Cuộn ngang chứng kiến ​​sự thay đổi trong việc chấp nhận với sự xuất hiện của công nghệ chẳng hạn như iPad và việc sử dụng rộng rãi điện thoại thông minh trong những năm gần đây. Với thiết bị di động, chuyển động vuốt trở nên trực quan hơn và thông tin của toàn bộ trang web có thể có sẵn cho người dùng chỉ bằng cách vuốt đầu ngón tay. Xu hướng cuộn ngang có thể được cho là do

Cách đây năm 2005, báo cáo khả năng sử dụng web trên toàn quốc cho biết rằng KHÔNG BAO GIỜ nên sử dụng thiết kế web cuộn ngang cho các trang web. Và đó là do toàn bộ trải nghiệm của việc cuộn sang một bên gây nhầm lẫn cho người dùng và nó không tuân thủ các tiêu chuẩn thiết kế web thông thường.

Hầu hết mọi người, bao gồm cả bạn và tôi, ngay lập tức cuộn xuống theo chiều dọc khi chúng ta nhấp vào mở một ứng dụng … Sau đó, chúng ta có thể làm gì với tư cách là nhà thiết kế để tạo ra một cuộn ngang một cách trực quan? Tôi đã khám phá ra một số ít cho các thiết kế của mình. Trong bài viết này, tôi sẽ nói về một số mẹo nhỏ đó .. Đây là –

1. Lập kế hoạch cẩn thận – Tìm ra những gì phù hợp với nơi

Được rồi, được rồi – đây có thể không phải là mẹo hay ho nhất trong danh sách, nhưng chắc chắn là mẹo quan trọng nhất trong danh sách.

Lập kế hoạch giao diện cẩn thận là điều đầu tiên chúng ta học về thiết kế. Đôi khi thời gian hạn hẹp, thời hạn ngắn hoặc ngày lười biếng dẫn đến việc bạn chỉ làm sai kế hoạch. Tuy nhiên, với một thiết kế theo chiều ngang, bạn chắc chắn muốn dành thời gian để lập kế hoạch, vẽ các nguyên mẫu và mô hình trên giấy, đồng thời tìm ra vị trí và cách mọi thứ sẽ phù hợp. Có rất nhiều thứ cần phải xem xét và vì nó không phải là điều mà hầu hết các nhà thiết kế hoặc khách truy cập hay sử dụng, bạn phải lập kế hoạch nhiều hơn những gì bạn có thể có với một trang web dọc.

2. Sử dụng cuộn ngang trong các trường hợp cụ thể

Cuộn ngang hoạt động tốt nhất khi bạn muốn hiển thị một tập hợp con của danh mục. Một vài tình huống mà cuộn ngang đã thành công tốt là –

1. Hiển thị một danh mục lớn các sản phẩm hoặc mặt hàng để có thể dễ dàng hiển thị các danh mục sản phẩm khác nhau

Ảnh chụp màn hình từ ứng dụng Myntra < p class = "pw-post-body-paragraph lw lx jp ly b lz ms kq mb mc mt kt me mf mu mh mi mj mv ml mm mn mw mp mq mr ix fy" id = "bb88"> 2. Hiển thị thông tin trong một khu vực trực quan rộng lớn không dễ nhìn thấy trong nháy mắt (ví dụ: bản đồ)

Ảnh chụp màn hình từ ứng dụng Airbnb

3. Hiển thị các phần hoặc trang trình bày thông tin kín đáo về ứng dụng

3. Hiển thị trực quan

Các trang web ngang không trực quan đối với khách truy cập như các trang web dọc mà họ nhìn thấy cả ngày, hàng ngày. Vì vậy, máy tính để bàn sử dụng mũi tên hoặc dấu chấm để hiển thị giống nhau. Khách truy cập của bạn muốn được hướng dẫn đường đi hơn là phải nhấp chuột để tìm hiểu cách hoạt động của từng thứ ngay cả khi nó hoàn toàn có ý nghĩa đối với bạn với tư cách là nhà thiết kế. Nhưng điều này hoạt động tốt cho máy tính để bàn. Điện thoại di động dựa trên cảm ứng chứ không dựa trên nhấp chuột.

Đối với điện thoại di động, bạn phải làm theo cách khác. Thiết kế của bạn phải có gợi ý trực quan rằng một tập hợp nội dung có thể cuộn theo chiều ngang. Cách tốt nhất để làm điều đó là để một phần nội dung có thể cuộn nhìn ra !

Ảnh chụp màn hình từ iMusic

4. Cho biết các điểm cực trị của danh sách

Điều quan trọng là người dùng phải biết khi nào cuộn kết thúc. Chúng tôi nhận thấy rằng người dùng lặp lại thao tác cuộn vì họ nghĩ rằng họ đã cuộn không đủ trong lần thử trước.

1. Hoạt ảnh gọn gàng giúp người dùng nhận ra rằng họ đã đến cuối danh sách.

Ảnh gif từ ứng dụng Medium

2. Một cách khác để chỉ ra cuối danh sách là sử dụng thêm không gian ở cuối.

Ảnh chụp màn hình từ ứng dụng Myntra