Thiết kế giao diện và trải nghiệm cho người dùng UI UX là công việc ngày càng phổ biến tại Việt Nam. Đối với một người mới bắt đầu, chắc hẳn các bạn sẽ lo lắng không biết mình nên bắt đầu từ đâu. Và thật sự thì để trở thành 1 UI designer sẽ không khó nếu như bạn biết sử dụng Figma. Để biết lý do tại sao, đừng bỏ qua bài viết sau đây nhé!
Công việc thiết kế UI UX sẽ dễ dàng hơn với Figma
Trong bài viết này
1. Tại sao nên chọn Figma để thiết kế UI?
1.1. Tốc độ cực nhanh
Đầu tiên, lý do để bạn sử dụng Figma để thiết kế UI là tốc độ xử lý trên Figma rất nhanh và rất mượt. Tốc độ của Figma vượt trội hơn hẳn so với các ứng dụng khác mà bạn có thể thiết lập bố cục và thiết kế UI của mình.
Các phím tắt của Figma trực quan, các ô giao diện người dùng cũng dễ thay đổi tùy thuộc vào công cụ bạn chọn. Điều này khá là hay bởi vì bạn sẽ không phải tốn thời gian để tìm kiếm mục menu hoặc các thuộc tính mà bạn cần chỉnh sửa.
Tốc độ xử lý trên Figma rất nhanh và mượt
1.2. Không phải lo lắng nếu lỡ quên save file
Lý do thứ 2 để bạn chọn Figma đó là Figma sử dụng điện toán đám mây. Tất cả các tệp và dự án đều sẽ được lưu trên đám mây – Cloud-based nên bạn không cần phải chủ động lưu tệp, điều này khá giống cách hoạt động của Google Drive. Ngoài ra, Figma còn tích hợp kiểm soát đầy đủ, nên nếu bạn cần quay lại bước trước đó thì hoàn toàn đơn giản.
Đối với những bạn mới tham gia thiết kế UI bằng Figma, thì sẽ càng phù hợp hơn bởi vì các bạn không cần phải truy cập vào máy chủ để tìm tệp nữa. Với không gian làm việc Figma, tất cả các dự án và tệp của bạn sẽ được lưu giữ ở một nơi trung tâm, dễ dàng cho việc quản lý hơn bao giờ hết.
Figma sử dụng điện toán đám mây
1.3. Figma miễn phí không?
Với các nhóm làm việc và cần có sự cộng tác chỉnh sửa của nhiều người cùng lúc, thì Figma hiện có các gói gồm: Starter – Education – Professional – Organization. Trong 4 gói này thì Starter và Education là 2 gói miễn phí. Riêng gói Professional và Organization là các gói phải trả phí, bời vì chúng tập trung vào tính năng quản lý nâng cao dành cho các tổ chức hoặc doanh nghiệp lớn mà cần quản lý chặt chẽ các dự án.
Nếu như bạn đang cùng nhóm cộng tác thực hiện 1 dự án nhỏ nào đó thì bạn có thể yên tâm chọn gói Starter của Figma để sử dụng các tính năng chỉnh sửa đồng thời dành cho nhiều người và thoải mái thực hiện từ đầu đến cuối dự án mà không phải trả tiền. Nhưng khi làm việc cho doanh nghiệp, đối với các dự án lớn và cần nhiều thời gian thì công ty nên mua gói trả phí để thực hiện dự án một cách hiệu quả.
Trường hợp bạn là Freelancer và chỉ có một mình chỉnh sửa thiết kế, dự án thì việc sử dụng Figma hoàn toàn đáp ứng được công việc của bạn với chi phí bằng 0 và không có giới hạn nào được đặt ra đối với các tính năng và công cụ thiết kế.
Một video hướng dẫn cho các bạn mới bắt đầu tải Figma miễn phí về và tự học một số kiến thức cơ bản về nó
2. Một số tính năng ưu việt của Figma
2.1. Cộng tác cùng nhau trên cùng một thiết kế
Tính năng ưu việt đầu tiên cần kể đến chính là Figma cho phép nhiều người chỉnh sửa cùng lúc trên cùng 1 bản thiết kế. Bạn có thể thực hiện thiết kế hoặc gửi phương án cho khách hàng xem ngay trên trình duyệt mà không bị phụ thuộc vào hệ điều hành của máy.
Đối với những công việc như thiết kế UI UX, đặc biệt là thiết kế cho các sản phẩm hay dự án quy mô lớn thì việc cộng tác cùng lúc của nhiều người tham gia gần như là 1 yêu cầu mang tính tất yếu, đây cũng chính là điểm mạnh mà Figma mang lại.
Figma cho phép nhiều người chỉnh sửa cùng lúc trên 1 bản thiết kế
2.2. Prototype
Điểm mạnh thứ 2 của Figma đó là tạo ra Prototype giúp cho bạn và mọi người đều có thể trải nghiệm thử thiết kế. Smart Animate của Figma sẽ là tính năng giúp bạn tạo nên 1 bản mô phỏng với hiệu ứng ấn tượng và.sinh động. Còn với tính năng Figma Mirror, bạn hoàn toàn có thể trực tiếp xem được thiết kế của mình trên điện thoại hay máy tính bảng để trải nghiệm ngay trong quá trình thiết kế.
Ngoài ra bạn cũng có thể gửi link của Prototype trên Figma cho khách hàng hoặc bất cứ ai xem. Bởi vì Prototype không phụ thuộc vào hệ điều hành nên có thể xem được trực tiếp từ trình duyệt web và mọi thay đổi trên bản thiết kế của bạn sẽ được cập nhật trực tiếp lên Prototype mà không cần gửi lại link.
Tính năng tạo Prototype giúp bạn dễ dàng trải nghiệm thử thiết kế
2.3. Vector network
Nếu bạn đã từng dùng các phần mềm vẽ vector như Adobe Illustrator thì khi trải nghiệm thử vector network của Figma, bạn sẽ thấy được Figma thực sự khác biệt và rất tiện lợi. Để vẽ 1 hình phức tạp gồm nhiều mảng và có cùng chung 1 điểm neo, thay vì phải quản lý bằng nhiều layer thì trên Figma bạn chỉ cần vẽ trên 1 layer mà thôi.
Một ví dụ cụ thể như bạn vẽ 1 bông hoa 5 cánh trên Adobe Illustrator, 5 cánh hoa tương đương 5 đường vector riêng biệt với 1 điểm gốc trùng lên nhau tức là phải có 5 layer, nhưng nếu bạn vẽ bông hoa đó trên Figma, tất cả 5 cánh hoa chỉ là 1 đường vector liên tục với 1 điểm neo chung chỉ với 1 layer,. Nhờ vậy mà việc chỉnh sửa cũng sẽ trở nên tiết kiệm thời gian hơn và đơn giản hơn rất nhiều.
Vector network của Figma thông minh và tiện lợi hơn so với Adobe Illustrator
2.4. Components
Components của Figma đem lại 2 lợi ích nổi bật chính là tốc độ xử lý nhanh và đem lại tính nhất quán cho thiết kế.
Bất kỳ thành phần giao diện nào mà người dùng muốn sử dụng lại ở nơi khác trong thiết kế của mình, bạn có thể lấy nó làm thành phần chính. Tức là nếu bạn muốn thay đổi một chi tiết bất kỳ, thay vì bạn phải chỉnh sửa hơn 30 giao diện tất cả chẳng hạn, thì bạn chỉ cần chỉnh sửa 1 thành phần chính, sau đó những thành phần con sẽ tự động cập nhật ngay lập tức. Thật sự là quá hay để giúp bạn tiết kiệm nhiều thời gian.
Hệ thống Component cùng hệ thống Style để cài đặt kiểu chữ, màu sắc cũng như các hiệu ứng là cơ sở để tạo nên hệ thống thiết kế đồng bộ, mang lại tính nhất quán cho dự án của bạn.
Components giúp tốc độ xử lý nhanh và mang lại tính nhất quán cho thiết kế
2.5. Auto layout
Auto layout (Bố cục tự động) là một tính năng cực thông minh và hữu ích mà Figma sẽ giúp bạn tiết kiệm nhiều thời gian và công sức khi thiết kế. Tính năng Auto layout giúp người dùng tạo ra một bố cục hoặc component có thể tự động điều chỉnh, thay đổi kích thước dựa trên sự thay đổi của nội dung bên trong hay đối tượng chứa bên ngoài.
Ví dụ, khi bạn cần bổ sung thêm hay bỏ bớt một thành phần nào trong bố cục, thì tất cả các thành phần còn lại sẽ tự động được thay đổi cho phù hợp, không cần phải tốn quá nhiều thao tác điều chỉnh lại. Tính năng này cực kỳ hữu ích khi bạn cần thiết kế giao diện cho nhiều kiểu kích cỡ màn hình của những thiết bị khác nhau.
Khi bạn thay đổi một thành phần nào đó, bố cục sẽ tự động điều chỉnh cho phù hợp
2.6. Community and Plugin
Bởi vì cộng đồng người dùng Figma ngày càng đông, hiện có nhiều plugin được viết ra để giúp cho việc design UI bằng Figma trở nên tiện lợi hơn cũng như hiệu quả hơn. Các plugin có thể được cài đặt trên Figma rất nhanh, gần như là ngay lập tức và chúng sẽ được lưu theo tài khoản của người dùng. Mỗi khi bạn đăng nhập và dùng Figma trên thiết bị khác thì các plugin mà đã được cài đặt vẫn sẵn sàng để sử dụng.
Ngoài ra bạn còn có thể khám phá kho tài nguyên khổng lồ trên cộng đồng của Figma mà mọi người đưa thiết kế của mình lên. Tại đây, bạn có thể tham khảo ý tưởng và xem được chi tiết các thông số thiết kế của mọi người để rút ra được cách làm, kiểu chữ, cách phối màu sắc và cách thiết lập các components như thế nào.
Plugin được lưu theo tài khoản của người dùng
3. Học Figma nên bắt đầu từ đâu?
Nếu như bạn là người mới bắt đầu học cách sử dụng Figma thì bạn cũng đừng quá lo lắng. Vì cộng đồng những người dùng Figma ngày càng lớn, nhu cầu học Figma ngày càng cao, các khóa học Figma cũng được mở ra nhiều hơn để phục vụ những người mới bắt đầu.
Trong bài viết này, Beto xin giới thiệu đến các bạn một khóa học Figma cơ bản nhưng rất chất lượng với tên gọi “Khóa học Figma dành cho Designer/ Developer đi đầu xu hướng”. Khóa học được phụ trách bởi giảng viên LƯU TRỌNG NHÂN, hiện thầy đang là Giám đốc sáng tạo tại TELOS kiêm Trưởng nhóm thiết kế tại XBOSS ERP. Với học phí khá phải chăng chỉ với khoảng 1,500,000 đồng, khi kết thúc khóa học bạn có thể:
- Sử dụng công cụ thành thạo; có tư duy bài bản và hiểu rõ được ngôn ngữ trong thiết kế.
- Tự tin thực hiện ý tưởng sáng tạo của bản thân trên các thiết kế.
- Nắm vững nền tảng cơ bản trong Figma.
- Tiết kiệm hơn 60% thời gian cho việc lặp đi lặp lại các thao tác bằng cách tạo components.
- Tự thiết kế được website hoặc app trên điện thoại
- Sẵn sàng trở thành một nhà thiết kế chuyên xây dựng website.
“Khóa học Figma dành cho Designer/ Developer đi đầu xu hướng” tại Beto chỉ với khoảng 1,5 triệu đồng
Tóm lại, qua bài viết trên đây, hy vọng có thể giúp những bạn nào làm việc trong lĩnh vực thiết kế UI sẽ nhận thấy được nhiều lợi ích từ việc sử dụng Figma. Và nếu như bạn mong muốn trở thành một nhà thiết kế chuyên xây dựng website/app chuyên nghiệp thì đừng chần chờ mà hãy đăng ký ngay khóa học Beto đã giới thiệu bạn nhé. Chúc các bạn thành công!
Nguồn tham khảo:
- hocdohoa.edu.vn
- colorme.vn