Module 3 — 審美眼を鍛える講座

UX/UIデザイン
審美眼を鍛えよう

「なんとなく良い」「なんとなくダサい」を卒業——
デザインの言葉で語れる審美眼を、3時間で手に入れよう。

3h
集中講座
4名
少人数制
7枚
ワークシート
1m
チャットサポート

こんな人におすすめ

デザインの良し悪しを言語化できない 「なんとなくダサい」は卒業。デザイン原則の言葉で説明できるようになります。
AI生成UIをそのまま使ってしまう AIが出力したUIの「どこが悪いか」を見抜き、的確にフィードバックできるようになります。
フロントエンド実装でデザインが崩れる タイポグラフィ・カラー・レイアウトの原則を理解し、実装品質を底上げします。
プロダクトの見た目に自信が持てない起業家 デザイナーに頼らなくても、最低限の審美眼で品質を担保できるようになります。

講座の進め方

ライブ講義+ハンズオンワーク+批評セッションの3本柱で学びます。

1
講義パート
デザイン原則・タイポグラフィ・カラー理論を、実例UIの対比で視覚的に解説します。
2
ワークショップ
全7枚のワークシートで手を動かしながら学習。原則を「知っている」から「使える」に変換します。
3
デザイン批評
実際のUIを観察→解釈→評価の3ステップで言語化。審美眼を鍛えるハイライトです。
4
成果物完成
AIに渡せるUIモックアップ仕様書(WS-7)を完成させて持ち帰ります。

カリキュラム

デザイン原則を学び、手を動かし、審美眼を鍛える。
3時間でここまでできるようになります。

PART 1 UXの全体像とデザイン原則を掴む
オープニング — なぜ今、審美眼が必要か
AI時代にデザインを学ぶ意義を問いかけ、良いUI vs 悪いUIの対比で「なんとなく」を可視化。本日の学習目標3つとWS-7完成イメージを共有します。
AI時代のデザインUI対比10分
UX基礎 — UXとUIの違い・認知フロー・5要素
UXとUIの定義を明確化し、ユーザーの認知フロー(認識→判断→行動→フィードバック)を理解。Peter MorvilleのUX5要素と認知コストの概念を習得します。
UX vs UI認知フロー5要素20分
デザイン原則 — ゲシュタルト原則+ラムス10原則
近接・類似・連続・閉合のゲシュタルト4原則と、ディーター・ラムスの「良いデザイン10原則」を学習。実際のUIで原則を見つけるワークショップ付き。
ゲシュタルトラムス10原則WS-225分
PART 2 タイポグラフィ・カラー・レイアウトを実践する
タイポグラフィ & カラー理論
フォント種別と印象の違い、H1/H2/Body/Captionの4レベル階層、60-30-10カラールール、コントラスト比とアクセシビリティを実践的に学びます。
タイポグラフィカラー理論WS-320分
休憩+中間振り返り(KPT)
前半の学びをKeep・Problem・Tryで振り返り。休憩しながらスクリーンショット課題に取り組み、後半の実践に備えます。
KPT振り返り10分
レイアウト & UIパターン
8ptグリッドシステムの考え方と、Button/Card/Form/Navigationの4種UIコンポーネント文法を習得。余白と視線の流れを設計する力を身につけます。
8ptグリッドUIパターンWS-425分
PART 3 批評力を鍛え、成果物を完成させる
デザイン批評術 — 審美眼を鍛える4視点
観察→解釈→評価の3ステップ批評手法とラムス原則チェックリストを使い、実際のUIを分析。「なんとなく」を原則の言葉に変換する講座のハイライトです。
批評3ステップWS-520分
ワイヤーフレーム → UIモックアップ作成
自分のプロダクトアイデアをワイヤーフレームに落とし込み、学んだ原則を適用してUIモックアップを作成。紙でもFigmaでもOK、ツールより判断力を重視します。
ワイヤーフレームWS-625分
GOAL — AI時代ワークフロー+WS-7完成
Figma→SVG→AIコーディングのワークフローを理解し、最終成果物「UIモックアップ仕様書(WS-7)」を完成。Claude Code / v0 / Boltに渡してUI実装を開始できる状態で講座を終了します。
AIワークフローWS-7完成Figma→AI実装25分

受講後1ヶ月のチャットサポート付き

講座終了後も安心。1ヶ月のチャットサポート期間中は、デザインレビューやAIツール連携の相談にお答えします。
WS-7の完成や実際のUI改善まで、しっかりサポートします。

デザインレビュー
AIツール連携サポート
WS-7完成フォロー

3時間後、あなたは
「審美眼」を持つ人間になる。

デザインの良し悪しを言語化できる審美眼
ゲシュタルト原則・ラムス10原則の言葉で、UIの問題点を的確に指摘・説明できるようになります。
タイポグラフィ・カラー・レイアウトの実践スキル
フォント階層・60-30-10カラールール・8ptグリッドを実際のUI設計に適用できるようになります。
AIに渡せるUIモックアップ仕様書(WS-7)
Claude Code / v0 / Boltに渡してUI実装を即座に開始できる設計書を持ち帰ります。

講師紹介

「AIで仕事を自動化し、
人間は本来やるべきことに集中しよう。」

東京都出身、バリ島在住。AIプロダクトの開発と、AIで仕事を自動化する仕組みづくりを専門とする。自身もClaude Codeを日常的に活用し、複数のプロダクトを開発・運用中。

「誰もが"作る側"になれる世界」を目指し、AutoMatesを運営。初心者がつまずくポイントを熟知した、実践重視の講義スタイル。

上山 翔太
AutoMates 主宰 / AIエンジニア・起業家

AutoMatesメンバーの声

UX/UIデザイン講座を受講した仲間のリアルな声を紹介します。
(画像はAI生成のイメージです)

田中さん(29歳)
石田さん(28歳)
マーケティング担当
「なぜ良いデザインか」を言語化
近接・類似・連続・閉合のゲシュタルト4原則を学んで、「なんとなくダサい」を原則ベースで説明できるようになりました。60-30-10のカラー比率やコントラスト比の基準も即実践で使えます。
佐藤さん(34歳)
西田さん(35歳)
フリーランスエンジニア
デザイン批評術で「感覚」を「原則」に変換
3ステップ批評(観察→解釈→評価)とラムスの10原則チェックリストが衝撃でした。コードは書けてもデザインに自信がなかった自分が、根拠を持ってUIを判断できるようになりました。
鈴木さん(42歳)
渡辺さん(39歳)
個人事業主
8ptグリッドとUIモックアップを自分の手で作成
タイポグラフィの4段階(H1/H2/Body/Caption)と8ptグリッドシステムを学んでから、UIの「見やすさ」が劇的に変わりました。講座内でモックアップまで仕上げて持ち帰れるのが嬉しかったです。

※ メンバーのプライバシー保護のため、お名前は仮名です。成果は個人差があります。

開催日程・申し込みの流れ

開催日次回日程調整中確定次第、優先案内します
時間3時間休憩10分含む
形式オンライン(Zoom)PC・音声・カメラ推奨
定員4名少人数制
料金¥16,500税込 / 1名

申し込みの流れ

STEP 1
フォーム送信
必要事項を入力して送信
STEP 2
決済(Stripe)
安全な決済ページでお支払い
STEP 3
Zoom URL配布
開催日前日にメールでお届け
STEP 4
当日開催
URLをクリックしてスタート!

よくある質問

はい、まったく問題ありません。センスは生まれつきではなく訓練で身につくものです。本講座で学ぶゲシュタルト原則・ラムス10原則・タイポグラフィ・カラールールはすべて「言語化されたセンス」です。3時間でセンスの土台となる言語を手に入れます。
はい、紙と鉛筆でも参加できます。本講座は「ツールの操作」より「デザインの判断力」を重視しています。Figmaを使いたい方には基本操作(フレーム・テキスト・図形の3つ)だけお伝えしますが、必須ではありません。
はい、AIツールの事前準備は不要です。講座のゴールはWS-7(UIモックアップ仕様書)を完成させることで、AIへの入力は講座後に取り組めます。Bolt.newはアカウント不要でURL(bolt.new)を開くだけで使えるので、講座後すぐに試せます。
はい、まさにその「知っている→使える」のギャップを埋めるのが本講座の核心です。Block⑦のデザイン批評演習では、実際のUIを原則で分析し、言語化する実践を行います。ラムス原則チェックリストで自分のUIを採点し、改善点を具体化するところまで落とし込みます。
はい、どなたでも受講いただけます。ただし、AutoMatesメンバーには優先案内と割引特典があります。興味のある方はAutoMatesへの入会もご検討ください。

準備はいい?
「審美眼」を手に入れよう。

デザイン原則・タイポグラフィ・カラー・レイアウトからUIモックアップ完成まで。
「なんとなく」を卒業する3時間の集中講座。

予約・お支払いへ進む

※ Stripeによる安全なオンライン決済

3h 集中講座
4名 少人数制
1m チャットサポート
¥16,500 税込