COMMUNICATION DESIGN STUDIO - UX DIGITAL PRODUCT DESIGN DIVISIONUXデジタルプロダクトデザイン総合コース

コース詳細表

• HTML Living Standard デザインシステムⅠ CSS3コーディングⅠ

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

• Webプロトタイピング （Figma）

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

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

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

• HTML Living Standard CSS3コーディングⅡ

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

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

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

• HTML Living Standard CSS3コーディング実践

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

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

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

• 作品制作実習

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

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

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

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

  アイコンフォント／ユーザビリティ設計／Webアクセシビリティ／デザインガイドライン／UI パーツデザイン／コンポーネント設計／情報構造／ HTML・CSS設計／CSS命名規則／ CSSプリプロセッサ

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

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

• UIデザイン（IA・UX・UIデザイン）

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

• Webマーケティング

  Web解析(Google Analytics)基礎／ CV / CVR / インテント／サイトコンセプトに基づいたSEO設計／SEOの課題発見と改善手法／ Webリスティング広告／リスティング広告の課題発見と改善手法／ランディングページの企画・設計／SNSマーケティング

• Webディレクション

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

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

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

• UX / UI基礎Ⅱ（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 / Version Management（履歴管理）／ 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 is the metaphor ／マルチデバイス最適化／ Device independent pixel ／人間中心設計／ HCD・UCD ／行動経済学／ Behavioral economics ／ Information Architecture

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

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

• UXデザイン実践Ⅰ

  Brand Framework（ブランディングの原則）／ Brand Proposition（中核概念）／ Brand Experience（構造構築）／ Brand Engagement（浸透活動）／ Brand Mesaure（効果測定）／ Brand Strategy（ブランド戦略）／OuterBrand / InnerBrand（アウターブランディングとインナーブランディング）／ Brand Department（ブランド組織の作り方）

• UXデザイン実践Ⅱ

  Design Philosophy / Brand Logo（デザイン哲学／ブランドロゴ）／ Brand Motif / Brand Color （ブランドモチーフ／ブランドカラー）／Brand Guidelines（ブランドガイドラインの策定と実装）／ Brand × UX / UI Design（UX / UIデザインへの応用）／組織設計と人的資本（ISO30414の理解）／インセンティブ設計（金銭報酬／体験報酬／感情報酬）／ビジネスSNSと時代性（依存先分散と自立）／ VUCA時代における「複業」の思考法

• 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タイポグラフィ／サイトレイアウト／ワイヤーフレーム／デザインカンプ／デザインカンプ制作実習／プレゼンテーション／講評

• カラーイメージ表現

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

• フォトイメージ表現

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

• タイポグラフィ実践

  タイポグラフィ概論／タイプフェイス／字形・字体／書体の構造／書体の選定／文字の表現力／文字の力／和文書体／種類・バリエーション／欧文書体／種類・バリエーション／文字サイズ・文字組み／文字間隔・行の間隔・禁則処理／可読性／可視性／グレー濃度と紙面／段組み／組版ルール／和欧混植／スペーシング

• レイアウト実践

  レイアウト概論／シンメトリー／グリッドシステム／ホワイトスペース／導線の設計／見えるラインと見えないライン／反復と変移／モジュールとユニット／ 1 / 3の法則／ジャンプ率／トリミング／キーワードとビジュアル／フレーミング／連続性・繰り返し／セパレーション／ムーブマン／アクセント／タイリング／曲線のデザイン効果

• JavaScript 実践（UI / 機能実装）

  JavaScript概論／基本文法／ ECMAScript ／変数／定数／文字列／条件分岐／繰り返し／関数／引数／戻り値／オブジェクト／プロパティ／メソッド／イベントハンドラ／イベントリスナー／正規表現／文字列操作／UI/機能の実装／タブ切り替え／アコーディオン／カルーセル・スライダー／モーダルウインドウ／ローディング／並べ替え機能／絞り込み機能／スクロール関連機能／フォーム関連機能

• Webサイト制作実習（ノーコード）

  ノーコード制作概要／プロジェクト管理／ダッシュボード／アニメーション設定／ボックスレイアウト／ Webフォント／マルチデバイス／レスポンシブデザイン／企画 ・コンセプト／ページ構成／トップページ・コンテンツページ制作／レスポンシブWebサイト／ページ最適化／サイトプレビュー／プレゼンテーション／作品講評

• モーションデザイン実践Ⅰ

  モーションデザイン概論／ワークスペース／環境設定／AfterEffects基礎／プロジェクト／レイヤー／プロパティ／パラメータ／タイムライン／コンポジション／キーフレーム／イージング／モーションパス／グラフエディター／リファレンスエフェクト／トランジション／アドビソフトとの連携

• モーションデザイン実践Ⅱ

  シェイプ／動き／ 3D ／視線誘導／優先順位／動きの見せ方／タイトルアニメーション／パスアニメーション／キャラクターアニメーション／グラフィックアニメーション／パララックス表現／カメラワーク／レンダリング／エクスポート／バナー制作／サイネージ広告制作／リール動画制作／プレゼンテーション／講評

• デザインシステムⅠ

  デザインの定義・事例／デザイン領域／デザインの道具／デザインフローの理解／デザインの前提・要素・原則／黄金比／グリッド／ゲシュタルト原則／デザイン分析／デザインの目的と対象／ビジネスフローとデザインの関係性／ブランドの定義／ブランドアイデンティティ／ブランド認知／ブランド体系／ブランド要素／ブランド体験

• デザインシステムⅡ

  ブランド分析／ターゲット／ブランディング事例／ブランド構築ステップ／ブランドとデザインの関係性／ブランドデザインの役割／コンセプト開発／ブランドメッセージ開発／グループワーク形式の理解／ 8QSを使ったコンセプトメイキング／ブランドキーワードの選定／コンセプト設計／ブランド構築ワーク／グループワーク発表／講評／課題リフレクション

• ブランドデザインⅠ

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

• ブランドデザインⅡ

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

• ブランドデザインⅢ

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

• ブランドデザインⅣ

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

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

  HTML Living Standard / CSS3コーディング復習／Figma操作／復習／ Visual Studio Code操作／復習／Photoshop操作／復習／ Illustrator 操作／復習／JavaScript / jQuery復習／ PHP・MySQL・WordPress復習／Webデザイン実践復習／レスポンシブWebデザイン復習／作品制作実習／復習

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

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

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

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

• デザイナー就活の実践テクニックⅡ（就活実践テクニック）

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

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

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

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

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