
Chrome DevTools MCP Cho Designer: Visual QA, Accessibility Và Handoff UI Với AI Agent
Hướng dẫn dùng Chrome DevTools MCP để designer kiểm tra responsive, accessibility, interaction, console, network và performance bằng quy trình QA có bằng chứng.
Chuyên mục
Kiến thức và case study về thiết kế giao diện, trải nghiệm người dùng, design system, prototype, interaction, usability, user research, product design và workflow từ yêu cầu đến sản phẩm. AI chỉ được khai thác như công cụ hỗ trợ quy trình, không dùng để hướng dẫn tạo ảnh anime, manga hoặc hoạt hình.
6 bài viết đã xuất bản
Bài mới được sắp xếp theo thời gian xuất bản, không lẫn bản nháp hoặc bài hẹn giờ chưa đến hạn.

Hướng dẫn dùng Chrome DevTools MCP để designer kiểm tra responsive, accessibility, interaction, console, network và performance bằng quy trình QA có bằng chứng.

Quy trình Penpot Prototype từ interaction, overlay và multiple flow đến usability test, QA cùng Inspect handoff cho designer và product team.

Phân tích GrapesJS cho designer và product team: Blocks, Component Model, Traits, Style Manager, responsive, accessibility, storage, bảo mật và QA handoff.

Workflow Storybook cho design system: kiểm tra accessibility, interaction, visual regression, coverage và CI trước handoff.

Hướng dẫn xây Design Tokens trong Penpot theo DTCG: tạo token, alias, công thức, remap, theme và workflow đồng bộ thiết kế với code.

Phân tích Material 3 Expressive cho UI/UX: nghiên cứu người dùng, ba mức biểu cảm, typography, shape, motion và checklist accessibility.