Figma là nền tảng tập hợp nhiều tính năng mạnh mẽ dành cho thiết kế đồng thời làm tăng hiệu suất suất làm việc cho các bạn designer. Đối với phiên bản miễn phí thì bạn có thể: Sử dụng cho 3 dự án thiết kế, cho phép 2 designer cùng sử dụng, không giới hạn lưu trữ, không giới hạn số lần xem.
AdobeXD là một công cụ giúp các nhà thiết kế UX có thể dễ dàng tạo sự tương tác trải ngiệm người dùng cho trang web và app điện thoại. Nó cho phép bạn có thể chia mẫu thiết kế web ra nhiều thành phần nhỏ hơn để có thể sử dụng cho các dự án khác nhau (nhằm giảm sự lặp lại ). Ngoài ra nó còn cung cấp hơn 200 plugin để giúp bạn có thể tự động hóa thiết kế cũng như tăng hiệu suất làm việc lên gấp nhiều lần. Một số điểm mạnh đáng chú ý của công cụ này là có thể kết hợp tốt với Photoshop, Illustrator, After Effects, cho phép tạo ra các component để áp dụng nhiều dự án khác nhau, tạo 3D transforms cho đối tượng, có thể kiểm tra và xem trước các mẫu prototype trên IOS và Android,... Đối với việc sử dụng cho cá nhân thì bạn có thể tải về hoàn toàn miễn phí cho máy tính hệ điều hành macOS và Windows. Tuy nhiên có một số điểm bất tiện là công cụ không hỗ trợ Tiếng Việt (bản mặc định sẽ là tiếng anh nhé), đối với hệ điều hành window thì phải là các phiên bản Windows 10 (64-bit) - Version 1803 (build 10.0.17134) trở về sau, đối với macOS là phiên bản macOS X v10.14 trở về sau nhé!
Công Cụ Lorem Picsum: Nhiệm vụ chính là giúp bạn có thể tạo ra hình ảnh minh họa ngẫu nhiên cho trang web bằng việc sử dụng đường dẫn https://picsum.photos/200/300. Ngoài ra nó còn có một số tính năng hữu ích khác như là chế độ blur, grayscale cho hình ảnh, cung cấp API về thông tin hình ảnh,...
MockPlus là một công cụ giúp bạn có thể tạo ra prototype cho trang web một cách đơn giản, nhanh chóng và thông minh bao gồm nhiều tính năng như là: + Các component và icon được tích hợp sẵn: Cung cấp hơn 200 mẫu component được thiết kế sẵn, hơn 3000 icon vector cho web, android, IOS giúp việc xây dựng mẫu thiết kế được nhanh chóng hơn. + Dễ dàng thiết lập các thư viện UI component riêng của bạn. Ngoài ra bạn có thể tạo ra tương tác cho component thông qua việc sử dụng và chỉnh sửa một số component được tích hợp sẵn như là checkboxes, pop-up, scroll boxes,… + Đặt trạng thái thái cho các component như là hover, focus, active, click, selected… + Luôn có thể xem trước mẫu thiết kế trang web của bạn khi đang design, có thể kiểm tra prototype trên nhiều thiết bị khác nhau như là iPhone, iPad và Android. + Có thể export(xuất) file HTML với tất cả hiệu ứng dựa trên mẫu thiết kế web của bạn.
Webflow là công cụ giúp các designer xây dựng và chỉnh sửa website một cách chuyên nghiệp thông qua trực quan hóa các tính năng của HTML, CSS3 và Javascript. Ngoài ra một điểm mạnh mà mình thích ở nó là cho phép tạo ra các hiệu ứng animation phức tạp với nhiều tính năng mà không cần phải quan tâm đến code. Cho phép bạn có thể thêm data(dữ liệu) vào trang web bằng cách thủ công thông thường, từ CSV hoặc API. Với phiên bản miễn phí thì bạn có thể: + Xây dựng 2 dự án + Đầy đủ các thiết lập tính năng cho thiết kế web + 100 giờ cho các khóa học online + Có thể xuất bản trên webflow.io
Công Cụ Smartmockups: Thông thường khi bạn thiết kế xong một trang web thì việc làm sao để khách hàng thấy nó có thể responsive trên nhiều màn hình thiết bị khác nhau thật không phải dễ dàng. Do đó các bản mockup ra đời với nhiệm vụ chính là đưa hình ảnh của bản prototype web được hiển thị trên các màn hình thiết bị khác nhau. Với công cụ Smartmockups thì Bạn chỉ cần tải hình ảnh của mẫu thiết kế web hoặc cung cấp địa chỉ URL của trang web thì ngay lập tức công cụ này sẽ tạo ra mockup dựa trên dữ liệu bạn cung cấp.
Pixlr là một công cụ chỉnh sửa hình ảnh online miễn phí nhanh chóng và dễ dàng ở ngay trên trình duyệt. Ngoài ra nó còn cung cấp thêm nhiều công cụ AI giúp quá trình thiết kế và xử lý công việc của bạn được giảm đáng kể. Nó cũng hỗ trợ xuất nhiều file phổ biến hiện nay như là PSD, PXD, JPEG, PNG, Webp, SVG,…
CleverBrush là một công cụ online giúp bạn có thể chỉnh sửa vector một cách nhanh chóng dễ dàng ở ngay trên trình duyệt web. Nó cũng hỗ trợ cho hầu hết các browser như là Google Chrome, Firefox, Edge và Safari.
MindMup giúp bạn tạo ra các sơ đồ tư duy (mind map) tuyệt vời đồng thời cũng làm gia tăng sự tập trung vào ý tưởng thiết kế, loại bỏ các thành phần phiền nhiều khác thông qua việc sử dụng giao diện tối giản của công cụ.
Gravit Designer là một công cụ miễn phí cung cấp đầy đủ tính năng dành cho thiết kế app và có thể hoạt động trên tất cả nền tảng hiện nay như là Mac OS, Windows, Linux, và Chrome OS.
Whimsical là công cụ giúp bạn có thể thiết kế website và app nhanh và tốt hơn thông qua việc cung cấp nhiều thư viện đi kèm để thiết lập phần tử trong trang web như là button, input, check box... Hỗ trợ xây dựng mẫu thiết kế trên nhiều màn hình thiết bị khác nhau(desktop, tablet, iPhone, Android), có thể thiết lập nhiều thành viên cùng làm trên một dự án và các chỉnh sửa sẽ được thay đổi theo thời gian thực.
Zeplin là một công cụ giúp gia tăng sự hợp tác giữa lập trình viên (developer) và nhà thiết kế (designer) trong quá trình xây dựng phát triển website, app. Điểm mạnh của nó trong thiết kế là bạn có thể chuyển mẫu của website sang nhiều chương trình như Sketch, Figma, Adobe XD, Adobe Photoshop CC mà không cần thay đổi bất cứ điều gì trên mẫu thiết kế.
Còn đối với việc lập trình thì Zeplin sẽ tự động tạo ra các đoạn mã HTML, CSS tương ứng dựa trên mẫu thiết kế web, app được cung cấp. Điểm mình thích nhất ở nó là việc kết hợp được với nhiều công cụ phổ biến như là Slack, Trello, Jira,...
Cloudconvert là một công cụ online giúp bạn có thể chuyển đổi định dạng của file một cách chóng và dễ dàng như là hình ảnh, video, audio, CAD, vector, document...
Invision là một công cụ mạnh mẽ trong việc tạo các mẫu (prototype) dành cho website và app. Một số tính năng vượt trội của nó là cho phép bạn tạo hiệu ứng và tương tác với các component mà không cần phải thêm bất kỳ dòng code nào, có thể thu nhận phản hồi trực tiếp từ người dùng, xây dựng liên kết với các công cụ thiết kế khác...
Octopus là một công cụ giúp bạn xây dựng cấu trúc website (sitemap) dưới dạng trực quan hóa giúp khách hàng có thể dễ dàng hiểu được luồng (flow) chạy trong trang web của bạn. Ngoài ra nó còn cung cấp tính năng export ra nhiều định dạng khác nhau như PDF, PNG, TXT, XML. Hỗ trợ việc chia sẻ file nhanh chóng cho khách hàng và các thành viên ở trong team.