UIデザイナーの初心者が抑えるべきUIの概念の1つにナビゲーションがある。ナビゲーションはサイトやサービスの使いやすさに大きく影響する。ナビゲーションをどう構築していくかはUI設計の根幹をなす。複雑だが、ここではナビゲーションの基本的な部分を解説する。理論だけでは分かりづらいので、改善が必要な例を示しながら、正しいナビゲーションのあり方を学んでいく。改善案の詳細は有料コンテンツで後に解説する。まずナビゲーションの構造設計、グローバルナビゲーションの内容、モードとの関係の3点を確認する必要がある。例として契約書管理サービスのUIを示す。ナビゲーションがバラバラであることが分かる。2つのナビゲーションブロックが必要か、グローバルナビゲーションに何を配置するべきかを考える必要がある。さらに、詳細ページでグローバルナビゲーションの内容が変わったり、モード移行時のナビゲーションが不適切だったりする点も改善が必要である。ナビゲーション作成の基本を押さえることで、UIデザイン力が向上すると期待できる。
ナビゲーションはサイト内のコンテンツ構造を反映する必要がある。契約書管理サービスの例では、契約書が中心のコンテンツ。これに関連するお気に入りや担当契約書などがある。アカウントや設定、通知などは別のコンテンツグループ。このようにコンテンツのグループ化と構造化が必要。
グローバルナビゲーションはサービスの出発点となる部分。サービスでできることが一般的に分かる内容が必要。契約書管理サービスなら契約書と取引先が主要なコンテンツとなる。通知などは優先度が下がる。
モード移行時はナビゲーションも切り替わる必要がある。契約書作成モード中は通常のグローバルナビゲーションは不要。モードとナビゲーションは密接に関係するため注意が必要。
ダメなUIを題材に、なぜこれが使いづらいのか?を考え、
それを通して”UIデザインにおけるアクションの設計”の基本を理解しましょう
動画の続きはこちら↓
□ ナビゲーションで抑えてほしい3つの基本
https://www.bo-no.design/contents/ui-layout-basic05-2
□ ナビゲーションの改善お題
https://www.bo-no.design/contents/ui-layout-basic05-3
2023年内限定で、ご意見お待ちしてます〜!
情報設計の中の「UIの書くパーツをどこになぜ配置するのか〜」の基本的な部分をやっていこうとしています。
・こういうの悩む
・こういうの知りたい
などありましたら教えてください
フォーム
https://docs.google.com/forms/d/e/1FAIpQLSdLk0jXuMxKgxOzI4xbWTSD_MY4ephm7kmw1HMYHlJ37Ds3MA/viewform
UIデザイナーの初心者が抑えるべきUIの概念の1つにナビゲーションがある。ナビゲーションはサイトやサービスの使いやすさに大きく影響する。ナビゲーションをどう構築していくかはUI設計の根幹をなす。複雑だが、ここではナビゲーションの基本的な部分を解説する。理論だけでは分かりづらいので、改善が必要な例を示しながら、正しいナビゲーションのあり方を学んでいく。改善案の詳細は有料コンテンツで後に解説する。まずナビゲーションの構造設計、グローバルナビゲーションの内容、モードとの関係の3点を確認する必要がある。例として契約書管理サービスのUIを示す。ナビゲーションがバラバラであることが分かる。2つのナビゲーションブロックが必要か、グローバルナビゲーションに何を配置するべきかを考える必要がある。さらに、詳細ページでグローバルナビゲーションの内容が変わったり、モード移行時のナビゲーションが不適切だったりする点も改善が必要である。ナビゲーション作成の基本を押さえることで、UIデザイン力が向上すると期待できる。
ナビゲーションはサイト内のコンテンツ構造を反映する必要がある。契約書管理サービスの例では、契約書が中心のコンテンツ。これに関連するお気に入りや担当契約書などがある。アカウントや設定、通知などは別のコンテンツグループ。このようにコンテンツのグループ化と構造化が必要。
グローバルナビゲーションはサービスの出発点となる部分。サービスでできることが一般的に分かる内容が必要。契約書管理サービスなら契約書と取引先が主要なコンテンツとなる。通知などは優先度が下がる。
モード移行時はナビゲーションも切り替わる必要がある。契約書作成モード中は通常のグローバルナビゲーションは不要。モードとナビゲーションは密接に関係するため注意が必要。
ダメなUIを題材に、なぜこれが使いづらいのか?を考え、
それを通して”UIデザインにおけるアクションの設計”の基本を理解しましょう
動画の続きはこちら↓
□ ナビゲーションで抑えてほしい3つの基本
https://www.bo-no.design/contents/ui-layout-basic05-2
□ ナビゲーションの改善お題
https://www.bo-no.design/contents/ui-layout-basic05-3
2023年内限定で、ご意見お待ちしてます〜!
情報設計の中の「UIの書くパーツをどこになぜ配置するのか〜」の基本的な部分をやっていこうとしています。
・こういうの悩む
・こういうの知りたい
などありましたら教えてください
フォーム
https://docs.google.com/forms/d/e/1FAIpQLSdLk0jXuMxKgxOzI4xbWTSD_MY4ephm7kmw1HMYHlJ37Ds3MA/viewform
UIデザイナーの初心者が抑えるべきUIの概念の1つにナビゲーションがある。ナビゲーションはサイトやサービスの使いやすさに大きく影響する。ナビゲーションをどう構築していくかはUI設計の根幹をなす。複雑だが、ここではナビゲーションの基本的な部分を解説する。理論だけでは分かりづらいので、改善が必要な例を示しながら、正しいナビゲーションのあり方を学んでいく。改善案の詳細は有料コンテンツで後に解説する。まずナビゲーションの構造設計、グローバルナビゲーションの内容、モードとの関係の3点を確認する必要がある。例として契約書管理サービスのUIを示す。ナビゲーションがバラバラであることが分かる。2つのナビゲーションブロックが必要か、グローバルナビゲーションに何を配置するべきかを考える必要がある。さらに、詳細ページでグローバルナビゲーションの内容が変わったり、モード移行時のナビゲーションが不適切だったりする点も改善が必要である。ナビゲーション作成の基本を押さえることで、UIデザイン力が向上すると期待できる。
ナビゲーションはサイト内のコンテンツ構造を反映する必要がある。契約書管理サービスの例では、契約書が中心のコンテンツ。これに関連するお気に入りや担当契約書などがある。アカウントや設定、通知などは別のコンテンツグループ。このようにコンテンツのグループ化と構造化が必要。
グローバルナビゲーションはサービスの出発点となる部分。サービスでできることが一般的に分かる内容が必要。契約書管理サービスなら契約書と取引先が主要なコンテンツとなる。通知などは優先度が下がる。
モード移行時はナビゲーションも切り替わる必要がある。契約書作成モード中は通常のグローバルナビゲーションは不要。モードとナビゲーションは密接に関係するため注意が必要。
ダメなUIを題材に、なぜこれが使いづらいのか?を考え、
それを通して”UIデザインにおけるアクションの設計”の基本を理解しましょう
動画の続きはこちら↓
□ ナビゲーションで抑えてほしい3つの基本
https://www.bo-no.design/contents/ui-layout-basic05-2
□ ナビゲーションの改善お題
https://www.bo-no.design/contents/ui-layout-basic05-3
2023年内限定で、ご意見お待ちしてます〜!
情報設計の中の「UIの書くパーツをどこになぜ配置するのか〜」の基本的な部分をやっていこうとしています。
・こういうの悩む
・こういうの知りたい
などありましたら教えてください
フォーム
:メンバー限定
0 Comments