Figma là gì? Hướng dẫn cách sử dụng Figma chi tiết

Dịch vụ tài khoản premium

Ra mắt vào năm 2015, Figma được biết đến như là công cụ thiết kế giao diện người dùng UI (Interface User) cho website và ứng dụng hàng đầu hiện nay.

Figma là gì? 

https://www.figma.com/
https://www.figma.com/

Figma là một công cụ prototype, biên tập/chỉnh sửa đồ họa vector dựa trên đám mây được sử dụng để thiết kế giao diện người dùng với khả năng cộng tác làm việc từ xa vượt trội.

Ngày càng nhiều doanh nghiệp lựa chọn sử dụng Figma vì sự tiện lợi. Trong bài viết này hãy cùng mình tìm hiểu những tính năng và cách sử dụng Figma.

✔ Cập nhật 15/9/2022: Adobe xác nhận chính thức, sẽ mua lại Figma với giá 20 tỷ đôla, hứa hẹn mở ra một kỷ nguyên hợp tác sáng tạo mới. Nguồn: Adobe.com

Có khá nhiều đánh giá về Figma với những ưu điểm tuyệt vời như: Figma có giao diện thiết kế trực quan, thân thiện với người dùng. Nếu bạn đã quen thuộc với Photoshop thì việc làm quen với Figma thật sự không mất nhiều thời gian, thậm chí bạn sẽ cảm thấy thao tác trên Figma đơn giản và dễ dùng hơn. Bạn có thể sử dụng Figma miễn phí, tuy nhiên, nếu muốn sử dụng đầy đủ tính năng của Figma, đặc biệt là tính năng cộng tác thiết kế bạn sẽ cần nâng cấp lên gói Figma Pro.

Những ưu điểm tuyệt vời khi sử dụng Figma

Khi các công ty, các Designer phải đưa ra quyết định họ nên lựa chọn công cụ thiết kế nào. Vì sao nên lựa chọn Figma? 

Ví dụ cho thấy Figma giúp giảm đáng kể việc sử dụng nhiều phần mềm chuyên dụng và đơn giản quy trình thiết kế.
Ví dụ cho thấy Figma giúp giảm đáng kể việc sử dụng nhiều phần mềm chuyên dụng và đơn giản quy trình thiết kế.

✅ Khi gửi file theo cách truyền thống, đôi khi file có lỗi nhưng ngay cả Designer và người nhận không phát hiện ra, dẫn đến những sai sót không đáng. Figma cho phép nhiều người dùng làm việc cùng một lúc trên 1 bản thiết kế. Figma có thể sử dụng dưới bất kỳ hệ điều hành và trình duyệt nào. Tất cả thành viên đều có thể truy cập vào file để xem trạng thái thiết kế hiện tại theo thời gian thực. 

✅ Mặc dù nhiều người làm việc trên cùng 1 file thiết kế. Tuy nhiên hiệu suất vẫn không thay đổi khi số lượng công cụ sử dụng và mức độ chỉnh sửa tăng lên. 

✅ Khi làm việc với khách hàng, nếu sử dụng Photoshop bạn phải xuất cả file cho khách hàng xem. Với Figma, bạn có thể xuất từng yếu tố trong file, cả file, hoặc xuất bản nháp để khách hàng xem và feedback nhanh hơn. Từ đó tăng tiến độ và năng suất làm việc của dự án. 

✅ Và còn rất nhiều tính năng khác.

Giao diện thiết kế Figma 

Figma có giao diện thân thiện với người dùng. Sau khi tạo tài khoản và đăng nhập, bạn sẽ thấy giao diện của Figma như sau:

  • New design file: Tạo thiết kế mới.
  • New FigJam file: FigJam được gọi là “bảng trắng” của Figma. Khi các Designer cùng làm việc trên 1 file thiết kế, họ cần một nơi để thảo luận ý tưởng và thống nhất quy trình, nên Figma đã bổ sung FigJam. 
  • Import file: Tải file từ máy tính. 
The Editor in Figma | Figma Handbook | Design+Code
Giao diện bạn sẽ gặp khi bắt đầu sử dụng Figma

Trong phần Explore FigJam templates > chọn See all để xem thêm nhiều mẫu template phù hợp khác. Trước khi bạn và đồng đội bắt tay vào việc thiết kế bất kỳ sản phẩm nào, bạn sẽ cần dùng đến FigJam. 

FigJam is an online whiteboard for teams to explore ideas | ChiasePremium.com
FigJam

Biểu tượng cái chuông góc phía trên bên phải là phần Notifications, bạn dễ dàng theo dõi những chỉnh sửa của file thiết kế thông qua Notifications.

Bạn có thể sử dụng Figma trên trình duyệt Browser và ứng dụng Figma App. Tuy nhiên, sử dụng Figma trên trình duyệt sẽ thuận tiện hơn khá nhiều so với dùng trên App. 

Figma downloads
Figma downloads

Hướng dẫn cách sử dụng Figma (cơ bản)

Trước hết mình sẽ tạo thiết kế mới – “New design file” và sau đó sẽ minh họa các thao tác sử dụng cơ bản của Figma.

Công cụ Move, Pan và Zoom 

Sau khi chọn tạo thiết kế mới, Figma sẽ hiển thị giao diện như sau. 

Tạo thiết kế mới - "New design file" trên Figma
Tạo thiết kế mới – “New design file” trên Figma

Phần góc bên trái phía trên là nơi hiển thị các công cụ của Figma. Bạn sẽ click vào từng biểu tượng để lựa chọn công cụ bạn muốn. Ưu điểm của Figma chính là nếu bạn không nhớ công cụ đó nằm ở đâu, nhưng chỉ cần bạn nhớ tên công cụ, thì chắc chắn bạn sẽ tìm được nhờ gõ tên công cụ đó vào Quick actions

Use shortcuts and quick actions – Figma
Quick actions

Sau khi click vào biểu tượng hình tam giác để vẽ 2 hình dạng bất kỳ. Mình sử dụng công cụ Move (phím tắt V) để di chuyển từng hình. Nếu muốn di chuyển cả 2 hình, mình sẽ sử dụng Hand tool (phím tắt H). 

Pan and zoom in FigJam – Figma
Hand tool

Phần góc bên phải để bạn Zoom file theo ý thích. 

Adjust your zoom and view options – Figma
Điều chỉnh Zoom – Figma

Công cụ Frame 

Vì Figma là ứng dụng để thiết kế giao diện UI nên sẽ có đầy đủ các loại Frame với sẵn kích thước để bạn thiết kế. Tuy nhiên phần Social Media thì Figma không cập nhật kích thước mới nhất, nên bạn cần kiểm tra kỹ lại kích thước và chỉnh sửa nếu cần nhé. 

What is a frame in Figma? Create frames
Công cụ Frame  trên Figma

Nếu muốn chỉnh sửa kích thước, bạn chỉ cần thay đổi W và H ở góc bên phải. 

Cách sử dụng Công cụ Frame trên Figma
Cách sử dụng Công cụ Frame trên Figma

Công cụ Groups, Lock và Hide Layers 

Từng layer trong Figma sẽ hiển thị tương tự như Photoshop. Bạn dễ dàng dùng chuột để di chuyển thứ tự các layer. Biểu tượng ổ khóa dùng để khóa layer, và biểu tượng con mắt để ẩn layer đó. 

Cách sử dụng các Công cụ Groups, Lock và Hide Layers trên Figma
Cách sử dụng các Công cụ Groups, Lock và Hide Layers trên Figma

Khi cần nhóm các layer lại với nhau, bạn click chọn những layer cần nhóm và chọn Ctrl + G. Nếu muốn bỏ nhóm các layer, bạn chọn Ctrl + Shift + G. 

Công cụ Opacity và Fill 

Lựa chọn mức Opacity trong phần Layer > Pass through. Ngoài tùy chọn Pass through thì Figma cũng có những tùy chọn hòa trộn khác (Blending Modes) tương tự như Photoshop. 

Cách sử dụng Công cụ Opacity và Fill trên Figma
Cách sử dụng Công cụ Opacity và Fill trên Figma

Figma cung cấp nhiều tính năng để bạn thiết kế sáng tạo hơn. Fill để đổ màu cho hình và bạn cũng có thể điều chỉnh mức Opacity của background/ hình đó. Để tạo được background dạng Gradient Color thì trong phần mũi tên mình tô vàng có nhiều lựa chọn cho bạn: Solid, Linear, Radial, Angular, Diamond, Image. Riêng Image dùng để chèn hình vào trong Shape đó. Hãy luyện tập thường xuyên để tạo được màu bạn yêu thích nha. 

Figma cung cấp nhiều tính năng để bạn thiết kế sáng tạo hơn
Figma cung cấp nhiều tính năng để bạn thiết kế sáng tạo hơn

Công cụ Rulers và Layout 

Trong ô tìm kiếm Quick actions… mình gõ Ruler thì lập tức hiển thị tùy chọn Show rulers. Sau đó mình chỉ việc nắm và kéo thước đặt vào thiết kế mà thôi. 

Công cụ Rulers và Layout 
Công cụ Rulers và Layout

Khi thiết kế giao diện dành cho điện thoại, bạn sẽ cần rất nhiều Ruler để căn chỉnh vị trí các vật thể trong thiết kế. Bạn không thể dùng tay thủ công tạo từng Ruler được. Vì vậy mà chúng ta nên dùng Layout grid.

Layout grid
Layout grid

Sau khi chọn Frame thì trong phần Layout grid, mình sẽ thay đổi Size để có mức lưới phù hợp. Lưới bố cục không phụ thuộc vào lưới pixel. Điều này có nghĩa là Layout grid không phụ thuộc vào độ phân giải hoặc kích thước cụ thể. Bên cạnh đó, bạn chỉ có thể áp dụng lưới bố cục cho 1 khung. 

Layout Grid dùng nhiều trong thiết kế giao diện. 
Layout Grid dùng nhiều trong thiết kế giao diện.

Công cụ History

Để xem lại lịch sử các phiên bản, trong phần Drafts/ Untitled, bạn chọn Show version history. Phần History của Figma hoạt động khá giống Drive, chỉ cần click vào là sẽ quay lại phiên bản cũ. 

Công cụ History trên Figma
Công cụ History trên Figma

Vẽ hình Shape 

Trên Menu, bạn sẽ lựa chọn hình bạn muốn vẽ. Nếu muốn vẽ hình vuông, hình tròn thì khi vẽ bạn chỉ cần nhấn và giữ phím Shift

Using Shape Tools - Figma
Shape Tools

Điểm hay của Figma chính là khi click vào Shape thì sẽ hiện ra chấm tròn ở các góc. Bạn dễ dàng thay đổi góc nhọn > góc tròn. Với hình tròn bạn có thể điều chỉnh lại góc như hình mẫu bên dưới. 

Vẽ Vectơ vẽ Shape
Vẽ Vectơ vẽ Shape
Cách sử dụng công cụ Shape 
Cách sử dụng công cụ Shape

Ngoài ra bên góc phải, bạn cũng có thể điều chỉnh 3 thông số mình tô màu vàng để ra được hình bạn mong muốn. Stroke để tô viền bên trong hoặc bên ngoài cho Shape. Phần Effects bao gồm đổ bóng Shadow và làm mờ Blur

Apply shadow or blur effects – Figma
Cách sử dụng công cụ Shape trên Figma

Công cụ Alignment và Distribution

Để căn chỉnh vị trí của các layer, bạn chỉ cần chọn các layer đó và chọn Alignment (phần tô màu đỏ). Nếu muốn điều chỉnh lại vị trí của các layer, bạn sẽ chọn Distribution trong phần ô tô màu vàng. Tidy up thường dùng để sắp xếp vị trí các biểu tượng trên điện thoại, canh chỉnh cả chiều ngang và chiều dọc. 

Adjust alignment, rotation, and position – Figma
Công cụ Alignment và Distribution

Chèn hình và chữ 

Để chèn hình ảnh vào trong thiết kế, bạn có thể kéo – thả trực tiếp file hình từ desktop vào file Figma hoặc chọn File > Place Image để chèn hình. 

Figma cung cấp đầy đủ tính năng ở menu bên tay phải để bạn chỉnh sửa chữ.

How do I insert an image into Figma | Chèn hình và chữ 
Chèn hình và chữ

Xuất file 

Ưu điểm của Figma chính là bạn có thể export/download từng yếu tố riêng lẻ trong bản thiết kế. Ví dụ như mình đã tải về máy file hình chữ nhật có đuôi PNG. 

Export images và PDFs
Export images và PDFs

Hướng dẫn cách sử dụng Figma chi tiết

(Thông qua minh họa Thiết kế banner với Figma)

Sau khi các bạn đã quen với những công cụ và tính năng cơ bản của Figma mà mình vừa giới thiệu ở trên thì việc thiết kế banner sẽ trở nên thú vị hơn. Mình sẽ hướng dẫn các bạn thiết kế 1 banner đơn giản cho dịp Giáng Sinh nha. 

Đầu tiên, các bạn sẽ tạo Frame bằng cách chọn Frame > Social Media. Vì mình cần banner khổ dọc, kích thước 900x1200px nên trong phần W và H (phần tô vàng) mình đã điều chỉnh lại kích thước. 

Minh họa Thiết kế banner với Figma
Minh họa Thiết kế banner với Figma

Tiếp theo, mình sẽ tô màu background. Bạn lựa chọn màu bằng cách rê chuột đến khi chọn được màu ưng ý, nhập thông số màu, hoặc sử dụng cây hút màu (phần mình tô màu vàng). 

Để hút màu trên hình có sẵn thì bạn sẽ đặt hình ảnh vào trong trình thiết kế bằng cách chọn Menu Figma > File > Place Image… Sau đó click vào biểu tượng cây hút màu và rê chuột đến vị trí màu cần hút. Do mình tải về color palette cho dịp Giáng Sinh nên sẽ có sẵn bảng màu, bạn hoàn toàn có thể hút màu từ bất kỳ hình ảnh nào cũng đều được hết nha. 

Hướng dẫn cách sử dụng Figma chi tiết (tiếp theo)
Hướng dẫn cách sử dụng Figma chi tiết (tiếp theo)

Nếu cần điều chỉnh sắc độ thì bạn sẽ chọn Linear, sau đó chọn màu thích hợp ở từng phần mình tô đỏ. 

Hướng dẫn cách sử dụng Figma chi tiết (tiếp theo)
Hướng dẫn cách sử dụng Figma chi tiết (tiếp theo)

Mình vẽ tiếp hình chữ nhật trong Frame. Khi dùng chuột di chuyển hình chữ nhật thì Figma sẽ hiển thị ngay phần căn chỉnh bằng đường màu đỏ, để bạn căn hình chữ nhật đã cân đối với Frame hay chưa. 

Hướng dẫn cách sử dụng Figma chi tiết (tiếp theo)
Hướng dẫn cách sử dụng Figma chi tiết (tiếp theo)

Mình chọn tiếp Text. Bạn dễ dàng chỉnh sửa font chữ, size, căn chỉnh vị trí. Ngoài ra mình có thêm phần Stroke để chữ trông nổi bật hơn. 

Hướng dẫn cách sử dụng Figma để thiết kế banner (tiếp theo)
Hướng dẫn cách sử dụng Figma để thiết kế banner (tiếp theo)

Để thêm hình vào Frame thì mình cũng chọn Menu Figma > File > Place Image… 

thêm hình vào Frame
thêm hình vào Frame

Thanh menu phía trên có biểu tượng Crop (phần được tô vàng). Mình sẽ dùng Crop để cắt hình cho phù hợp với khung màu xanh. Nếu bạn muốn hình vừa khít vào hình chữ nhật màu xanh thì chỉ cần di chuyển hình vào khung là được. 

Cuối cùng mình sẽ thêm những phụ kiện Giáng Sinh khác từ Freepik và PNGtree để banner sống động hơn. Để di chuyển các layer lên phía trước hoặc lùi xuống phía sau, ngoài di chuyển thứ tự bên menu layer phía tay trái, bạn có thể click chuột phải chọn Bring to font hoặc Sent to back

Hướng dẫn cách sử dụng Figma chi tiết (tiếp theo)
Hướng dẫn cách sử dụng Figma chi tiết (tiếp theo)

Cuối cùng thì mình cũng đã hoàn thành banner Giáng Sinh và export với đuôi PNG rồi. Với sự sáng tạo và sử dụng thành thục các công cụ của Figma thì chắc chắn các bạn sẽ thiết kế banner đẹp hơn banner này nhiều nữa ^^ 

Hướng dẫn cách sử dụng Figma chi tiết (tiếp theo và hết)
Hướng dẫn cách sử dụng Figma chi tiết (tiếp theo và hết)

FigJam for iPad: dễ dàng phác thảo và chia sẻ ý tưởng

✅ Figma vừa mới ra mắt FigJam cho iPad ngày hôm qua 15/3, với đầy đủ các tính năng cộng tác nhóm theo thời gian thực, chỉnh sửa trực tiếp FigJam file trên iPad (trước đó phiên bản dành iOS chỉ có thể xem thiết kế mà thôi) hay cùng nhau “brainstorm” lên ý tưởng thiết kế ngay từ đầu.

Có thể hình dùng FigJam trên iPad giống như một “online whiteboard“.

Xem thêm: Top ứng dụng bảng trắng online & Đăng ký Whiteboard lifetime

Điểm mạnh của phiên bản FigJam dành cho iPad không chỉ giúp người dùng được trải nghiệm đầy đủ các tính năng như phiên bản Figma trên web (sử dụng trên máy tính) mà điều đặc biệt hữu ích hơn nữa ở FigJam for iPad là hỗ trợ đầy đủ Apple Pencil – với khả năng ghi chú trực tiếp lên thiết kế và Magic Keyboard.

FigJam for iPad
FigJam for iPad

Tính năng đồng bộ theo thời gian thực và cộng tác thiết kế vẫn là một trong các điểm mạnh của Figma mà ít có công cụ thiết kế UX ,UI nào có thể cạnh tranh được.

✅ Một số tính năng nổi bật khác của phiên bản FigJam trên iPad
– [ ] Design in low-fidelity
– [ ] Annotate designs
– [ ] Sketch flows and diagram
– [ ] Hand-write notes
– [ ] Jot down idease.

Nguồn: https://www.figma.com/blog/introducing-figjam-for-ipad/

Có nên đăng ký mua tài khoản Figma Pro?

Figma là gì
Figma là công cụ thiết kế UI/UX hàng đầu hiện nay.

Trong bài so sánh: “Figma vs. Sketch vs. Adobe XD: Công cụ thiết kế nào tốt hơn?” mình đã chia sẻ với các bạn rằng Figma là công cụ rất tốt khi bạn mới bắt đầu học thiết kế giao diện người dùng.

Và nếu bạn có một đội/nhóm thiết kế thì Figma có thể coi là công cụ phù hợp hơn cả vì khả năng cộng tác thiết kế đa nền tảng (Windows, Mac, Android, iOS,…) rất tuyệt vời.

Sau những tất cả những ưu điểm trên thì mình cho rằng, nâng cấp lên tài khoản Figma Pro là một sự lựa chọn đáng “đồng tiền bát gạo”.

Bạn có thể nâng cấp, đăng ký tài khoản Figma Pro khá dễ dàng (với một mức phí không quá đắt)
Bạn có thể nâng cấp, đăng ký tài khoản Figma Pro khá dễ dàng (với một mức phí không quá đắt)

Thông qua bài viết này, các bạn đã có thể đã làm quen và sử dụng những công cụ, tính năng trong Figma. Bên cạnh đó, thiết kế banner cho mạng xã hội bằng cách sử dụng Figma cũng đã trở nên dễ dàng hơn. Để ứng dụng Figma vào thiết kế website, thiết kế giao diện cho ứng dụng hoặc điện thoại cần nhiều sự luyện tập hơn nữa. Chúc các bạn thành công!

Chia sẻ tài khoản Figma Pro miễn phí

Cập nhật 10/2/2022: Hiện tại blog chiasepremium chia sẻ 03 slots (từ 10/2 – 17/2/2022) tài khoản Figma Pro miễn phí (team member | editor | không giới hạn), nếu bạn cần sử dụng hãy đăng yêu cầu kèm địa chỉ email của bạn trong Group Facebook ChiasePremiumdotcom nhé: https://www.facebook.com/groups/chiasepremiumdotcom

➤ Xem thêm: Dịch vụ tài khoản Figma Pro

N.L.Chi

Khóa học Figma thiết kế UI/UX

Dưới đây mình sẽ cập nhật và chia sẻ đăng ký miễn phí sử dụng các khóa học hay về Figma. Sau khi đăng ký bạn có thể truy cập sử dụng khóa học này vĩnh viễn. Thời gian miễn phí trong 24h và chỉ áp dụng cho 120 người đăng ký đầu tiên (theo quy định mới của Udemy), do đó, mình vừa đăng thông tin ở blog và đồng thời đăng trên Fan Page, Group, Telegram,… để các bạn tiện cập nhật và đăng ký sử dụng (Đây là các khóa học Figma rất hay và hoàn toàn miễn phí lifetime các bạn nhé).

  • Cập nhật tháng 3/2023: Mình có tạo một post riêng, chỉ để chia sẻ link đăng ký các khóa học Figma thiết UX/UI. Link truy cập ngay dưới đây:

Có thể bạn quan tâm: Khóa học Figma thiết kế UI/UX – Đăng ký, download miễn phí

Chia sẻ khóa học Figma từ cơ bản đến nâng cao

Ultimate Guide to Product Design

Design Thinking Approach – Uncover the secrets of successful products for outstanding user experience. Design your unique product that users love. Source: udemy.com

2 hours on-demand video
4 articles
Free | Full lifetime access

Ultimate Guide to Product Design: Design Thinking Approach
Ultimate Guide to Product Design: Design Thinking Approach

 

Giới thiệu khóa học (lược dịch)

Thế giới cuối cùng cũng hiểu được vai trò thiết yếu của thiết kế. Sản phẩm trông đẹp hơn bao giờ hết, giao diện trực quan và các công ty đang thuê các nhà thiết kế với tỷ lệ ngày càng tăng. Tuy nhiên, vai trò của nhà thiết kế đã thay đổi trong vài năm qua. Nó không còn đủ để lặp lại và hiểu người dùng của bạn, thay vào đó trong thế giới ngày nay, các nhà thiết kế có thể làm cả hai – xác định vấn đề và xây dựng giải pháp, điều này sẽ tăng giá trị của họ lên ít nhất 10 lần cho bất kỳ công ty nào. Khi bạn có thể làm cả hai, bạn có thể làm những điều mà không ai khác có thể làm và bạn sẽ là tài sản độc nhất của công ty mình.

Có một sự thay đổi đang diễn ra trong các tổ chức lớn, một sự thay đổi đưa thiết kế đến gần hơn với trung tâm của doanh nghiệp. Nhưng sự thay đổi không phải là về thẩm mỹ. Đó là về việc áp dụng các nguyên tắc thiết kế để có trải nghiệm người dùng tốt hơn. Cách tiếp cận mới này phần lớn là một phản ứng đối với sự phức tạp ngày càng tăng của công nghệ hiện đại và kinh doanh hiện đại.  

Hầu hết mọi người không nghĩ về các tương tác hàng ngày được thiết kế kém như thế nào cho đến khi họ học được các nguyên tắc của thiết kế tốt và trải nghiệm người dùng, nhiều nguyên tắc trong số đó không trực quan. Bạn không cần phải sinh ra đã nghĩ về những thứ này để trở thành một nhà thiết kế thành công, đó là một kỹ năng có thể được phát triển giống như bất kỳ thứ gì khác. Niềm đam mê thường đi sau kiến ​​thức và chuyên môn.   

Trong khóa học này, tôi đã giải thích toàn bộ quy trình thiết kế mà khi được tích hợp vào sản phẩm của bạn có thể tạo ra trải nghiệm người dùng tuyệt vời. Bạn cũng sẽ học cách tiếp cận vấn đề một cách có hệ thống. Làm việc theo chuỗi là giai đoạn quan trọng nhất của quá trình thiết kế. Khả năng thử nghiệm, đánh giá cao và học hỏi từ những sai lầm, và xây dựng dựa trên kinh nghiệm đạt được là dấu hiệu của một cá nhân thực sự thành công và sáng tạo, bất kể lĩnh vực nào. Source: udemy.com 

Khóa học này dành cho ai:

  • Khóa học này dành cho các Doanh nhân, Chủ doanh nghiệp và Nhà quản lý, những người sẵn sàng làm việc để tạo ra một sản phẩm yêu thích của khách hàng
  • Nếu bạn đang tìm kiếm một lối đi tắt, khóa học này KHÔNG dành cho bạn
  • Nếu bạn không sẵn sàng làm việc không ngừng để có kết quả mong muốn, khóa học này KHÔNG dành cho bạn

→ Link đăng ký miễn phí vĩnh viễn, cập nhật ngày 04/9/2022 (áp dụng cho 300 slot đăng ký đầu tiên) mời bạn xem ở link sau, (nếu bạn cần hãy nhanh tay đăng ký nhé trước ưu đãi miễn phí này hết hạn).

https://www.udemy.com/course/design-engaging-products-using-design-thinking/?couponCode=SEP2022FREE1

Figma Design Course 2023 Start to Finish

Cập nhật năm 2023.

Figma Design Course 2023. Your Website from Start to Finish
Step-by-step guide for beginners on how to go through the process of creating your project on Figma from start to finish.

Figma Design Course 2022. Your Website from Start to Finish
Figma Design Course 2022. Your Website from Start to Finish

“Figma is a web-based design tool that enables users to create interactive, collaborative designs. You can use it to do all kinds of graphic design work from wireframing websites, designing mobile app interfaces, prototyping designs, crafting social media posts, and everything in between. Figma works directly on your browser. This means you get to access your projects and start designing from any computer or platform without having to buy multiple licenses or install software. What makes it so attractive is the fact that it’s free to use.

If you’re still not familiar with this wondering web-based app you’ve come to the right place. You will learn through recorded lessons, practical exercises, and tips by UI & UX Designer Željko Milivojević, reviewing content at your own pace.” Source: Udemy.com

Link đăng ký vĩnh viễn (for 120 enrolls), cập nhật 20.7.2023

https://www.udemy.com/course/figma-practical-design/?couponCode=FIGMA2007

Figma Mega Course Complete Web App UI/UX

Figma Mega Course - Design 6 Complete Web App UI/UX Project
Figma Mega Course – Design 6 Complete Web App UI/UX Project

In this course you will learn how to design web app UI/UX using Figma.Prototyping with figma and animation. UI/UX Design. Source: udemy.com

  • You will design 3 real world web app UI/UX project
  • Figma UI/UX Design
  • How to design a complete web app using figma
  • Prototyping with animation in Figma
  • Different sort of tools and uses of those tools in Figma
  • Learn to use the best design technique
  • Learn to use plugin in Figma” (Source: udemy.com)

Link đăng ký vĩnh viễn (150 enrolls):

https://www.udemy.com/course/figma-uiux-design-a-complete-web-app-project-base/?couponCode=F2388E3B059293966B61

Figma UI/UX Projects course

Figma UIUX Projects UIUX Projects to try
Figma UIUX Projects
UIUX Projects to try

What you’ll learn

Understand UIUX fundamentals
Design a News App UI
Design mobile UIs of a contact page
Apply acquired knowledge to various UI’s. source: udemy.com

“User interface design(UI) and user experience design(UX) is a very crucial parts of determining the final output of software, applications, or process. User interface design and user experience design(UI/UX) has lots of benefits since they have a greater impact on influencing how users might use or uninstall an app or the retention rate of an app or software and the like. Welcome to this course future designers, in this course, we will be learning to design Interfaces using Figma as the primary design tool. You’ll be introduced to some useful resources/ links to help you thrive in an ever-changing world. Figma makes it fun and easier to get your designs up to speed with positive outcomes especially when you use a creative approach to doing what you love doing best. In this lesson, you’ll learn to use shapes(components) and tools to create stunning user interfaces. Some fundamental design principles would be taught and demonstrated in the course. The main course projects includes several steps to learning to build or design a contact app user interface. The course is for anybody who would like to get started with User interface design. This course is in collaboration with Jacqueline Asare Dartey a UI/UX expert in using Figma and Adobe XD”. source: udemy.com

Link đăng ký miễn phí vĩnh viễn (150 enrolls today): https://www.udemy.com/course/figma-uiux-projects/?couponCode=UXUIFORANYBODY

The Complete Mobile App Design Course – UI/UX

Create E-commerce Mobile Application from A to Z. Source: udemy.com

The Complete Mobile App Design Course - UI/UX
The Complete Mobile App Design Course – UI/UX source: udemy.com

Khóa học này có cách tiếp cận vừa học vừa làm . Sẽ không có nhiều lý thuyết, tất cả chỉ hướng dẫn bạn cách thiết kế một sản phẩm di động trong thế giới thực và cho bạn thấy toàn bộ tiềm năng của Adobe XD.

Khi kết thúc khóa học, bạn sẽ có một bức tranh rất rõ ràng về cách Adobe XD hoạt động và bạn sẽ có thể áp dụng các kỹ thuật thiết kế, mẹo năng suất và tất cả các kỹ năng bạn đã học được vào các dự án thiết kế trong tương lai của mình.

Khóa học có phần hướng dẫn thực hành giúp bạn từng bước thực hiện các quy trình làm việc của một nhà thiết kế ứng dụng chuyên nghiệp. Từ sơ đồ luồng người dùng đến wireframing đến mô hình và nguyên mẫu. source: udemy.com 

Link đăng ký miễn phí vĩnh viễn, dành cho 120 người đăng ký đầu tiên trong hôm nay 06/3/2023 (120 enrolls today): https://www.udemy.com/course/the-complete-mobile-app-design-course-uiux/?couponCode=F8449D1DB7E48529B295

➤ Xem thêm: Cách tạo tài khoản Udemy có hàng nghìn khóa học miễn phí


4.9/5 - (19 bình chọn)

Theo dõi
Thông báo của
guest
5 Bình luận
Phản hồi nội tuyến
Xem tất cả bình luận
Nhật Minh

Chia sẻ link đăng ký vĩnh viễn khoá học, cập nhật link đăng ký mới, 23.7.2022,

Complete Figma Megacourse: UI/UX Design Beginner to ExpertThis course will be your personal guide for interface design using Figma! Go from the basics to working professionally!

https://www.udemy.com/course/beginners-guide-to-prototyping-and-designing-using-figma/?couponCode=AA2B7906D9A6E7999549

Nhật Minh

Chia sẻ khóa học:

Adobe XD – UI & UX Design Masterclass from 0 to Hero
Use XD to get a profitable job in UI / UX Design & Web Design

Link đăng ký miễn phí (lifetime);

http://www.chiasepremium.com/adobe-xd-ui-ux-design-masterclass-from-0-to-hero-free/

Nhật Minh

Chia sẻ khóa học:

Complete Adobe XD Megacourse: Beginner to Expert. This course will be your personal guide for UI/UX design using Adobe XD! Go from the basics to working profesionally!

http://www.chiasepremium.com/complete-adobe-xd-megacourse-beginner-to-expert-free/

HQuyen

Chia sẻ khóa học hay về Figma
✅ Link đăng ký miễn phí và sử dụng vĩnh viễn (áp dụng cho 1000 người đăng ký đầu tiên):

https://www.udemy.com/course/linkedin-amazon/?couponCode=LOVENEPAL

Nếu bạn cần, hãy nhanh tay đăng ký trước khi link đăng ký ưu đãi miễn phí hết hạn bạn nhé.

ChiasePremium

Blog chia sẻ Kiến thức công nghệ và Trải nghiệm tài nguyên số. Hướng dẫn đăng ký và Hỗ trợ sử dụng các loại Tài khoản Premium.

Share via
Copy link