Trong thế giới kỹ thuật số, các thuật ngữ UI và UX đã dần trở nên phổ biến để chỉ các nhiệm vụ hoặc nghề nghiệp đã tồn tại trước đó, cụ thể là nhà thiết kế web cho thuật ngữ đầu tiên và kiến trúc sư web cho thuật ngữ thứ hai (hoặc “nhà nghiên cứu ergonomics”), điều này có thể gây nhầm lẫn cho các chuyên gia dày dạn kinh nghiệm và những người mới vào nghề.
Để tóm tắt một cách đơn giản trước khi đi vào chi tiết:
- UI hoặc Giao diện Người dùng, là hình thức của một trang web hoặc ứng dụng.
- UX hoặc Trải nghiệm Người dùng, là cách mà chúng hoạt động.
Tất nhiên, dù chúng khác nhau, hai khái niệm này có mối liên hệ mật thiết với nhau, lý do tại sao chúng thường được kết hợp trong “Thiết kế UX / UI”. Tuy nhiên, các nghề nghiệp hoặc đội ngũ đứng sau chúng không nhất thiết phải làm việc cùng nhau ngay từ đầu, mà thường làm việc song song.
Tìm hiểu thêm về UX và kiến trúc của một ứng dụng di động hoặc web
Trước hết, bạn cần biết rằng thuật ngữ UX được đặt ra bởi một nhà khoa học chuyên về nhận thức, Tiến sĩ Donald Norman. Do đó, với UX, lý luận và chức năng não bộ sẽ trở thành trung tâm!
UX giống như “bản thiết kế” của ngôi nhà kỹ thuật số mà bạn sẽ xây dựng.
Và di chuyển trong một ngôi nhà nên dễ dàng: các phòng và các yếu tố tạo thành nó nên có thể sử dụng một cách đơn giản nhất, bằng cách nghiên cứu các quy chuẩn chung và hành vi của con người.
Ví dụ, trong một ngôi nhà, chúng ta mong đợi tay cầm cửa ở độ cao của tay. Trong một ứng dụng, nhà thiết kế UX sẽ đặt hành động chính (ví dụ như nút xác nhận) trong tầm với của ngón cái người dùng, hoặc nút đóng ở góc trên bên phải của cửa sổ (hoặc đôi khi ở bên trái).
Trong đó, các nhà thiết kế UX tập trung vào Tính trực quan, Ergonomics và Logic.
Nhiều lĩnh vực hoặc nhiệm vụ thuộc về Nhà thiết kế UX, thường theo thứ tự sau:
1. Nghiên cứu hành vi và Persona Người dùng
Đây gần như là một khía cạnh của “Tiếp thị” hoặc “Neuromarketing”.
Để thiết kế một ứng dụng di động hoặc khác, trước tiên bạn phải xác định AI sẽ là người sử dụng ứng dụng đó. Bởi vì thực tế, theo độ tuổi, loại hình, quốc gia và văn hóa, cách sử dụng có thể khác nhau. Do đó, điều quan trọng là hiểu đối tượng mục tiêu của mình để thích ứng tốt nhất với thiết kế.
Bước này không bắt buộc, nhưng mang lại nhiều giá trị cho độ chính xác của ứng dụng và do đó cho sự thành công của nó. Các dự án nhỏ thường sẽ tránh bước này, vì nó yêu cầu nhiều nguồn lực con người và thời gian, và do đó phát sinh chi phí không nhỏ.
Trong trường hợp không có một nghiên cứu thực địa thực sự, chúng ta có thể sử dụng những người dùng giả định, được gọi là “Persona Người dùng”. Đây là những hồ sơ điển hình mà chúng ta giả định sẽ sử dụng ứng dụng.
Nếu bạn thực sự có thể sử dụng những Persona Người dùng này làm cơ sở, chắc chắn sẽ tốt hơn nếu xác nhận những trực giác của bạn bằng cách tạo ra một bảng thử nghiệm thực tế, hoặc hỗ trợ nó bằng dữ liệu.
Để làm điều này, một mẫu được thực hiện (như trong bất kỳ cuộc khảo sát ý kiến nào), và bảng thử nghiệm này sẽ phục vụ như một nơi thử nghiệm tại các giai đoạn khác nhau của việc thực hiện dự án, bằng cách cung cấp phản hồi và cảm xúc, các kết quả sẽ được tích hợp vào thiết kế.
Nghiên cứu hành vi này có thể rất sâu, ví dụ như đo thời gian phản ứng của người dùng, hoặc đo hành trình của mắt họ trên một màn hình bằng các công cụ gọi là “eye-tracking” hoặc “heatmaps”. Các bài kiểm tra này thường hoạt động trên nguyên tắc của việc gọi là thử nghiệm A/B: giữa một giải pháp A và B được thử nghiệm, cái nào là tốt nhất?
Sử dụng dữ liệu này, Nhà thiết kế UX sẽ điều chỉnh công việc của mình để mỗi hành động của người dùng mất ít thời gian nhất có thể mà không gây nhầm lẫn, với tốc độ thực hiện là một “chén thánh” thực sự trong cuộc tìm kiếm UX.
2. Phát triển kịch bản
Song song với nghiên cứu hành vi này, nhà thiết kế UX sẽ lập danh sách các giả thuyết cần được tích hợp vào thiết kế và các thử nghiệm thực tế.
Những kịch bản này tương ứng với danh sách các chức năng mà ứng dụng cung cấp.
Làm thế nào để thoát khỏi ứng dụng? Làm thế nào để sửa đổi một yếu tố nào đó? Điều gì xảy ra nếu ứng dụng gặp lỗi? Các bước cần thực hiện để đến hành động X hoặc Y là gì? Nói tóm lại, tất cả các hành động có thể xảy ra, tất cả các kịch bản phải được xem xét để chuẩn bị cho bất kỳ tình huống nào và để phục vụ tốt nhất cho người dùng.
Do đó, những kịch bản này có thể là hành vi (các hành động mà một cá nhân thực hiện) và môi trường. Ví dụ: Điều gì xảy ra nếu độ sáng thay đổi? Điều gì xảy ra nếu tôi nhận được cuộc gọi? Điều gì xảy ra nếu tôi tương tác với một ứng dụng khác? v.v.
3. Kiến trúc thông tin
Khi đã biết ai là người sử dụng và tất cả các hành động có thể thực hiện trên một trang web hoặc ứng dụng, bây giờ chúng ta phải tổ chức tất cả!
Nhà thiết kế UX sẽ nhóm các hành động hoặc thông tin thành các gia đình hợp lý, và trong các gia đình này, thiết lập thứ tự ưu tiên. Một số nhiệm vụ thực tế kém quan trọng hơn những cái khác. Các công cụ Mindmapping do đó rất hữu ích ở giai đoạn này.
Kiến trúc này sau đó được thực hiện ở hai cấp độ:
- Ở cấp toàn cầu, xác định danh sách tất cả các màn hình và các liên kết logic của chúng.
- Ở cấp cụ thể, xác định trong mỗi màn hình một hệ thống thứ bậc của thông tin.
Trong trường hợp của một trang web Thương mại Điện tử, ví dụ, trên một trang sản phẩm, người dùng phải có thể xem sản phẩm, giá cả, tìm hiểu về các đặc điểm của đối tượng, cá nhân hóa nếu cần, điều chỉnh số lượng và thêm vào giỏ hàng của mình.
Nhưng lập luận nổi bật của sản phẩm là gì?
Giá cả? Thiết kế? Các đặc điểm kỹ thuật?
Tùy thuộc vào câu trả lời, thiết kế sẽ được điều chỉnh để làm nổi bật điểm bán hàng tốt nhất.
Sau đó, nhiệm vụ của nhà thiết kế UX là truyền đạt sự quan trọng tương đối của mỗi tương tác này và sắp xếp chúng theo một thứ tự hợp lý.
Ví dụ: Tôi trước tiên nhìn vào hình ảnh, sau đó là giá cả, sau đó tôi tìm hiểu thêm về sản phẩm và những gì nó hứa hẹn, và chỉ khi “được thuyết phục”, tôi mới có thể tiến hành thêm món hàng vào giỏ.
Một ví dụ khác: Việc truy cập vào hồ sơ người dùng của bạn có quan trọng không? Đến Điều khoản và Điều kiện Bán hàng chung? Nếu có, khi nào? Ở đâu mọi người thường tìm thấy những mục này? v.v.
Tất cả các câu hỏi này sẽ được giải quyết tại thời điểm này.
4. Wireframing
Sau đó là giai đoạn đầu tiên của mô hình hóa.
Một Wireframe là một mô hình có các yếu tố và thông tin được xác định trước đó trên một màn hình (di động, pc, hoặc khác).
Wireframe là “bản đồ” thực sự của ứng dụng hoặc trang web, và là khuôn khổ, với các khoảng trống được nghĩ đến để được “lấp đầy” bởi nhà thiết kế UI, như trong ví dụ dưới đây:
Truyền thống, phần mềm như Sketch hoặc Adobe XD được sử dụng để sản xuất wireframe này.
5. Nghĩ theo hướng tương tác
Cuối cùng, nhà thiết kế UX sẽ tưởng tượng cách tương tác với mô hình đã được tạo ra trước đó.
Các hoạt động như animation, di chuyển của tay (vuốt) hoặc điện thoại (cảm biến gia tốc), chuyển đổi màn hình, tóm lại, mọi thứ sẽ tạo thêm phần thú vị cho trải nghiệm của người dùng sẽ được “kịch bản hóa” bởi nhà thiết kế UX để cuối cùng, nhà thiết kế UI có thể tạo ra các tài nguyên cần thiết và lập trình viên thực hiện nó!
Nguồn: uxplanet.org
Tìm hiểu thêm về UI: Thiết kế trực quan của một ứng dụng di động hoặc web
Với Giao diện Người dùng, chúng ta hoàn thiện công việc đã được khởi đầu bởi UX và làm phong phú nó với các yếu tố trực quan sẽ tạo ra cá tính thực sự của ứng dụng hoặc trang web.
Do đó, chúng ta sử dụng các yếu tố thiết kế thông thường:
- Phông chữ
- Màu sắc và bảng màu
- Biểu trưng, hình dạng
- Kích thước và tỷ lệ tương ứng của tất cả các yếu tố này
- Minh họa, hình ảnh, hình ảnh mọi loại
- Motion Design
Mục tiêu của UI là thu hút và gây ấn tượng với ánh nhìn của người dùng, và khuyến khích họ ở lại trên trang mà họ đang truy cập để thúc đẩy sự tương tác.
Trong quy trình làm việc của mình, một nhà thiết kế UI có thể trải qua các bước sau:
1. Tạo mood board
Mood board là một bộ sưu tập các ảnh hưởng sẽ hướng dẫn cảm hứng cho dự án.
Mood board này có thể bao gồm các tác phẩm nghệ thuật, đối tượng, trang web, hoặc các ứng dụng đã tồn tại, màu sắc và sắc thái, tóm lại, bất cứ thứ gì có thể gắn với “tinh thần” mà chúng ta muốn đưa vào sáng tạo.
Moodboard có thể đến từ:
- từ bảng mẫu
- nhà thiết kế UI hoặc nhóm nghệ thuật
- nghiên cứu các xu hướng và phong cách hiện tại
2. Đề xuất các hướng dẫn đồ họa
Dựa trên những ý tưởng được thảo luận trong các phiên brainstorming và được minh họa bởi các mood board, thiết kế UI sẽ đề xuất cơ sở của một bộ quy tắc đồ họa được hình thành như sau:
- Phông chữ: thường từ 1 đến 3
- Màu sắc: thường từ 2 đến 5
- Hình dạng hoặc họa tiết để trang trí mọi thứ
Có thể bổ sung thêm đề xuất về biểu trưng và/hoặc biểu tượng ứng dụng.
3. Thực hiện các hướng dẫn đồ họa và cải thiện các công cụ được cung cấp bởi UX
Khi các hướng dẫn đồ họa được xác nhận, nhà thiết kế UI sẽ có thể sử dụng wireframe được phát triển bởi nhà thiết kế UX để tạo ra bản mô phỏng cuối cùng của ứng dụng.
Trong quá trình này, nhà thiết kế UI sẽ mang đến chuyên môn của mình để điều chỉnh toàn bộ tổng thể, để ứng dụng có thể hài hòa nhất có thể với mắt.
Họ cũng sẽ trang trí nó bằng các yếu tố đồ họa cuối cùng được tạo ra cho mục đích này: biểu tượng, minh họa, nội dung động, v.v. và do đó mang lại sức sống cho toàn bộ dự án.
4. Kiểm tra sự đón nhận của công chúng, một lần nữa và một lần nữa
Với nỗ lực hoàn thiện ứng dụng di động, nhà thiết kế UI sẽ, giống như đồng nghiệp UX của mình, tìm kiếm ý kiến của bảng thử nghiệm của mình để đảm bảo rằng công chúng chào đón thiết kế.
Nhiều làn sóng sửa đổi có thể được xem xét để đạt được sản phẩm hoàn thiện thành công nhất có thể.
