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