Using a Sketch file in Axure

rp-7
newbie-question

#39

@popweb,

Thanks! It looks like Jane is handling the bugs I reported here. If i find any additional ones, I’ll certainly post them in the thread you linked to. Appreciate your support for my product suggestions. I hope that if enough of us speak up that the Axure product managers will finally recognize the importance of 2-way Sketch integration and spec mode and make some moves in the right direction. This is definitely a critical need!


#40

Hi guys,

I was able to reproduce this bug where the SVG loses its dashed border after converting the Sketch SVG into a custom shape in RP 8, and I’ve gotten it filed with our QA team.

As for the issue with the corner radius, I talked to our dev team about this and it turns out this is actually by design. When converting the SVG into a custom shape, that SVG is now a vector shape in RP. You’ll see the same thing when using the Pen tool to create a custom shape or converting a Box widget into a custom shape in Axure RP where its rounded corner attributes will not be available to edit. So while images/rectangles can have rounded corners, custom shapes cannot. Nonetheless, I’ll be happy to pass this along to our product team about the ability to round corners on custom shapes.

Hope this helps!


#41

Hi Jane

I suspected as much. While I get that by design that is the easiest dev way to bring in SVG as custom shapes - it would be great if for simple shapes such as Rectangles, that there is a way to map attributes to control points and make a “smart” Axure shape like a rectangle with editable attributes like corner radius (much like photoshop’s live shapes vs regular shapes).

Obviously converting random complex shapes might be cumbersome, but since we are often dealing with textbox-style shapes, keeping the editability of shapes when you can - so you can tweak properties in Axure - would be ideal where possible.

This also begs the bigger question of how to map groups to Axure elements besides Axure custom shapes, since Axure has more “smarts” in its elements than Sketch (or SVG) does. So some thought is required in the design for this.

I gave it some thought, and wondered if the default way to bring shapes in, should be the way it currently works - bringing them in as several custom shapes. But perhaps, if you give a Sketch Layer or GROUP a specific name, then the Paste could be smart enough to translate that specially named group of items into 1 kind of Axure element.

For example, let’s say you have a Sketch group consisting of a rounded rectangle with a text field placed inside it - if the group were named, “AxureTextbox - something” then when you pull in that group, those 2 Sketch shapes could be combined to an Axure rectangle named “something” containing that text with the corner radius properties set appropriately. Or if it was named “AxureInputbox - something” then Axure would attempt to combine both 2 layers into an input box and try to style it (where it could).

Does that make sense? This would make it a conscious decision to pull in items and have them map to appropriate Axure elements. Naming Sketch items in the form of:
“Axure<elementtype> - <youritemname>”
would make it so it would be incredibly unlikely to do this unless you intended to. But if you did not name it special like this then it would continue to work as you’ve already implemented it - as custom shapes in Axure.

Please float that by your dev team and see what they think… :slight_smile:

thanks!


#42

Hi popweb,

Thanks for the very thorough and comprehensive feedback! I brought up everything you’ve shared directly in a meeting with our product manager and dev team, and we agree that this would be a good solution to the current issue of enabling editable attributes for custom shapes in RP. While this is unlikely to be implemented anytime soon, we’ll definitely be keeping this in mind as we continue to evaluate integrating Sketch files with Axure RP.

If you have any other questions or concerns, please do let us know. TY!


#43

I’m a huge Axure fan and love it and promote it whenever I can. But I have to be honest. As a UX Design freelancer I’ve worked with a lot of companies and I’m finding Sketch/Invision being used far more than Axure. This is because of the ease of use. It’s true that Axure can do far more. But when I sell designs, concepts to clients I don’t need those deep interactions. It’s sort of like the difference between MS Word and Google Docs. Sure Word is far more capable than Google Docs. But 90% of the people use only use 30% of it’s capabilities and therefore MS Word is loosing ground to Google Docs. This is similar to Axure. If I need to do some serious UX testing these Axure is an obvious choice. But it’s difficult to convince another designer that they should use Axure when Sketch/Invision does 90% of what they need.

So please figure out how to integrate well with Sketch. It would be an easy sell to say lets use Sketch/Axure vs Sketch/Invision.


#44

Sketch plugin please! Justinmind have realized a plugin for Sketch. You can export artboards, layers and pages you’ve made in Sketch to Justinmind and turn them into interactive shareable prototypes.


#45

Justinmind Sketch by Justinmind. You can export artboards, layers and pages you’ve made in Sketch to Justinmind and turn them into interactive shareable prototypes.


#46

Admin - Please have a look at the below screenshots. SVG import and conversion doesnt seem to work as expected.

Would make designers job much easier if we can have a sketch plugin.



#47

Thanks for posting this - more help getting things fixed.

All these are specific bugs I’ve posted and are in theory being worked on. I’ve noted all the font issues and masking issues in another thread that Axure said they were working on. It’s been a while and not a lot of fixes though - so the more voices that complain, maybe they’ll speed up the release candidates :slight_smile:


#48

Hi Praveen!

We’ll continue to look into this. In the meantime, would you also be able to send us the files that you’re working on? If you’re able to provide the Sketch file and/or the exported SVGs, please let me know. Feel free to attach a .zip of those files here; also feel free to email us directly at support@axure.com with the files attached.

As @popweb mentions, some of these do sound similar to the ones reported in their thread. I’ll be updating our existing reports that match; testing your files will be a great way to make sure that we cover all bases, too. Thanks!


#49

Hello guys,
I am wondering why do you go this path of converting SVGs to get access to the Sketch data.
With version 43 sketch changed their file format. It is now a .zip with .json files and image data.

http://sketchplugins.com/d/87-new-file-format-in-sketch-43

I think that this made importing sketch files way easier than before.
Dear Axure team, are you actively looking into this?

Because there you have all the assets and all the detailed information in plain text.

Cheers
l.


#50

Thanks Lennart. We’ve seen that and we’re interested in the opportunities there. SVG gives you access to a lot of published resources and vector data from a variety of tools. We thought that SVG support would be a good addition regardless of tool-specific implementations. Proprietary formats have been more of a moving target, but as you said, would give us direct access to the data which could be really nice.

Importing SVGs from Sketch can only be successful, though, if Sketch exports the features to the SVG itself. As of currently, when Sketch exports to SVG, they don’t export the the capitalisation (for certain versions), and they don’t export the superscript for text.


#51

I pasted the SVG and converted to objects easily by selecting all of the groups in a Sketch artboard. This works fine. BUT as others have mentioned… the fact that I can’t import an artboard to Axure is a deal breaker for workflow.

I would also need to sync my artboard in sketch to Axure so that any updates in the sketch file will auto reflect in axure.

I realize that it is a huge task to create that in axure as a developer, but I think invision is promising that in Motion when they bring that out and then all other prototype apps will be obsolete.
Axure has leverage features such as variables etc that trump invision, however, without sketch integration as everyone has mentioned Axure will be toast when Motion is released.

Dear Axure,

Imagine (or better yet, use modern design studios as users for testing, researching and interviewing) that you are in an agency and you have a mobile product that you building, lets say it is an app for sharing garage space as storage. The AirBnB of garage storage. You need to have your UI and or UX designers wireframe in Sketch (because of it’s amazing symbols, plugins, file structures, artboards and integration with Abstract for versioning - all the things a designer NEEDS.)

Then you need to test those wireframes with stakeholders, users etc and measure and analyze the results. You then need to iterate quickly on those wireframes due to a common pattern in user testing that made it apparent that a button is not being tapped that should be so you need to move it to a more contextual position on the app. You need the wires updated on the fly because more users are coming in for testing and you want to test the new position of that button. (not what I would actually do as a ux designer but you get the idea).

I need sketch to talk to axure to update all artboards that I changed that button symbol on. now I need the interactions on that button to remain intact also. I need the prototype wireframe to mirror my droid and ios device for testing without the need for the user to download an additional app if possible.

…etc you see where I am heading?

you NEED to analyze how actual ui and ux designers work in big agencies in order to understand what features to put on your road map. By spending a year or 2 on an svg to object feature has been unfortunately an extremely small and costly win for you when concentrating on a bigger feature like a sketch plugin would have been better.

you need to employ some veteran developers and visionaries from leading app companies to come and help you. I’m going out on a limb here to say that axure is stuck in the dark ages probably because it started off as an enterprise app and I bet you anything that your management and C levels are completely unaware of what designers need in order to work in product/service design in 2017.


#52

When pasting an SVG-image into Axure from Sketch, the fonts are rendered totally different, which makes the use of Sketch-files useless. Someone?


#53

Did you select “Convert to SVG” after you paste. Here’s a quick screencast showing how it works for me.


#54

Checking back almost a year later and happy to see some progress! But please take it the rest of the way and make it easy for us to work with Sketch files. The rise of Sketch over the last few years as many have noted makes it a deal breaker if this can’t be made easy to bring in an artboard full of svg’s. I am tired of adjusting or recreating Sketch svg’s. Please make it work so I can go back to evangelizing about about how much better Axure is.


#55

When I paste the SVG code into Axure, the layers are screwed. The text-elements are on top of all layers. Does someone have the same issue? Is there a solution for this?



#56

Hi AbacUX,

Thanks for reporting this and sending over that screenshot–I was able to reproduce the behavior you’re seeing on my end. It looks like this was working as expected in build 8.0.0.3338 but not in the current build 8.1.3355. I’ll go ahead and submit a bug report for this issue and our QA team will be able to investigate it further.

In the meantime, please let us know if you have any questions or if there’s anything else we can assist you with!


#57

Well said. Axure needs to evolve or risk becoming less adopted


#58

Hi all!

For those following this thread topic, check out the Sketch plugin we made for bringing assets into Axure RP 8 (build 3368 or higher):