
Allbirds
Chất liệu tự nhiên trên vải lanh trắng
Allbirds vận hành với sự tự tin điềm tĩnh, tự nhiên—một nền tảng gần như hoàn toàn không màu, được bổ sung bởi màu cát ấm (#e0dacf) và các tông màu đất trầm được lấy trực tiếp từ ảnh chụp sản phẩm. Giao diện người dùng không làm ảnh hưởng đến trải nghiệm sản phẩm: bề mặt trắng, viền mỏng, điều hướng viết hoa toàn bộ và các nút điều khiển hình viên thuốc tạo cảm giác giống như các nút vật lý hơn là các yếu tố web. Phông chữ Self Modern (một phông chữ serif tùy chỉnh) được sử dụng cho một vài khoảnh khắc quan trọng cần sự chú ý về mặt biên tập—tiêu đề và tên bộ sưu tập—trong khi Geograph được sử dụng cho mỗi chữ cái, nội dung chính và nút bấm với ba trọng lượng cân bằng. Thẻ danh mục trở thành một hệ thống màu sắc: mỗi thẻ lấy màu nền từ sản phẩm nổi bật, biến điều hướng thành một bảng màu Pantone sống động.
Chiều rộng tối đa khoảng 1200px, căn giữa với khoảng đệm hai bên rộng rãi. Yếu tố chính là một dải biên tập toàn chiều rộng trên nền màu cát ấm áp với một băng chuyền sản phẩm lớn tỏa ra từ trung tâm. Thanh điều hướng danh mục là một lưới gồm bốn thẻ màu giống hệt nhau trong bốn cột, mỗi cột chứa một mẫu giày được căn giữa. Bên dưới phần hiển thị đầu tiên, bố cục xen kẽ giữa các bảng chia đôi toàn chiều rộng (ảnh phong cách sống ở bên trái + mẫu sản phẩm ở bên phải) và các băng chuyền sản phẩm được căn giữa bên dưới một tiêu đề phần nhỏ, được gạch chân. Nhịp điệu tổng thể là: bảng biên tập toàn chiều rộng → lưới bốn cột → băng chuyền sản phẩm được căn giữa → bảng chia đôi hai cột → băng chuyền sản phẩm được căn giữa. Khoảng cách giữa các phần là 40-56px, tạo ra sự chuyển tiếp thoáng đãng nhưng không quá rối mắt. Thanh điều hướng là một thanh trên cùng tối giản, cố định với các liên kết chính được căn giữa.
Nhiếp ảnh là toàn bộ hệ thống hình ảnh. Tất cả các bức ảnh sản phẩm đều được chụp cận cảnh, từ một góc hơi nghiêng, trên nền đơn sắc phù hợp hoặc bổ sung cho màu sắc chủ đạo của giày, biến mỗi bức ảnh thành một nghiên cứu về màu sắc. Các bức ảnh phong cách sống được chụp với tông màu ấm áp, nắng rực rỡ, trong bối cảnh tự nhiên (cánh đồng cây thùa, sàn gỗ, địa hình gồ ghề), được làm dịu nhẹ để phù hợp với bảng màu trầm. Không có hình minh họa, không có hình ảnh 3D, không có đồ họa trừu tượng. Hợp tác với Pantone, bảng màu thực tế được sử dụng như một yếu tố đồ họa. Biểu tượng được tối giản và đơn sắc (biểu tượng đường viền ở vị trí điều hướng và phụ trợ).
Bảng màu
Trung lập
- Canvas White
#ffffff— Hình nền trang, bề mặt thẻ, hình nền thẻ sản phẩm. - Charcoal
#212121— Màu trung tính được hỗ trợ cho các yếu tố giao diện người dùng phụ, đường phân cách và nhãn mờ. Không nên sử dụng màu này làm màu chủ đạo cho các nút kêu gọi hành động. - True Black
#000000— Tiêu đề, biểu tượng, khung có độ tương phản cao, văn bản điều hướng. - Warm Sand
#e0dacf— Hình nền phần chính, hiệu ứng đổ bóng bề mặt bổ sung, các bảng biên tập lớn. - Olive Char
#222519— Màu trung tính được hỗ trợ cho các yếu tố giao diện người dùng phụ, đường phân cách và nhãn mờ. Không nên sử dụng màu này làm màu chủ đạo cho các nút kêu gọi hành động. - Iron Gray
#525252— Văn bản phụ, văn bản bổ trợ, khung hình không gây chú ý.
Kiểu chữ
Từ 12 đến 40px · 6 bước
- Self Modern — thay thế: Playfair Display · phác thảo 400 · Tiêu đề và lời bình được sử dụng một cách tiết kiệm, tập trung làm nổi bật các cụm từ khóa và tên bộ sưu tập. Kiểu chữ có chân và chữ nghiêng phá vỡ sự đơn điệu của kiểu chữ không chân và truyền tải thông điệp: "Đây là bản chất của câu chuyện."
- Geograph — thay thế: Inter · phác thảo 400, 500, 700 · Phông chữ chính cho giao diện người dùng bao gồm văn bản chính, nhãn điều hướng, nút bấm, tiêu đề sản phẩm, chân trang, trường nhập liệu và biểu tượng. Kích thước 500 cho tiêu đề nổi bật, 700 cho tên sản phẩm. Khoảng cách chữ rộng (0,025em–0,10em) trong chữ in hoa ở nhãn điều hướng và danh mục tạo nên phong cách thương hiệu nhất quán.
- HurmeGeometricSans3 — thay thế: Inter · phác thảo 400 · Hiếm khi được sử dụng làm nhãn dự phòng hoặc nhãn chuyên dụng cho nút bấm. Geograph sử dụng hệ thống này hàng ngày.
Khoảng cách và hình thức
| Mục đích | Nghĩa |
|---|---|
| Tỉ trọng | dày đặc |
| Bước cơ bản | 8-16px |
| Bán kính nút | 9999px (pill) |
| Bán kính thẻ | 16px |
| Bóng tối | không - viền thay vì bóng |
| Giữa các phần | 40-56px |
| Chiều rộng trang | 1200px |
AI sẽ xây dựng trang web của bạn theo phong cách Allbirds và điền đầy đủ thông tin vào đó.
- Đăng tải sản phẩm và bài viết qua các liên kết sau: Instagram, TikTok, Facebook.
- Chuyển nội dung từ trang web cũ của bạn—chỉ cần chỉ định địa chỉ.
- Thiết kế hiện đại trên nền tảng tốt nhất: React ( Next.js) với khả năng render phía máy chủ và tối ưu hóa SEO ngay từ đầu.
- Tối ưu hóa SEO hoàn toàn tự động cho kết quả tìm kiếm và đề xuất dựa trên mạng thần kinh.
Phong cách tương tự
- Lightship — Một bức tranh sống động về con đường rộng mở. Những bức tường màu kem ấm áp được trang trí bằng những bức ảnh phong cảnh khổ lớn được gắn sát nhau, chữ đen mảnh mai gần như không nhìn thấy trên khung ảnh, và một điểm nhấn màu cam tươi sáng phá vỡ gam màu đơn sắc như một đống lửa giữa đồng cỏ.
- Faire ES — danh mục bán buôn kem ấm
- Adanola — Một cuốn lookbook biên tập trên giấy trắng. Một buổi chụp ảnh thời trang nơi kiểu chữ và nhiếp ảnh hòa quyện trên bề mặt trắng tinh khiết, với mực đen cho kiểu chữ và một phông chữ sans-serif đặc trưng tinh tế (Favorit), phản ánh phong cách tổng thể của thương hiệu.
- Oura Ring — Một xưởng làm yến mạch ấm cúng, ngập tràn ánh sáng ban ngày dịu nhẹ.
- Stykka — Một xưởng chế tác kiểu Scandinavia ngập tràn ánh sáng trắng – một phòng trưng bày yên tĩnh, được làm thủ công, nơi chỉ có tiếng nói của nhiếp ảnh vang lên.
- DJI — Vải canvas màu đen vũ trụ với điểm nhấn màu xanh điện duy nhất.
- Altitude Beverages — Trang tạp chí đen trắng. Hãy tưởng tượng một trang tạp chí thời trang được loại bỏ hoàn toàn màu sắc ngoại trừ các bức ảnh tĩnh—văn bản và khoảng trắng sẽ kể toàn bộ câu chuyện.
- AATHER — Lòng bàn tay mở, ngọn lửa đơn độc - một sự xa xỉ thầm lặng ẩn chứa trong sự tĩnh lặng.
- Cowboy — Một phòng trưng bày xe đạp Bỉ trong không gian trắng tinh khôi với chất liệu sứ. Một showroom nơi các bề mặt mờ, phông chữ lớn thường dùng trong các ấn phẩm và gần như không có trang trí nào khác thu hút sự chú ý vào chiếc xe đạp và những vật dụng bên trong.
- Refero — Bố cục biên tập trên nền đá cẩm thạch trắng - trang sản phẩm được thiết kế bởi một nhà thiết kế kiểu chữ, trong đó tiêu đề kiểu chữ serif là dấu ấn đặc trưng của thương hiệu, còn mọi thứ khác đều được tối giản một cách tinh tế.
- Face Formula — Một bức chân dung theo phong cách biên tập Scandinavia. Một bố cục tĩnh lặng, theo kiểu tạp chí, nơi ánh mắt của người mẫu và tiêu đề, được viết bằng phông chữ serif cô đọng, tự nói lên tất cả trên nền sương mù mát mẻ.
- Shupatto — Tủ trưng bày bảo tàng trên nền đá cẩm thạch trắng.