Vào ngày 16/07 vừa qua, TELOS Academy đã tổ chức thành công buổi workshop “Làm sao để vẽ wireframe tốt và hốt wireframe tởm” trong chuỗi Nghề Trong Người với sự tham gia của đông đảo các bạn quan tâm đến UI/UX và Product Design.
Chúng tôi xin gửi lời cảm ơn chân thành đến diễn giả và tất cả các bạn đã góp phần tạo nên một buổi chia sẻ thực tế – nhiều kiến thức – và vô cùng gần gũi với nhu cầu của người học.
Buổi chia sẻ được dẫn dắt bởi chị Lê Nguyễn Ánh Dương, người đã có nhiều năm kinh nghiệm làm việc ở các vị trí Product Designer, UX/UI Designer, UX Research, PM/PO trong môi trường công nghệ. Nhờ sự kết hợp góc nhìn đa chiều này, workshop đã giúp người tham dự “mở khoá” lại một khái niệm tưởng chừng cơ bản nhưng thường bị hiểu sai: Wireframe.
I. Nội dung chính của workshop
Workshop tập trung vào 5 nhóm nội dung quan trọng, bám sát những gì một Designer – PM – Marketer – Dev đều cần hiểu khi làm việc với wireframe:
1. Wireframe là gì và vì sao quan trọng?
Wireframe là bản khung của sản phẩm, mô tả bố cục – chức năng – flow – nội dung chính mà không đi vào hình ảnh, màu sắc, visual.Đây là công cụ giúp PM/BA, Designer, Dev, Marketer, Stakeholder hiểu chung một ngôn ngữ trước khi bước vào thiết kế hoặc phát triển. Một wireframe tốt giúp tiết kiệm thời gian, giảm sai lệch yêu cầu, tăng tốc quá trình review & phát triển.
2. Ai là người làm wireframe và ai dùng wireframe để làm gì?
Business/Marketing/Sales:
- Phác thảo bố cục landing page, conversion flow
- Review để đảm bảo CTA – nội dung – flow thuyết phục
Product Manager/Business Analyst:
- Truyền đạt yêu cầu chức năng
- Làm rõ logic, user flow, MVP
UX/UI Designer:
- Dựng layout trước khi thiết kế visual
- Review và đề xuất giải pháp UX
UX Research/Tech team:
- Mô phỏng test
- Kiểm tra tính khả thi kỹ thuật, viết test case
3. Quy trình tạo ra một wireframe đúng chuẩn
Workshop hướng dẫn từng bước thực hành chuẩn:
- Hiểu đề bài & mục tiêu
- Bắt đầu từ User Flow – không phải layout
- Tập trung vào chức năng, loại bỏ yếu tố gây nhiễu
- Phân cấp thông tin rõ ràng
- Luôn có annotation
- Phản hồi sớm – sửa sớm
4. Designer cần làm gì khi nhận Wireframe?
Diễn giả trình bày checklist giúp Designer tránh “vẽ UI theo thói quen”:
- Hiểu user, goal, KPI
- Review flow, interaction, edge cases
- Kiểm tra content, hierarchy
- Xác định hành động quan trọng nhất
- Đặt câu hỏi: “Có gì mơ hồ? Có gì thiếu? Có gì sai logic?”
5. Không phải mọi wireframe đều tốt
Workshop đưa ra nhiều ví dụ “bad wireframe” trong thực tế và cách xử lý:
- Không có flow
- Không có CTA rõ ràng
- Sa đà visual
- Thiếu trạng thái quan trọng
- “Wireframe một đường – yêu cầu một nẻo”
Cách xử lý khi gặp wireframe thiếu chuẩn:
- Hỏi lại mục tiêu
- Phân tích hành vi người dùng
- Đề xuất cách chia nhỏ task
- Xác định ranh giới thay đổi được/không được
TELOS Academy xin trân trọng cảm ơn diễn giả vì những chia sẻ sâu sắc và tất cả các bạn tham gia vì tinh thần học hỏi nhiệt tình. Hãy theo dõi fanpage của TELOS Academy để không bỏ lỡ những khoảnh khắc thú vị và đón chờ các sự kiện hấp dẫn tiếp theo!
Nếu các bạn muốn tìm hiểu thêm về UX Design, các bạn có thể đăng ký khóa học do chính diễn giả giảng dạy tại form bên dưới nhé!
II. Về TELOS Academy
TELOS Academy là trung tâm đào tạo trực diện về UI/UX Design dành cho người mới bắt đầu với phổ kiến thức trải dài từ nhập môn cho đến chuyên sâu, cung cấp kiến thức và KỸ NĂNG THỰC CHẤT, phù hợp cho những NEWBIE bắt đầu từ số 0, đã đào tạo hơn 1300 học viên.
Các kiến thức được dạy sẽ thực tế nhất để có thể áp dụng được NGAY, với phương pháp truyền đạt dễ nhớ và thời lượng thực hành đến 70%. Hãy để TELOS Academy giúp bạn bước vào ngành UI/UX Design với:
- Các sản phẩm đầu ra chất lượng, học viên được hỗ trợ sửa bài/dự án/portfolio ngay cả khi kết thúc khóa học
- Giảng dạy các kiến thức thực tiễn, không chỉ học dùng tool mà còn cả tư duy làm việc
- Đội ngũ giảng viên nhiều năm kinh nghiệm, kiến thức thực chiến và đang giữ vị trí PM, Managers,… trong ngành
- TELOS cam kết giới thiệu các job chất lượng đến bạn và giúp bạn hoàn thành portfolio cá nhân để nhận job
