Giới thiệu về Adobe Experience Design CC (Adobe XD) cho Mac

Adobe Experience Design CC (hay Adobe XD) dành cho hệ điều hành Mac là một công cụ đắc lực dành cho các nhà phát triển. Phần mềm này được cung cấp hoàn toàn miễn phí, cho phép người dùng thực hiện thiết kế, kiểm tra và xây dựng các bản mẫu (prototype) cho cả trang web và các ứng dụng di động.

*Giao diện phần mềm thiết kế Adobe XD cho Mac*

Giao diện ứng dụng thiết kế UX website Adobe Experience Design CC cho Mac

Adobe Experience Design CC, còn được biết đến với tên gọi Adobe XD, là sản phẩm được Adobe phát triển. Mục tiêu của việc phát triển này là kết hợp những ưu điểm của công cụ thiết kế đồ họa chuyên nghiệp Sketch với các tính năng tạo nguyên mẫu (prototype) của ứng dụng web InVision. Từ đó, một công cụ hoàn chỉnh cho các nhà thiết kế web đã ra đời.

Bản Beta đầu tiên của phần mềm được giới thiệu vào đầu năm 2016. Khoảng hai tháng sau, Adobe đã phát hành bản Beta thứ hai với nhiều tính năng được bổ sung. Kể từ thời điểm đó, phần mềm liên tục được cải tiến và cập nhật các tính năng mới.

Những cập nhật mới nhất trong Adobe XD cho Mac

Cập nhật trong phiên bản mới nhất của Adobe XD cho Mac bao gồm những cải tiến đáng chú ý sau:

Linear Gradients: Tính năng này cho phép người dùng tạo, chỉnh sửa và áp dụng các hiệu ứng gradient tuyến tính lên các đối tượng trên canvas, trực tiếp từ bảng chọn màu.
Hỗ trợ ngôn ngữ Hàn Quốc: Phiên bản mới đã được bổ sung khả năng hỗ trợ ngôn ngữ Hàn Quốc.

Trước đây, Adobe Experience Design CC được biết đến với tên gọi Project Comet. Phần mềm này hướng tới việc hỗ trợ các nhà thiết kế UX (trải nghiệm người dùng) bằng cách cung cấp khả năng phát triển ứng dụng web và ứng dụng di động, kiểm tra và thử nghiệm sản phẩm, cũng như tạo ra các bản mẫu tương tác.

Sau phiên bản dành cho máy Mac, Adobe XD cũng sẽ sớm có mặt trên hệ điều hành Windows, cùng với các phiên bản dành cho thiết bị di động chạy iOS và Android.

Video giới thiệu phần mềm thiết kế Adobe Experience Design CC cho Mac

Ngay sau khi khởi động, Adobe XD cung cấp nhiều tùy chọn mẫu (template) đa dạng, hỗ trợ người dùng bắt đầu công việc một cách nhanh chóng. Các lựa chọn này bao gồm kích thước phù hợp với từng thiết bị iOS, Android, web, hoặc khả năng tùy chỉnh kích thước theo ý muốn.

Lựa chọn mẫu template với các kích thước cho thiết bị sẽ chạy ứng dụng

Nhằm mục đích tạo ra những ứng dụng có cảm giác tự nhiên, giống như ứng dụng gốc (native) nhất, công cụ này tích hợp UI Kit cho các thiết bị iOS. Đồng thời, ngôn ngữ Material Design của Google được áp dụng cho các thiết bị Android từ phiên bản Lollipop trở lên, và các thiết bị Windows 10 (bao gồm cả điện thoại, máy tính bảng và laptop).

Thiết kế từng đối tượng trên ứng dụng của mình với nhiều kích thước có sẵn

Giao diện của Adobe XD được phân chia thành hai khu vực chính: Design, nơi hiển thị các đối tượng trên bản thiết kế, và Prototype, khu vực dùng để chỉnh sửa các yếu tố liên quan đến nguyên mẫu. Bố cục này khá quen thuộc đối với những ai đã từng sử dụng các sản phẩm khác của Adobe.

Các công cụ không được sắp xếp dày đặc như trong Photoshop hay Illustrator , mặc dù số lượng công cụ có thể ít hơn. Tuy nhiên, điều này không làm giảm đi sức mạnh của phần mềm.

Hiển thị các layout khác nhau trên các bảng ở giao diện

Các màn hình hoặc bố cục khác nhau trong một bản thiết kế được đặt trong các bảng trên màn hình. Bên cạnh đó là các công cụ ở phía bên trái và các thuộc tính ở phía bên phải.

Cùng với các công cụ thiết kế vector tiêu chuẩn, còn có nhiều tiện ích khác hỗ trợ các công việc chuyên dụng. Ví dụ, bạn có thể dễ dàng tạo ô lưới để liệt kê danh sách sản phẩm bằng cách chọn nhóm và kéo thả, sau đó điều chỉnh khoảng cách giữa các phần tử.

Các công cụ chuyên biệt khác giúp thiết kế UI/UX nhanh chóng

Bạn cũng có thể chọn một nhóm hình ảnh từ máy Mac và kéo thả chúng vào ô lưới để thay thế toàn bộ hình ảnh một cách nhanh chóng.

Trên cửa sổ Prototype, người dùng có thể thêm các yếu tố tương tác vào thiết kế để xây dựng nguyên mẫu. Ví dụ, bạn có thể kết nối các màn hình với nhau bằng cách kéo thả các đường màu xanh nước biển.

Kết nối các màn hình bằng đường nối màu xanh trong Prototype

File nguyên mẫu của Adobe XD được lưu trữ trên máy chủ của Adobe, tạo điều kiện cho các nhà phát triển dễ dàng truy cập thông qua liên kết hoặc chia sẻ qua email, Slack . Hiện tại, chưa có các tính năng bảo mật như yêu cầu mật khẩu, nhưng giám đốc quản lý sản phẩm của Adobe cho biết tính năng này sẽ được thêm vào trong tương lai.

Khi đã kết nối các màn hình hoặc bố cục, phần mềm cho phép tùy chỉnh hiệu ứng chuyển đổi, chẳng hạn như hướng di chuyển hoặc hiệu ứng chuyển trang. Thời lượng hiệu ứng cũng có thể được điều chỉnh. Các hiệu ứng mới sẽ được bổ sung liên tục.

Tính năng chỉnh sửa kích thước của ô Grid

Adobe Experience Design CC cho phép kiểm tra kết quả trên một cửa sổ riêng biệt. Tại đây, bạn có thể xem, chỉnh sửa khi cần thiết, ghi lại hoạt động hoặc chia sẻ màn hình với các thành viên trong nhóm hoặc khách hàng. Sau khi hoàn tất, bạn có thể xuất bản thiết kế dưới dạng ảnh PNG hoặc ghi lại các hoạt động trên nguyên mẫu dưới dạng video MOV.

Kéo hình ảnh từ Finder của máy Mac hoặc text file để tạo text box

Bạn cũng có thể sử dụng tài khoản Creative Cloud để chia sẻ các nguyên mẫu của mình. Tính năng Share cung cấp một URL để xem nguyên mẫu trên trình duyệt và chia sẻ với bất kỳ ai.

Tính năng nổi bật của phần mềm Adobe Experience Design CC

Giao diện thiết kế mượt mà

Quá trình thiết kế của bạn sẽ được đẩy nhanh hơn nhờ các công cụ trực quan của Adobe XD. Phần mềm cho phép bạn vẽ, tái sử dụng và kết hợp các thành phần để tạo wireframe cho website, các thiết kế đồ họa, nguyên mẫu tương tác và nhiều loại tài sản khác, tất cả trong cùng một ứng dụng.

Các nguyên mẫu tương tác có thể được làm phong phú bằng các hiệu ứng, giúp nhà thiết kế kiểm tra và đánh giá chính xác trải nghiệm người dùng trên thiết kế của mình. Việc chuyển đổi giữa chế độ thiết kế và nguyên mẫu cũng trở nên dễ dàng, không cần rời khỏi ứng dụng.

Khả năng xem trước thời gian thực

Adobe XD giúp bạn loại bỏ những dự đoán về giao diện cuối cùng của thiết kế. Bạn có thể dễ dàng xem trước bản thiết kế hoàn chỉnh với đầy đủ các hiệu ứng. Sau đó, thực hiện các điều chỉnh, thay đổi và xem lại kết quả cho đến khi đạt được sự hài lòng.

Chia sẻ dễ dàng, cộng tác hiệu quả

Adobe Experience Design cung cấp một không gian làm việc nhóm hiệu quả, cho phép nhà thiết kế gửi liên kết đến các thành viên trong nhóm để nhận phản hồi về bản thiết kế. Đồng thời, bạn có thể chia sẻ các sản phẩm thiết kế để các nhà phát triển xây dựng thông số kỹ thuật liên quan.

Chia sẻ nhiều phiên bản nguyên mẫu với đồng nghiệp và khách hàng

Thiết kế đối tượng lặp lại nhanh chóng

Tính năng Repeat Grid cho phép người dùng thiết kế và sử dụng hình ảnh, dữ liệu trực tiếp trong quá trình làm việc. Sau đó, bạn có thể sao chép chúng theo chiều dọc hoặc chiều ngang trên màn hình. Tất cả các thuộc tính và khoảng cách từ bản gốc sẽ được giữ nguyên trong bản sao.

Sao chép dữ liệu một cách nhanh chóng, bảo toàn style và khoảng cách

Adobe Experience Design CC liên tục được cập nhật với các tính năng mới hàng tháng. Lộ trình phát triển của hãng bao gồm việc bổ sung các hiệu ứng, chế độ hòa trộn, hỗ trợ thư viện Creative Cloud, Adobe Stock và mở rộng khả năng tương thích trên nhiều thiết bị khác nhau.