初心者がデザインを１ヶ月勉強すると…？【7日目】 〜2回目の制作〜
どうも、note毎日更新しているせぶへいです🇵🇭
今日はアウトプットトレーニングの日で
2回目の自分で作品を作る時間です。
↑今受講しているオンラインコースの詳細↑
日記アプリのUIをデザインする
前回のアウトプットトレーニングでは
丸だけで感情を表現するお題だったので
自分の好きなようにデザインできましたが
今回はそうもいきません。
何故なら、今回は明確なターゲットありきで
デザインを考えないといけないお題だからです。
そして今回デザインするのは
日記アプリのUIです！！
日記アプリのデザインをデザインするのかー！
と思っていました。
この考え間違いではなかったのですが・・・
なんと…
4つセグメントに向けたアプリをデザインする超鬼畜なお題だったのです。笑
4つのターゲット層
①10代の女子高校生向け
②20代後半から30代のビジネスマン向け
③50代以上のシニア向け
④年齢性別を問わない全年齢向け
つまり、アプリのデザインを4つも考えて
更に、それをデザインとして形に落としていかないといけないのです。
しかも、制作時間は約2時間のみ。笑
「おい、待て待て！」 と突っ込みたくなりましたが
つべこべ言っている暇はありません。
しかし幸いにもテンプレートは用意されているので
それを基に、フォントや色を変えたり
写真の枚数やアイコンを変更して差別化していきます。
2時間かけて、自分が今持っている全力を尽くし
なんとか完成させました。（少し時間が足りなかったのは秘密w）
ターゲット層が違う日記アプリのデザイン
コチラが今回の僕の4つの日記アプリのデザインです。
では一つずつ簡単にコンセプトを説明します。
①10代の女子高校生向け
女子高生なので、全体的に丸みを持たせて
フォントをゴシックにし、角も丸みを持たせました。
また若い子は友人の一挙手一投足が気になる年齢なので
いつ日記を書いたか分かるようにデザインしました。
あとは安直ですが、女の子なので、ピンクを使って女の子らしさも出しています。
あとハッシュタグの色は、Twitterのタグと同じにしたかったので
Twitterの画面をスクショして貼り付け
スポイトツールでハッシュタグの色をコピーしました。
②20代後半から30代のビジネスマン向け
大人になると、あまりSNSとかに写真を投稿することも少なくなり
あまり写真は重要ではないと考えました。
なので投稿ボタンを写真に被せています。
そうすることで、よりテキストの部分が映えるようにデザインしました。
また金曜日だけ色を変えたのは
ビジネスマンが大いに嬉しくなる金曜日は華金をイメージして
色を変えてテンションが上がるようにデザインしました。笑
③50代以上のシニア向け
シンプルを追求してこのデザインにしました。
50代の方なら、視認性が高い方が良いという考察のもと
テキストを２つまで削減しています。
また投稿ボタンも分かりやすいように
アイコンから「投稿」という文字に変えて
一目でどこを押せば良いか分かりやすくしました。
また投稿ボタンに影をつけることで
よりボタンっぽい演出も出しています。
④年齢性別を問わない全年齢向け
すみません、正直に言うと実は時間が足りませんでした。笑
上の画像のところをカレンダーに固定することで
一目で今日が何日かわかりやすくして
誰でもストレスなく使えるようにデザインしました。
またテキスト部分を曜日ごとのカラーにすることで
色のイメージで曜日を連想させるように設定しています。
（しかしこれは色の情報が多くなりすぎるので良くない）
上記の4つのデザインを2時間で装飾しました！！
デザイン講師からの鬼フィードバック！？
前回と同様、自分が作ったデザインを生徒の前で発表します。
今回はなんとトップバッターだったので少し緊張しました。
自分の作品をなぜこのようにデザインしたのか
なぜこの配色で表現しているのか等を
全て言語化して説明します。
そして発表が終わると
デザイン講師のムラケンさん(@muraken43111407)から
フィードバックがあります。
デザインにおける「機能美」vs「装飾美」論争｜ムラケン -muraken- https://t.co/KJwJbaTnj4 #デザイン #デザイン漫画 #UI #UX pic.twitter.com/ZUerbn3I6K
— muraken@デザイン漫画 (@muraken43111407) July 24, 2020
これがなかなか鬼フィードバックでした笑（実は神フィードバックですw）
自分のデザインの良いところをもちろん褒めてくれるのですが
もっとこう言う風に表現した方が良いなどのアドバイスを
とても具体的に指摘してくれます。
そのアドバイスが的確すぎて、ぐうの音も出ませんでした。笑
いくつかデザイン講師からのフィードバックで
印象深かったことを2つ紹介します。
『余白も表現を気にして表現した方が良い』
一つ目は余白に関するフィードバックです。
赤丸のところは余白を取れているのですが
日にちとグレーの枠組みの余白（たての余白）が
全く取れていなくて一見余白があるように見えるが
アンバランスなデザインになっていると指摘を受けました。
これを指摘されるまで、自分の中では
「余白取ってやったぜー！どやっ」 と言わんばかりだったのですが
見る人が見ると良くないデザインなのだなーと反省しました。笑
この本を読もうと決意しました。笑
『アイデア(発想)は良いが、それをデザインに落とし込む力』
二つ目はすごく本質的で自分の弱点の的をえたフィードバックでした。
自分で言うのもなんですが、僕は割と発想力は豊かだと思っています。笑
なので、今回のアウトプットトレーニングも
自分が表現したいデザインは色々と思い浮かびました。
しかしその発想をデザインに落とし込む力がまだ乏しいので
上記のようなデザインが精一杯の表現になってしまっているのです。
しかし、逆に言うとデザインする力が付くと
持ち前の発想力を活かして
良いデザインが作れると言うこだ！(超プラス思考ww)
何にせよまだまだ経験不足なので
これからもっともっと勉強しながら
良いデザインを学んでいきたいと思います👍
最後まで読んで頂き、ありがとうございました！
To Be Continued…👋
↓デザインに興味がある方はご参考ください↓
＼モンスター・アカデミアのオンライン授業／