Thiết kế Linh hoạt (responsive) rất quan trọng, nhưng nó không phải là tất cả và đoạn kết của tất cả. Pete Sena đến từ công ty Digital Surgeons giải thích nguyên tắc ở bản của việc bối cảnh dẫn dắt thiết kế.

Bạn không thể đọc một bài viết trên thiết bị di động mà không có sự hỗ trợ từ thiết kế Linh hoạt. Cho dù bạn là một nhà thiết kế, một người làm tiếp thị hay một nhà quản lý thương hiệu, không thể bỏ qua thiết bị di động trong thời đại này.

Thiết kế linh hoạt cho đến lúc này, giúp bạn có một nội dung được làm sáng sủa, gọn gàng. Tuy nhiên có lẽ nó sẽ chưa đủ thoả mãn và còn nhiều thứ phải cân nhắc.

“Context first” – Ưu tiên nội dung – hay “context-driven design” – Bối cảnh quyết định thiết kế – có nghĩa là nội dung và sự trải nghiệm sẽ được quyết định dựa trên người dùng. Những điều cần lưu tâm và bối cảnh bao gồm những thứ sau…

01. Mục đích

Có nhiều manh mối dựa trên những thứ mà người dùng muốn làm trên trang của bạn.

Tôi nêu điều này đầu tiên bởi vì nó hiếm khi được thảo luận ở tầm quan trọng như cách chúng ta thường lưu tâm. Mục đích của người dùng thường rất khó khăn để dự đoán và nếu bạn có sai thì nó cũng không nghiêm trọng bằng việc không thử.

Có những manh mối mà chúng ta có thể phát hiện khi cải thiện trải nghiệm người dùng. Thói quen tìm kiếm, trang đăng nhập, và dựa trên dữ liệu thu thập từ các hành động của người dùng để cung cấp trải nghiệm tốt hơn.

Dưới đây tôi sẽ phác thảo vài khía cạnh của một bối cảnh người dùng nhằm có những cuộc thảo luận dựa trên những điều chúng ta muốn cung cấp cho người dùng trải nghiệm tốt, hoàn toàn dựa trên người dùng.

02. Đường truyền

Chúng đều đồng ý rằng tốc độtải trang là một trong những điều tối quan trọng trong trải nghiệm người dùng. Thậm chí Google sẽ giảm thứ hạng trang của bạn nếu tốc độ tải trang chậm chạp.

Trải nghiệm tối thiểu của bạn mong muốn là phải Tải về máy một tập tin nén nhanh gọn, lưu trữ những gì cần thiết và đem nội dung tới người dùng nhanh hơn.

Yêu cầu rõ ràng ở đây là, chúng ta ngày càng thiếu kiên nhẫn – ít thời gian – để chờ đợi việc thực hiện một tương tác trong kỷ nguyên kỹ thuật số.

Về khía cạnh này, bạn có thể cung cấp một trang web nhanh hơn? Hoặc nói cho họ biết nếu họ muốn xem định dạng HD thì nội dung sẽ loading trong bao lâu và sẽ nhanh nếu họ chấp nhận xem nội dung chất lượng thấp hơn.

Tất nhiên bạn không cần thiết phải nén nội dung ngay, mà tốt hơn nên cung cấp cho người dùng những lựa chọn khiến họ thấy tự chủ. Đường truyền đem lại cho khách hàng của bạn sự thoải mái, hãy cân nhắc khi để có một đường truyền chất lượng tốt, phù hợp.

03. Thiết bị và hỗ trợ

Nó không chỉ là về kích thước màn hình – độ phân giải, hỗ trợ thiết bị nào, nền tảng nào, trình duyệt nào.

Người dùng có thể truy cập bất cứ khi nào, khi trên máy sách tay, máy để bàn, thiết bị cầm tay, điện thoại. Ngày nay họ không hề cố định khi truy cập trang của bạn trên một thiết bị nào đó, họ linh hoạt và tuỳ thuộc vào bối cảnh sử dụng.

Điều đó khiến trải nghiệm cung cấp cần đồng nhất, hỗ trợ trên mọi nền tảng thiết bị. Tương tác chuột hay tương tác cảm ứng đều phải được cân nhắc. Những điểm mới của cảm ứng như, vuốt, trượt, phẩy tay, chụm… sẽ làm phong phú trải nghiệm người dùng.

Facebook và Google đều cung cấp những trải nghiệm lạ mắt với người dùng trên các thiết bị cầm tay.

04. Dung lượng … Pin

Nghĩ tới những người dùng ở trạng thái sắp hết pin, hoặc pin yếu là điều họ luôn cảm kích. Cân nhắc về độ hao pin của ứng dụng luôn luôn là một cân nhắc thực tế. Những điểm sạc pin miễn phí, hay bộ sạc lưu động không bao giờ là một giải pháp tốt.

05. Vị trí

• Nếu người dùng cho bạn biết họ đang ở đâu, hãy cung cấp cách để họ quay lại.
• Nếu người dùng đi xa khỏi cửa hàng của bạn? Hãy cung cấp hướng đi để họ có thể quay lại hoặc ghé thăm.
• Nếu trời sắp mưa? Hãy nhắn rằng họ cần đem theo dù hoặc áo mưa chứ không phải ngăn họ đừng ra đường.
• Nếu người dùng tới từ một từ khoá hiếm gặp? Thay đổi nội dung hoặc đặt tiêu để để giúp họ dễ dàng tìm kiếm.

Tôi không thể nói ngay một lúc các tình huống mà tôi không gặp trong công việc của mình. Các câu hỏi đến từ công việc hàng ngày của tôi, và những câu hỏi tôi tự đặt ra. Các câu hỏi, những giải đáp bạn cần đặt ra trong quá trình thiết kế sản phẩm thực tế.

• Bandwidth detection libraries like Netbiscuits or something like iRules from your load balancer
• Browser capability – modernizer and caniuse
• Location detection – HTML5 Geolocation
• Responsive images – Gumby responsive images
• Responsive design framework – Gumby, Bootstrap, Skeleton
• Battery levels – Battery Status API
• Screen Brightness – Luminosity API

TheoCreativebloq