Dương NT - Blog | Haposoft | Top-notch IT Solutions

Figma (kỳ 6): Tạo prototype cơ bản trên Figma

Một điểm cộng rất lớn để Figma có thể "vượt mặt" Sketch đó chính là tích hợp cả chức năng tạo prototype. Ở bài viết này chúng ta sẽ tìm hiểu về chức năng Prototype trên Figma. 1. Prototype là gì ? Prototype là 1 bản mô phỏng cho

Figma

Figma (kì 5): Mẹo quản lý Components trong Figma

Ở bài viết trước mình đã hướng dẫn các bạn cách tạo Components trong Figma, ở bài viết này mình sẽ mách cho các bạn một số mẹo quản lý các components sao cho dễ tìm kiếm. Như các bạn đã biết, sau khi tạo component (bằng cách chuột phải

Figma

Figma (kì 4): Cách tạo component

Components có lẽ là chức năng thú vị nhất của Figma. Mặc dù về bản chất giống với chức năng Symbols của Sketch nhưng Components lại chiếm được cảm tình vì cách làm việc thông minh và linh hoạt hơn Symbols trong Sketch. Cách tạo components cơ bản Ví dụ

Layoutgrid

Figma (kì 3): Tạo layout grid (lưới) trong Figma

Nếu bạn là designer chắc bạn sẽ cảm thấy quen thuộc với cụm từ Layout Grid (tạm dịch là bố cục lưới). Layout Grid hỗ trợ chúng ta tạo ra thiết kế có bố cục chặt chẽ, ngăn nắp, gọn gàng. Tuy nhiên, trong khuôn khổ bài viết nói về

Figma

Figma (kì 2): Phím tắt

Để đẩy nhanh tiến độ làm việc, hầu hết các phần mềm đều có một hệ thống phím tắt để hỗ trợ người dùng thao tác nhanh. Để bật hướng dẫn phím tắt của Figma, bạn làm theo hướng dẫn sau: Bước 1: Ở phía góc dưới bên phải màn

Figma

Figma (kỳ 1): Giới thiệu

Gần đây mới thấy trên các group của designer xuất hiện Figma như một công cụ thần thánh mới, tích hợp cả việc thiết kế và làm prototype trong một tool, chưa kể nhiều người có thể cùng vào sửa file một lúc giúp tiết kiệm thời gian làm việc.

sketch

Công cụ quản lý lịch sử cho file thiết kế

Mỗi bản thiết kế hoàn thiện đều có một câu chuyện đằng sau. Designer sẽ không bao giờ dừng lại ở phiên bản đầu tiên vì nhiều lý do: khách hàng đòi sửa, sếp đòi sửa, tự thấy xấu xong rồi sửa. Và sau ti tỉ lần sửa như thế

UI/UX

Craft - plugin nhất định phải cài cho Sketch và Photoshop

Nếu bạn là một UI/UX designer, chắc chắn bạn không thể bỏ qua CRAFT - một sản phẩm của InVision [https://labs.invisionapp.com]. CRAFT là một plugin vô cùng mạnh mẽ cho những phần mềm thiết kế chuyên dụng như Sketch và Photoshop. Bộ sản phẩm này là

UI/UX

Phân tích UX và thiết kế lại trang Booking.com (kì cuối)

Design Iterations### Dưới đây là kết quả thiết kế giao diện người dùng của tôi. Tôi muốn gửi lời cảm ơn đến tất cả bạn bè của tôi - những người đã bị tôi làm phiền bởi những cuộc phỏng vấn của tôi. 1. Header#### 2. Card layout#### 3. Credibility#

UI/UX

Phân tích UX và thiết kế lại trang Booking.com (kì 2)

Phân loại thẻ (1)### "Phân loại thẻ" là một phương pháp hỗ trợ việc thiết kế và đánh giá phần kiến trúc thông tin của sản phẩm. Trong phần "phân loại thẻ" này, những người tham gia sẽ sắp xếp nội dung theo từng category sao

uxdesign

Phân tích UX và thiết kế lại trang Booking.com (kì 1)

Chúng tôi đã tiếp nhận ý kiến đánh giá của người dùng như thế nào ? Tôi rất thích du lịch và khám phá thế giới. Khi cần đặt chỗ ở, tôi thường sử dụng Airbnb để tìm homestays và Booking.com để tìm những hostel giá rẻ. Nếu bạn hỏi

Icon font - Plugin quản lý icon cho Sketch

Lúc trước mình quản lý icon không tốt nên là mỗi lần thiết kế đều phải ngồi tìm một bộ icon hoàn chỉnh và đồng nhất phù hợp với thiết kế, xong việc tìm kiếm chỉnh sửa màu mè icon khá là mất thời gian. Sau đó mình có dùng

uxdesign

Giới thiệu về UX Project Checklist (kì II)

BƯỚC 6: PHẢN HỒI Hoạt động 1: Loading [https://www.sitepoint.com/3-tips-make-application-feel-faster/] Nếu người dùng phải đợi web/app của bạn loading, ít nhất hãy cho họ xem loading animation. Nếu web/app của bạn load lâu hơn, bạn nên thử cái gì đó có tính giải trí hơn

uxdesign

Giới thiệu về UX Project Checklist (kì I)

Mỗi UI/UX designer đều có một giải pháp riêng trong việc thiết kế giao diện và trải nghiệm người dùng. Việc nghiên cứu trải nghiệm người dùng (User experience) là một quá trình vô cùng phức tạp từ việc xử lý các yêu cầu của khách hàng, vẽ wireframe,