Design Perspective: How Cuberto Tells a Story Through Dark-Mode UI for Kelvin Zero
Enterprise security and passwordless authentication usually sound pretty dry, but Cuberto brought a fresh, vibrant energy to Kelvin Zero’s website project. Rather than sticking to the same old enterprise software template, the design team took a visual approach inspired by an iceberg.
The visual experience guides users from a brightly lit ice peak above the water right down into deep cobalt and charcoal-black spaces. The primary color palette blends charcoal gray (#191921) and cobalt blue (#3843B0) with pops of electric blue (#324EEF). Translucent glass crystals, refractive surfaces, and volumetric lighting give the UI a gorgeous aesthetic while capturing the pinpoint precision of a cybersecurity system built for government and financial institutions.
On the typography side, pairing Instrument Sans with Space Mono strikes the perfect balance. The rounded Instrument Sans handles titles, key messaging, and navigation menus. Meanwhile, the monospaced Space Mono takes care of technical data, encryption metrics, and NFC biometric verification panels. The entire layout runs on a flexible column grid, scaling seamlessly from 1920px desktop displays down to 375px mobile screens.
Another cool touch is how Cuberto integrated dynamic elements using realistic WebGL transitions and custom 3D models built in Blender and Cinema 4D. To keep browser performance snappy, these 3D scenes are individually optimized for desktop and mobile resolutions. Smooth After Effects animations, interactive cursor effects, and glassmorphism overlays beautifully illustrate the connection between the digital access system and the physical Multi-Pass Pro smart card.
Góc nhìn thiết kế: Cách Cuberto kể chuyện bằng giao diện dark-mode cho Kelvin Zero
Bảo mật doanh nghiệp và xác thực không mật khẩu vốn là mảng đề tài khá khô khan, nhưng qua bàn tay của Cuberto, dự án trang web cho Kelvin Zero đã khoác lên mình một tinh thần hoàn toàn mới. Thay vì đi theo phong cách giao diện phần mềm doanh nghiệp lối mòn, team thiết kế chọn hướng tiếp cận trực quan dựa trên hình ảnh tảng băng trôi.
Trải nghiệm thị giác đưa người dùng đi từ phần đỉnh băng rực sáng trên mặt nước xuống dần những không gian sâu thẳm mang sắc xanh cobalt và xám đen. Bảng màu chủ đạo kết hợp giữa xám than (#191921), xanh cobalt (#3843B0) cùng các điểm nhấn xanh điện (#324EEF). Sự xuất hiện của các khối tinh thể thủy tinh trong suốt, bề mặt khúc xạ và ánh sáng thể tích (volumetric lighting) giúp giao diện vừa đạt tính thẩm mỹ cao, vừa thể hiện sự chuẩn xác của một hệ thống an ninh mạng dành cho các tổ chức tài chính và chính phủ.
Về mặt typographic, việc kết hợp giữa Instrument Sans và Space Mono tạo nên sự cân bằng hợp lý. Phông chữ nét tròn Instrument Sans đảm nhận các phần tiêu đề, thông điệp chính và thanh điều hướng. Trong khi đó, phông chữ monospaced Space Mono lại được dùng cho các dữ liệu kỹ thuật, chỉ số mã hóa và bảng xác thực sinh trắc học NFC. Toàn bộ bố cục tuân thủ hệ thống lưới cột linh hoạt, đáp ứng mượt mà từ màn hình desktop 1920px cho đến mobile 375px.
Điểm đáng chú ý khác là cách Cuberto đưa các yếu tố động vào trang web thông qua chuyển cảnh WebGL thực tế và mô hình 3D dựng bằng Blender, Cinema 4D. Để đảm bảo tốc độ phản hồi trên trình duyệt, các cảnh 3D được tối ưu riêng cho từng độ phân giải máy tính và điện thoại. Các chuyển động tạo bằng After Effects, hiệu ứng con trỏ chuột hay lớp phủ glassmorphism giúp minh họa rõ ràng mối liên kết giữa hệ thống truy cập kỹ thuật số và chiếc thẻ thông minh Multi-Pass Pro ngoài đời thực.
