IA? OOUX?
⚔️ ⚔️ ⚔️

IA? OOUX?

IA? OOUX?

October 5, 2024

Về căn bản các digital product thuộc công nghệ thông tin, thứ “hàng hoá” được trao đổi là thông tin. Thử quan sát xem nhé,

Tạo ra content (vd: tạo post Facebook, quay edit video qua capcut,…)
Giao tiếp / truyền thông tin (vd: chat, đặt xe, gửi email,…)
Tiêu thụ thông tin (vd: lướt feed, lướt reel, xem chart chứng khoán,…)
Tìm kiếm hoặc Xử lý thông tin (vd: xem map để biết các nhà hàng gần đây, dashboard,…)

Nên khi design cho digital product, “thông tin” là thứ cần quan tâm đến, do đó term Information architecture (IA) là sẽ là từ bắt gặp rất nhiều trong công việc UX/UI, sơ lược thì nó để giải quyết việc quyết định xem các thông tin cần có là gì, gọi tên & ngữ nghĩa nó thế nào, sắp xếp chúng ra sao, thông tin đó tác động gì đến user,…

IA là gì?

Information (Thông tin)

"Information" trong IA là bất kỳ dữ liệu, nội dung hoặc tài liệu nào mà người dùng cần tìm và sử dụng trên một website hoặc ứng dụng. Điều này bao gồm văn bản, hình ảnh, video, tài liệu, liên kết, và nhiều loại thông tin khác.

Architecture (Kiến trúc)

"Architecture" là cách tổ chức và sắp xếp thông tin một cách có hệ thống và logic, tương tự như cách một kiến trúc sư xây dựng cấu trúc cho một ngôi nhà vậy. Đó là việc phân chia phòng ốc, thiết kế lối đi, hành lang, và thang máy để mọi người có thể di chuyển dễ dàng trong tòa nhà, cách đặt để các vật dụng trong phòng ra sao cho tiện nghi, quyết định xem nên dùng loại cửa nào, chất liệu ra sao cho phù hợp…

Vậy làm IA là làm gì?

Đặt tên & gán nhãn (labeling)

Define tên gọi & ngữ nghĩa có tính thống nhất xuyên suốt trên app/web, mình muốn make sure tên gọi (name) và ngữ nghĩa (meaning) luôn được đồng bộ với nhau & nên dễ hiểu cho user, mình gọi đây là công việc naming conventions.

Ví dụ: trong app tại flow “huỷ gói đăng ký” bạn có action để user huỷ đăng ký, mặc dù từ “huỷ” riêng trong ngữ cảnh này có thể hiểu là huỷ gói đăng ký nhưng từ “huỷ” này cũng đang được dùng ở nhiều màn hình khác với nghĩa là bỏ qua/ đóng >> giờ bạn phải thay đổi thành từ “huỷ đăng ký” để tránh trùng lắp ngữ nghĩa.

https://res.cloudinary.com/dpzknshvi/image/upload/v1753081670/uxcomic-imgs/1225d164-78d8-8076-9c70-d00a79c93d30.png

Sắp xếp phân loại (content structure)

Phân loại thông tin và sắp xếp chúng thành các nhóm chủ đề hợp lý. Ví dụ: trong danh mục “Điện thoại - máy tính bảng” có các mục con: điện thoại smartphone, máy tính bảng, máy đọc sách,…

Yếu tố chính của Content Structure

Phân cấp thông tin (Hierarchy)
Nhóm nội dung (Grouping)
Metadata và Tags
Consistency
https://res.cloudinary.com/dpzknshvi/image/upload/v1753081672/uxcomic-imgs/1225d164-78d8-8065-af7f-cedca28ab4c8.png

Thiết kế luồng thông tin & điều hướng (Information Flow & navigation)

Định nghĩa cách thông tin di chuyển trong hệ thống và cách người dùng tương tác với thông tin qua các bước hoặc kịch bản. Đảm bảo luồng thông tin mạch lạc, hỗ trợ người dùng đạt được mục tiêu nhanh chóng. Output: site map, navigation flow, progressive disclosure, state, flowchart…

https://res.cloudinary.com/dpzknshvi/image/upload/v1753081673/uxcomic-imgs/1225d164-78d8-8046-abd3-d7e8a272cd87.png

Evaluate the IA

Tất cả các output của IA như labeling, structure, navigation… đều phải hợp lý với user, phù hợp với mental model của họ. Mình sẽ không muốn việc nói A nhưng user hiểu B, hoặc các bước sử dụng, tìm kiếm thông tin của user trên app lại khác hoàn toàn với cách họ hình dung, kì vọng.

Để có thể đánh giá IA tốt sẽ có các cách tactics như: card sorting (cách user phân nhóm thông tin), tree testing (cách user điều hướng tìm kiếm thông tin nào đó), usability testing (chung chung về việc user có hiểu label & tìm kiếm thông tin không, cách sắp xếp có phù hợp với mental model của họ không)

Another concept - OOUX

https://res.cloudinary.com/dpzknshvi/image/upload/v1753081675/uxcomic-imgs/1ca5d164-78d8-80d4-bb7e-e8c0e3a1a6a7.png

OOUX (Object-Oriented UX)  là một phương pháp thiết kế tập trung vào việc xác định và tổ chức các đối tượng cốt lõi trong hệ thống trước khi phát triển giao diện người dùng. Chúng đưa cái hình dung một digital object gần hơn với physical object, ở đó bạn nắm các về điều gì cấu thành nên chúng, mối quan hệ giữa các object, user có thể tương tác với chúng như thế nào (phần nào đó khái niệm này sẽ bổ sung cái hiểu cho ERD - dùng để thiết kế dữ liệu database).

Thay vì bắt đầu từ luồng hoặc giao diện, OOUX tập trung vào:

1.
Object - Các đối tượng chính  (ví dụ: sản phẩm, người dùng, sự kiện).
2.
Relationship- Mối quan hệ giữa các đối tượng  (như liên kết hoặc thứ bậc).
3.
CTA của đối tượng (có thể tuỳ theo user role có CTA khác nhau)
4.
Attribute - Thuộc tính và thông tin cần thiết  của mỗi đối tượng. (ID, size, số lượng,…)

Cực kì hữu ích khi phải làm việc với hệ thống lớn hoặc design system.

Tham khảo thêm qua các bài viết sau:

Reference

Cuốn sách của anh này nói rất thú vị về chủ đề IA, mọi người có thể tham khảo thêm (How to make sense of any mess của Abby Convert).

Relevant Item

Relation (systematic thinking)

Relation (systematic thinking)

Diagram & Canvas
♟️ ♟️ ♟️

Diagram & Canvas