【２ヶ月目】手を動かしてツール（Figma）に慣れる　#音声SNS編

前回までのお話
https://note.com/mochiko322/n/ne0ce8db643a3

---

今回からはBONOを使ってUIの学習をしていきます。
BONOでは学習のプログラムが分かりやすく、UIデザイナーに必要な要素の習得に向かって１つづつ丁寧に段階を踏んで学んでいくことができます。実際に手を動かしてツールに慣れていきつつ、UIで考えなければならないことを学習していきました。

お題 : 音声SNSをつくろう

こちらではまず、新規会員登録ページを作成しました。
根本的に大切なことは個性ではなく、ユーザビリティ。MENTAでも聞いたのは、「UIデザイナー＝ユーザビリティの専門家」ということ。

Before

まず私が作ったのがこれ。
メルカリを参考にしてレイアウトを組んでいきました。

UIに個性のあるデザインは特に不要ですが、さすがに無難すぎて、そっけない印象です。

After

次に解答動画を見てブラッシュアップ

SNSということで、色があった方がポップ、楽しげでいいなと思ったので背景色も設定。明るめの紫でタイトルもいれました。線も消してすっきり。利用規約が上下にかかるよう、ログインボタンをつめて間隔を均等に。

線って重要ですね。他のアプリでも線の扱いは特に気にして見るようになりました👀

全体的にBeforeより登録したくなるような、気がします。笑

そして最後まで作成したものがこちら。

カイさんの（カイさんでいいのか…）説明がめちゃくちゃ分かりやすく、スムーズに制作できました。

Figmaも少しづつ使えるようになり、UIのレイアウトの基本も分かるようになってきて楽しい！！BONOのおかげです。

ご説明にあったように、今はまだ、ツールを少〜し動かせるようになってきただけ。これからより重要な中身のこと（コンセプトやユーザー理解など）をくわしく進めていくとのことです。ワクワク〜✨