Quy chuẩn thiết kế
một nền tảng
mọi phòng ban
iNET Design System cung cấp nguyên tắc thiết kế, UI components đã chuẩn hóa và công cụ tự động hóa giúp đồng bộ trải nghiệm số toàn hệ thống, tăng tốc phát triển cho mọi phòng ban.
Portal Hub: Phân Khu Theo Vai Trò
Bất kể bạn thuộc phòng ban nào, iNET Design System đều có khu vực tài nguyên chuyên biệt tối ưu hóa công việc hàng ngày.
Developer & Outsource
Component code sẵn sàng, tài liệu API, hướng dẫn tích hợp Storybook cho đa tech-stack.
- 54 Vi* Components · 12 Design Styles
- 44 MCP Tools · 290 CSS Tokens
- Storybook 10 · Nuxt 3 · Vue 3
Marketing & Sale
Quy chuẩn Banner, PowerPoint template và mẫu nội dung truyền thông chuẩn thương hiệu.
- Quy định phối màu banner
- Template trình chiếu iNET
- AI Prompt cho content
Brand & HR
Logo chuẩn đa định dạng, mascot Cú iNET, chữ ký email và tài liệu nội bộ.
- Trọn bộ Logo iNET
- Mascot Cú iNET 2026
- Email signature chuẩn
Designers (In & Out)
Quy tắc Grid, bảng màu chính/thứ cấp, kiểu chữ và logic bố cục chuẩn iNET.
- Nguyên lý bố cục UI/UX
- Figma guide (Tham chiếu)
- SVG icon library
Quy chuẩn cốt lõi
Trích xuất từ Brand Guidelines v2.0 của iNET. Nhấp vào màu để sao chép HEX.
Bảng màu thương hiệu chuẩn
Click để copy HEXMàu chủ đạo (Primary)
Màu UI & Thứ cấp
Nhận diện kiểu chữ
Tối ưu cho giao diện web & mobile iNET. Hỗ trợ đầy đủ tiếng Việt.
Tiêu đề dùng Black / ExtraBold
font-weight: 800–900
Nội dung dùng Regular (400) để tăng trải nghiệm đọc dễ chịu và rành mạch.
JetBrains Mono
Token names, code snippets, mono labels
Nguyên tắc sử dụng Logo & Khoảng trắng
Xem Brand Style Guide đầy đủKích thước tối thiểu
Vùng trống bảo vệ (Clear Space)
Duy trì vùng trống xung quanh logo bằng chiều cao của chữ "i" trong logo. Không đặt bất kỳ yếu tố nào vào vùng này.
Do / Don't
- Dùng trên nền trắng hoặc tối với độ tương phản đủ
- Giữ nguyên tỷ lệ gốc của logo
- Kéo dãn hoặc làm méo logo
- Thay đổi màu sắc của logo
- Đặt trên nền phức tạp, nhiều màu
UI Playground
Khám phá 290 design tokens, 5 DNA themes và bộ công cụ CLI + MCP Server của iNET Design System.
/* Dùng token trong CSS */
.my-btn { background: var(--brand-primary); }
.my-card { padding: var(--sp-16); border-radius: var(--radius-lg); }Nhật ký Cập nhật & Lộ trình
Mỗi tháng làm được gì, và tháng tới làm gì.
Triển khai bộ giao diện chung cho mọi đội
Website, trang quản trị và OneDash dùng chung một bộ màu, chữ, nút và biểu tượng thay vì mỗi đội tự làm lại. Chỉ triển khai rộng khi kiểm tra tháng 10 đạt.
Kiểm tra lần cuối trước khi triển khai rộng
Hoàn thiện đủ 10/10 tiêu chuẩn chất lượng (đầu tháng mới có 6/10) và xử lý 24 góp ý còn tồn từ đội đang dùng thật. Cuối tháng chấm lại: chưa đạt thì lùi ngày triển khai, không hạ yêu cầu.
Nâng chuẩn chất lượng cho bộ giao diện chung
Mỗi lần phát hành có thay đổi giao diện, hệ thống tự so ảnh với bản chuẩn và tự kiểm chữ có đủ rõ cho người thị lực kém. Sửa nguyên nhân của 37% phiếu báo lỗi: trợ lý AI không tìm ra giá trị thiết kế khi người dùng gõ khác cách viết.
Sửa lỗi hiển thị, chuẩn bị cho người dùng thật
Sửa hết lỗi khiến chữ khó đọc trên cả nền sáng lẫn nền tối, và 90 biểu tượng hiển thị sai. Mục tiêu để Marketing tự làm trang giới thiệu trong 30 phút chưa thử được — tạm hoãn vì trang quản trị còn thiếu chỗ chọn ảnh.
Công cụ cho Marketing, thư viện biểu tượng lớn hơn
5 mẫu trang giới thiệu dựng nhanh bằng trợ lý AI; 713 biểu tượng có thêm kiểu hai màu; bắt đầu tự kiểm độ rõ của chữ; xác minh 7/7 lỗ hổng bảo mật quan trọng đã được vá.