読み込み中...
UI情報構造のデザインをトレースで実践学習 | ゼロからはじめるUI情報設計 | BONO
一覧
ゼロからはじめるUI情報設計
0
%
1
1.シリーズ全体像と手順
どんなシリーズ？
シリーズをやるメリット
要件をUIに反映するデザインの流れ
【補足】おすすめの道具:紙とペン
2
2.要件内容を把握する
お題を把握する-デザインの前に始めること
補足：内容がわからない時は1人で考えない
3
3.UIの要件定義をしよう
UIの要件定義をトレースしよう
【重要】UIの要件を整理する意味あります？
トレースするUI要件定義の完成形をチェック
①ユースケース：UIを人がいつ使うか整理しよう
②行動フロー : UIで必要なアクションの整理
③オブジェクト：表示する情報を書き出そう
④タスク：UIで必要なアクションを整理する
4
UIのリサーチをしよう
1.作る前にUIを調べよう
UIリサーチの方法：同じカテゴリーのものを調べる
UIリサーチ：まずは構造から参考にしよう
UIの見た目よりまずは、構造を参考に仕様
5
UIのVer1.0をデザインする
UI制作スタート:手書きで情報設計
UI情報構造のデザインをトレースで実践学習
6
1.0を壊して自分で改善する
UI情報設計をブラッシュアップするには？ - Ver.1で終わるのはハーゲンダッツ
ラフをデザインしたら、叩いてアイデアを出そう
「フィッシュボーン図」で課題解決のアイデアを効率よく考える
優先度を付ける。UIアイデアをパターンでデザインしていこう
UIの質の上げ方：テーブルUIをデザインする
配色はアクションからUIに指定していく
UIをブラッシュアップする方法：詳細ページの完成UIを紹介
7
お疲れ様でした！
おわりに：ゼロからはじめる情報設計
プレミアムコンテンツ
この動画を視聴するにはメンバーシップの登録が必要です
ログインする
メンバーシップ登録へ
2. UI情報構造のデザインをトレースで実践学習
クエスト5: UIのVer1.0をデザインする
完了にする
お気に入り
質問する
シェア
このデータから始めよう
この後のフローでも使うので、こちらで確保してください〜！
↓コピペして使ってください（Figma）
続きを読むにはメンバーシップの登録が必要です
ログインする
メンバーシップ登録へ
前
UI制作スタート:手書きで情報設計
次
UI情報設計をブラッシュアップするには？ - Ver.1で終わるのはハーゲンダッツ
