Welcome Dialog

Welcome to the Community!

We have a brand new look! Take a tour with us and explore the latest updates on Adobe Support Community.


Adobe XD to SVG animation

Guest
Sep 05, 2020 Sep 05, 2020

Copy link to clipboard

Copied

Good Day, I would like to embed an animated app/web prototype as an SVG for user illustration. How does one go about it? Kindly share any tutorial.. 

Views

5.9K

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Adobe Community Professional , Sep 06, 2020 Sep 06, 2020
SVG - means Scalable Vector Graphics and its include code that allows to draw vectors in browsers and vector programs. It dosn't need player for showing SVG animation in browsers. You are aware that video files consist of raster images so you need to use apps that can convert video files in SVG format.  Here is some helpful links https://youtu.be/h8tInajwIHo https://sendeyo.com/onlineconverter/en/video-mp4/svg or find any other converter on the web.  Sometime the size of vector graphics be...

Likes

Translate

Translate
Adobe Community Professional ,
Sep 05, 2020 Sep 05, 2020

Copy link to clipboard

Copied

Do I understand right. You want to create animation in xd and export it as SVG? Or import SVG animation into XD?

XD do not exporting SVG animations or imported SVG animation created in other program into XD.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Guest
Sep 05, 2020 Sep 05, 2020

Copy link to clipboard

Copied

Hello Ares, thank you for responding. The video you export after prototyping I would like to have it as an SVG file so that it can be shown on the website as an illustration, is that possible? 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Sep 06, 2020 Sep 06, 2020

Copy link to clipboard

Copied

LATEST

SVG - means Scalable Vector Graphics and its include code that allows to draw vectors in browsers and vector programs. It dosn't need player for showing SVG animation in browsers. You are aware that video files consist of raster images so you need to use apps that can convert video files in SVG format. 

 

Here is some helpful links

https://youtu.be/h8tInajwIHo

 

https://sendeyo.com/onlineconverter/en/video-mp4/svg

or find any other converter on the web. 

 

Sometime the size of vector graphics become larger that raster file so may it better to use video file instead of vector.

Today's Question: How much experience do you have with After Effects?-- In today's tutorial, I'm going to show you how to use http://airbnb.io/lottie/ to tur...

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines