13 điểm bởi GN⁺ 2025-11-05 | Chưa có bình luận nào. | Chia sẻ qua WhatsApp
  • Sự xuất hiện của các công cụ tạo prototype bằng AI đang khiến nhà thiết kế chuyển từ mockup tĩnh sang quy trình trực tiếp tạo prototype tương tác và thậm chí tự triển khai thành mã thực tế
  • Tại các startup lớn như Perplexity, Vercel, các nhà thiết kế đang dùng các công cụ AI như Cursor, Claude, Lovable, V0 để viết mã frontend và phụ trách cả việc triển khai production
  • Trong mảng branding, họ tự xây dựng công cụ tạo hệ thống đồ họa bằng Lovable để bàn giao cho khách hàng, tự động hóa việc mở rộng pattern và duy trì thương hiệu
  • Trực giác sản phẩm (product intuition) và nền tảng thiết kế đồ họa (màu sắc, khoảng cách, khả năng đánh giá thị giác) vẫn là năng lực cốt lõi, còn AI đóng vai trò chất xúc tác giúp tăng tốc thực thi
  • Vai trò của nhà thiết kế đang mở rộng từ "vẽ hình chữ nhật" thành "truyền đạt tầm nhìn và ra quyết định", và ý tưởng rõ ràng cùng khả năng phán đoán nhanh ngày càng quan trọng hơn kỹ năng sử dụng công cụ

Quy trình branding dựa trên công cụ AI

  • Nick Patterson(phụ trách branding cho Lovable, Craft, Maven, v.v.) đã dùng Lovable để tạo một công cụ sinh hệ thống đồ họa thương hiệu chỉ trong 1 giờ
    • Trong dự án branding cho bộ xử lý thanh toán Flow Glad, anh đã xây dựng công cụ Pattern Architect dựa trên các pattern hình học Hồi giáo
    • Đây là công cụ tương tác cho phép khách hàng điều chỉnh theo thời gian thực bán kính, mật độ ngôi sao, độ dày nét, khoảng cách, v.v.
    • Trong sprint 2 tuần (10 ngày), anh phát triển nhiều phiên bản của công cụ tạo pattern và bàn giao cho khách hàng
  • Có thể trình bày visual hoàn thiện cao ngay từ giai đoạn moodboard
    • Trước đây moodboard chủ yếu dựa vào tham chiếu từ tác phẩm của nhà thiết kế khác, nhưng nay sản phẩm tự tạo đã trở thành trung tâm của moodboard
    • Ngay từ ngày thứ 2 đã có thể tiến hành tích hợp typography và pattern theo phong cách sơ đồ tuyến metro
  • Một cách handoff mới: bàn giao công cụ cho khách hàng
    • Sau khi xây dựng thương hiệu, cung cấp chính công cụ để khách hàng có thể tự mở rộng và biến thể pattern
    • Khi khách hàng yêu cầu một "điểm ở giữa", họ có thể tự điều chỉnh tham số để thể hiện ý định
    • Giúp các công ty vận hành nhanh có thể triển khai và mở rộng thương hiệu ngay lập tức

Ứng dụng thực tế của công cụ tạo prototype bằng AI

  • Pranati Perry(trưởng thiết kế Vercel V0) sử dụng V0 cho tạo asset và prototype tương tác
    • Tạo component cartridge cho portfolio: sinh SVG trong Figma → chuyển thành công cụ động trong V0
    • Chỉ với một prompt có thể đổi màu gradient của SVG, làm text trở nên động, thêm hiệu ứng trong suốt, v.v.
    • Tạo sprite animation và chuẩn bị làm game RPG trên web
  • Quy trình thiết kế sản phẩm: các giai đoạn Trước(Pre) - Trong khi thực hiện(During) - Sau đó(Post)
    • Trước: khám phá ý tưởng trong Figma và V0, Figma không còn là nguồn duy nhất của UI
    • Trong khi thực hiện: dùng Claude để viết mã production, nhà thiết kế trực tiếp hiện thực hóa phần lớn thiết kế
    • Sau đó: Vercel Agent tự động để lại comment trên PR để hỗ trợ review code
  • Phạm vi sử dụng V0
    • Prototype phức tạp như billing flow: thay vì "spaghetti prototyping" trong Figma, có thể mô tả luồng modal bằng ngôn ngữ tự nhiên
    • Công cụ tạo hiệu ứng khối cube dithering cho quảng cáo hội nghị Next.js và email header (do nhà thiết kế thương hiệu Dan thực hiện)
    • Hoàn thiện animation cho nút CTA trong V0 rồi chuyển trực tiếp cho design engineer
  • Xu hướng người dùng V0
    • Ban đầu chủ yếu dùng để tạo landing page, đồ họa, shader
    • Gần đây các vị trí sales và PM dùng nó để tạo phần mềm cá nhân phục vụ công việc
    • PM tạo mockup tương tác để bổ sung PRD, vượt qua prototype tĩnh để kết nối dữ liệu live và tích hợp AI

Tích hợp công cụ AI trong thiết kế sản phẩm

  • Henry Modiset(VP of Design tại Perplexity) định nghĩa vai trò của nhà thiết kế là giải quyết vấn đề + truyền đạt tầm nhìn
    • Công cụ AI được dùng như công cụ giao tiếp tương tác, tập trung vào trực quan hóa định hướng thay vì mockup ứng dụng hoàn hảo
    • Có thể khám phá ý tưởng nhanh và rẻ trước khi yêu cầu kỹ sư bắt tay vào làm
  • Tình hình sử dụng AI của đội ngũ thiết kế Perplexity
    • Đội thiết kế thương hiệu: thử nghiệm và kết hợp mọi công cụ theo nguyên tắc tốc độ(velocity) và sản lượng(volume)
    • Đội thiết kế sản phẩm: viết mã production hằng ngày bằng Cursor và Claude Code
    • Một số nhà thiết kế chỉnh animation trong sandbox prototype rồi chuyển cho kỹ sư
    • Đội game design: cộng tác giữa nhà thiết kế cơ chế game + nhà thiết kế UI + nhà thiết kế tạo nhạc
  • Công cụ được áp dụng nhiều nhất: Cursor
    • Đây là công cụ được tích hợp hoàn chỉnh nhất ở khía cạnh thiết kế sản phẩm
    • Khi cần khám phá ở quy mô nhỏ (như một animation cụ thể), họ dùng các công cụ kiểu sandbox như V0, Lovable
    • Đội branding xây dựng pipeline từ Midjourney → Sora(video) → tạo nhạc → Frame.io
  • Phổ kỹ năng kỹ thuật của nhà thiết kế
    • Người đã có nhiều năm kinh nghiệm viết mã production: dùng AI như bộ tăng tốc chủ lực
    • Nhà thiết kế không có kinh nghiệm code: bắt đầu học code để tinh chỉnh animation và thêm chi tiết mang bản sắc thương hiệu
    • Gunnar(nhà thiết kế): trước đây không có kinh nghiệm code nhưng hiện viết UI component Svelte bằng Cursor

Cách nhà thiết kế đóng góp vào codebase

  • Triển khai giờ đã trở thành table stakes (năng lực nền tảng mà nhà thiết kế cần có)
    • Khi tốc độ triển khai tăng lên, có thể dành nhiều thời gian hơn cho tư duy sáng tạo
    • Những phần follow-up của tính năng trước đây mất 2~3 tuần thì nay rút xuống còn 1 tuần
  • Xác định phạm vi prototype là điều quan trọng
    • Prototype toàn bộ flow là không hiệu quả; nên tạo PR ở giai đoạn giữa rồi chuyển sang triển khai thực tế
    • AI hiệu quả nhất cho prototype tương tác theo điểm chạm cụ thể
    • Xử lý edge case: mô tả điều kiện bằng ngôn ngữ tự nhiên hiệu quả hơn việc tạo mockup từng cái một
  • Cách tiếp cận review code và học tập
    • Cần tiến hóa vượt qua "blind coding" để thực sự hiểu đoạn mã do LLM viết
    • Hãy đối xử với LLM như một "thực tập sinh"; khi đưa chỉ dẫn kỹ thuật cụ thể, chất lượng đầu ra sẽ tốt hơn
    • Ghi rõ trong Claude Memory rằng "Tôi là nhà thiết kế và muốn học cách code hoạt động" để tạo cơ hội học tập
    • Đặt mục tiêu giảm thiểu "dấu chân"(footprint) để không gây phiền cho kỹ sư

Sự tiến hóa của vai trò nhà thiết kế và tiêu chí tuyển dụng

  • Năng lực cốt lõi của nhà thiết kế trong thời đại AI
    • Trực giác sản phẩm (product intuition): khả năng quyết định nên tạo gì và nói "không" với phần lớn ý tưởng
    • "Vì sao mọi người sẽ dùng thứ này? Nó có hoạt động một cách trực quan không? Nó phù hợp với thị trường như thế nào? Nó có đủ hấp dẫn để đặt trên màn hình chính không?"
    • Nền tảng thiết kế đồ họa: khả năng đánh giá "tốt và xấu" trong màu sắc, khoảng cách, định hình character, v.v.
  • Những tín hiệu Perplexity chú ý khi tuyển dụng
    • Kinh nghiệm làm founder designer hoặc freelancer solo: người quen với việc ra quyết định độc lập
    • Nhân sự có cả trực giác sản phẩm lẫn khả năng art direction
    • Ý chí học hỏi liên tục: công cụ thay đổi nhanh nên khả năng thích nghi rất quan trọng
  • Định nghĩa lại vai trò của nhà thiết kế
    • Nếu bị mắc kẹt trong việc "vẽ hình chữ nhật" thì sẽ không có quyền lực(power)
    • Với công cụ AI, có thể truyền đạt tầm nhìn trong đầu mạnh mẽ hơn
    • Lợi ích cốt lõi của việc nhà thiết kế code: "Tự làm còn dễ hơn là giải thích suy nghĩ của mình"
    • Có thể tạo ra kết quả tương tác và có chiều sâu chỉ trong vài ngày

Cấu trúc cộng tác và lời khuyên thực tiễn

  • Môi trường nơi cả PM và nhà thiết kế đều có thể tạo prototype
    • Tệ nhất là hỗn loạn, tốt nhất là tạo ra phần mềm tốt hơn
    • Cần xem xét lại từ nguyên lý đầu tiên: "Lên kế hoạch phần mềm bằng công cụ hình ảnh tĩnh là điều phi lý"
    • Prototype tương tác là cách tự nhiên để thiết kế phần mềm
  • Cần văn hóa ra quyết định rõ ràng và xác lập quyền sở hữu
    • Khi ai cũng có thể tạo ra sản phẩm, khả năng ra quyết định nhanh hơn lại càng cần thiết
    • Điểm mạnh của nhà thiết kế: giỏi chọn hướng đi trong sự bất định
  • Lời khuyên áp dụng thực tế
    • Ý tưởng chiếm 80%, sử dụng công cụ chiếm 20%
    • 2~3 năm trước còn code mà không có AI, nhưng giờ thay đổi đến mức khó tưởng tượng
    • Có thể biến danh sách ý tưởng thành prototype chỉ bằng hội thoại ngôn ngữ tự nhiên
    • Học qua sai lầm là điều quan trọng; văn hóa tổ chức cung cấp môi trường thử nghiệm là thiết yếu

Kết luận — Phổ thiết kế được AI mở rộng

  • AI không chỉ là công cụ tăng tốc cho nhà thiết kế mà còn là phương tiện mở rộng bề rộng của đầu ra sáng tạo
  • Giờ đây nhà thiết kế đang tiến hóa từ người dùng công cụ thành người tạo công cụ, vượt qua ranh giới giữa code, AI và đồ họa
  • Kỷ nguyên thiết kế sau Figma đang dịch chuyển theo hướng thiết kế "ý tưởng có tương tác thay vì hình ảnh tĩnh"
  • Khi AI trở nên phổ cập, thời đại mà "ai có thể triển khai" kém quan trọng hơn "muốn tạo ra điều gì" đang đến gần

Chưa có bình luận nào.

Chưa có bình luận nào.