授業計画 |
| 回数 |
学習目標 |
学習項目 |
| 1 |
半期で学ぶ内容について理解し、アプリ制作においてグラフィックデザイナーが担う作業内容について説明出来るようになる。 |
Figmaの必須初期設定・基本操作（キャンバスの基本と、ワークスペース操作の基本）について解説する。アプリ制作についてグラフィックデザイナーが担う作業内容について「UXUI」事例を示し、解説する。 |
| 【理解度確認】画面共有による進捗確認。 |
| 2 |
Webアプリの開発、インターフェイスデザインに関わる基礎的・基本的原則について理解する。選択したオブジェクトの設定が出来るようになる。 |
Figmaでオブジェクトを作る。「画像」「ベクターパス」「テキスト」について学ぶ。Figmaで作成するシェイプを使い、重なり順序を通して「階層」について学ぶ。 |
| 【理解度確認】画面共有による進捗確認。 |
| 3 |
Webアプリの開発、インターフェイスデザインに関わる基礎的・基本的原則について理解する。選択したテキストや画像の設定が出来るようになる。 |
テキストや画像の扱いについて理解を深める。Figmaの「制約」機能を学ぶ。 |
| 【理解度確認】画面共有による進捗確認。 |
| 4 |
Webアプリの開発、インターフェイスデザインに関わる基礎的・基本的原則について理解する。選択したテキストや画像のレイアウトが出来るようになる。 |
テキストや画像のレイアウト方法について理解を深める。Figmaの「オートレイアウト」機能を学ぶ。 |
| 【理解度確認】画面共有による進捗確認。 |
| 5 |
Figmaの基本的な操作方法が一通り出来るようになる。 |
Figmaの「コンポーネント」機能を学ぶ。トグルボタンなどのパーツづくりを通して基本操作のおさらいをする。 |
| 【理解度確認】画面共有による進捗確認。 |
| 6 |
AdobeXDの基本的な操作を踏まえて、アプリ画面を作成出来るようになる。 |
個人制作課題「ショッピングモールのアプリを作ろう」UIデザイン |
| 【理解度確認】画面共有による進捗確認。 |
| 7 |
アプリデザインのプロセスにおけるリサーチ活動について理解し、実際に競合他社のデザイン事例が分析できるようになる。グループ内において互いの個性を理解し合い、生かし合える分担をし、取り組めるようになる。リサーチを元に、ターゲットに合わせたアプリのブランディングを設定出来るようになる。チームのメンバー同士で知識を共有し、物事を見る角度を増やす。
クイズアプリのブランディングを反映したワイヤーフレームが制作出来る。コミュニケーションを通してお互いの知識と技術を相互補完し合う。 |
グループ制作課題「睡眠アプリをデザインしよう」ワイヤーフレーム
ワイヤーフレームを検討する。 |
| 【理解度確認】画面共有による進捗確認。 |
| 8 |
ワイヤーフレームを元にUIデザインを制作出来る。クラウドでドキュメントを共有し、誤って上書きをしないように気をつけながら、グループ内で共同作業を出来るようになる。 |
グループ制作課題「睡眠アプリをデザインしよう」UIデザイン
UIデザインの制作。 |
| 【理解度確認】画面共有による進捗確認。 |
| 9 |
ワイヤーフレームを元にUIデザインを制作出来る。クラウドでドキュメントを共有し、誤って上書きをしないように気をつけながら、グループ内で共同作業を出来るようになる。 |
グループ制作課題「睡眠アプリをデザインしよう」UIデザイン
UIデザインの制作。 |
| 【理解度確認】画面共有による進捗確認。 |
| 10 |
制作したアプリのブランディングやUIデザインの概要をプレゼン用スライドにまとめられるようになる。 |
グループ制作課題「睡眠アプリをデザインしよう」プレゼン資料の作成 |
| 【理解度確認】スライドの提出。 |
| 11 |
完成作品についてUIの工夫点や特徴について解説出来るようになる。 |
グループ制作課題「睡眠アプリをデザインしよう」プレゼンテーション |
| 【理解度確認】プレゼンテーションの内容。 |
| 12 |
アプリデザインのプロセスにおけるリサーチ活動について理解し、実際に競合他社のデザイン事例が分析できるようになる。レシピアプリのリサーチを元に、ターゲットに合わせたアプリのブランディングを設定出来るようになる。レシピアプリのブランディングを反映したワイヤーフレームが制作出来る。 |
個人制作課題「レシピアプリをデザインしよう」リサーチとブランディング
既存のレシピアプリを調査し、競合他社の機能やデザインを把握する。ペルソナ設計。
レシピアプリの名前、カラー、ロゴを決定する。ワイヤーフレームを検討する。 |
| 【理解度確認】画面共有による進捗確認。 |
| 13 |
ワイヤーフレームを元にUIデザインを制作出来る。 |
個人制作課題「レシピアプリをデザインしよう」UIデザイン
UIデザインの制作。 |
| 【理解度確認】画面共有による進捗確認。 |
| 14 |
ワイヤーフレームを元にUIデザインを制作出来る。制作したアプリのブランディングやUIデザインの概要をプレゼン用スライドにまとめられるようになる。 |
個人制作課題「レシピアプリをデザインしよう」UIデザイン
個人制作課題「レシピアプリをデザインしよう」プレゼン資料の作成 |
| 【理解度確認】スライドの提出。 |
| 15 |
完成作品についてUIの工夫点や特徴について解説出来るようになる。 |
個人制作課題「レシピアプリをデザインしよう」プレゼンテーション |
| 【理解度確認】プレゼンテーションの内容。 |
