Microcopy hướng đến người dùng – P.1: Button & Loading screen

Share

Chia sẻ của một nhà thiết kế sản phẩm ở Woowa Brothers.

Microcopy là việc sử dụng chữ hoặc câu văn ngắn (text) trên giao diện người dùng nhằm mục tiêu giảm thiểu ma sát giữa người dùng và dịch vụ, đồng thời thúc đẩy một trải nghiệm người dùng tích cực. 

Nguồn ảnh: Tác giả / Dịch & chỉnh sửa: Metacoders

Ví dụ, thông báo lỗi ID không khả dụng chỉ truyền tải duy nhất sự thật rằng người dùng không thể sử dụng ID đã nhập, do đó mang lại cảm giác cứng nhắc. Ngược lại, microcopy bên phải ID không được chứa ký tự đặc biệt thông báo cả lý do gây lỗi, giúp người dùng dễ dàng tìm được cách giải quyết vấn đề và mang lại cảm giác dịu dàng, nhẹ nhàng hơn. Như vậy, microcopy đóng vai trò quan trọng trong việc nâng cao tính thân thiện với người dùng, là một yếu tố mà các nhà kế hoạch và nhà thiết kế nhất định phải chú ý.

Trong series này, tôi sẽ tham khảo nội dung từ cuốn sách 마이크로카피 2/e UX 디자이너의 글쓰기 (tạm dịch: Microcopy 2/e: Kỹ năng viết của nhà thiết kế UX) và phân tích cách áp dụng những mẹo và phương pháp viết microcopy trong sách vào dịch vụ thực tế.

Button

Button – Nút chính là “turning point” biến quyết định của người dùng thành hành động, do đó bạn cần cân nhắc khả năng dẫn dắt của chúng. Thêm nữa, người dùng có thể cảm thấy hoang mang khi nhấn nhầm nút thoát trong thời gian chờ đợi hoặc hủy một hành động đang thực thi, do đó bạn cần kiểm tra cẩn thận các đoạn chữ liên quan đến nút.  

1. Truyền tải giá trị

Bạn sẽ dẫn dắt người dùng tốt hơn khi cho họ biết về giá trị mà hành động mang lại. Giá trị người dùng nhận được bao gồm giá trị kinh tế, giá trị tính năng và giá trị tâm lý.

Giá trị kinh tế

Giá trị kinh tế là chi phí hoặc số tiền người dùng có thể tiết kiệm được.

Ohouse

Ohouse là một nền tảng về nội thất ở Hàn Quốc, được thành lập năm 2014.

Nguồn ảnh: Tác giả / Dịch & chỉnh sửa: Metacoders

Nút Mời bạn bè và nhận 5,000P cho người dùng biết về lợi ích sẽ nhận được thông qua hành động. Số tiền được làm nổi bật bằng màu sắc chủ đạo (key color), tuy nhiên lại có độ tương phản thấp so với màu nền nên không dễ đọc. Trong trường hợp này, một cách khắc phục hợp lý là thay đổi màu sắc chủ đạo thành màu tối hơn một chút để duy trì độ tương phản thích hợp với màu nền. W3C đề xuất độ tương phản tối thiểu 4.5:1 đối với chữ nhỏ và 3:1 đối với chữ lớn.

Naver Pay

Naver Pay là một ứng dụng thanh toán trực tuyến do Naver Financial phát triển.

Nguồn ảnh: Tác giả / Dịch & chỉnh sửa: Metacoders

Nút Nhận ưu đãi ngay bây giờ không cho người dùng thông tin chi tiết về ưu đãi sẽ nhận được, nhưng thông tin này đã được hiển thị một cách rõ ràng bằng thông điệp ngắn phía trên: Tích lũy tối đa 10% trên mỗi 20.000 won cash back. Vì thông tin về số tiền đã được hiển thị ở ngoài khu vực nút nên bên trong nút không cần lặp lại nội dung đó.

Tuy nhiên, nút này không cung cấp gợi ý về luồng chức năng sẽ được thực hiện sau khi người dùng nhấn. Do đó, người dùng sau khi nhấn nút có thể được chuyển đến một màn hình không giống với suy nghĩ hay mong đợi của họ. Vì bước tiếp theo khi người dùng nhấn nút này là giai đoạn mở thẻ, một cách diễn đạt rõ ràng như Mở thẻ và nhận ưu đãi sẽ hiệu quả hơn trong trường hợp này. 

Welaaa

Một nền tảng audiobook tại Hàn Quốc.

Nguồn ảnh: Tác giả / Dịch & chỉnh sửa: Metacoders

Chắc hẳn nút 1 tháng miễn phí cho lần đăng ký đầu tiên cho người dùng biết về ưu đãi khi gia nhập sẽ mang lại giá trị rõ ràng hơn nút Đăng ký thành viên thông thường. Việc sử dụng dấu chấm than cuối câu cũng góp phần truyền tải thông điệp mạnh mẽ hơn và giúp “bầu không khí” của màn hình tươi sáng hơn. Tuy nhiên, việc lạm dụng dấu chấm than ở mọi nơi trên màn hình có thể mang đến ấn tượng không nghiêm túc, do đó bạn nên sử dụng một cách vừa phải ở những nơi thật sự cần nhấn mạnh.

Giá trị tính năng

Giá trị tính năng là giá trị liên quan đến mức độ hữu dụng và thực tế của dịch vụ.

Toss

Toss là một ứng dụng hỗ trợ chuyển tiền trực tuyến tại Hàn Quốc.

Nguồn ảnh: Tác giả / Dịch & chỉnh sửa: Metacoders

Nút Gọi bạn bè và biến hình cho người dùng biết nhân vật hiện tại của họ sẽ thay đổi khi họ mời bạn bè. Cấu trúc “Hành động + Giá trị” được sử dụng để truyền tải đồng thời cả hành động người dùng cần làm và giá trị họ sẽ nhận được, ví dụ như Thanh toán và nhận ưu đãi hay Gia nhập và đăng ký tư vấn miễn phí.

Lý do phải nêu hành động người dùng cần thực hiện là để người dùng có thể dự đoán về giai đoạn tiếp theo sau khi nhấn nút. Qua nội dung Gọi bạn bè và biến hình, một cách tự nhiên người dùng có thể suy nghĩ được rằng “À hóa ra bước tiếp theo là mời bạn bè”.

Nút Tìm hiểu chỉ trong 1 phút cho biết quá trình tìm hiểu về khoản vay sẽ mau chóng kết thúc, giảm thiểu nỗi bất an của người dùng về việc có thể tốn nhiều thời gian. Bằng cách này, dịch vụ đã cân nhắc và dự tính những nỗi bất an hay thắc mắc của người dùng trước để phòng tránh và giảm thiểu một cách phù hợp.

Fint

Fint là một ứng dụng hỗ trợ quản lý đầu tư và tài chính trong cuộc sống hằng ngày tại Hàn Quốc.

Nguồn ảnh: Tác giả / Dịch & chỉnh sửa: Metacoders

Trong màn hình mở tài khoản tiết kiệm lương hưu, nút mở tài khoản được viết là Bắt đầu chuẩn bị cho tuổi già. Thay vì đặt trọng tâm vào hành động người dùng sẽ thực hiện: Mở tài khoản tiết kiệm lương hưu, ứng dụng đã nhấn mạnh giá trị chuẩn bị cho tuổi già mà người dùng cảm nhận được. Trong trường hợp người dùng đã nhận thức đủ về luồng tính năng tiếp theo, bạn có thể chỉ truyền tải riêng giá trị trong chữ trên nút. 

Giá trị tâm lý

Giá trị tâm lý bao gồm những cảm xúc như thích thú, thoải mái, an toàn mà người dùng cảm nhận được. Bạn có thể đạt được cùng một lúc cả giá trị tính năng và giá trị tâm lý, do đó rất khó để phân biệt rạch ròi hai giá trị này. 

Audioclip

Audioclip là dịch vụ cung cấp và chia sẻ nội dung dưới dạng âm thanh (phim truyền hình, sách nói, radio, ASMR) do Naver phát triển.

Nguồn ảnh: Tác giả / Dịch & chỉnh sửa: Metacoders

Nút Đăng nhập và nhận đề xuất cho riêng tôi cho người dùng biết rằng ứng dụng sẽ cung cấp những nội dung được cá nhân hóa cho riêng bản thân họ. Đặc biệt, Audioclip đã sử dụng cụm từ cho riêng tôi để nhấn mạnh tính năng cá nhân hóa. Một vài cách diễn đạt tương tự bạn có thể tham khảo bao gồm phù hợp với tôi, vì riêng tôi, v.v.

2. Xác nhận hành động

Daangn Market

Daangn Market là một nền tảng mua bán đồ cũ tại Hàn Quốc.

Nguồn ảnh: Tác giả / Dịch & chỉnh sửa: Metacoders

Chữ trên nút sẽ thay đổi tùy theo nội dung câu hỏi. Nếu câu hỏi là Bạn sẽ thoát chứ? thì câu trả lời sẽ là Tôi sẽ thoát, còn nếu câu hỏi là Bạn chắc chắn muốn xóa chứ? thì câu trả lời lại là Xóa. Việc lặp lại từ ngữ thể hiện hành động được sử dụng trong title hoặc sub-title sẽ khiến người dùng dễ dàng nhận thức về hành động hơn. 

Bạn cũng cần chú ý đến thể thức và ngữ điệu sử dụng trong các từ ngữ và câu văn. Sự nhất quán đem lại cho người dùng cảm giác thoải mái và ổn định, do đó bạn nên duy trì ngữ điệu và tông giọng nhất quán trong cả trang web hoặc ứng dụng.

Bạn cũng nên lựa chọn sử dụng tông giọng phù hợp trong từng tình huống, chẳng hạn như sử dụng câu khi cần thể hiện cảm giác thân mật, nhẹ nhàng và bày tỏ sự tôn trọng hay sử dụng động từ trong những nút không cần dẫn dắt hành động của người dùng hoặc khi muốn để người dùng tự quyết định hành động.

KakaoBank

Ứng dụng của KakaoBank Corp – công ty công nghệ tài chính và ngân hàng dành riêng cho thiết bị di động tại Hàn Quốc.

Nguồn ảnh: Tác giả / Dịch & chỉnh sửa: Metacoders

Nút thoát được viết là là Vâng. Vâng hoặc Xác nhận là những cách thể hiện trung lập có thể khiến người dùng bối rối, do đó nên cải thiện thành Thoát. Việc thể hiện nội dung hành động trên nút sẽ giúp người dùng dễ dàng nắm bắt hành động sắp được thực hiện hơn. 

3. Tránh gây ra những cảm xúc tiêu cực

Zigzag

Một ứng dụng mua sắm tại Hàn Quốc.

Nguồn ảnh: Tác giả / Dịch & chỉnh sửa: Metacoders

Nút hủy được viết là Không, làm biếng quá sẽ dễ bị hiểu thành Nếu bạn là người tốt và chăm chỉ thì hãy đánh giá đi. Vì vậy, người nhấn nút hủy có thể cảm thấy bản thân là một người lười biếng.

Mặc dù câu ngắn này có thể nâng cao tỷ lệ người dùng đánh giá, tuy nhiên sẽ khiến thương hiệu mất điểm trong mắt người dùng và khiến họ cảm thấy không thoải mái về dịch vụ. Nếu bạn muốn người dùng hành động theo mong muốn của mình, trước tiên bạn cần tìm hiểu xem liệu nội dung mình sử dụng có làm hỏng tâm trạng của họ hay không.

Loading Screen

Loading Screen – Màn hình chờ là một màn hình quan trọng. Nếu người dùng bận đọc hay xem một thứ gì đó trong thời gian chờ đợi, họ sẽ cảm thấy khoảng thời gian đó ngắn hơn thực tế. Thêm nữa, thông qua màn hình chờ, bạn có thể tận dụng thời gian người dùng nhìn chăm chăm vào màn hình để quảng bá ứng dụng hoặc truyền tải các thông tin cần thiết. Do đó, màn hình chờ đóng vai trò quan trọng trong dịch vụ và cần được đầu tư thiết kế.

1. Duy trì tâm trạng người dùng trong thời gian chờ

Thái độ Chúng tôi đang chuẩn bị vì bạn có thể duy trì tâm trạng tốt cho người dùng và thường được sử dụng trong giai đoạn người dùng bắt đầu truy cập hoặc sử dụng dịch vụ.

Spotify

Nguồn ảnh: Tác giả / Dịch & chỉnh sửa: Metacoders

Đây là màn hình chờ khi ứng dụng tìm những ca khúc để đề xuất cho người dùng dựa trên thông tin những ca sĩ họ quan tâm. Một cách tiếp cận khác là giải thích chi tiết hành động ứng dụng đang thực hiện, nhưng thông điệp Đang tìm âm nhạc vì quý khách mang đến cảm giác thân thiện và truyền tải được rằng ứng dụng đang vì người dùng.

Audioclip

Nguồn ảnh: Tác giả / Dịch & chỉnh sửa: Metacoders

Chúng tôi đang nghiên cứu sở thích của bạn cho thấy ứng dụng đang tìm kiếm nội dung dựa trên những mối quan tâm của người dùng. Với sắc thái tương tự Spotify, thông điệp này được sử dụng trong giai đoạn bắt đầu để giải thích rằng ứng dụng đang hoạt động hướng đến trung tâm là người dùng. 

2. Cho người dùng biết hành động đang diễn ra trong thời gian chờ

Thông báo này được sử dụng trong những khoảng thời gian chờ dài, chẳng hạn như tìm kiếm kết quả theo từ khóa hay thực hiện hành động kiểm tra / thẩm định.

Skyscanner

Skyscanner là ứng dụng hỗ trợ tìm vé máy bay và phòng khách sạn giá rẻ cho khách du lịch.

Nguồn ảnh: Tác giả / Dịch & chỉnh sửa: Metacoders

Thông báo Đang tìm trên + tên site cho người dùng biết dịch vụ đang tìm kiếm khách sạn / homestay trên nhiều site chuyên về du lịch khác nhau, nâng cao cảm giác mong chờ của họ. Người dùng sẽ mong chờ rằng họ có thể xem được tất cả các kết quả tìm kiếm sau thời gian đợi. Cảm giác mong chờ này phụ thuộc vào nội dung trên màn hình chờ, và khi cảm giác mong chờ càng lớn thì tỷ lệ người dùng thoát khỏi màn hình chờ sẽ càng giảm đi. 

Trivago

Trivago là ứng dụng hỗ trợ tìm phòng khách sạn giá rẻ bằng cách so sánh giá phòng giữa nhiều trang web khác nhau. 

Nguồn ảnh: Tác giả / Dịch & chỉnh sửa: Metacoders

Trivago sử dụng thông báo Đang tìm khách sạn phù hợp nhất với điều kiện trong thời gian tìm kiếm. Nghĩa của phù hợp nhất khá mơ hồ, người dùng không thể biết được dịch vụ đang tìm kiếm khách sạn theo tiêu chí nào trong thời gian chờ mà chỉ có thể biết thông qua kết quả tìm kiếm: liệu đó là khách sạn rẻ nhất, gần vị trí hiện tại nhất hay được đánh giá cao nhất? Hình ảnh minh họa với biểu tượng đô-la có thể giúp người dùng dự đoán tiêu chí tìm kiếm là giá cả, do đó nội dung thông báo nếu được sửa thành Đang tìm kiếm khách sạn rẻ nhất sẽ tiếp cận người dùng một cách nhanh chóng và trực quan hơn trong trường hợp này.

Booking.com

Nguồn ảnh: Tác giả / Dịch & chỉnh sửa: Metacoders

Thông báo Đang tìm nhà nghỉ gần vị trí hiện tại nhất thể hiện một cách chính xác tiêu chí tìm kiếm, có thể giảm thiểu thắc mắc của người dùng và giúp họ có khả năng đoán được tiêu chí hiển thị, sắp xếp kết quả tìm kiếm.

Toss

Nguồn ảnh: Tác giả / Dịch & chỉnh sửa: Metacoders

Toss sử dụng những câu thông báo khác nhau trong từng giai đoạn để cho người dùng biết dịch vụ đang thực hiện hành động gì. Chúng tôi sẽ bắt đầu → Chúng tôi đang OO → Chúng tôi đang thu thập kết quả thẩm định → Chúng tôi đang tính toán các điều kiện theo từng ngân hàng là một luồng thông tin tự nhiên và hợp lý, giúp người dùng đoán được mình đã thực hiện đến bước nào. Khi quá trình thẩm định kết thúc, ứng dụng gửi thông báo để người dùng có thể yên tâm rời đi. Nhóm phát triển Toss đã tìm hiểu trước những lo lắng của người dùng và giải quyết chúng thông qua các nội dung trên màn hình. 

Kakao Bank

Nguồn ảnh: Tác giả / Dịch & chỉnh sửa: Metacoders

Hành động dịch vụ đang thực hiện và kết quả tìm kiếm được giải thích bằng các thông báo như: Đang tìm hiểu thời hạn và lãi suất cho vay trực tiếp tại công ty liên kếtChỉ hiển thị những công ty bạn có khả năng vay. Các câu này không nối tiếp nhau mà tồn tại một cách độc lập, khiến luồng thông tin trở nên kém tự nhiên. Hơn nữa, các câu không được viết theo một cấu trúc nhất định, khiến người dùng không thể đoán biết câu nào sẽ xuất hiện tiếp theo.

3. Truyền tải nội dung đến người dùng

Có rất ít dịch vụ cung cấp các nội dung độc đáo cho người dùng khi thời gian chờ đợi dài, vì việc chế tác và duy trì nội dung cần đến nhiều tài nguyên. Do đó, những dịch vụ cung cấp nội dung trong thời gian chờ đợi sẽ mang đến cho người dùng trải nghiệm thú vị không có ở nơi khác, đồng thời cải thiện được khả năng giữ chân người dùng. Những trải nghiệm thú vị không chỉ mang lại hiệu quả tích cực cho việc quảng bá hình ảnh thương hiệu mà còn giúp ứng dụng nổi bật hơn trong mắt người dùng.

Kakao Page

Nguồn ảnh: Tác giả / Dịch & chỉnh sửa: Metacoders

Kakao Page mang đến các câu đố Đúng/Sai trong thời gian chờ đợi, phổ biến kiến thức về chủ đề hiện tại (các khoản vay) thông qua các câu đố liên quan. Việc đặt ra những câu đố liên quan đến luồng chức năng hiện tại góp phần giảm khả năng người dùng thoát khỏi ứng dụng, tuy nhiên cần lưu ý rằng mỗi người dùng sẽ cảm thấy mức độ khó của câu đố khác nhau, do đó bạn có thể nâng cao khả năng tham gia giải đố của người dùng bằng cách tạo ra những câu hỏi mà đa số người dùng đều hiểu.

Checklist cho text trên button / loading screen

Tổng kết từ bài viết này, dưới đây là danh sách những điều bạn cần lưu ý khi viết microcopy cho các nút và màn hình chờ.

1. Button

  • Hãy cho biết giá trị người dùng có thể nhận được
  • Hãy cho biết hành động xảy ra tiếp theo 
  • Đừng gây ra ảnh hưởng tiêu cực đến tâm trạng người dùng

2. Loading Screen

  • Hãy tạo ra cảm giác mong chờ về kết quả
  • Hãy truyền tải một cách chính xác (không có từ ngữ hay cách diễn đạt mơ hồ) về hành động dịch vụ đang thực hiện
  • Khi sử dụng nhiều câu, hãy liên kết các câu một cách tự nhiên và hợp lý
  • Khi cung cấp nội dung, hãy chú ý lựa chọn nội dung phù hợp với tổng thể và mức độ hiểu biết chung của người dùng

Microcopy trong nút đóng vai trò dẫn dắt hành động nhấn (click) của người dùng, do đó đóng một vai trò cực kỳ quan trọng trong dịch vụ. Thêm vào đó, các nút liên quan đến những hành động xóa bỏ dữ liệu người dùng đã mất công nhập, chẳng hạn như Xóa hay Kết thúc, sẽ gây ra rủi ro lớn khi người dùng lỡ nhấn phải, do đó bạn cần vô cùng thận trọng khi viết microcopy cho chúng. Bên cạnh đó, microcopy trong màn hình chờ giúp rút ngắn thời gian chờ của người dùng hoặc thay đổi trải nghiệm của họ theo hướng tích cực hơn, do đó có ảnh hưởng rất lớn đến trải nghiệm dịch vụ. 


The original article: 고객을 위한 마이크로카피: ①버튼 · 대기화면
The translated article above belongs to the author Kim Tae Hee (김태희) and yozmIT (요즘IT). Metacoders commits not to use this content for any commercial purpose.