見やすいUIの鉄則.pdf

Transcript

1. 見やすいUIの鉄則 見やすいUIの鉄則 ～　ユーザーが快適にゲームをすることができるUIにするために ～ ～　ユーザーが快適にゲームをすることができるUIにするために ～ GT2　14番　　白川　萌
2. 前提として 前提として 2 この発表には 実際にUIやデザインに必要な要素・知識のほかに 個人の意見、偏見も一部混ざっています。 すべてを鵜呑みにするのは あまりオススメしません・・・ すべてを鵜呑みにするのは あまりオススメしません・・・
3. 次のページ、 目に悪いから注意だよ １ ．初めに ２．UIの比較 ３．大切にすべきこと 4.ペルソナのUI 5．まとめ 6.それを踏まえて 4～７ ８ ９～１３ １４～１６ １７ 1８～1９ 目次 目次 3
4. 初めに～このテーマにした理由～ UIはとっても大 切！！ このテーマにした理由は主に3つあります ・ユーザーに見やすいUIを提供するにはどうしたらいいかを知るため ・ユーザーに見やすいUIを提供するにはどうしたらいいかを知るため ・なぜ一見見にくいようなフォントでもゲームとして成り立っているものはある ・なぜ一見見にくいようなフォントでもゲームとして成り立っているものはある ので、なぜ成り立っているのかが単純に気になったからです ので、なぜ成り立っているのかが単純に気になったからです ・見やすいUIを学ぶことでこれからの学内、就職してから、個人、チー ・見やすいUIを学ぶことでこれからの学内、就職してから、個人、チー ムに限らずゲーム制作や見やすい資料作成などに生かせると思った ムに限らずゲーム制作や見やすい資料作成などに生かせると思った 初めに～このテーマにした理由～ このテーマにした理由は主に3つあります
5. ところで・・・ ところで・・・ 5 先ほどのこのスライド、どのように感じましたか？
8. 既存ゲームのUIの比較 既存ゲームのUIの比較 8 文字量が多く、情報が多すぎて 逆に入ってこない 読む気が失せる ※ 現在は修正されている 文字量がすくない 必応な要素がうまくまとめられている わかりやすい
9. 大切なこと 大切なこと 9 UIに限らずデザインする上で一番大切な事 読み手やプレイヤーに 負担をかけないこと 読み手やプレイヤーに 負担をかけないこと
10. 色の使い方 色の使い方 10 使う色は3色に 抑えよう 色を使うときは近い色 対照的な色は避けよう メイン色 文字色 アクセント 見づらい 目に悪い 見やすい 目に悪くはない
11. 人はこのように見るらしい 人はこのように見るらしい 11 人の視線の流れ まんべんなく読む場合 情報量が多いものを 読む場合
12. 余白のお話 余白のお話 12 あけすぎない 詰めすぎない 木曽馬は、日本に昔から飼われていた「日本在来馬」や「日本和種」 といわれる馬です。 中型馬に属し、体高は平均133cmです。 険しい山間高冷地で長年飼育された木曽馬は、 厳しい自然環境に適応して極めて強健で粗食に耐え、 ひずめは堅く、蹄鉄をうつ必要はありません。 丈夫で安定性のある脚は、 狭い山路でも踏み外すことなく急な坂道を 安全に上り下りすることができます。 平安時代から軍事用、農耕用として大切に育てられてきました。 木曽馬は 中型の日本の馬です
13. その他の諸々 その他の諸々 13 ・ちゃんと改行をする ・位置を揃える ・装飾にこだわりすぎない ・読みやすいフォントで統一 ・図やグラフなど使うときは簡潔に ・誰に何を伝えるのかを明確にして制作 etc 要するに！ 細かいところにも気を配ろう!! 細かいところにも気を配ろう!! ってこと!!
14. ペルソナは、？ ペルソナは、？ 14 パット見た感じ見にくそうなペルソナのUI なぜ見やすいと感じ、直感的に操作できるのか
15. 15 メニュー画面を開いたとき、中央に白いラインを引いて、視線誘導の役割を与える 必要な物しか升目状レイアウトを利用してない
16. 16 操作 操作 HP HP 戦闘の情報 戦闘の情報 必要な情報が固まっている
17. まとめ まとめ 17 見やすいUIの鉄則 １ ．色に気を遣うべし 2. 人が見る順番、方向を学んで構図を 　 考えるべし ３. 余白を上手に利用するべし ４. 改行や位置を揃えるなど細かいところも 意識すべし
18. まとめを踏まえたうえで まとめを踏まえたうえで 18 どうすべき？？
19. 初めに 初めに 19 このテーマにした理由 ユーザー目線の見やすいUIの学習のため 学んだことをこれからの制作に生かすため 見にくいと感じそうなUIのゲームが なぜ操作しやすく成り立っているか気になったため
20. ご清聴ありがとうございました ご清聴ありがとうございました 20