2. InstagramのUIデザインを「3構造」で分析してみた

実際に画面に触れてポイント確認して進めよう

サービスのURLから登録して自分でもUIを触りましょう。UIUXデザイナーとしてUIに詳しくなるために、さまざまなサービスに率先して触る習慣はとても大切です

Instagramhttps://instagram.com/

‍

‍

‍

動画の目次

00:00 イントロ01:46 ゴールと目次03:18 見ていくUI03:58 Instagramアプリの『ホームUI』の3構造07:40 コンテンツについて10:44 ナビゲーションについて12:52 アクションについて15:25 Instagramアプリの『投稿フロー』の3構造16:25 3構造は？17:03 ナビゲーションについて19:24 アクションについて24:18 Instagramアプリの『デスクトップUI』の3構造24:44 コンテンツについて25:14 ナビゲーションについて27:15 アクション29:21 Notion Mailの3構造31:28 コンテンツについて32:43 続きはBONOで！

スライドのURL

手元で見たい、編集したい時は、コピーして自分のファイルにペーストしてください。

FigmaのURL https://www.figma.com/deck/9sXEWzI21qES3CocWVfBBc/%E4%BA%8B%E4%BE%8B%E3%81%A7%E5%AD%A6%E3%81%B63%E6%A7%8B%E9%80%A0?node-id=4-252&t=L6iMDfudW3zZfLjr-1&scaling=min-zoom&content-scaling=fixed&page-id=0%3A1

‍

‍