Kan pass-制作過程-
1. Kan passとは
ユーザーが漢字を選択して、オリジナルの漢字テストが作成できるwebサービスです。
ユーザーが選択した漢字から漢字テストのPDFを作成し、ダウンロードできます。
2. 制作のきっかけ
子供の進捗に合わせて漢字テストを作成するのに時間がかかっていた。
Googleで漢字テストと検索するとたくさんの漢字テストをプリントすることができる。しかし進捗に合ったテストを見つけるのに時間がかかった。
上記のような問題があったので解決作として、漢字テストが作成できるwebサービスを制作することにしました。
（webサービスのUIデザインは私が担当し、コードは主人が担当です。UXの部分は二人で考えました。）
3. 制作過程：制作開始〜ワイヤーフレーム作成
今回は、最低限の機能でwebサービスを公開して、徐々に機能を追加していくということを目標としました。
理由は、デザインにかかる時間や開発にかかる時間が少なくて済み、公開までが最短になると判断したからです。
そのため、
今後も機能を追加できるようにデザインを考えたり、最低限の機能だけを持つデザインをする必要がありました。
まずは課題と機能の洗い出しをfigmaでざっとメモ書きをしました。
そして、デザインがイメージできてきたのでワイヤーフレームを作成してみました。（この時点では、まだ将来こんな機能もあってほしいという希望がたっぷり入っていました。）
上記のワイヤーフレームでイマイチと感じた所を文字可。そして手直しをしました。
4. 制作過程：ワイヤーフレームに色や文字を追加〜ブラッシュアップ
ワイヤーフレーム作成で更にイメージが膨らんで、いよいよ色付けを開始！
実際に文字を入れたり、ポップアップ等を作成する段階になりました。
アプリケーションの全体のイメージは涼しい感じ。
背景は白でメインカラーを青（#0DB8D9）としました。
そして、ユーザーがサービスを使っている時に適度に明るい気分を保てるように、オレンジ（#F8B800）をアクセントとしていれました。
ここから機能削除をしたりボタンのデザインを変えたり、6種類ほどデザインをしました。また、細かな部分を手直ししたりと大分と時間がかかりました。（ワイヤーフレームの時点でもっと機能を絞っておくべきでした。）
そして、出来上がりが以下のものです。（初回サービス訪問時）
5. まとめ
はじめてのwebサービスのデザインとなりました。
まだまだわからない部分もたくさんあるので、UIトレースをして使える部品を増やしてアウトプットを早くしていきたいです。
また、最低限の機能を絞ることや優先度を付けてデザインのやり直しを少なくしていきたいです。
これからは改善、修正、機能追加等たくさんやることが待っていますが、いいものが作れるように精進します。