Dịch vụ thiết kế UI/UX

Website và ứng dụng dễ dùng, đẹp, sẵn sàng để lập trình

Cananest nghiên cứu người dùng, thiết kế luồng sử dụng và giao diện trên Figma, rồi bàn giao bản thiết kế chi tiết để đội lập trình dựng đúng như thiết kế.

  • Thiết kế dựa trên hành vi người dùng thật
  • Hệ thống thiết kế (design system) nhất quán
  • Bàn giao Figma đầy đủ trạng thái, sẵn sàng code
Sản phẩm bàn giao
  1. 01Sơ đồ trang & luồng người dùng
  2. 02Wireframe & prototype bấm thử được
  3. 03Giao diện cho máy tính và điện thoại
  4. 04Design system & file Figma

Sản phẩm số có đang làm khách rời đi?

01
Vấn đề

Đẹp nhưng khó dùng

Khách không tìm thấy nút đặt hàng, form quá dài, đọc trên điện thoại bị vỡ bố cục.

Giải pháp

Thiết kế từ luồng sử dụng: mỗi màn hình có một mục tiêu rõ ràng, ưu tiên điện thoại, rút gọn các bước.

02
Vấn đề

Lập trình làm sai thiết kế

Bản thiết kế thiếu trạng thái, thiếu kích thước, dev phải tự đoán nên sản phẩm cuối khác bản vẽ.

Giải pháp

Bàn giao Figma có đủ trạng thái (rỗng, lỗi, đang tải), thông số và component, kèm buổi hướng dẫn cho đội lập trình.

03
Vấn đề

Mỗi màn hình một kiểu

Sản phẩm phát triển nhiều năm, nút bấm, màu sắc, khoảng cách không còn thống nhất.

Giải pháp

Xây design system: màu, chữ, khoảng cách, component dùng chung để thiết kế và lập trình nhanh hơn.

04
Vấn đề

Nhiều người xem, ít người chuyển đổi

Website có lượt truy cập nhưng ít đơn hàng, ít người để lại thông tin.

Giải pháp

Kiểm tra trải nghiệm (UX audit), tìm điểm khách bỏ đi và thiết kế lại các trang quan trọng nhất.

Bạn đang ở giai đoạn nào?

Thiết kế từ con số 0

Cho startup và doanh nghiệp chuẩn bị ra mắt website, ứng dụng hoặc phiên bản thử nghiệm (MVP).

  • Làm rõ người dùng và tính năng cốt lõi
  • Sơ đồ, wireframe, prototype
  • Giao diện và design system ban đầu
Tư vấn cho mục tiêu này

Nâng cấp sản phẩm đang chạy

Giữ những gì người dùng đã quen, sửa những chỗ gây khó chịu, làm mới giao diện.

  • Rà soát trải nghiệm hiện tại
  • Thiết kế lại các luồng chính
  • Lộ trình chuyển đổi từng phần
Tư vấn cho mục tiêu này

Tối ưu trang bán hàng

Cho website, landing page cần nhiều đơn hàng và khách để lại thông tin hơn.

  • UX audit các trang quan trọng
  • Thiết kế lại trang đích, form, giỏ hàng
  • Gợi ý thử nghiệm A/B
Tư vấn cho mục tiêu này

Chuẩn hóa thiết kế cho đội ngũ

Cho sản phẩm có nhiều người cùng thiết kế và lập trình, cần một bộ quy chuẩn chung.

  • Thống kê và chuẩn hóa component
  • Thư viện Figma có biến thể
  • Tài liệu hướng dẫn sử dụng
Tư vấn cho mục tiêu này

Tìm lý do khách rời đi

Đánh giá nhanh sản phẩm hiện có để biết nên sửa gì trước.

  • Đánh giá theo nguyên tắc trải nghiệm
  • Danh sách vấn đề xếp theo mức ưu tiên
  • Đề xuất giải pháp cụ thể
Tư vấn cho mục tiêu này

Phạm vi công việc

Nghiên cứu người dùng

Phỏng vấn, khảo sát, chân dung người dùng và hành trình khách hàng.

Kiến trúc thông tin

Sơ đồ trang, cấu trúc menu, luồng người dùng cho từng tác vụ.

Wireframe

Khung bố cục để thống nhất nội dung và chức năng trước khi lên giao diện.

Thiết kế giao diện

Giao diện cho máy tính, máy tính bảng, điện thoại theo nhận diện thương hiệu.

Prototype & thử nghiệm

Bản mô phỏng bấm thử được, thử với người dùng thật và sửa trước khi code.

Design system

Màu, chữ, khoảng cách, icon và component dùng chung trong Figma.

Bàn giao cho lập trình

File Figma có thông số, trạng thái, tài nguyên xuất sẵn và buổi hướng dẫn.

Nội dung giao diện

Tiêu đề, nút bấm, thông báo lỗi rõ ràng, dễ hiểu.

Quy trình UI/UX

Mỗi giai đoạn được bạn duyệt trước khi sang giai đoạn tiếp theo, để sửa sớm khi chi phí còn thấp.

  1. 01

    Khám phá

    1–2 tuần

    Tìm hiểu mục tiêu kinh doanh, người dùng, đối thủ và sản phẩm hiện có.

    Bàn giaoChân dung người dùngDanh sách vấn đề cần giải quyết
  2. 02

    Kiến trúc & wireframe

    1–2 tuần

    Lên sơ đồ trang, luồng người dùng và wireframe các màn hình chính.

    Bàn giaoSơ đồ trangUser flowWireframe
  3. 03

    Giao diện & design system

    2–4 tuần

    Thiết kế giao diện chi tiết và xây bộ component dùng chung.

    Bàn giaoGiao diện các màn hìnhThư viện component
  4. 04

    Prototype & thử nghiệm

    1 tuần

    Tạo prototype bấm thử, cho người dùng thật thử các tác vụ chính và chỉnh sửa.

    Bàn giaoPrototypeKết quả thử nghiệm
  5. 05

    Bàn giao & đồng hành

    Trong quá trình code

    Bàn giao file, hướng dẫn đội lập trình và kiểm tra giao diện sau khi dựng.

    Bàn giaoFile Figma bàn giaoKiểm tra giao diện sau khi code

Thiết kế cho đẹp hay thiết kế để dùng?

Tiêu chíChỉ thiết kế giao diệnUI/UX bài bản cùng Cananest
Điểm bắt đầu
Chọn mẫu theo cảm tính
Từ mục tiêu và người dùng thật
Luồng sử dụng
Không có, vẽ từng trang rời
Có sơ đồ và luồng cho từng tác vụ
Thử nghiệm
Phát hiện lỗi sau khi code
Thử prototype trước khi code
Bàn giao
Ảnh chụp giao diện
Figma đủ trạng thái, thông số
Mở rộng về sau
Mỗi lần thêm trang lại vẽ mới
Có design system dùng lại

Dự án Cananest đã thực hiện

Website Cananest đã thiết kế UI/UX, đồ họa và nội dung.

Du học & xuất khẩu lao động

Vilaco Group

Doanh nghiệp tư vấn du học, đưa lao động đi làm việc ở nước ngoài và đào tạo ngoại ngữ, có văn phòng tại Hà Nội và TP.HCM.

Thiết kế đồ họaUI/UX websiteNội dung
vilacogroup.vn
Nhà hàng · Ẩm thực

Nhà hàng Tiến Vua

Nhà hàng gà Đông Tảo, gà H'Mông và phở gà tại Khu đô thị Văn Khê, Hà Đông, Hà Nội, có thực đơn combo và chương trình thành viên.

Thiết kế đồ họaUI/UX websiteNội dung
nhahangtienvua.vn
Giáo dục · Kỹ năng sống

CARA Education

Đơn vị giáo dục thuộc Tập đoàn Giáo dục Trí Việt, có chương trình kỹ năng sống cho trẻ 4–14 tuổi và các lớp văn hóa tại Hà Nội.

Thiết kế đồ họaUI/UX websiteNội dung
cara.edu.vn

Gói thiết kế UI/UX

UX audit

Cho website, ứng dụng đang chạy cần biết nên cải thiện gì trước.

Liên hệ báo giá

  • Đánh giá trải nghiệm các trang chính
  • Báo cáo vấn đề theo mức ưu tiên
  • Đề xuất giải pháp kèm hình minh họa
  • Buổi trình bày kết quả
Nhận báo giá
Phổ biến nhất

Website & landing page

Cho doanh nghiệp cần website giới thiệu hoặc bán hàng.

Liên hệ báo giá

  • Sơ đồ trang và wireframe
  • Giao diện máy tính và điện thoại
  • Prototype bấm thử
  • Nội dung cho các trang
  • Bàn giao Figma cho lập trình
Nhận báo giá

Ứng dụng & sản phẩm số

Cho ứng dụng, phần mềm, nền tảng có nhiều luồng nghiệp vụ.

Liên hệ báo giá

  • Nghiên cứu người dùng
  • User flow cho từng tính năng
  • Design system đầy đủ
  • Thử nghiệm với người dùng
  • Đồng hành trong quá trình code
Nhận báo giá

Thời gian và chi phí phụ thuộc số màn hình và độ phức tạp. Cananest gửi đề xuất chi tiết sau buổi trao đổi đầu tiên.

Câu hỏi thường gặp

Cananest thiết kế bằng công cụ gì?

Cananest thiết kế trên Figma. Bạn và đội lập trình xem, bình luận và lấy thông số trực tiếp trên file.

Cananest có lập trình luôn không?

Dịch vụ này tập trung vào thiết kế và bàn giao cho đội lập trình. Cananest hỗ trợ đội lập trình của bạn trong suốt quá trình dựng và kiểm tra giao diện sau khi hoàn thành.

Một dự án mất bao lâu?

Landing page thường vài tuần, website nhiều trang hoặc ứng dụng có thể vài tháng. Lịch cụ thể được ghi trong đề xuất.

Tôi cần chuẩn bị gì?

Mục tiêu sản phẩm, thông tin về người dùng, nội dung hiện có và các website bạn thích. Nếu có số liệu truy cập, hãy chia sẻ để phân tích chính xác hơn.

File thiết kế thuộc về ai?

Sau khi thanh toán đủ, file Figma và quyền sử dụng thiết kế được chuyển cho bạn.

Có thiết kế theo nhận diện thương hiệu sẵn có không?

Có. Nếu chưa có nhận diện, Cananest có thể làm bộ nhận diện cùng lúc với dịch vụ thiết kế đồ họa.

Trao đổi về dự án của bạn

Để lại thông tin, Cananest sẽ liên hệ để tìm hiểu nhu cầu và gửi đề xuất phù hợp với ngân sách của bạn. Tư vấn không tính phí.