High-Fidelity & Low-Fidelity Prototyping trong thiết kế UI/UX

Trên thực tế, các thuật ngữ “High Fidelity” và “Low Fidelity”, lần đầu tiên được sử dụng trong nhạc rock để mô tả âm thanh và kỹ năng chơi của nhạc rock và roll vào cuối những năm 1980. Nhiều năm trôi qua, chúng cũng được áp dụng trong thiết kế web, app để đề cập đến các cấp độ chi tiết và chức năng khác nhau được tích hợp trong một Prototype.

Tuy nhiên, sự khác biệt thực tế giữa chúng trong thiết kế UI/UX là gì, làm thế nào và tại sao chúng ta nên chọn  High / Low Fidelity Prototype để có thiết kế tốt hơn hoặc nghiên cứu người dùng?

Trong phần sau, mình sẽ hướng dẫn bạn những điểm cơ bản và khác biệt giữa High fidelity và Low Fidelity, đồng thời giải thích lý do và cách chọn chúng để tạo ra các nguyên mẫu xuất sắc cho thiết kế hoặc nghiên cứu người dùng tốt hơn.

Mục lục:

  • Prototype là gì?
  • Low Fidelity Prototype là gì?
  • High Fidelity Prototype là gì?
  • Ví dụ về Lo-fi Prototype và Hi-fi prototype
  • Lợi ích và hạn chế của Lo-fi Prototype và Hi-fi Prototype
  • Nên chọn Hi-fi hay Low-fi Prototype để có một bản thiết kế tốt hơn?

Prototype là gì?

Prototype là một mẫu, mô hình hoặc bản phát hành ban đầu của sản phẩm được xây dựng để thử nghiệm một khái niệm hoặc quy trình. Nó là một thuật ngữ được sử dụng trong nhiều ngữ cảnh, bao gồm thiết kế, điện tử và lập trình phần mềm.

Khi nói đến thiết kế UI / UX, prototype của một giao diện được dùng để thực hiện các thử nghiệm với người dùng trước khi chúng ta chuyển bản thiết kế thành code, tạo ra sản phẩm được sử dụng chính thức.

Prototype của giao diện sẽ thể hiện các giải pháp mà chúng ta giả định rằng có thể giải quyết các vấn đề cụ thể của người dùng. Và để biết được giải pháp đó có phù hợp hay không thì cách đơn giản nhất là quan sát hành động và phản ứng của người dùng khi tương tác, trải nghiệm với prototype đó.

Khi làm prototype chúng ta sẽ cố gắng mô phỏng sao cho giao diện của prototype mang lại cảm nhận gần giống nhất có thể với sản phẩm hoàn chỉnh đã được code. Hơn nữa, vì nhu cầu của các nhóm khác nhau, họ cũng tạo ra Low Fidelity Prototype hoặc High Fidelity Prototype để kiểm tra ý tưởng thiết kế của họ cho các mục đích khác nhau.

Low Fidelity Prototype là gì?

Low Fidelity Prototype - được gọi là Prototype công nghệ thấp, và thường được mọi người viết tắt là low-fi hoặc lo-fi. Đây là Prototype bán thành phẩm tập trung vào chức năng, cấu trúc, quy trình và cung cấp khung và các yếu tố đơn giản nhất của web / ứng dụng.

Nó thường được sử dụng để chuyển các ý tưởng thiết kế thành các thành phần có thể tương tác được và có thể kiểm tra để thu thập và phân tích nhu cầu của người dùng ở giai đoạn đầu.

Low Fidelity Prototype

High Fidelity Prototype là gì?

High Fidelity Prototype - được gọi là Prototype công nghệ cao, viết tắt là high-fi hoặc hi-fi. Đây là một nguyên mẫu toàn diện và tương tác khá gần với các sản phẩm cuối cùng với rất nhiều chức năng, tương tác và chi tiết.

Nó thường được sử dụng trong đánh giá khả năng sử dụng sau này để khám phá các vấn đề tiềm ẩn mà một thiết kế web / ứng dụng có thể vẫn tồn tại.

High Fidelity Prototype

Ví dụ về Lo-fi Prototype và Hi-fi prototype

Bạn vẫn không biết sự khác biệt giữa các Lo-fi Prototype và Hi-fi Prototype? Đừng lo lắng! Dưới đây là 2 ví dụ về Lo-fi Prototype để giúp bạn tìm hiểu rõ hơn:

1. Ví dụ về Low Fidelity Motion Prototype

Lo-fi prototype này hiển thị rõ ràng các chuyển động của menu thứ hai mà không cần tập trung quá nhiều vào các chi tiết giao diện người dùng của nó.

2. Ví dụ về Lo-fi Prototype

Đây là một ví dụ điển hình khác để hiển thị các bố cục chính và vị trí phần tử của một ứng dụng. Ngay cả khi không có chi tiết phần tử, nó giúp các nhà thiết kế phát hiện và giải quyết các vấn đề tiềm ẩn ở giai đoạn sớm hơn.

Ngay cả khi không có thông tin chi tiết về giao diện người dùng, Low-fi Prototype giúp truyền tải ý tưởng thiết kế và hiển thị các chức năng, cấu trúc, luồng và tương tác chính của web / ứng dụng một cách dễ dàng. Nó mang lại cho các nhà thiết kế rất nhiều lợi ích.

Tiếp theo là 2 ví dụ về Hi-fi Protoitype:

1. Ví dụ về danh sách công việc - High Fidelity Prototype

Hi-fi prototype này không chỉ hiển thị chi tiết giao diện người dùng mà còn hiển thị rõ ràng các luồng và tương tác của người dùng. Các nhà thiết kế có thể dễ dàng kiểm tra và kiểm tra chi tiết rất nhỏ để xem liệu có còn một số vấn đề về UI / UX hay không.

2. Ví dụ thứ 2 về High Fidelity Prototype

Một Hi-fi Prototype cho phép bạn truyền tải ý tưởng thiết kế với màu sắc phong phú, các nút, ảnh, biểu tượng, hoạt ảnh, tương tác và nhiều chi tiết hơn.

Lợi ích và hạn chế của Lo-fi Prototype và Hi-fi Prototype

1. Lo-fi Prototype:

Lợi ích:

  • Chi phí thấp. Chi phí của Lo-fi Prototype là cực kỳ thấp.
  • Nhanh. Không cần tập trung vào từng chi tiết giao diện, các nhà thiết kế chỉ có thể làm theo ý tưởng thiết kế của họ và tạo ra một Prototype đơn giản và có thể kiểm tra được trong vòng vài phút.
  • Dễ dàng trình bày, hợp tác và sửa đổi. Không có quá nhiều chi tiết về giao diện người dùng, một Lo-fi Prototype không yêu cầu nhiều kỹ năng chuyên nghiệp. Và nhiều người hơn có thể tham gia và cộng tác trong cùng một dự án. Các nhà thiết kế cũng dễ dàng thực hiện các thay đổi và làm lại Prototype trong quá trình hợp tác.
  • Dễ dàng nhận được phản hồi. Vì Lo-fi Prototype dễ mang theo và trình bày, các nhà thiết kế cũng có thể trực tiếp chia sẻ nó với những người khác (bao gồm các thành viên trong nhóm và các bên liên quan) để thu thập phản hồi về thiết kế.
  • Dễ dàng phát hiện và giải quyết các vấn đề tiềm ẩn. Lo-fi Prototype cũng cho phép các nhà thiết kế kiểm tra luồng người dùng, tương tác và menu điều hướng của web / ứng dụng một cách dễ dàng. Nó rất tốt cho các nhà thiết kế để phát hiện và giải quyết các vấn đề tiềm ẩn về UI / UX một cách nhanh chóng.

Hạn chế:

  • Chi tiết giao diện người dùng / hoạt ảnh / tương tác bị hạn chế . Để truyền tải ý tưởng một cách nhanh chóng, Lo-fi Prototype thường được tạo với các chi tiết, chức năng, hoạt ảnh và tương tác giao diện người dùng bị hạn chế, v.v. Vì vậy, sẽ không tốt cho các nhà thiết kế khác hoặc các thành viên trong nhóm có hiểu biết đầy đủ về thiết kế web / ứng dụng.
  • Kết quả thử nghiệm còn hạn chế và không chính xác. Nếu không có đủ chi tiết thiết kế, Lo-fi Prototype ở một mức độ nào đó, không thể mô phỏng chính xác các tình huống thực của người dùng. Kết quả thử nghiệm cũng không tránh khỏi bị ảnh hưởng và thiếu chính xác. Không cần phải nói, khi Prototype được sửa đổi đáng kể ở giai đoạn sau, kết quả thử nghiệm có thể hoàn toàn khác.

Vì vậy, nếu bạn chỉ nhận được một số ý tưởng thiết kế, muốn trình bày chúng bằng một Prototype đơn giản, hãy thảo luận và cộng tác với các nhà thiết kế hoặc thành viên nhóm khác trước khi tìm hiểu, thì một Lo-fi Prototype là hoàn hảo cho bạn.

2. Hi-fi Prototype:

Lợi ích:

  • Chi tiết thiết kế phong phú. Hi-fi Prototype được xây dựng với nhiều hình ảnh, màu sắc, hiệu ứng, icon, button và các yếu tố khác. Mọi phần tử đều được thiết kế y như trong một trang web / ứng dụng thực.
  • Hiệu ứng hình ảnh tốt hơn. Với cách phối màu tuyệt vời, hình ảnh động, bố cục sống động và hơn thế nữa, Hi-fi Prototype cũng thường có hiệu ứng hình ảnh tốt hơn Lo-fi Prototype.
  • Kết quả thử nghiệm chính xác hơn. Với các chi tiết phong phú, Hi-fi Prototype trông giống như một trang web / ứng dụng thực sự. Các nhà thiết kế có thể dễ dàng mô phỏng các tình huống người dùng thực và kiểm tra sản phẩm từ tất cả các khía cạnh có thể có, bao gồm các tương tác, luồng người dùng, hiệu ứng và phối màu cũng như UX. Kết quả thử nghiệm cũng chính xác hơn rất nhiều.
  • Phản hồi hiệu quả hơn. Tất nhiên, sau khi được chia sẻ với các nhà thiết kế khác và các thành viên trong nhóm, phản hồi nhận được cũng hiệu quả hơn để giải quyết các vấn đề hiện có.
  • Hấp dẫn hơn đối với khách hàng và các bên liên quan. Nó cũng tốt cho các nhà thiết kế khi trình bày rõ ràng cách thức hoạt động của web / ứng dụng cuối cùng và giúp thu hút nhiều khách hàng, các bên liên quan và nhà đầu tư hơn.

Hạn chế:

  • Chi phí cao hơn. Hi-fi Prototype thường cần được tạo bằng một công cụ tạo mẫu chuyên nghiệp. So với Lo-fi Prototype, giá thành của nó chắc chắn cao hơn nhiều.
  • Khó thay đổi và làm lại. Khi một số thay đổi được thực hiện, một loạt trang hoặc thành phần trong Hi-fi Prototype cũng cần được sửa đổi cùng một lúc. Điều này có thể gây rắc rối và tốn thời gian.

Vì vậy, Hi-fi Prototype có chức năng và tính tương tác cao để bạn và nhóm của bạn tìm và giải quyết một số vấn đề nhỏ về UI / UX, cũng như thu hút được nhiều chủ sở hữu và khách hàng hơn ở giai đoạn thiết kế cuối.

Nên chọn Hi-fi hay Low-fi Prototype để có một bản thiết kế tốt hơn?

Như mình đã đề cập ở trên, vì Lo-fi và Hi-fi Prototype đóng vai trò rất khác nhau trong việc tạo ra các thiết kế thành công, tốt hơn hết bạn nên sử dụng chúng trong các giai đoạn thiết kế khác nhau:

1.Tại sao Lo-fi Prototype lại tốt hơn cho bạn ở giai đoạn thiết kế ban đầu?

Rõ ràng, Lo-fi Prototype tập trung nhiều hơn vào các khái niệm cấp cao về sản phẩm cuối cùng và giúp khám phá các vấn đề tiềm ẩn cũng như giải quyết chúng ở giai đoạn đầu.

Nó giúp đảm bảo rằng bạn và nhóm của bạn đã chọn và làm theo chủ đề và hướng thiết kế phù hợp trước khi tìm hiểu.

Vì vậy, ở giai đoạn thiết kế ban đầu, khi bạn và nhóm của bạn đang hướng tới việc nhanh chóng chuyển các ý tưởng thành các nguyên mẫu được trực quan hóa, rút ngắn các lần lặp lại và thu thập phản hồi của người dùng, thì lo-fi Prototype là lựa chọn tốt hơn nhiều.

Nói một cách ngắn gọn, khi nào là thời điểm thích hợp để sử dụng Lo-fi Prototype?

  • Khi một ý tưởng thiết kế lóe lên trong đầu bạn và bạn muốn chuyển nó thành một mô hình tương tác một cách nhanh chóng
  • Khi bạn muốn thảo luận về ý tưởng thiết kế của mình với đối tác càng sớm càng tốt
  • Khi bạn muốn kiểm tra xem ý tưởng thiết kế có khả thi và đáp ứng nhu cầu của người dùng hay không
  • Khi bạn muốn nhận phản hồi từ các thành viên khác trong nhóm

2. Tại sao việc tạo Hi-fi Prototype lại tốt hơn cho bạn ở giai đoạn thiết kế cuối cùng?

Vì Hi-fi Prptotype thường chú ý nhiều đến các chi tiết và chức năng của web / ứng dụng, nên các nhà thiết kế thường kiểm tra tính khả thi của các thiết kế web / ứng dụng và thu hút nhiều người dùng / các bên liên quan hơn ở giai đoạn thiết kế cuối.

Nói một cách ngắn gọn, khi nào là thời điểm tốt nhất để sử dụng Hi-fi Prototype?

  • Khi thiết kế trực quan(visual design) của sản phẩm đã được hoàn thành
  • Khi bạn muốn kiểm tra chi tiết web / ứng dụng của mình, chẳng hạn như các thành phần giao diện người dùng, bảng màu và bản sao của các trang v.v.
  • Khi bạn muốn kiểm tra tương tác, quy trình làm việc, quy trình người dùng, hiệu ứng chuyển động, hiệu ứng hình ảnh hoặc các ý tưởng thiết kế tương tự với đầy đủ chi tiết giao diện người dùng
  • Khi bạn muốn biết phản hồi từ các nhà thiết kế và người dùng khác

Bất kể bạn chọn Lo-fi Prototype hay Hi-fi Prototype, mục đích duy nhất là trình bày các ý tưởng thiết kế tuyệt vời của mình một cách sống động hơn và xây dựng các Prototype web / ứng dụng xuất sắc với giao diện đẹp và trải nghiệm người dùng tốt. Hy vọng bài viết này có thể truyền cảm hứng cho bạn.