Andy Posted February 13, 2017 Share Posted February 13, 2017 Hi, new guy here. o/ I recently purchased and started using both Photo and Designer after having used Photoshop and Illustrator for many many years, not a heavy user but I know my way around it. Will take a while before I can switch completely, but I like the direction of both Affinity tools. Keep up the good work! First thing I tried with Designer is port some of the assets from AI and use Export Persona for exporting both PNG and SVG. While PNG works fine, SVG not so much. I've searched the forum, but wasn't able to find a concrete answer. Hence this topic. 1. Ability to retain width and height of the artboard as well as the viewbox. Checking off `Set viewbox` option in the export setting does set the height and width attributes, but it also removes the viewbox property, which is not ideal. For example AI handles this through `Responsive` setting in SVG export options; checking it removes width and height, otherwise both are always present. 2. Output SVG contains unwanted (unnecessary perhaps?) clipping elements and references and an empty artboard rect. In the below example only `<path />` is wanted and none of the other stuff. I imagine this is necessary if the slice is smaller than the artboard. But this is exactly what `viewbox` is for — to clip unwanted areas of an SVG. 3. Presentational attributes: `fill="#ebebeb"` instead of `style="fill:#ebebeb;"`. I do believe this was mentioned in one of the topics I found, but there was no clear answer to the issue. Perhaps something similar to AI SVG options where you can select how you want those properties to be exported. 4. Long-shot, but perhaps something similar to SVGO for minification. <svg width="100%" height="100%" viewBox="0 0 200 200" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;"> <rect id="Artboard1" x="0" y="0" width="200" height="200" style="fill:none;" /> <clipPath id="_clip1"> <rect id="Artboard11" x="0" y="0" width="200" height="200" /> </clipPath> <g clip-path="url(#_clip1)"> <path d="..." style="fill:#ebebeb;" /> </g> </svg> JohaWeber and cycloptopus 2 Quote Link to comment Share on other sites More sharing options...
themapsmith Posted March 17, 2017 Share Posted March 17, 2017 I want to second Andy's request to clean up the SVG output. I end up manually editing the SVG code to remove unnecessary elements. That's simple enough for simple drawings, but becomes very cumbersome on complicated ones. My preferred output would be <svg ... > <path ... > <path ... > ... etc </svg> I'm not sure why all the grouping and transforming and clipping is going on. I'd love the ability to remove them. I also second Andy's compliments to the developers. I've been using Designer intermittently for over a year and swear by it. Keep it up! Thanks, ~Stephen JohaWeber 1 Quote Link to comment Share on other sites More sharing options...
Andy Posted March 26, 2017 Author Share Posted March 26, 2017 Perhaps someone from the team can shed some light on the subject? Quote Link to comment Share on other sites More sharing options...
JohaWeber Posted April 4, 2017 Share Posted April 4, 2017 I have the same problems, see https://forum.affinity.serif.com/index.php?/topic/37700-export-persona-adds-unnecessary-clip-path-to-svg/ Integration of SVGO would be awesome and help my workflow a lot! Andy 1 Quote Link to comment Share on other sites More sharing options...
Chrysogonus Posted August 30, 2018 Share Posted August 30, 2018 It would be wonderful if there were an option to post-process SVG export with SVGO. Running an SVG from Affinity Designer through this typically reduces the file size by about a quarter. In the meantime, ImageOptim added support for SVGCleaner in its most recent update. It also has SVGO as an option – but it must be specifically enabled in the preferences, and you need to install Node.js for it to work (which can be done easily with Homebrew). Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.