AI có thể tạo giao diện rất nhanh, nhưng để giao diện đó trông giống một sản phẩm thật lại là chuyện khác. Không khó để nhận ra những UI được AI tạo ra: quá nhiều card, chữ nhồi kín màn hình, mọi thành phần có độ ưu tiên gần như nhau và đôi khi nhìn đẹp nhưng lại thiếu cảm giác “có người thiết kế”.
Benji Taylor, Head of Design tại X, thử giải quyết vấn đề này theo một cách khá thú vị. Thay vì tiếp tục viết prompt kiểu “make it more polished” hay “make it look professional”, anh đóng gói chính cách mình đưa ra quyết định thiết kế thành một Skill có tên Stageshow để AI Agent có thể làm theo.
Điểm hay của Stageshow không nằm ở việc đưa cho AI thêm một bộ UI component. Nó giống như đưa cho AI một quy trình suy nghĩ của designer hơn.
Stageshow: kỹ năng giúp agent tạo ra UI, animations, bố cục dạng bento grid chất lượng cùng nhiều nội dung khác.
Vì sao UI do AI tạo vẫn thường có cảm giác “AI”?
Theo cách Stageshow tiếp cận vấn đề, có một vài lỗi rất dễ xuất hiện khi giao toàn bộ phần thiết kế cho AI.
Có lúc AI làm quá nhiều: quá nhiều nội dung, quá nhiều chữ thật, quá nhiều thành phần chen chúc nhau. Ngược lại, đôi khi nó lại làm quá ít, khiến sản phẩm trông giống wireframe hoặc prototype hơn là một giao diện hoàn chỉnh.
Một lỗi khác mình thấy cũng khá quen thuộc là AI thích đóng mọi thứ vào card. Kết quả là cả ứng dụng giống như một screenshot được đặt bên trong một chiếc hộp lớn.
Ngoài ra còn có vấn đề về hierarchy. Khi mọi thứ đều nổi bật như nhau thì cuối cùng chẳng có thứ gì thực sự nổi bật. Giao diện có thể sạch, đúng grid nhưng lại khá phẳng và thiếu điểm nhìn.
Cuối cùng là bản sắc. AI có thể tạo ra một UI đẹp, nhưng đó thường là kiểu đẹp chung chung. Nếu đổi logo sang một thương hiệu khác đôi khi cũng chẳng có gì khác biệt.
Stageshow cố gắng xử lý chính những vấn đề này.
AI chưa vội code, mà phải nghĩ như designer trước
Điểm mình thích nhất ở Stageshow là Agent không được nhảy ngay vào code.
Quy trình được chia thành 7 giai đoạn: Medium → Look → Story → Examples → Screen → Choreograph → Rehearse.
Đầu tiên, Agent phải xác định giao diện này dùng để làm gì: là màn hình tĩnh hay animation, xuất hiện ở đâu và kích thước thế nào.
Sau đó mới đến phần chọn Look — light, dark, glass, blueprint hay một phong cách khác — cùng với màu nhấn chính.
Tiếp theo là Story. Thay vì xem UI như một màn hình duy nhất, Agent chia trải nghiệm thành khoảng 3–5 phân đoạn để xác định người xem nên chú ý vào đâu trước và điều gì xảy ra tiếp theo.
Đến lúc này Agent vẫn chưa thực sự bắt tay vào thiết kế.
Nó tiếp tục tìm những Examples gần nhất từ thư viện mẫu có sẵn để lấy chúng làm điểm xuất phát. Cách này khá giống designer tham khảo các sản phẩm tốt trước khi bắt đầu một concept mới, thay vì ngồi nhìn canvas trắng rồi tự nghĩ mọi thứ từ đầu.
Sau đó mới đến Screen — lúc giao diện thực sự được dựng lên.
Một nguyên tắc khá hay ở đây là không cố nhét nội dung thật vào mọi vị trí. Chỉ những thông tin cần thiết mới sử dụng text thật, những khu vực phụ có thể dùng placeholder hoặc các đường mô phỏng nội dung.
Nhờ vậy màn hình có đủ độ chi tiết để trông như sản phẩm thật nhưng không bị biến thành một đống chữ.
Animation cũng phải có lý do
Nếu giao diện có chuyển động, Stageshow tiếp tục bước sang Choreograph.
Các chuyển động không được thêm vào chỉ vì “animation nhìn xịn hơn”. Chúng phải hỗ trợ câu chuyện của giao diện, kết nối các phân đoạn với nhau và tạo cảm giác liên tục.
Nếu là một animation loop, điểm kết thúc còn phải quay trở lại điểm bắt đầu một cách tự nhiên.
Đây là một chi tiết nhỏ nhưng tạo ra khác biệt khá lớn giữa một UI demo thông thường và một đoạn product showcase được chăm chút.
Hay nhất là AI tự xem lại sản phẩm của mình
Bước cuối cùng có tên Rehearse, và đây có lẽ là phần thú vị nhất của Stageshow.
Agent không tạo xong rồi dừng lại.
Một script sẽ render lại các frame, tạo ảnh tổng hợp để Agent có thể kiểm tra toàn bộ kết quả. Nó có thể phát hiện những vấn đề như text tràn khỏi container, layout thay đổi bất thường hoặc animation bị giật giữa hai frame liên tiếp.
Nói đơn giản, AI vừa là người thiết kế, vừa phải ngồi review lại thiết kế của chính mình.
Cách làm này tốt hơn khá nhiều so với việc chỉ kiểm tra một screenshot cuối cùng, đặc biệt với những giao diện có animation.
Không tự bịa màu sắc và font chữ
Stageshow còn có khả năng đọc design token của project.
Nếu sản phẩm đã có hệ thống màu sắc, typography, border radius hay các quy chuẩn UI riêng, Agent sẽ cố gắng sử dụng những giá trị đó thay vì tự nghĩ ra một bộ style mới.
Đây là chi tiết rất quan trọng nếu muốn đưa AI vào workflow sản phẩm thực tế. Một màn hình đẹp nhưng lệch hoàn toàn khỏi design system hiện tại thì designer vẫn phải mất khá nhiều thời gian sửa lại.
Cách Benji xây dựng Skill cũng đáng học
Một phần mình thấy thú vị không kém bản thân Stageshow là cách Benji cải thiện nó.
Anh sử dụng cùng một prompt cho hai AI Agent mới hoàn toàn. Một Agent được trang bị Skill, Agent còn lại không có thêm hướng dẫn.
Sau đó hai kết quả được đặt cạnh nhau để so sánh.
Khi phát hiện vấn đề, thay vì sửa trực tiếp sản phẩm mà Agent vừa tạo, Benji sửa Skill, rồi chạy lại bài test.
Quá trình cứ tiếp tục như vậy.
Đây là một thay đổi khá lớn trong cách làm việc với AI. Thay vì liên tục sửa output:
Prompt → AI tạo → sửa bằng tay → xong
workflow chuyển thành:
Prompt → AI tạo → phát hiện lỗi → sửa Skill → chạy lại
Kết quả là những gì học được từ một lần thất bại có thể tiếp tục được sử dụng cho hàng loạt tác vụ sau đó.
Cài Stageshow
Stageshow hiện có thể được cài bằng Skills CLI:
npx skills add benjitaylor/skills --skill stageshowSkill được thiết kế để sử dụng với nhiều coding/AI Agent như Claude Code, Codex, Gemini và Grok Build.
Tất nhiên, có Skill không có nghĩa là AI sẽ ngay lập tức thay thế được designer. Chính Benji cũng chia sẻ rằng kết quả thường vẫn cần vài vòng feedback và tinh chỉnh.
Điểm khác biệt nằm ở chất lượng của điểm xuất phát.
Thay vì để Agent tự đoán thế nào là một giao diện đẹp, chúng ta đưa cho nó một hệ thống nguyên tắc rõ ràng hơn để ra quyết định ngay từ đầu.
Điều đáng học từ Stageshow
Với mình, Stageshow thú vị không chỉ vì nó giúp AI tạo UI đẹp hơn.
Ý tưởng lớn hơn nằm ở cách chúng ta xây dựng AI Agent.
Một người có kinh nghiệm thường đưa ra hàng trăm quyết định nhỏ gần như theo bản năng: chỗ này nên bớt chữ, khoảng trắng kia cần rộng hơn, animation này không cần thiết, hierarchy đang sai, màu này không đúng với brand…
Những thứ đó rất khó truyền đạt bằng một câu prompt kiểu:
“Hãy thiết kế giao diện chuyên nghiệp hơn.”
Nhưng nếu chúng được biến thành một quy trình có nguyên tắc, có bước kiểm tra và có thể lặp lại, AI bắt đầu có khả năng tái sử dụng một phần cách suy nghĩ đó.
Và có lẽ đây mới là phần đáng chú ý nhất của Stageshow: không chỉ dạy AI phải làm gì, mà cố gắng đóng gói cách một người có kinh nghiệm đưa ra quyết định.
Khi AI Agent ngày càng phổ biến, những Skill kiểu này có thể sẽ trở thành một phần khá quan trọng trong workflow của designer và developer — nơi kinh nghiệm cá nhân không chỉ nằm trong đầu mỗi người, mà có thể được biến thành một hệ thống để AI cùng sử dụng.
Để lại một bình luận