20.1 · Tổng quan khóa học — Claude Design cho Designer UI/UX

Khóa học này dành cho ai

✅ Design lead / creative director — quản lý team designer, đánh giá tool mới cho team adoption.

✅ Freelance / agency designer — cần explore brand direction nhanh, pitch khách multi-variant, ship nhiều dự án parallel.

✅ In-house product designer — work với PM/eng, cần iterate spec → mockup nhanh hơn.

❌ Không dành cho: founder/marketer hoàn toàn không biết design (course này assume basic Figma vocab); đại học sinh viên năm 1 mới học design (foundation cần học trước).

Tại sao Claude Design — và tại sao bây giờ

Bối cảnh ngành design 2026

3 sự kiện thay đổi cách designer làm việc:

1. 2024 — Figma launch AI featuresgenerate component, smart suggestions. Tốt nhưng còn limited cho production design.
2. 2025 — Image generators matureMidjourney v6, DALL-E 3 → moodboard và illustration generation thuần thục, nhưng không hiểu design system, không reason layout.
3. 2026 — Claude Design (Anthropic Labs)model đầu tiên Opus 4.7 hiểu cả text và visual cùng lúc — generate design có structure thật, code-aware, design system aware.

Đây là điểm gãy. Designer không học Claude Design 2026 = designer 2018 chưa học Figma = lệch 1 chu kỳ tool.

Arc lịch sử design tools

1990s ─── 2010s ──────── 2020s ─────── 2026
   │         │              │            │
   ▼         ▼              ▼            ▼
 Adobe     Figma          Canva      Claude Design
   │         │              │            │
   ▼         ▼              ▼            ▼
"Cần         "Designer       "Ai cũng    "Bạn không
 chuyên       collab          design     cần biết
 môn 5+      realtime,       được         design.
 năm         design          với           Chỉ cần
 mới         system           template.    chọn cái
 dùng        bài bản"                      bạn muốn"
 được"

Mỗi bước:

• Rào cản học giảm xuống
• Tốc độ produce tăng lên
• Số người tham gia tạo visual tăng lên

Claude Design không thay Figma cho designer pro. Nó augment designer + cho phép non-designer participate. Designer thông minh dùng Claude Design = leverage. Designer ignore = relegated to "chỉ làm cái Claude làm không tốt".

Stats thị trường

Theo các nghiên cứu trích trong cộng đồng AI design 2026:

• 65% time product team dành cho giải thích design thay vì xây design
• 70% increase demand visual content vài năm gần
• 75% non-designers trong early Claude Design testing tạo được usable design
• 40% accuracy improvement khi combine visual + text reasoning (Opus 4.7)
• 50% YoY adoption AI tools trong creative industries

Translate cho designer:

• Designer không adapt = bị replace ở 30-50% task ideation/first draft trong 2-3 năm tới
• Designer adapt = multiplier 3-5x productivity cho cùng quality

Course này dạy bạn cách thuộc nhóm thứ 2.

Cấu trúc khóa học — 11 bài, 4 module

┌─────────────────────────────────────────────────────────────┐
│                                                             │
│  MODULE 1: NỀN TẢNG  (Bài 1, 2, 3)                          │
│   ├─ Bài 1: Tổng quan khóa học (đang học)                   │
│   ├─ Bài 2: Claude Design là gì                             │
│   └─ Bài 3: Prototype đầu tiên — anatomy 1 vòng prompt      │
│                                                             │
├─────────────────────────────────────────────────────────────┤
│                                                             │
│  MODULE 2: WORKFLOW CỐT LÕI  (Bài 4)                        │
│   └─ Bài 4: Iterate & Edit — 4 chế độ chỉnh sửa             │
│                                                             │
├─────────────────────────────────────────────────────────────┤
│                                                             │
│  MODULE 3: BRAND & DESIGN SYSTEM  (Bài 5, 6)                │
│   ├─ Bài 5: Brand synthesis từ zero (firecrawl + Claude)    │
│   └─ Bài 6: Design system trên Claude — upload, audit       │
│                                                             │
├─────────────────────────────────────────────────────────────┤
│                                                             │
│  MODULE 4: OUTPUT FORMATS  (Bài 7, 8)                       │
│   ├─ Bài 7: Slide deck & pitch — PowerPoint killer          │
│   └─ Bài 8: Landing page & launch video — 21st.dev integ.  │
│                                                             │
├─────────────────────────────────────────────────────────────┤
│                                                             │
│  MODULE 5: PRODUCTION  (Bài 9, 10, 11)                      │
│   ├─ Bài 9: Hand-off & integration — 5 paths                │
│   ├─ Bài 10: Token economics & ROI                          │
│   └─ Bài 11: Tổng kết, quiz, tương lai                      │
│                                                             │
└─────────────────────────────────────────────────────────────┘

Thời gian học ước tính

Pacing đề xuất:

• Sprint mode (1 tuần): 2 bài/ngày × 6 ngày, ngày 7 review
• Comfort mode (1 tháng): 3 bài/tuần
• Reference mode (open-ended): đọc theo nhu cầu, không sequential

Cách học hiệu quả nhất

Tip 1: Đọc Bài 4 sớm (ngay sau Bài 2)

Bài 4 (Iterate & Edit) là file mẫu structure-wise. Đọc sớm = hiểu pattern các bài còn lại.

Recommended order: 1 → 2 → 4 → 3 → 5 → 6 → 7 → 8 → 9 → 10 → 11.

Tip 2: Có Claude Pro trial trước khi bắt đầu

Bài tập hands-on là half giá trị course. Không có Claude Design access → mất 50%.

• Free tier: đủ tour Bài 2 (workspace, examples)
• Pro $20/mo: đủ làm full bài tập 11 bài
• Trial 7 days: đủ 1 sprint hoàn thành course

Tip 3: Maintain "Recipe doc" từ Bài 3

Bài 3 introduce concept "Recipe doc" — Notion/Markdown lưu prompt + answers + tweaks cho mỗi prototype tốt. Bắt đầu doc này ngay từ Bài 3.

Sau 11 bài, bạn có 15-25 recipe = library cá nhân.

Tip 4: Skip exercise nếu time-tight, nhưng đọc full

Mỗi bài có 1-2 exercise (15-60 phút). Skip OK nếu bạn chỉ muốn understanding. Đừng skip phần đọc — exercise có thể quay lại sau.

Tip 5: Apply trên 1 dự án thật song song

Trong khi học, pick 1 idea cá nhân (course bạn build, side project, freelance client). Apply mọi technique vào idea đó. Cuối course, bạn có:

• Brand synthesis output (Bài 5)
• Design system Claude Design (Bài 6)
• Pitch deck (Bài 7)
• Landing page + animation (Bài 8)
• Production-ready hand-off (Bài 9)

= MVP launch package. Cost: $20 + 12 giờ học.

Yêu cầu chuẩn bị

Technical

• Browser modern (Chrome/Safari/Firefox/Arc latest)
• Tài khoản Claude (free tier OK cho start, Pro recommended)
• Tài khoản Figma free (cho Bài 6, 9 — upload design system, hand-off)
• (Optional) Account firecrawl.dev free (Bài 5)
• (Optional) Vercel/Netlify free (Bài 9 deploy HTML)
• (Advanced) Claude Code CLI + Figma MCP (Bài 9)

Background knowledge

• Basic Figma vocab: frame, component, auto-layout, variable, style
• Basic design principles: hierarchy, spacing, color theory, typography
• Đã làm ít nhất 3-5 prototype Figma (mobile / desktop)

Mindset

• Sẵn sàng spend $20 Pro Claude cho hands-on (hoặc trial 7-day cho sprint)
• Sẵn sàng "fail forward" — vài prototype đầu sẽ không hoàn hảo
• Sẵn sàng update workflow — không cứng nhắc "Figma forever"

Triết lý course này

Nguyên tắc 1: Augment, không replace

Claude Design không thay Figma cho production design. Course này dạy bạn dùng nó bổ sung, không thay thế. Designer ignore Figma sẽ mất production craft. Designer ignore Claude Design sẽ mất exploration speed. Tốt nhất là cả hai.

Nguyên tắc 2: Speed enables judgment

Tool nhanh hơn không có nghĩa quyết định nhanh hơn. Tool nhanh = nhiều variation explore = judgment chất lượng cao hơn. 5 mockup variant trong 30 phút = quyết định có data, không phải gut feeling.

Nguyên tắc 3: Token là tài nguyên giới hạn

Course này không pretend Claude Design free. Pro $20/mo có cap. Designer disciplined work within budget. Bài 10 chi tiết token economics — đọc kỹ để không "burn out budget cho fun".

Nguyên tắc 4: Craft 20% là nơi designer giỏi nổi bật

Tool cho 80%. 20% còn lại — responsive polish, accessibility, micro-interaction, brand soul — là craft. Tool không thay craft. Course này không pretend bạn không cần craft.

Nguyên tắc 5: Vocabulary matters

Bạn sẽ thấy nhiều English term trong course (prompt, design system, hand-off, MCP). Đó không phải laziness — là convention industry. Học English design vocab = communicate với global designer community.

Câu chuyện cá nhân — tại sao course này tồn tại

Course này được biên soạn từ 6 transcript YouTube + experience của các designer dùng Claude Design 2-3 tháng đầu sau launch (Apr 2026). Nguồn:

• Kirk @UI Collective — Claude Design: The Complete Guide (32 phút) — designer-grade tutorial chi tiết, có honest critique
• Vaibhav Sisinty — Nobody Is Ready For What Claude Just Launched (13 phút) — non-designer founder POV, brand from zero workflow
• Lil @Iana Veia — Claude Designer Brasil (14 phút) — sales page WordPress workflow, 21st.dev integration
• Anthropic AI — official launch teaser (1.5 phút)
• 3 Demos creator — generic walkthrough (10 phút)
• 30s vs 3hrs Marketing video — stats + thesis (9 phút)

Total source: 80 phút video → đã chuyển thành 11 bài deep-dive. Course này không substitute việc xem video gốc — nhưng condense + structure pedagogically + thêm Vietnamese context, case studies theo ngành, prompt templates, anti-patterns, token economics.

Mục đích: cho designer Việt Nam starting point structured thay vì lặn lội youtube + trial-and-error 2-3 tuần.

Bắt đầu thế nào

Sprint 1 tuần (recommended cho focused learner)

Ngày 1 — Sáng: Bài 1 (15 phút) + Bài 2 (1 tiếng)
         Chiều: Bài 3 (1.5 tiếng)

Ngày 2 — Sáng: Bài 4 (1.5 tiếng) ← apply 4-mode trên prototype Bài 3
         Chiều: Bài 5 (1.5 tiếng)

Ngày 3 — Sáng: Bài 6 (1.5 tiếng)
         Chiều: Apply Bài 5 + 6 vào idea cá nhân

Ngày 4 — Sáng: Bài 7 (1 tiếng)
         Chiều: Bài 8 (1.5 tiếng)

Ngày 5 — Sáng: Bài 9 (1.5 tiếng) — hands-on hand-off
         Chiều: Bài 10 (1 tiếng) — tính ROI cá nhân

Ngày 6 — Bài 11 + review toàn course

Ngày 7 — Off / consolidate Recipe doc / pitch budget cho team

Comfort 1 tháng (recommended cho busy designer)

• Tuần 1: Bài 1-3
• Tuần 2: Bài 4-6
• Tuần 3: Bài 7-9
• Tuần 4: Bài 10-11 + apply project

Reference (advanced)

Đã quen Claude Design? Skip Bài 1-2, đi thẳng:

• Token tight: Bài 4 + 10
• Brand work: Bài 5 + 6
• Production ship: Bài 8 + 9

Tóm tắt bài học

Tài liệu tham khảo

• Claude Design (Anthropic Labs)
• Source videos:
• · Kirk @UI Collective — Claude Design: The Complete Guide (YouTube)
• · Vaibhav Sisinty — Nobody Is Ready For What Claude Just Launched (YouTube)
• · Lil @Iana Veia — Claude Designer Brasil (YouTube, PT)
• Course này — 11 bài tinh chế từ 6 transcript

Quote để giữ tinh thần đúng từ đầu course: "The companies who figure this out first win the next decade" — Vaibhav Sisinty. Replace "companies" với "designers". Bạn đang ở thời điểm 1996 với Photoshop, 2016 với Figma. Pick up tool đúng lúc = career arc đi lên thay vì plateau.