デザインする前にやること

Transcript

1. デザインチェック機構でよく指摘すること Frequently pointed out by the design check mechanism.
3. それ、ディレクターに確認しましたか？
4. スタイリッシュで尖ったデザイン インタラクティブですごい動くデザイン クライアントが「かっこいい！」と喜ぶデザイン それ、ディレクターに確認しましたか？ 良いデザインの定義 前提として
5. ユーザーにとって使いやすいデザイン スタイリッシュで尖ったデザイン クライアントの要望が適切に反映されているデザイン インタラクティブですごい動くデザイン クライアントが「かっこいい！」と喜ぶデザイン システム開発時に⽭盾が起こらないデザイン それ、ディレクターに確認しましたか？ 良いデザインの定義 前提として
6. それ、ディレクターに確認しましたか？ 良いデザインを作るためには？ ワイヤーフレーム デザイン
7. それ、ディレクターに確認しましたか？ 良いデザインを作るためには？ ワイヤーフレーム デザイン
8. それ、ディレクターに確認しましたか？ 良いデザインを作るためには？ ワイヤーフレーム このボタン押したらどこに 遷移するんだろう この要素って静的なんだろうか 動的なんだろうか ここってイラスト必須なのか 画像でもいいんだろうか このテキストって他と⽐べて どのくらい重要なんだろう
9. それ、ディレクターに確認しましたか？ デザインを作る前にやること ⻑年の経験で培った ⾃分の中の引き出しを漁って を出すこと とっておき
10. ⻑年の経験で培った ⾃分の中の引き出しを漁って を出すこと とっておき それ、ディレクターに確認しましたか？ デザインを作る前にやること
11. それ、ディレクターに確認しましたか？ デザインを作る前にやること ディレクター への
12. ヒアリング ヒアリング それ、ディレクターに確認しましたか？ デザインを作る前にやること ディレクター への
13. ヒ
14. ア
15. リ
16. ン
17. グ
18. それ、ディレクターに確認しましたか？ デザインを作る前にやること です。
19. それ、ディレクターに確認しましたか？ です。 不明点がある状態では 良いデザインは作れない コトが多い デザインを作る前にやること
20. それ、ディレクターに確認しましたか？ 不明点は特にありませんでした！ デザインを作る前にやること 観点が⾜りてない可能性
21. それ、ディレクターに確認しましたか？ ユーザーにとって使いやすいデザイン を作るためには よくある 場⾯ ここのテキストを16px にした理由は？ なんとなく収まりが良いから。
22. それ、ディレクターに確認しましたか？ ユーザーにとって使いやすいデザイン を作るためには ターゲットは誰か？という情報が必要 よくある 場⾯ ここのテキストを16px にした理由は？ なんとなく収まりが良いから。 20 代 16pxで良さそうやな 60 代 20pxはないとちゃんと読めなそうやな 情報が揃って初めて判断が出来る
23. それ、ディレクターに確認しましたか？ ユーザーにとって使いやすいデザイン を作るためには ターゲットは誰か？という情報が必要 よくある 場⾯ ここのテキストを16px にした理由は？ なんとなく収まりが良いから。 20 代 16pxで良さそうやな 60 代 20pxはないとちゃんと読めなそうやな ディレクター！ 教えて！ 情報が揃って初めて判断が出来る
24. それ、ディレクターに確認しましたか？ クライアント要望適切反映デザイン を作るためには よくある 場⾯ メインカラーを⾚にした理由は？ ロゴが⾚いから。なんかぁー、イケてるカラぁー。
25. それ、ディレクターに確認しましたか？ クライアント要望適切反映デザイン を作るためには クライアントがユーザーに与えたい印象は？価値は？という情報が必要 よくある 場⾯ メインカラーを⾚にした理由は？ ロゴが⾚いから。なんかぁー、イケてるカラぁー。 信頼と実績 落ち着いた⻘が良さそうやな エコと先進 メインを緑、アクセントに寒⾊系 情報が揃って初めて判断が出来る
26. それ、ディレクターに確認しましたか？ クライアント要望適切反映デザイン を作るためには クライアントがユーザーに与えたい印象は？価値は？という情報が必要 よくある 場⾯ メインカラーを⾚にした理由は？ ロゴが⾚いから。なんかぁー、イケてるカラぁー。 信頼と実績 落ち着いた⻘が良さそうやな エコと先進 メインを緑、アクセントに寒⾊系 ディレクター！ 教えて！ 情報が揃って初めて判断が出来る
27. それ、ディレクターに確認しましたか？ システム開発時無⽭盾デザイン を作るためには よくある 場⾯ ココの画像と⽂章って動的？静的？ 分かりません。
28. それ、ディレクターに確認しましたか？ システム開発時無⽭盾デザイン を作るためには 画像は固定サイズか変動するか？最⼤何⽂字⼊るか？という情報が必要 よくある 場⾯ ココの画像と⽂章って動的？静的？ 分かりません。 サイズ変動 ボックスに対して画像の横幅は固定にして 縦幅はトリミングした⽅が良いな 最⼤50 ⽂字 5⾏ぐらいになるし縦幅取りすぎるから2⾏で3点リーダーにして 以降は省略した⽅が良いな 情報が揃って初めて判断が出来る
29. それ、ディレクターに確認しましたか？ 画像は固定サイズか変動するか？最⼤何⽂字⼊るか？という情報が必要 よくある 場⾯ ココの画像と⽂章って動的？静的？ 分かりません。 サイズ変動 ボックスに対して画像の横幅は固定にして 縦幅はトリミングした⽅が良いな 最⼤50 ⽂字 5⾏ぐらいになるし縦幅取りすぎるから2⾏で3点リーダーにして 以降は省略した⽅が良いな ディレクター！ 教えて！ 情報が揃って初めて判断が出来る システム開発時無⽭盾デザイン を作るためには
30. まとめ
31. まとめ ⼿を動かす前に 情報を揃えましょう
32. これ、ディレクターに確認しました！！