We are finally ready to give you a preview release of the vector graphics package. It provides an SVG importer as well as runtime APIs to build vector graphics elements.
This is phase one of the Vector Graphics package. We want your feedback in order to add the features that are important to you in subsequent phases.
Here’s some additional information:
The SVG importer generates triangulated sprites.
As a consequence, the size of the imported asset is directly related to the number of generated triangles.
We will consider more import options in the future (import to texture, etc.)
The runtime API is in preview phase, and may change at any time.
We’ve also created a video to showcase the features in action. Watch it here:
The “SVGDemo/DemoSVG.unity” scene has some examples of SVG files with features that are supported.
The “RuntimeDemo/RuntimeDemo.unity” scene has some examples of runtime features:
A bezier path tessellated at runtime
A clipping example
An SVG file loaded at runtime
Please let us know about your experience with this package!
What worked as expected?
Did you encounter any bugs?
What important features are you missing?
The SVG importer is integrated with the Sprite Editor, but only the “Physics Outline” is implemented at this time. We do have future plans for animation workflows, but probably not the same “bones/skin weights” approach as the 2D animation tools. We are investigating a way to import an SVG file into multiple sprites that would be connected together with regular transforms. This is still very exploratory, let us know what are your needs.
SVG sprites are currently incompatible with the UI system, unfortunately. We are looking for ways around this!
Our vector structures are all implemented using Vector2, so you won’t be able to express 3D curves. Moreover, all of the vector tessellation and operations are implemented with a 2D mindset, so you couldn’t get very far even if we were using Vector3.
Man, very excited to see this happening. I’ll try to find time to give it a look.
Top of mind features:
Lightning fast perf and scale. To me this isn’t interesting b/c you can zoom into static visuals, but b/c it opens the door to realising full games done entirely in vectors. Flat, minimalist style with modern processing effects.
Works with dynamic lighting.
Works with baked lighting. SpriteRenderer doesn’t seem to today, major pain.
Works with all PostProcessing effects like DepthOfField, Fog, etc, out of box, no need for custom shaders. Again, SpriteRenderer doesn’t out of the box, very frustrating.
Can be used with Unity’s animation system, as sprites would today, meaning you can build a 2d doll (chest > shld > arm > hand). Fancier bone stuff would be great too, but basic parity would go a long way.
In-unity editing, so you can tweak assets imported from say Illustrator.
Round-tripping to standard vector editors would be great. Something as basic as save unity version out to SVG so you can load your edits in something like Illustrator.
This is pretty exciting news! You can get a lot done with vector like graphics in Unity now if you are willing to build your own true type fonts. FontForge with SVG glyphs work well for font building. This works in the UI and in 3D space. TextMeshPro does a great job of handling SDF fonts. All the foreground visuals in my latest 2D Unity game SiNKR are built with TextMeshPro. One downside to this approach is the need for separate glyphs for each color so simple graphics are best.
This is going to be amazing for our 2D games to keep them very low file size and be able to scale onto any screen resolution.
Some things we’re interested in:
• Inspector information for the generated mesh showing how big each generated asset is, this will help us keep an eye on overall file size.
• UI and canvas support (including 9 slicing, or is that already supported?)
• Atlas support, for example using something like Spine to animate, it generates a png atlas. Be fantastic to be able to replace the png atlas with a SVG one.
• A frame animator, say I’m animating a mouth that has 10 shapes. A frame animator component that would allow me to swap SVG asset on the timeline (maybe theres a better way to do that)
I had one problem when I imported my own svg file.
My svg has attributes that explicitly describes stroke-dasharray is none.
like this,
style=“opacity:1;fill:#ededdc;fill-opacity:1;stroke:#000000;stroke-width:7.9380002;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1”
That caused error.
I looked into some code.
I think it should be checked if the value is “none” in SVGParser.cs around line 1303. Thanks.
I hope it works this way, but Im a bit worried that he svg is just imported and saved as a sprite or texture and therefore is actually bigger in data than the source svg
