Học Wokine cách xây một Website tối giản mà vẫn thu hút người dùng

  • 11/11/2019
  • 0 Bình Luận

Giới thiệu

Casamance là một nhà thiết kế và sản xuất độc quyền các loại vải dệt nhuộm thành phẩm và vải thêu cho các ứng dụng bọc và trang trí nội thất. Chúng tôi được giao nhiệm vụ thiết kế website bán hàng thời trang cung cấp toàn bộ catalog vải (hơn 5000 sản phẩm), bộ sưu tập, lookbook, Brand DNA và hơn thế nữa. 

Ý tưởng thiết kế

Trong nhiều năm, Casamance thường xuất bản những cuốn catalog nhằm mục đích truyền tải thông điệp, với các bộ sưu tập và sản phẩm được trưng bày với một loạt các bức ảnh hàng đầu. Những catalog này rất tối giản nhưng làm nổi bật các bức ảnh.

Một sản phẩm Catalogue mẫu của Casamance

Điều đầu tiên chúng tôi muốn giữ lại là cảm ứng tối giản để cung cấp trải nghiệm khám phá nhẹ nhàng và dễ hiểu thông qua các bức ảnh cỡ lớn. Chúng tôi đã không muốn thêm nhiều hiệu ứng, có thể làm các bức ảnh trông bị choáng ngợp, một chút điểm nhấn trong các bức ảnh là đủ.

Ảnh kích cỡ lớn

Về bố cục Concept 

Casamance không muốn chúng tôi cắt tách bức ảnh, mà hãy cứ để nguyên như vậy. Đó mới chính là vấn đề, bởi vì hầu hết các bức ảnh là khổ in đứng (Portrait) và chỉ một số ít là khổ in ngang (Landscape). Trong khi làm việc với các bức ảnh Landscape thì tốt hơn khi tạo ra một bố cục website.

Vì vậy, chúng tôi đã nảy ra ý tưởng đơn giản là chia bố cục trang thành hai phần: 1/3 – 2/3, vì vậy phía bên trái sẽ được dành riêng cho Portrait và bên phải để cho Landscape. Với giải pháp này, chúng tôi không phải cắt bất kỳ bức ảnh nào. Chúng tôi chỉ phải đặt phía bên phải cho các bức ảnh nằm ngang.

 

Ý tưởng vị trí ảnh
Sản phẩm cho ảnh Portrait và Landscape

Một kho tàng các bộ sưu tập đồ sộ

Casamance đã tạo ra hơn 200 bộ sưu tập và con số này đang không ngừng tăng lên. Đây là nơi mà họ có thể khoe các bộ sự tập đó như một dạng Case study về công việc của họ. Một danh sách đơn giản với nhiều hình ảnh và ít nội dung là sự lựa chọn tốt nhất.

Bộ sưu tập

Bố cục bộ sưu tập khá giống với trang chủ. Thông qua thanh cuộn, các bức ảnh hiển thị trái / phải dọc theo trang với một chút điểm nhấn. Chúng tôi muốn nó trông thật hài hòa để làm nổi bật các ảnh chính.

Một bộ sưu tập sẽ chỉ nói về một vài sản phẩm. Người dùng sẽ được truyền cảm hứng từ các bức ảnh và sau đó xem loại vải nào đã được sử dụng. Chúng tôi yêu thích cách các hình ảnh minh họa sản phẩm xuất hiện dưới dạng các mảnh ghép hình ảnh được trích xuất từ ​​các bức ảnh gốc. Chúng tôi đã nảy ra ý tưởng liên kết các bức ảnh với hình thu nhỏ của các loại vải đã được sử dụng để tạo ra sản phẩm. Các hình minh họa đó sẽ đưa người dùng đến trang chi tiết sản phẩm.

Thông tin chi tiết trên sản phẩm

Choáng ngợp với danh sách 5000 Sản phẩm

Có tất cả là hơn 5000 sản phẩm, được phân loại theo loại và màu sắc. Chúng tôi muốn tạo một trang danh sách sản phẩm trung thực hơn có thể, để màu sắc và họa tiết vải được làm nổi bật thay vì một cái gì đó khác.

Các sản phẩm

Trang sản phẩm chi tiết được thiết kế hoàn toàn dựa trên một ý tưởng đơn giản. Vấn đề là rất khó để tưởng tượng chất lượng vải trên một trang web bán hàng. Vì nhân viên bán hàng của Casamance thường giới thiệu sản phẩm với khách hàng bằng máy tính bảng, do đó cần có chức năng Zoom In (phóng to) hình ảnh sản phẩm cải thiện tốt hơn. Bằng cách nhấp vào, hình ảnh sẽ hiển bị bức ảnh có chất lượng cao (hi-res) hiển thị đầy đủ và mở rộng toàn màn hình, như thể bạn đang xem một tấm vải thật đặt ngay trước mắt.

Lookbook chuyên nghiệp

Trước khi tạo ra một bộ sưu tập, các nhà thiết kế tại Casamance tìm kiếm những cảm hứng, những chất liệu vải, mọi thứ phải hoàn hảo, phải phản ánh ý tưởng và mục tiêu của họ. Điểm ấn tượng cuối cùng của dự án này là chúng tôi đã cố gắng cho khách hàng trải nghiệm, thấy những khung cảnh đằng sau hậu trường của quy trình thiết kế và sản xuất. Vì toàn bộ website sử dụng hình ảnh tượng trưng cho chất liệu như các mảnh mẫu, chúng tôi muốn ghi nhớ ý tưởng này và giới thiệu look-book theo mùa với các khối tác phẩm nghệ thuật sinh động nhanh chóng được tạo ra từ mỗi sản phẩm xuất phát từ cảm hứng này.

Look-book

Một nguồn cảm hứng, một khối tổng thể. Màu nền xung quanh được tự động thiết lập khi chúng tôi phát hiện liên kết màu tối trong lại phù hợp với các màu sáng nhất.

Look-book
Look-book

Lời kết cho dự án

Chúng tôi rất lấy làm tự hào khi giành được giải thưởng Site of the Day trên Awwwards vì những nỗ lực không ngừng nghỉ!

Về Wokine

Wokine là một công ty kỹ thuật số toàn cầu của Pháp và là một studio khởi nghiệp, cung cấp các giải pháp sáng tạo, cách tân và thẩm mỹ kể từ năm 2004.

Nguồn: awwwards.com


Bài viết liên quan

15 điều NÊN làm trước khi thay đổi giao diện WordPress (180 lượt xem )

Mục lụcGiới thiệuÝ tưởng thiết kếVề bố cục Concept Một kho tàng các bộ sưu tập đồ sộChoáng ngợp với danh…

Sửa lỗi h-entry với công cụ Xác thực dữ liệu Cấu trúc (477 lượt xem )

Mục lụcGiới thiệuÝ tưởng thiết kếVề bố cục Concept Một kho tàng các bộ sưu tập đồ sộChoáng ngợp với danh…

5 việc cần làm trước khi thuê Designer thiết kế Website (107 lượt xem )

Mục lụcGiới thiệuÝ tưởng thiết kếVề bố cục Concept Một kho tàng các bộ sưu tập đồ sộChoáng ngợp với danh…

Thiết kế Portfolio trên giao diện di động với Rich Brown (86 lượt xem )

Mục lụcGiới thiệuÝ tưởng thiết kếVề bố cục Concept Một kho tàng các bộ sưu tập đồ sộChoáng ngợp với danh…

No ratings!

Chưa có đánh giá

Đánh giá bài viết




Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *