COMMUNICATION DESIGN STUDIO - WEB INTERACTION DESIGN DIVISIONWEBインタラクションデザイン総合コース

コース詳細表

• HTML5・CSS3コーディングⅠ

  HTML・CSS基本構造／ HTML・CSSコーディング基礎／マルチデバイス対応／ Dreamweaver基本／ビュー／各種パネル／ HTML5 ／セクショニング／エンベット／CSS3 ／セレクタ／プロパティ／デジタルデバイスとWebブラウザ概要／フレキシブルボックスレイアウト

• Webグラフィック（Adobe XD）

  Webサイト概論（Webサイトの仕組み／サーバー／ドメイン）／Webサイト制作フロー／Adobe XDの基本操作／ワークスペース／レイヤー／オブジェクト／アセット／コンポーネント／プランニングシート／コーディング設計／ワイヤーフレーム／デザインカンプ制作

• レスポンシブWebデザイン

  マルチデバイス対応実践／ブレークポイント設計／ Media Queries ／スマートフォンデバイスの特徴／モバイルファーストのサイト設計／リキッドレイアウト／スマートフォン最適化データ／ SVG実装／ページの高速化／レスポンシブWeb実践

• HTML5・CSS3コーディングⅡ

  リセットCSS ／ノーマライズCSS ／HTML5によるWebサイト構築／CSS3によるWeb編集／HTML5・CSS3コーディング応用／マルチブラウザ対応／デベロッパーツール／バリデーションチェック／ FTP

• Webリッチコンテンツ（jQuery / JavaScript）

  クライアントサイドスクリプト概論／JavaScript概要／ JavaScript基礎／jQuery基礎（実装）／jQuery実践（class変更など）／jQueryプラグイン（lightboxなど）／jQuery応用（Loading ／条件分岐による挙動）／プラグイン

• HTML5・CSS3コーディング実践

  HTML5・CSS3コーディング実践／セマンティックWeb ／ CSSアニメーション／CSS transform ／Webフォント概要／グリッドレイアウト／Dreamweaver応用／ Webポートフォリオ／業界最新技術動向

• Webプログラミング（PHP / MySQL）WordPress

  サーバーサイドスクリプト概論／ API 概論／PHP概要／基礎／入力フォーム／データベース／ MySQL概要／CMS（コンテンツマネジメントシステム）概要WordPress概要／インストール／環境設定／管理画面／投稿ページ／固定ページ／カテゴリ／タグ／タクソノミー／WordPress関数／プラグイン／オリジナルテーマ制作

• 作品制作実習

  Webサイトプランニング／企画 ・コンセプト／コンテンツページ構成／コーディング／ページ最適化／ブラウザ互換性／コーディングチェック／トップページ・コンテンツページ制作／スマートフォンサイト制作／プレゼンテーション／作品講評

• WebデザインⅠ（ビジュアルデザイン）

  Webデザイン概論／ Webサイトの種類と役割／サイトレイアウトデザイン／マルチデバイスページデザイン／高度なフォトコンテンツ表現／ Webカラーデザイン／Webタイポグラフィ実践／Webサイトデザイン思考／分析

• WebデザインⅡ（情報設計）

  モーションデザイン／マイクロインタラクション／アクションとレスポンス／映像を用いたサイト表現／インフォグラフィックス／アイコン／ピクトグラム／Webサイトデザイン制作実習／プレゼンテーション／講評

• WebデザインⅢ（インタラクション）

  モーションデザイン／マイクロインタラクション／アクションとレスポンス／映像を用いたサイト表現／インフォグラフィックス／アイコン／ピクトグラム／Webサイトデザイン制作実習／プレゼンテーション／講評

• IA・UI・UXデザイン

  IA・UI・UXデザイン概論／企画・コンセプト立案／情報の組織化とカテゴリ設計／サイトマップの設計／ワイヤーフレーム設計／UXの3大要素／ユーザー行動と画面設計／サイト目的別／デバイス別UI・UX設計／UI・UXの改善手法

• Webマーケティング

  Web解析（Google Analytics）基礎Ⅰ／Web解析（Google Analytics）基礎Ⅱ／普遍的なSEO ／ SEOの課題発見と改善手法／普遍的なWebリスティング広告／リスティング広告の課題発見と改善手法／ランディングページの企画・設計Ⅰ／ランディングページの企画・設計Ⅱ

• Webディレクション

  ユーザー行動の理解と情報収集／定性手法と定量手法／仮説検証とコンテクストリサーチ／カスタマージャーニーマップ／ユーザビリティテストサイトの問題点と改善策の検証／改善提案プロトタイプ作成／プレゼンテーション／講評

• UI / UX基礎Ⅰ（Design・Science・Engineering）

  UI / UXデザイン／ユーザーインタフェースデザイン／ UI / UXデザイン／ ユーザーエクスペリエンスデザイン／ 人間中心設計／Cooperative Design・Participatory Design／行動経済学／Behavioral Economics ／人間工学／Human Factors and Ergonomics ／感性工学／ Affective Engineering ／ デザインガイドライン／ Human Interface Guidelines ／デザインガイドライン／ Material Design

• UI / UX基礎Ⅱ（The Elements of User Experience）

  戦略段階・要求段階／要件定義・Google Design Doc ／構造段階／インタラクション設計・情報設計／骨格段階／インタフェース設計・ナビゲーション設計／表層段階／ワイヤーフレーム・プロトタイピング／予期的UX・一時的UX・エピソード的UX・累積的UX ／ウォーターフロー型開発・アジャイル型開発／ Atomic Design / Design System（デザインシステム構築）／ Complexion Reduction / UIトレンド

• ユーザーリサーチ

  プロトタイピング／ストーリー視点・プロダクト視点／ツール／Prott・ InVision・Zeplin・Figma・Google Gallery ／調査／ユーザーインタビュー・エスノグラフィー・行動観察／評価／ヒューリスティック評価・ユーザビリティーテスト／総括的評価・形成的評価／反証アプローチ・ゼロ仮説／ Design Sprint ／スプリント・イテレーション／ペルソナ手法・シナリオ設計・カスタマージャーニーマップ

• チームビルディング

  Sketch / Exporting・Symbols・Plugins（シンボル設計）／ Figma/ Collaborative Interface Design（共同設計）／Abstract / VersionManagement（履歴管理）／ Google Drive / Docs・Sheets・Slides（情報共有）／デザインレビュー／フィードフォワード／デザインレビュー／フィードバック／コミュニケーション／共通認識確認・傾聴／コミュニケーション／学習機会提供・行動促進

• 認知工学／ Webマーケティング

  インタフェースデザイン心理学／データ分析／Business Intelligence ／データ分析／ Deep Learning ／Webマーケティング／集客施策・回遊施策／SEO・SEM・LPO・EFO ／効果測定／ Analytics ／視線誘導・促進要因・阻害要因／同調現象・認知的不協和・後知恵バイアス

• ヒューマンインタフェース

  UX ５階層モデル／ Task Oriented・Information Oriented ／戦略／要求／構造／骨格／表層／ DesignOps / UX Engineering（合意形成）／ Lean UX / MVP（実用最小限の製品）／ UXライティング・ラベル設計／アクセシビリティ・ユニバーサルデザイン／オブジェクトベースUI / Modeless User Interface ／タスクベースUI / Command Line Interface

• UIデザインⅠ（iOSアプリ・Androidアプリ）

  OS最適化Ⅰ／ Human Interface Guidelines ／OS最適化Ⅱ／ Material Design Guidelines ／審美的整合性／ Aesthetic Integrity ／比喩的要素／ Material isthe metaphor ／マルチデバイス最適化／ Device independent pixel ／人間中心設計／ HCD・UCD ／行動経済学／ Behavioral economics ／ Information Architecture

• UIデザインⅡ（iOSアプリ・Androidアプリ）

  ワイヤーフレーム・プロトタイピング・デザインレビュー／要件定義・画面仕様／ UI設計・制作／ネイティブアプリ／画面レイアウト・トーン&マナー／要素・コンポーネント／ Tab Bars・Navigation Bars ／要素・コンポーネント／ Tabs・Floating Action Button ／プレゼンテーション／検証・評価／改善

• UXリサーチ I（ユーザーリサーチ実践Ⅰ）

  定量調査・定性調査／定量調査・分析／アンケート設計／定性調査・分析／基礎／応用／User Interview / Depth Interview ／Research Plan / Plan-Prep-Work-Analyze ／Research Question 1 / Research Question 2

• UXリサーチ II（ユーザーリサーチ実践Ⅱ）

  Desk Research ／Contextual Inquiry / Flow model / Sequence model ／Contextual Inquiry / Artifact model / Cultural model / Physical model ／行動観察／ Ethnographic Research / User Modeling ／ペルソナ法／ジャーニーマップ／ User Modeling ／価値マップ／シナリオ／仮説思考／ Zero hypothesis ／ MECE / Logical Thinking

• Webグラフィック（Photoshop / Illustrator）

  Photoshopの操作（ツール・機能）／選択範囲／レイヤー／写真の加工・合成／トリミング／色域指定／カラーバランス／色調補正／クイックマスク／レイヤーマスク／文字マスク／フィルタ／Illustratorの操作（ツール・機能）／オブジェクト／パスファインダ／文字の扱い／アウトライン化／クリッピングマスク／Webグラフィック実践Ⅰ／ Webグラフィック実践Ⅱ

• Webグラフィック制作実習

  デジタルデバイス対応デザイン／Web用画像フォーマット／ Webカラー表現／Webタイポグラフィ／サイトレイアウト／ワイヤーフレーム／デザインカンプ／デザインカンプ制作実習／プレゼンテーション／講評

• カラーイメージ表現

  色彩の基礎知識／色の見え方／トーンのイメージ・色の温度感／対比・同化／色の進出・後退／色の膨張・収縮色／色のサンプリング・グラデーション実習／配色の基本／配色基礎用語／色相・トーンを手がかりにした配色／配色トレーニング／色彩マーケティング／色彩構成 実習／プレゼン／講評

• フォトイメージ表現

  写真の基礎知識／写真の表現力／カメラの仕組み／構図／アングル／光の向き・種類／考察／焦点距離／画角／ホワイトバランス／遠近感（パースペクティブ）／被写界深度／露出／シャッタースピードと絞り値／コンセプトワーク／フォトセレクション／デジタルフォト撮影実習／プレゼン／講評

• タイポグラフィ

  タイポグラフィ概論／ヒストリー／タイプフェイス／字形・字体／書体の構造／書体の選定／複数メディアのタイポグラフィ／書体イメージとバリエーション／欧文書体／欧文組版／ハイフネーション／和文書体／和文組版／約物と禁則処理／実験的和文組版／スペーシング実践／和欧混植／組版ルール／ジャスティファイ

• グラフィックデザイン

  デザイン制作ワークフロー／コンセプトワーク／デザイン基礎／デザインエレメント／コミュニケーションデザイン／視覚デザイン／ DTP基礎／プロセスカラー／トンボ／ロゴタイプ／トレース／Map／レイアウト／ホワイトスペース／グラフィックデザイン（広告・販促）制作実習／プレゼンテーション／講評

• Web基礎

  Web技術（Webの仕組み／HTTP／静的・動的ページ）／ネットワーク（TCP・IP／URL／ドメイン／DNS）／Webのデータ形式（HTML／CSS／画像形式／Script言語）／Webアプリケーション（MVCモデル／SPA／フレームワーク／API／CGI）／システム基礎（LAMP環境／クライアントサーバシステム）／マインドセット（バックキャスティング／考え方）／リサーチテクニック（Google検索テクニック／質問／情報収集スキル）／コミュニケーションツール（Slack／RSS／IFTTT）

• PM概論（プロジェクトマネジメント）

  プロジェクトマネジメント概論／ドキュメント管理／プロジェクトの企画／タスク管理ツールの使い方／Gitを用いたバージョン管理／GitHubとPull Requestを使ったグループ作業／プロジェクトマネジメント演習／講評

• データサイエンス基礎

  AI概論／データの前処理や加工の種類／機械学習アルゴリズムの種類と特徴／モデルの評価方法／ディープラーニング概論／ディープラーニングの種類と特徴／AI実装におけるビジネス法規制の基礎理解／G検定対策

• デザインシステムⅠ・Ⅱ

  デザインの定義／関わる領域／デザインの要素／デザインの原則／デザイン事例／デザイン分析／ブランドの定義／ブランド認知・体系／ブランド分析／ターゲット／ブランディング事例／ブランド構築ステップ／コンセプト開発／ブランド構築ワーク／ブランドメッセージ開発

• ブランドデザインⅠ

  ブランドデザイン戦略の理解／デザインの役割／デザインワークフローの理解／アフォーダンスの知識・ブランドイメージ構築／ブランド構築ステップ／自己理解を深めるワーク／五感リサーチ法／共感と反発／課題リフレクション

• ブランドデザインⅡ

  ペルソナを探る／ペルソナ観察・構築／デザイン思考／ブランドデザイン構築Ⅰ・Ⅱ／インタビュー設計／共感マップ作成／フィールドワークⅠ・Ⅱ／フレームワーク分析／ 3C分／ STPマーケティング／セグメンテーション／ターゲティング／ポジショニング開発／ブランドアイデンティティⅠ・Ⅱ／ロゴマークの設計／プロセスの振り返り

• ブランドデザインⅢ

  ブランド戦略構築／ 4Pと4C ／ブランド要素／ブランド体験シナリオ作成／ブランディングプレゼンテーション／発表フィードバック／情報分析／問題定義／市場の情報収集／課題リフレクション／ブランド構築ワークショップ（個人・グループ）／インタビューとアンケート

• ブランドデザインⅣ

  共感ポイント／独自価値の仮説／市場細分化の注意点／見込み客の選定／ネットワーク連想法とポジショニング／ポジショニングマップ作成Ⅰ・Ⅱ／共感課題の見極め／ブランディングテーマの設定／ポジショニングの軸を設定／チーム対話の発想法・収束法／チームコミュニケーション／プロトタイピングⅠ・Ⅱ／プレゼンテーション／講評

• Webクリエイティブ（個別スキルアップ復習）

  HTML5・XHTMLソース復習／ CSS3・CSSソース復習／Dreamweaver操作／復習／ Illustrator操作／復習／Photoshop操作／復習／ jQuery復習／Javascript・PHP・MySQL復習／WordPress復習／レスポンシブWebデザイン復習／作品制作実習／復習

• ポートフォリオ制作実習（Webクリエイティブ／ UI / UX設計 修了制作）

  ポートフォリオ基礎知識／企画／コンセプトメイキング／基本設計／レイアウト／ポートフォリオ情報設計／トップページデザイン制作／差別化／オリジナリティ／ポートフォリオプレゼンテーション／ポートフォリオUI / UX戦略／権利／コピーライト ／講評／フィードバック

• デザイナー就活の実践テクニックⅠ（キャリアデザイン）

  デザイナー就活のフロー／デザイン業界の就活動向／自己分析（時系列／強み・弱み／カテゴリー）／自分のコア・コンピタンスと客観的評価／現状把握とビジョン設計からアクションプランを構築／自己PR・志望理由／オリジナル履歴書のプロトタイプと成功事例紹介／自己分析とオリジナル履歴書の最適化／デザイン業界で評価されるオリジナル履歴書の作り方／オリジナル履歴書＆職務経歴書の個別添削

• デザイナー就活の実践テクニックⅡ（キャリアデザイン）

  デザイナー就活の書類選考・面接試験の採点基準／オリジナル履歴書の最終添削と質疑応答／企業情報の収集と分析／自分に合った会社探し／デザイナー選考試験のグループディスカッション必勝法／面接試験の実践的対策（デザイナー採用編）／デザイナー採用面接の質問例6類×7パターン分析／ビジュアル対策（面接）／写真の選定（応募書類）／第一志望の最終面接に照準を合わせた準備

• プレックスプログラムⅠ

  デザインプロセス／デザインシステム／デザイントレンドⅠ（現在）／デザイントレンドⅡ（未来）／企画アイデアの発想方法／着眼点と発想法の成功事例Ⅰ／着眼点と発想法の成功事例Ⅱ／ストーリー構築／コンセプトメーキングⅠ／コンセプトメーキングⅡ

• プレックスプログラムⅡ

  ボーダレスデザイン（国／分野）／プラスデザイン／ソーシャルデザイン／コミュニケーションデザインⅠ／コミュニケーションデザインⅡ／デザインストラテジーⅠ（ブランディング）／デザインストラテジーⅡ（マーケティング・MD）／クリエイティブワークショップ／グループディスカッション／デザインプレゼンテーション