App UX: Một số nguyên tắc cơ bản bạn nên biết trong năm 2021

Trung bình mỗi người dành 4 giờ mỗi ngày để dùng app trên smartphone. Người dùng mobile app tìm kiếm những tương tác gọn gàng và mong đợi kết quả tức thì; họ hướng đến mục tiêu và bị giới hạn về thời gian lẫn băng thông (nhiều khi theo đúng nghĩa đen), nên bạn cần đặc biệt chú ý đến trải nghiệm người dùng (UX) của mobile app.

Những app được dùng thường xuyên nhất là những app giúp cuộc sống của chúng ta đơn giản hơn. Theo Josh Clark, tác giả cuốn Tapworthy: Designing Great iPhone Apps, khi dùng thiết bị di động, chúng ta thường ở ít nhất một trong ba trạng thái sau:

• Xử lý việc nhỏ (microtasking) trong những khoảng ngắn, tập trung cao độ, như kiểm tra số dư tài khoản hay tìm kiếm thông tin;
• Định vị bản thân tại một địa điểm, tìm đường hoặc tìm điểm tham quan gần đó;
• Giết thời gian, lướt tin tức và mạng xã hội giữa các công việc, khi đang di chuyển hoặc khi chờ đợi.

Trong những “khoảnh khắc vi mô” (micro-moment) này, người dùng mobile hướng đến mục tiêu và bị giới hạn về thời gian lẫn băng thông. Họ tìm kiếm những tương tác gọn gàng và mong đợi kết quả tức thì.

UX là khía cạnh thiết yếu của mọi chiến lược sản phẩm, nhưng UX của mobile app có những yếu tố riêng cần cân nhắc, chẳng hạn giới hạn về không gian hiển thị và nhận thức về ngữ cảnh, để thiết kế trải nghiệm phù hợp với người dùng ở bất cứ đâu họ đang ở.

Trong hướng dẫn này, chúng tôi sẽ giải thích mobile app UX là gì, vì sao quan trọng và làm thế nào để làm tốt, kèm theo một loạt cách làm hiệu quả để thiết kế và cải thiện trải nghiệm người dùng trên mobile app của bạn.

Mobile app UX là gì?

Mobile app UX là toàn bộ trải nghiệm và chuỗi tương tác mà người dùng có với một app trên thiết bị cầm tay, bao gồm smartphone, máy tính bảng và thiết bị đeo.

Lưu ý: thuật ngữ rộng hơn “mobile UX” chỉ cả thiết kế app và website, và hai khái niệm thường được dùng thay thế cho nhau.

Cần nói rõ là UX và UI luôn song hành trong mọi quy trình thiết kế. UX liên quan đến trải nghiệm: hành trình tổng thể qua các điểm chạm trong thiết kế sản phẩm. UI liên quan đến giao diện: ngôn ngữ thiết kế và hệ thống các thành phần mà người dùng tương tác.

Vì sao bạn nên quan tâm đến mobile app UX (nếu chưa làm)

Trước hết, đến năm 2025, gần 3/4 người dùng internet sẽ chỉ truy cập web qua smartphone, tương đương gần 3,7 tỷ người. Những người dùng này có kỳ vọng cao về trải nghiệm di động: tốc độ, sự dễ dùng và cảm giác thích thú.

Thêm vào đó, 38% người dùng sẵn sàng tải app nếu bắt buộc phải có app mới mua được hàng, nhưng một nửa trong số đó sẽ gỡ app sau khi hoàn tất giao dịch. Trên thực tế, cứ 2 app thì có 1 app bị gỡ trong vòng 30 ngày!

Mọi chuyện còn phức tạp hơn khi trung bình mỗi người dùng chỉ thường xuyên tương tác với 5 app. Để giữ được sự chú ý và lòng trung thành của người dùng, UX của mobile app phải liên tục chứng minh giá trị. Bạn nên luôn tìm cách đơn giản hóa cuộc sống của người dùng, tạo ra những trải nghiệm phù hợp ngữ cảnh hơn, hoặc đơn giản là mang lại những khoảnh khắc giải trí thú vị.

Tập trung vào những yếu tố này là một phần tạo nên khác biệt giữa thiết kế UX tốt và thiết kế UX xuất sắc.

Khác biệt chính giữa UX trên desktop và mobile

Có nhiều điểm khác biệt giữa UX trên desktop và trên mobile app, xét theo bối cảnh và môi trường của người dùng:

Không gian làm việc thực và ảo

Trên desktop, người dùng thường mở nhiều tab và app để làm nhiều việc cùng lúc, có bàn phím kích thước đầy đủ và không gian làm việc ổn định, thoải mái hơn. Họ cũng thường ngồi cố định và có ánh sáng ổn định.

Còn trên thiết bị di động, người dùng thường tập trung vào một việc duy nhất, có thể đang cần giải quyết gấp. Ngoài ra, họ có thể đang di chuyển, ở một nơi xa lạ, làm hai việc cùng lúc (chẳng hạn đang đi mua cà phê, ghé tiệm giặt khô lấy đồ…) và thậm chí bị hạn chế về băng thông hoặc kết nối internet.

Hiển thị và hướng màn hình

Người dùng desktop có thể dùng một hoặc nhiều màn hình kích thước lớn, độ phân giải cao, giúp dễ nhìn và cuộn để xem chi tiết cũng như các lời kêu gọi hành động (call-to-action) cần họ chú ý.

Ngược lại, màn hình di động rõ ràng bị giới hạn, nên việc đặt nội dung quan trọng và lời kêu gọi hành động ở màn hình đầu tiên (above the fold) và ở những vị trí thu hút nhiều sự chú ý nhất là rất quan trọng.

Ngôn ngữ hình ảnh và tín hiệu thị giác

Xây dựng một ngôn ngữ thiết kế rõ ràng, đầy đủ là điều thiết yếu trong thiết kế mobile app, giúp đưa người dùng từ nơi này đến nơi khác một cách suôn sẻ nhất.

Giống như trong đời thực, các khuôn mẫu (pattern) gợi ý cho người dùng hành động nên làm, ngay cả khi không được nói rõ.

Trong khi giao diện mobile dựa nhiều vào các khuôn mẫu hình ảnh quen thuộc, phổ biến để báo hiệu hành động cho các tác vụ và tính năng thông dụng (ví dụ menu hamburger, biểu tượng ba gạch chỉ menu thu gọn), thì desktop lại là chuyện khác.

Không ai thực sự thay đổi menu hamburger quen thuộc kể trên hay các quy ước mobile đã định hình rõ. Tuy nhiên, trên desktop, các nhà thiết kế xử lý UX theo nhiều cách đa dạng hơn nhiều.

Tính nhất quán và liên tục

Khi lượng sử dụng mobile vượt desktop từ năm 2014, và đặc biệt khi Google chú trọng trải nghiệm người dùng và lập chỉ mục ưu tiên thiết bị di động (mobile-first indexing) trong năm qua, các nhà thiết kế ngày càng chuyển sang cách tiếp cận UX ưu tiên mobile (mobile-first).

Điều này có nghĩa là quy trình thiết kế xuất phát từ những giới hạn của thiết bị nhỏ nhất mà người dùng có (như Apple Watch hoặc iPhone), rồi được điều chỉnh dần lên các màn hình lớn hơn.

Nó cũng có nghĩa là mang lại trải nghiệm mượt mà giữa mobile web và app native, bằng cách dùng cả các tín hiệu thị giác đúng nhận diện thương hiệu lẫn công nghệ như deep linking và deferred deep linking, để người dùng có trải nghiệm không bị gián đoạn.

Bước đầu tiên, đội ngũ sản phẩm cần đưa ra một quyết định quan trọng về chiến lược phát triển, sẽ được trình bày ở phần tiếp theo.

Quy trình thiết kế mobile app

Về cơ bản, quy trình thiết kế mobile app giống mọi quy trình thiết kế lấy người dùng làm trung tâm, chỉ khác là cần quyết định ngay từ đầu cách phát triển sản phẩm.

Dưới đây là một số bước quan trọng trong quy trình:

1. Đánh giá và chọn 1 trong 3 phương án phát triển phù hợp nhất với mục tiêu kinh doanh và nhu cầu của người dùng:
   • Native: phát triển app cho một hệ điều hành duy nhất, tức Apple iOS hoặc Google Android. Điều này đồng nghĩa với việc tuân thủ nghiêm ngặt các hướng dẫn đã công bố về thiết kế, phát triển và phân phối trên kho ứng dụng (app store).
   • Adaptive: phát triển nhiều phiên bản của app hoặc website, bắt đầu từ thiết bị nhỏ nhất rồi thiết kế dần lên. Gần với cách này là phương pháp lai (hybrid), phát triển app hoặc website hoạt động trên nhiều nền tảng và hỗ trợ nhiều hệ điều hành. Trải nghiệm của người dùng cuối không được khác biệt so với một app native.
   • Responsive: thường được xem là cách tốt nhất để phát triển website và web app hiện nay, thiết kế với trải nghiệm ưu tiên thiết bị di động. Nhược điểm chính là website responsive không thể phân phối qua app store.
2. Xây dựng chân dung người dùng (user persona), lý tưởng nhất là dựa trên nghiên cứu sơ cấp như phỏng vấn, khảo sát, dữ liệu và insight khách hàng, kết hợp với nghiên cứu thị trường thứ cấp. Hãy tập trung hiểu nhu cầu của người dùng. Cân nhắc những khó khăn họ có thể gặp khi dùng app và đâu là cơ hội để đưa ra giải pháp cụ thể, khả thi giúp họ đạt mục tiêu.
3. Xác định các bước thiết yếu trong luồng người dùng (user flow) từ đầu đến cuối. Xác định các tương tác chính ở mỗi điểm chạm, ưu tiên nội dung và lời kêu gọi hành động cần thiết để đưa người dùng đi qua trải nghiệm một cách hiệu quả.
4. Phát triển các bản phác thảo thành wireframe cho từng màn hình, thiết lập hệ thống điều hướng và phân cấp thông tin. Ban đầu, wireframe nên đơn giản, chỉ với mức chi tiết tối thiểu cần thiết để nhận được phản hồi hữu ích.
5. Kết nối các màn hình thành nguyên mẫu (prototype) để thử nghiệm với người dùng. Nguyên mẫu giúp xác định các bước đã đúng thứ tự chưa và luồng sử dụng có chỗ nào bị hổng không. Đây là công cụ hiệu quả để nhận phản hồi trong suốt quá trình thiết kế. Hãy kiểm thử sớm và thường xuyên!
6. Lặp lại (iterate), bổ sung dần các lớp chi tiết khi nhận được phản hồi từ người dùng và đội ngũ. Sau mỗi vòng thử nghiệm, bạn có thể thêm các yếu tố và phong cách thiết kế hình ảnh, thay nội dung mẫu lorem ipsum bằng nội dung thật và thêm các tương tác phức tạp hơn.

Nguyên tắc chung trong mobile app UX là luôn tập trung làm mọi thứ dễ dàng hơn.

Những giới hạn của mobile thực ra có thể có lợi cho bạn khi chắt lọc tinh túy của sản phẩm qua từng nấc màn hình responsive, buộc bạn chỉ đặt những nội dung và tương tác giá trị nhất ở vị trí trung tâm.

Vậy làm thế nào để giảm sự rối mắt và tăng sự tập trung?

Mẹo và cách làm hiệu quả khi thiết kế mobile app UX

Theo các chuyên gia tại Interaction Design Foundation, “khả năng hiểu của người dùng trên thiết bị di động thấp hơn 50%, nghĩa là nội dung, điều hướng và các yếu tố thiết kế hình ảnh phải trực quan gấp đôi so với trên desktop”.

Dưới đây là tổng hợp các cách làm hiệu quả để định hướng quy trình thiết kế của bạn:

1. Dẫn đường cho người dùng bằng lời kêu gọi hành động tập trung

• Không lãng phí không gian màn hình đầu tiên cho lời kêu gọi hành động mơ hồ hoặc nội dung không cần thiết.
• Nên giúp người dùng dễ dàng truy cập các tác vụ thường dùng.
• Nên phản hồi và xác thực theo thời gian thực để người dùng thấy có điều gì đó đang diễn ra.
• Nên giúp người dùng dễ dàng yêu cầu trợ giúp, chẳng hạn nhấn để gọi (click-to-call) hoặc chat.

2. Rút ngắn thời gian làm quen (onboarding) bằng các mẫu điều hướng quen thuộc

• Không giấu chức năng tìm kiếm trong menu.
• Không bắt người dùng dùng hai ngón tay để phóng to hình ảnh hoặc phải cuộn ngang.
• Nên có đường quay về Trang chủ chỉ với một lần nhấn.
• Nên đảm bảo các liên kết quan trọng nhất luôn hiển thị; các mục phụ có thể nằm trong menu thu gọn hoặc menu trượt nếu cần.

3. Loại bỏ những yếu tố làm gián đoạn tác vụ của người dùng

• Không bắt người dùng làm lại từ đầu khi chuyển sang mobile; hãy tạo sự liên tục giữa trải nghiệm desktop và mobile, điền sẵn và giữ lại càng nhiều dữ liệu càng tốt.
• Không kéo người dùng ra khỏi trải nghiệm bằng pop-up hoặc cửa sổ mới.
• Nên chia các quy trình nhiều bước thành những tác vụ nhỏ.
• Nên có phương thức nhập liệu thay thế, chẳng hạn giọng nói.

4. Mỗi yếu tố thiết kế trên màn hình đều phải có giá trị

• Không dùng vùng chạm quá nhỏ cho các lựa chọn; Apple khuyến nghị tối thiểu là ô vuông 44px.
• Không dùng menu thả xuống dài cho các lựa chọn, ví dụ hãy dùng lịch trực quan để chọn ngày.
• Nên tạo phân cấp thị giác rõ ràng bằng kiểu chữ (H1, H2…) và độ tương phản (chẳng hạn chế độ tối) để tránh lóa màn hình.
• Nên giúp điều hướng bằng một tay dễ dàng bằng cách đặt các lựa chọn chính trong “vùng ngón cái” (thumb zone).

5. Cân nhắc kỹ khi đưa ra yêu cầu với người dùng

• Không cản trở người dùng khám phá app bằng việc bắt đăng ký ngay từ đầu.
• Không yêu cầu dữ liệu mà không nêu lý do rõ ràng (ví dụ dữ liệu vị trí).
• Nên cho phép đăng nhập một lần (single sign-on), chẳng hạn bằng tài khoản Facebook hoặc Google.
• Nên cho phép thanh toán không cần tài khoản (guest checkout).

Làm việc với nhà thiết kế UX để tạo ra trải nghiệm đáng nhớ và tăng chuyển đổi

Cũng như marketing, UX tốt dựa trên hiểu biết sâu sắc về khách hàng. UX không chỉ chịu trách nhiệm tạo ra chức năng hữu ích, dễ dùng mà còn tạo ra trải nghiệm thương hiệu gây được ấn tượng.

Marketer và UX designer cần coi nhau là đối tác cùng đầu tư cho thành công của app. Suy cho cùng, cả hai đều có chung mục tiêu là đảm bảo tương tác.

Nếu muốn hiểu rõ hơn trải nghiệm nền tảng của app, nơi tốt để bắt đầu là hiểu thiết kế UX. Hãy trao đổi với nhà thiết kế về lý do đằng sau các luồng và đường đi của người dùng trong app. Ngoài ra, hãy hỏi xem họ có hình dung trải nghiệm cụ thể nào cho hành trình từ web sang app không.

Với những hiểu biết này, bạn có thể bắt đầu đào sâu vào dữ liệu hành vi và insight để đánh giá hiệu quả của app.

Đối chiếu các KPI như độ sâu phiên (session depth), số màn hình mỗi lượt truy cập và số lần hoàn thành sự kiện trong app với thiết kế UX có thể cho thấy điều gì đang hỗ trợ hoặc cản trở người dùng trên đường chuyển đổi và họ có thể rời bỏ ở đâu.

Ví dụ, đưa ra ưu đãi hoặc khuyến mãi làm gián đoạn luồng sử dụng app có thể là một nguyên nhân khiến người dùng bỏ đi. Trong 46% trường hợp gặp trải nghiệm mobile bị gián đoạn, người dùng cho biết họ sẽ không mua hàng của thương hiệu đó trong tương lai.

Marketer có thể phối hợp với nhà thiết kế UX để tìm ra những thời điểm phù hợp trong trải nghiệm để tiếp cận người dùng, với đúng thông điệp vào đúng lúc, mà không làm họ xao nhãng khỏi mục tiêu của mình. UX là chìa khóa để app được thị trường đón nhận.

Ví dụ, khi xem xét hệ số K (K-factor) của app, tức mức độ lan truyền qua truyền miệng, hãy nhớ rằng 89% người dùng có khả năng giới thiệu một thương hiệu sau khi có trải nghiệm tích cực trên mobile.

Dù mỗi khoảnh khắc tương tác trong app có thể nhỏ, tác động của chúng có thể rất lớn.

Điều cần nhớ khi thiết kế trải nghiệm người dùng cho mobile app

Có ba điểm chính:

1. Nhận thức về ngữ cảnh là tất cả. Người dùng mobile chuyển đổi linh hoạt giữa các trạng thái. Nhà thiết kế mobile app cần hiểu rõ khách hàng sẽ dùng sản phẩm như thế nào, khi nào, ở đâu và vì sao (và hy vọng họ sẽ tiếp tục dùng lâu dài).
2. Giới hạn là bạn đồng hành. Nhà thiết kế mobile app nên xem những giới hạn của mobile là cơ hội để tập trung tối đa vào thông điệp và hành động thiết yếu nhất của sản phẩm.
3. Thiết kế có chủ đích. Xác định chính xác bạn muốn người dùng làm gì trong app, rồi tạo cho họ một con đường thông suốt để làm điều đó.

Trên hết, khi thiết kế tính năng hay luồng sử dụng, hãy tự hỏi làm thế nào để mọi thứ đơn giản hơn, nhanh hơn, trơn tru hơn và thú vị hơn cho người dùng. Và đừng quên nhắc họ để lại đánh giá trên app store.

Bài dịch từ App UX: The fundamentals you need to know in 2021 (AppsFlyer, 2021).