Hướng dẫn chuyển đổi tệp của bạn từ XD sang Figma

Share on facebook
Share on pinterest
Share on twitter
Share on google
Share on linkedin
Share on email
Share on print

Hướng dẫn chuyển đổi tệp của bạn từ XD sang Figma

Những cách để giúp bạn có thể chuyển từ định dạng XD sang Sketch để phục vụ một số trường hợp đặc biệt buộc phải cần chuyển sang Figma cho nhu cầu doanh nghiệp và đối tác dễ tương tác hơn...

Chuyển thiết kế từ XD sang Figma – dễ hay không?

Gần đây tôi đang cân nhắc về định dạng của các phần mềm thiết kế UX/UI

Ban đầu tôi muốn viết về việc chuyển đổi giữa các công cụ thiết kế phổ biến trong một bài báo, nhưng đã bắt gặp một điều thú vị trong quá trình này.

Tôi đã chuyển đổi các tệp Sketch thành XD (thông qua chính XD) và cả Sketch thành Figma trước đây và tôi biết rằng điều này là rất dễ.

Nhưng tôi chưa bao giờ có bất kỳ kinh nghiệm thực tế nào về việc chuyển đổi các tệp XD sang Figma.

Vì vậy, giống như tất cả những người tò mò, tôi quyết định đi sâu hơn và viết về cách mở tệp XD trong Figma.

Chuyển đổi trực tiếp có được không?

Thực sự không có nhiều thông tin có sẵn, hầu hết chỉ là những người phàn nàn trên các diễn đàn Reddit và Adobe rằng một điều như vậy có thể xảy ra.

Phản hồi bao quát từ nghiên cứu của tôi là không thể chuyển đổi gốc, nhưng phải có một cách khác.

Rõ ràng việc hỗ trợ điều này thông qua XD sẽ không có lợi ích gì cho Adobe.

Nếu họ làm điều đó có nghĩa là một nhóm người dùng sẽ chuyển hướng sang dùng Figma.

Nói cách khác, về nguyên tắc là có thể chuyển từ XD sang Figma tuy nhiên hãng Adobe sẽ không bao giờ hỗ trợ tính năng này.

Tại sao cần chuyển đổi tệp sang Figma?

Có một số lý do để bắt đầu với Figma, vì vậy hãy đề cập đến những lợi ích chính.

  • Môi trường làm việc realtime – một số nhà thiết kế / các bên liên quan có thể làm việc trên tệp cùng một lúc
  • Dựa trên trình duyệt – điều đó có nghĩa là nó có thể chạy trên mọi hệ điều hành. Đây là một trong những khía cạnh tôi yêu thích Figma, vì cá nhân tôi sử dụng PC (không phải Mac)
  • Hầu hết là MIỄN PHÍ – tất cả đều có thể truy cập và sử dụng được, tất nhiên với team làm các dự án quy mô thì việc nâng cấp lên trả phí là cần thiết
  • Tất cả trong một – Nó bao gồm thiết kế, tạo mẫu và thông số design system để dễ dàng chuyển giao

Họ cũng có thể có cái nhìn tổng quan hơn vì mọi thứ đều trực tuyến. Họ cũng có thể cung cấp phản hồi trong chính tệp mà không cần phải xuất bản bất kỳ thứ gì hoặc chuyển sang giao diện khác hơn so với bạn làm trên Adobe XD.

Figma là một công cụ tuyệt vời, không có nghi ngờ gì về nó.

Bây giờ, chúng ta cùng xem các cách thức chuyển đổi định dạng từ XD sang Figma

Giải pháp chuyển đổi XD sang Figma

Sau khi tìm kiếm nhanh trên Google, tôi nhận ra rằng các tùy chọn thực sự rất hạn chế cho loại chuyển đổi này, nhưng có hai tùy chọn có thể dùng được

Bạn có thể chuyển XD sang Figma hoặc sang Sketch như sau:

  • SVG : Chuyển về định dạng vector và mở trên ứng dụng còn lại
  • XD2Sketch.com : Một công cụ trực tuyến từ hãng thứ 3 và có tính phí

Tôi đã tạo một tệp XD mẫu để kiểm tra với cả hai tùy chọn bản thiết ban đầu trông như thế này:

Tôi đã sử dụng các thành phần, nút, văn bản và hình ảnh để xem giải pháp nào tốt hơn.

Giải pháp với SVG

Đầu tiên là phương pháp chuyển đổi sang SVG.

Từ XD, bạn có thể sao chép bảng vẽ và dán trực tiếp vào Figma.

Dán SVG vào Figma

Cũng có thể xuất bản dưới dạng SVG từ XD và kéo chúng vào Figma.

Sau đây là kết quả:

Bạn có thể thấy sự khác biệt giữa cái này và bản gốc không?

Rõ ràng là điều này không ổn, vì nó không giống với bản gốc của tôi chút nào và mọi thử vỡ nát ra.

 

Ưu và Khuyết

  • Các định dạng không phải vector như PNG hoặc JPG sẽ không được chuyển đổi.
  • Bạn sẽ cần thêm cả mớt thứ để hoàn thành lại toàn bộ Artboard (phiền nhất là hình ảnh và font)
  • Hình nền của Shape cũng bị chuyển đổi thành hình dạng vector
  • Các ký hiệu / thành phần không được hỗ trợ
  • Artboards không được giữ đúng tên đã đặt
  • Tương đối nhanh chóng để dán các phần tử vector thực tế vào Figma
  • Sẽ ổn nếu bạn chỉ cần khai thác các số ít phần tử mfa không cần văn bản và hình ảnh (có thể là chỉ copy icon là chính).

 

Giải pháp chuyển từ XD sang Figma với XD2Sketch

Tiếp theo là một công cụ online có tên XD 2 Sketch, công cụ này thực sự đã chuyển đổi tốt và hoàn chỉnh toàn bộ tệp tin.

Để sử dụng công cụ chuyển đổi, trước tiên tôi cần chuyển đổi tệp XD của mình sang Sketch (vì Sketch là định dạng cơ bản nhất có thể hỗ trợ mọi phần mềm thiết kế UX/UI khác, hoặc nếu thích bạn cũng có thể chuyển trực tiếp từ XD sang Figma.

Sau khi up file và trả tiền cho hãng, tôi có thể tải xuống tài liệu dưới dạng tệp Sketch trực tiếp hoặc check email nhận link tải

Sau đó, tôi có thể nhập tệp vào Figma như thông thường

Quá trình tải lên được hoàn thành khá nhanh chóng

Bây giờ chúng ta hãy xem nó diễn ra như thế nào:

Mọi thứ trông rất ổn áp và tệp trình bày đầy đủ như bản gốc đã thiết kế trên XD trước đó

Ưu và Khuyết

  • Tiết kiệm rất nhiều thời gian trong quá trình chuyển đổi so với SVG
  • Mọi thứ đã được chuyển đổi và nguyên vẹn
  • Có rất ít việc phát sinh để làm lại tệp, (cụ thể là Master Component đã mất liên kết)
  • Artboards giữ nguyên tên ban đầu của chúng, vì vậy không cần đổi tên / tổ chức lại chúng
  • Sản phẩm không miễn phí (Bạn có thể xem giá tại đây ). Thành thật mà nói, theo cá nhân tôi thì việc phải chi phí cho mỗi lần chuyển rất tốn kém, tuy nhiên một số trường hợp đặc biệt có thể đôi khi chúng ta sẽ phải chấp nhận trả phí để giải quyết nhu cầu của doanh nghiệp
  • Các tính năng Master Component và Design System không được giữ lại, tuy nhiên điều này hoàn toàn dễ hiểu giữa các nền tảng này sang nền tảng khác. (Thật may mắn là Figma việc tạo lại các Master Component và Design System thật sự nhanh chóng)

Bây giờ chúng ta hãy so sánh giữa 2 phương pháp trên:

Chúng ta có thể thấy, chiến thắng rõ ràng đã thuộc về XD2Sketch.

Nguồn: Sưu tầm

 

Lời kết từ VAHOVA, thật sự là một dân UI/UX Design thì mình cũng như các bạn chúng ta đều bắt đầu dự án với 1 bản thiết kế từ đầy. Vì vậy, sẽ rất ít khi có trường hợp cần phải chuyển đổi qua lại các định dạng thiết UX/UI. Tuy nhiên đã có ít nhất 2 lần mình cần phải chuyển bản thiết kế XD sang Figma vì sự khó tương tác giữa team bên mình với đối tác ngoài nước nên phải chi phí cho XD2Sketch với mỗi lần chuyển 94$/file (trên 100 artboard). Một cái giá khá tốn kém đối với mình và cũng trong thời điểm mình sưu tầm bài viết trên, hãng đang có một gói offer không giới hạn số lượng tệp và thời hạn sử dụng cho những ai có nhu cầu.

Cá nhân mình thì cũng không thực sự có nhu cầu, tuy vậy mình vẫn nhanh tay thanh toán cho gói Offer đó. Cũng chính vì vậy mình cũng xin mở ra dịch vụ nhận chuyển file XD sang Sketch với giá rẻ bèo cho bạn nào đang cần (và mình cũng biết rằng khó có thể hồi vốn với dịch vụ này 😁) 

Cũng trong thời điểm viết bài này, mình xin tặng free dịch vụ cho mọi người trong thời gian cụ thể là tháng 8 và tháng 9 – 2021

Link truy cập dịch vụ: https://store.vahova.net/vahova-toolkit/chuyen-dinh-dang-thiet-ke-ux-ui-xd2sketch/

 

Video cách sử dụng XD2Sketch

 

5 1 Đánh giá
Article Rating
Đăng ký theo dõi
Thông báo bằng cách
guest
0 Comments
Cùng dòng phản hồi
Xem tất cả bình luận

VAHOVA TOOLKIT
THIẾT KẾ WEBSITE chuyên
NGHIỆP đẳng cấp ÔNG NỘI

Chúng tôi đã trang bị tận răng những plugins mạnh mẽ cùng các bài hướng dẫn chi tiết để giúp bạn thực hiện hóa ý tưởng của mình bởi chính tay bạn.

Bài cùng chuyên mục