AXURE and SVGs - for Dev use

#1

Hello
I need some help - am a UI Designer and my devs want SVGs Icons that come from a pure source - not a PNG converted to SVG. Have tried Photoshop to export as SVGs and export cons from Sketch as SVGs…but they don’t like them.
Can anyone give me advice about how you get your cons ready for dev use from a UI side when using Axure.

Thanks Daryl

DEV COM TO ME: You can’t really turn PNG into SVG files, because there’s no way to tell what strokes led to that PNG file (edited) so all that happens is that the SVG file basically creates a brush that looks exactly like the PNG file, but it can’t create information
so when you scale up the SVG the PNG still gets blurry
cause the brush only has so much information
So when we’re asking for SVG files, we need SVG files from the source

#2

Your devs are right, you can’t really convert a raster source (ex. PNG) into a vector source (ex. SVG). Where are you designing your icons? You need to be designing them as vector graphics and export as PNG. If you’re designing them in Sketch, the SVG export should likely work.

As for my workflow: when I need an icon I design it in Sketch and export as a SVG. Axure also has vector drawing capabilities as of version 8, but I haven’t personally used them. I don’t know about exporting as SVG from Axure.

#3

I create my icons in Illustrator, and export them as svg images. Then I import them into Axure. I also use Fontello to test the icons to make sure they appear correctly. For instance, saving an icon to svg doesn’t preserve the line width. Also, each object in an icon needs to be converted to a compound path within Illustrator.

#4

Thanks everyone - sorry for delay getting back (xmas. new year and break

#5

Can you elaborate a little please?

I’ve made a simple truck in ilustrator that has 2 objects.

I’ve grouped them and saved as SVG. However in Axure whenever I scale it up or down it distorts ever so slightly but enough to ruin the Truck I’ve made.

I’ve tried making the 2 parts of the truck a compound path too, so the trailer and the cabby, however axure still breaks them when scaling, I thought the whole point of SVG was so I could scale them however big or small with little to no loss