3 phương pháp sử dụng hamburger icon thông minh

Thứ sáu - 14/08/2015 06:57

Thết kế website tối giản là xu hướng được mến mộ trong giới thiết kế. Nó giúp bạn tập trung tạo điểm nhấn và sự tập trung cần thiết của người dùng web vào một nội dung nào đó quan trọng.

3 phương pháp sử dụng hamburger icon thông minh

Sự đơn giản không đồng nghĩa với nhạt nhẽo và buồn tẻ. Các thiết kế tối giản hiện đại luôn có những yếu tố tạo sự tương tác thú vị để tăng trải nghiệm người dùng. 

Hamburger icon trong thiet ke web

Nếu bạn cần một bố cục gọn gàng cho thiết kế web của mình, hãy sử dụng nút bấm hamburger cho navigation . Mặc dù đây không phải là phương án có thể áp dụng cho mọi trường hợp, xong chúng ta phải công nhận rằng nó đã phát huy tác dụng đáng kể trên vô số thiết kế web hiện đại. Bạn có thể giữ cho giao diện của mình sạch, gọn và đẹp bằng cách ẩn menu đằng sau hamburger icon. Chỉ với một cú di chuột hoặc click chuột, mọi thứ lại hiện ra đầy đủ. Icon này chỉ là một chi tiết nhỏ nhắn trên cả bố cục web rộng lớn, xong nó ẩn chứa sức mạnh tuyệt vời trong việc làm tăng tính hấp dẫn và gọn gàng cho website.

Mọi người sẽ nghĩ một icon đơn giản với 3 đường kẻ ngang song song sẽ rất dễ dùng và không có gì mới cả, nhưng thực tế không phải vậy. Hãy xem 3 cách dùng hamburger icon thông minh dưới đây để mở rộng ý tưởng thiết kế cho mình. Điều thú vị là cả 3 ví dụ này đều là những website của các hãng hoạt động trong lĩnh vực thiết kế web. Họ chọn cách dùng icon đơn giản này để thể hiện sự sáng tạo và tính chuyên nghiệp hơn hẳn của mình trong tư duy thiết kế. 

01. Grid & Flow

Hamburger icon này nằm trên website của một hãng thiết kế website có tên là Grid & Flow. Họ đã sử dụng icon này để ẩn những thông tin nền, đảm bảo sự tập trung của người xem vào những link quan trọng dẫn đến trang portfolio của hãng thiết kế ấy. Bạn cũng thấy việc dùng icon để ẩn menu đã giúp cho bức ảnh nền toàn trang phô diễn được hết thông điệp của mình mà không hề gây rối mắt cho người xem. Mọi thứ trên mang hình rất cơ bản, không có chi tiết nào thừa. 

02. PRPL

Thêm một thiết kế web hãng thiết kế có tên PRPL . Nó sử dụng nút bấm hamburger cho menu và bạn có thể cuộn tran hoặc điều hướng tùy thích để khám phá trang web thú vị này. Đây xứng đáng là một website đại diện cho dịch vụ thiết kế web. Icon nằm khiêm tốn ở một góc nhưng như một phản xạ chung, ai cũng sẽ dễ dàng nhìn thấy menu nằm ở đâu.

03. Pixelage

Hãng thiết kế website Pixelage sử dụng hamburger icon cho menu chính trên website của mình. Cách làm này giúp cho trang chủ của website trở nên gọn gàng, kích thích người dùng điều hướng theo 2 hướng khác nhau với 2 đường link dẫn.

Tác giả bài viết: Phùng Thanh Hằng
Nguồn tin: Ngôi Sao Số Web & Brand Solutions