Thiết kế theo hướng dễ đọc, dễ scan và phù hợp dashboard enterprise.
Trải nghiệm của khách hàng
Hạ tầng cloud dành cho khách hàng
Cloud GPU là nền tảng hạ tầng điện toán đám mây tích hợp tài nguyên GPU, được tối ưu cho việc provisioning máy ảo nhanh chóng, vận hành các GPU workload hiệu năng cao, quản trị tập trung và mở rộng scale-out đa cụm linh hoạt
Tối ưu cho orchestration, provisioning engine và workflow backend.
Nhấn mạnh độ tương phản, trạng thái và hierarchy rõ ràng cho thao tác quan trọng.
Layout co giãn tốt từ desktop đến tablet và mobile theo nhịp spacing 4px.
Capabilities
Tổ chức nội dung theo đúng hierarchy của Fluent 2
Các khối nội dung được chia bậc rõ ràng bằng spacing, shape, elevation và text emphasis, thay vì dùng quá nhiều màu mạnh hoặc shadow nặng.
AI
Provisioning rõ trạng thái
Surface, badge và trạng thái hành động được tách lớp để người dùng hiểu luồng thao tác nhanh hơn.
UX
Typography thoáng hơn
Tiêu đề, body và text phụ được giãn nhịp hợp lý để landing page bớt dày và mang cảm giác Microsoft hơn.
API
Cards có chiều sâu vừa đủ
Dùng border + tint + elevation tinh tế thay cho card shadow quá nặng kiểu template marketing phổ thông.
Ops
Responsive dễ mở rộng
Grid được viết lại để khi thêm section mới vẫn giữ được nhịp spacing và tỷ lệ khối ổn định.
Sec
Accessibility tốt hơn
Đã bổ sung focus-visible, contrast ổn hơn và hành vi động có hỗ trợ prefers-reduced-motion.
Dev
Sẵn sàng chuyển sang component hóa
Bộ class và token được tách để bạn dễ nâng cấp sang React hoặc Fluent UI sau này.
Architecture
Luồng vận hành theo kiểu dashboard enterprise, ít phô diễn hơn nhưng đáng tin hơn
Cách trình bày này hợp với sản phẩm cloud, virtualization, GPU orchestration và control plane hơn một landing page quá thiên về marketing.
01
Portal
User request
02
API Gateway
Policy + auth
03
Provisioning Engine
Orchestration
04
Compute / GPU Cluster
Execution plane
05
Observability
Metrics + logs
Pricing
Bảng giá được chỉnh theo kiểu card sạch, nhấn tier chính nhưng không quá chói
Fluent 2 ưu tiên sự rõ ràng và tính hữu dụng, nên tier nổi bật cần được nhấn bằng shape, stroke và elevation vừa phải.
Developer
$0 / tháng
- 1 vCPU · 2 GB RAM
- Sandbox environment
- Tài liệu cộng đồng
Được chọn nhiều nhất
Business
$99 / tháng
- 8 vCPU · 32 GB RAM
- Auto scaling
- 24/7 support
- Policy & monitoring
Enterprise
Custom
- Dedicated GPU / cluster
- Multi-region deployment
- SLA & onboarding riêng
FAQ
Một vài điểm quan trọng khi áp Fluent 2 cho landing page
Đây có phải Fluent UI chính thức không?
Chưa. Đây là bản static HTML/CSS/JS được thiết kế bám tinh thần Fluent 2. Nếu cần đồng bộ tuyệt đối theo component Microsoft, nên chuyển sang React với Fluent UI.
Điểm thay đổi lớn nhất so với bản cũ là gì?
Thay đổi lớn nhất là nhịp khoảng trắng, surface layering, interaction states, typography hierarchy và cách nhấn mạnh CTA.
Có phù hợp để Trae hoặc đội dev mở rộng tiếp không?
Có. Token, section và class đã được tách gọn để bạn có thể tiếp tục component hóa hoặc nhúng vào Node/Next.js.
Next step
Sẵn sàng nâng cấp 3 file landing page hiện tại thành bản production-ready hơn
Bản này đã chỉnh theo hướng gần Fluent 2 hơn cho web enterprise. Từ đây bạn có thể tiếp tục thêm form lead, đa ngôn ngữ hoặc tích hợp vào frontend hiện tại.