デザイン鍛錬16
今日もUI/UXの練習をしています。
過去の作品はこちらのマガジンに掲載していますので、ご覧ください。
デザインお題
今回は「Daily Cocoda」の45レッスン目に取り組んでいきます。
1. デザインする上でのポイント
ポイント
・ターゲットは、すでにデザインに対しある程度知識を持っている人
・Cocodaの強みは、プロを目指すデザイナー候補の人たちの学びの場/アウトプットできる場だと思っています。→それを推していければいいのかなと。
・PCかモバイルか→デザインする人たちはPCの方がやりやすいのでは。
PC画面でデザインしてみます。
参考サイト
・Cocoda
・Progate
・note
使用ツール
Adobe Xd
2. 骨格をデザインする
プログラミング初心者のための学習サイト「Progate」の場合、ログインする前の画面はご覧の通りです。
キャッチーなことばと、スクロールするとチュートリアルやプロの方々の口コミを載せています。
必要な項目しか載せておらず、背景色・文字の太さで強調。
私が大好きなデザインの1つです。
まずは、Cocodaのサービスのテーマカラーをベースにデザイン。
Progateの構成を参考に、
1. 「今すぐ始める」（会員登録ボタン）
2. Cocodaのサービス概要
3. 使い方・機能の説明
の順で配置していきます。
3. 詳細をデザインする
「Designer's Passport」の背景が寂しい感じなので、写真かイラストを入れてみました。
カッコ良すぎる写真にしてしまうと、デザインに対する敷居が高く感じてしまうので、カジュアルな写真を選択。その雰囲気にともない、見出しのフォントを「メイリオ」にし、やわらかさを出しました。
4. 反省点・議論点
1画面でどこまで説明をしてユーザーを会員登録に導くか、考えるのがとても難しかったです。
いいなと思ったら応援しよう！
