Axure
Still on a mission to find the ultimate protoyping tool…
What’s most important during ideation & validation? (Besides users)
— “Process”
Some tools are great for constant change and some just aren’t.
When I first started this journey in search of the best tools, I only looked to all the “newer” software that’s out there. After awhile, I’ve realised, that all of the new applications are lacking bits and pieces; and will generally require 2–3 other applications to be incorporated into the flow. They cannot stand alone, to cover all areas required.
Today…I am left with 2 choices:
- Either wait after many updates before the software is where I want it to be. While using 2–3 extra applications to complete my workflow. Or
- Rather look at the “dinosaurs”. As they would’ve already solved most of the problems which the new software is still working on. They would most likely have an all-in-one software to cover all milestones in the design process. Axure, being in the industry for over 14 years ...must count for something.
PROBLEM STATEMENT: How might we reduce costs, save time and improve this process of constant change throughout the design process, while all members work remotely?
HYPOTHESES: If each stakeholder/team member is part of a constant conversation, working from one central software/document (& having a centralised process), then direction/goals will always be clearly understood. Having each move in the same direction. Bearing in mind that each have different locations, mindsets, roles and responsibilities within a given project, each using different hardware. If the software used can make the process of feedback simplified and communication clear, then everyone will ultimately always be focused on the same goal, always on the same page. What can be used in teams where members don’t like the constant updates of Slack, or feel that InVision is limited in creating clear direction in Product Management?
Axure
I started looking into Axure, mostly because current team is using it and most are running Windows. So Sketch is out. ( Even though I believe the battle of the prototyping software will be won by either Sketch or Adobe XD ) — Because Adobe always gets it right…I know they’ll be awesome.
Signed up for the trial … first question:
Is it pixels or vectors?
Vector [ ✓ ]
Ok, I might as well give it a chance then, and research further…
First impressions…
It looks similar to Justinmind or Sketch…(perhaps the UI of 7 years ago). So if you’re familiar with Justinmind, this transition shouldn’t be too difficult. I have basic Justinmind knowledge, namely anything to get the job done, that doesn’t involve code. Axure has the same layout as Justinmind — with reference to widget library and tools. Figured they must also have widget libraries to download, which they do:
The default libraries are just common, forms, menus/tables, markup, flow & icons. So you’ll have to first download the libraries you’ll need. (IOS, Android, Bootstrap etc) Only downside, is that almost all the links for these libraries are paid items. Perhaps it’s just like this because I’m testing the 30day trial. Perhaps with a license you are able to download for free. I mean, why would you send me to a link to download a widget library if only redirecting me to another site which requires payment?! At least allow me to filter free vs paid. Don’t waste my time making me click on all the links I like only to find out I now have to take out my card.
Best to just start off with searching for some basic freebies, before buying:
Multiple Artboards?
Umm…nope…No artboards, let alone adding multiple artboards per view. Just windows. All you have is the infinite looking workspace with a guide to let you know that it’s either desktop, tablet or mobile view. This is going to take some getting used to. Think about preview mode in InDesign, or the artboards in Adobe illustrator/ Photoshop. Why ignore this fundamental aspect in perceptual organisation, Figure/ground?
Differentiating the background from the artboard itself helps with the design process. Being able to zoom out and view it in contrast to the background. Balance in layout can be reviewed. Mistakes jump out, and you can quickly amend. It makes sense to be able to work within the confines of an artboard. But then again, only because that’s the way I’ve always worked.
Perhaps a change will be good. After all the worst reason not to do something is,
“why change it, that’s how it’s always been done”.
Even Apple got this right back in the day. I remember working in Photoshop 1.0 (Exhibit A), finding it so easy, because it had an actual canvas. This just makes more sense to me.
But, let’s not judge Axure based on this…perhaps it makes up for this in other ways.
Documentation : Analysis/Annotations/notes
Axure wins this round, as all your documentation can be kept in one central document or linked to various documents. From personas, user flows, wireframes, screenflows, notes, prototype etc.
Alot of the comments in the Axure forum are from 2011 or 2015…So I don’t know how relevant it still is. But according to one of the comments from their support team:
File size
Currently 100MB is the upload limit for AxShare prototypes, so if your prototype is larger than that you’ll need to either reduce the size or break up the prototype into smaller chunks. If the prototype involves linking from one page to another, you could potentially set up one group of pages as a separate AxShare link. You would then swap out your “Open Link to Page…” link to “Open Link to (specify your second AxShare URL without the sitemap)”.
Another possibility is to try reducing your file size either by optimizing your large images (provided it doesn’t remove the animations) or hosting the gifs elsewhere online and linking to them via an inline frame. I haven’t personally tested that last idea yet, but it makes sense.
UXPin must’ve gotten their ideas for documentation from Axure. But UXPin & Justinmind both beat Axure in aesthetics.
Flow diagrams
To create user flow diagram: Click on libraries menu> load library > Flow
Diagram shapes will be accessible once loading flow library, then use connect tool to connect shapes. Each shape is editable when selected to add text. If you have already named your pages, you can also drop the pages into the flow workspace and page will be added as an editable shape. (Justimind does this better— with scenarios)
I’m sorry Axure, but Justinmind still beats you in this round…Their navigation flows/scenarios start with icons which are divided into screens, decisions and actions, it just looks and works better:
You decide…but I’m on Justinminds’ side so far.
Other types of flow diagrams you can create in Axure
Data Flow
Screen flow
Sketch/Photoshop/Illustrator integration
Ok, so if you were hoping for something like the inVision/Sketch integration or Sketch/UXPin…Sorry…Axure RP can’t import Sketch/Photoshop files, but it can import image files: PNG, JPEG, and GIF. Drag or drop into Axure RP from the file explorer, copying and pasting them in, or importing them via the image widget.
Copying and pasting from Illustrator works with the latest versions of Axure & Creative Cloud. Ensure, “Include SVG Code” checkbox is selected in Illustrator’s Clipboard settings.
You can’t edit this pasted svg in Axure. Would be nice if it was editable. (Like pasting from Illustrator to InDesign. ( What if I need to change graphics? Colours? Paths?) — Now I’ll have to keep going back to Illustrator or Sketch to edit and repaste. I mean really… a designer who doesn’t change their minds, who were they making this software for, if not thinking of designers? Maybe it wasn’t built with designers in mind. It must be made for business, because it looks like a slightly “pimped” version of Powerpoint.
It’s not a train smash though, because Axure has a pen tool. That’s all you really need anyways besides the standard shapes and widgets. Might as well keep it simple.
Workflow — Adaptive views
Does it have the equivalent of symbols in Sketch. Unfortunately not. But it does work on a principle similar to InDesign, using a Base design. Think of base as your Master pages in InDesign. ( Or Masters in Powerpoint for the rest of you)…Create masters, for all the items which are common among all the pages. (Whatever you would’ve made a symbol in sketch, you’ll make masters in Axure).
Elements can be created as masters, so if you use masters in various places, you just have to change the master in order to have the changes reflected everywhere.
As far as adaptive views, you’d start with a base design. Then add your portrait phone, tablet and large display views. Phone would inherit from base, tablet inherits from phone, and large display inherits from tablet. In this process, you’ll use the masters you’ve created and drop into your base design view. So if you need to make changes, you just change the master, and the changes will be global. If you want the changes within the layout to be the same on all views, then you’d adjust the base design for all designs to update.
There would still be tweaking on each page to ensure items are proportional in relation to the screen size, as we’re working from smallest to largest screen sizes. Makes process less messy when making changes along the way. At least their process is correct…namely, mobile first then work your way up. (Glad somebody got this right)
This guy explains it better, he’s a bit dry to listen to, and he’s a bit long-winded, but the info he shares is valid. So just be patient when watching…
Style Manager
Click the “Manage Styles” icon, to the right of the Style dropdown in the Style tab, to open the Widget or Page Style Manager dialog.
Click the green “+” icon at the top of the left column to add a new style. Name the style in the left column. Alternatively, you can use the “duplicate” icon at the top of the left column to make a new style from an existing style.
Team project — Styles
Styles in a team project can be edited without checking out the project styles. To update style changes for all users of the project, send changes via the “Team > Send Changes to Team Directory” menu command.
Preview
This would work like Adobe XD on mobile or Mirror in Sketch…or so I thought. Turns out to view on device isn’t the way you’d expect, ideally, you’d just connect phone and preview in real time via USB.
They use Axure Share instead. (Equivalent to InVision on mobile). Just download Axure Share on mobile> Login>Open project>view protoype after publishing.
Interactivity
Looks like it’s only really basic interactivity. Not the same kind of things you can do in Principle. (eg. card-swipe animation). However you can add in gifs, so, whatever you can’t create directly in Axure, you can do in Photoshop>create gif>import in Axure. Will have to play with it more before I comment further. There must be a way to do all the cool stuff in here too, I don’t doubt that.
Create links
Hide/Show images
Mouseover interactions
Button rollover style
Add annotations/notes
Share screens via project link
Tutorials
Core training can be found on their website:
https://www.axure.com/support/training/core/4-interactive-prototyping
Further tutorials for lightbox, account login, image carousels and buttons etc:
Usability Testing
Seeing as we’re just working with axure share links, Lookback would be fine to use with Axure. But it would be nice to have options for integration like Justinmind:
For further info on the awesomeness of Justinmind, check out their blog:
I initially thought that Axure was ideal for prototype to code. But found various articles which disagree:
That’s a bummer…So ultimately, I am still going to stick to Sketch or Illustrator while learning Axure. Most likely will end up with Adobe XD.
For the Axure-beginners out there, (like me), I found this worth reading from Smashing Magazine. Take it as a checklist to starting off correctly:
I have barely touched the surface of Axure, but this post is getting too long. After I’ve played with it a bit more, I’ll summarise findings. On the whole, I can see the potential. But not blown away. (Interface sucks and I just can’t look past it).
-image credits [ screenshots: dashboards/workspace : Axure ]
This article was written with the intention of getting feedback…tell me what makes Axure great? What do you love about it?
Just in case you’re wondering who’s writing this and why?
I am not affiliated with any company (apart from my own). I do not get paid to write. [ Obviously I don’t get paid for this…have you read some of my articles? ;) ] I’m on a mission to sift through the bullsh*t and test products/processes for myself. Because there are no definite answers, only opinions everywhere.
I am not an expert. I have just found hacks to do what I need to do. And always question if there’s a “right” or better way. I’m an “almost” normal “Design.erd” working remotely in search of better processes, people, products…while adding to my principles along the way. [ …insights/comments/suggestions always appreciated ]
These are my opinions, based on curiosity, a desire for knowledge and inspired by my values. It’s not rocket science!
← P R E V I O U S UXPIN: On a mission to find the ultimate prototyping tool
DIY: GV Sprint + Lean Product Playbook (Solo) N E X T →
If you enjoyed this article, don’t be shy… tap the ♥ or follow this publication
