Sinh Vũ Design System
Hệ thống nhận diện riêng cho Sinh Vũ, đạt chuẩn quốc tế WCAG 2.2 AA. Bộ tokens DTCG, 10 components tái sử dụng. Mọi giao diện Sinh Vũ nhất quán brand đến từng pixel.
Vì sao cần
Trước đây mỗi trang web tự khai báo màu, font, khoảng cách riêng. Đổi màu chủ đạo phải sửa 31 chỗ. Mỗi developer mới phải tự đoán đúng giá trị. Brand bị "trôi" theo thời gian.
Design System là Single Source of Truth. Một nơi duy nhất định nghĩa mọi visual decision. Đổi một chỗ, cập nhật toàn bộ. AI hỗ trợ cũng không thể "bịa" giá trị sai.
Điểm nổi bật
- Chuẩn quốc tế DTCG W3C (tokens cũng dùng được cho Figma, React, native app)
- 10 components live: button, card, chip, bubble, input, fab, modal, progress, cta-block, role-picker
- WCAG 2.2 AA tuyệt đối, mọi text đủ contrast, mọi input có label, mọi link đủ rõ ràng
- CI gate tự động: trước khi deploy, hệ thống tự kiểm tra mọi quy chuẩn. Sai một chỗ là chặn deploy.
- 5 trang preview live: tokens, components, audit dashboard, methodology, design system index
Vì sao quan trọng cho khách
Khách thuê Sinh Vũ thiết kế brand → Sinh Vũ không chỉ giao bộ logo + bảng màu. Sinh Vũ giao cả Design System chuẩn DTCG để khách team marketing tự dùng được lâu dài. Đây là khác biệt giữa "thiết kế xong rồi quên" và "thiết kế xong rồi vận hành mãi".
Bạn có thể xem 5 trang preview chi tiết tại yeucau.sinhvu.work/design-system/: tokens swatch, components live, audit dashboard, methodology.