AXURE – Awesome Tool for Prototyping

Hi Folks,

It is almost a year and three months for me to practice as a UI developer. During my practice, I’ve learnt that it is always nice and important to have a brainstorming design session before diving into the coding. Visualization of your thoughts & design through prototyping, mixing with the user experience can reduce your development efforts, pain points of redesigning the components and to get all functional & technical team on single page.

Initially during my practice of developing SAPUI5 applications or SAP Fiori like applications, i started with paper for low fidelity mock ups and the PowerPoint or some open source tool for high fidelity mock ups as i did not know how to use Photoshop. But with the time, i realized that the all the tools which i was using were not robust and the designs were also not good neither in terms of user experience nor interactive and most importantly efforts in terms of time was much to afford in designing.

Even during designing the high level mock ups using the above tools, it was hard to achieve the design near SAP Fiori design patterns which resulting in slight confusion about the icons and layouts. So, i was in search for the tool where i can quickly prepare my wire frames and visualize my design incorporating the user experience design guidelines of SAP Fiori with live interaction, using the similar SAP layouts and controls.

Then, luckily while reading about the SAP Fiori design guidelines, I read about a tool Axure, for which SAP provides the SAP fiori design stencils & Icons font, with the help of which we can design wire frames and mock ups with ease, fully interactive and using exactly same layouts & Icons. And told my manager about the tool who suggested me to go ahead with the trial version. Later on I got the licensed version.

After using the Axure, in wire frame and high fidelity preparation, i realized that why i didn’t come to know about this tool earlier which could have made my job easier. ????

Then while searching about the Axure, i also read a beautiful blog by Kenton Hankins which gave me more clear picture about the prototyping categories and his comments on blog UI5 & Twitter – Designing the Solution which inspired me to use Axure.

So, sharing my experience with Axure so that anyone who is unaware about Axure can know about its awesomeness and advantage.

What is Axure?

Axure is a prototyping tool that you can use to make low and hi fidelity wireframes with dynamic interactions, or to build fast mockups without interactions:

• Masters and widgets/stencils make your work easier and save time.
• Adaptive views help you to visualize interactive mockups for all sizes (desktop, tablet, and smartphone). Interactive prototypes can be tested on all devices.
• No coding is required. Axure is a tool for designers, or for anyone who wants to proof a concept.

Getting started with AXURE :-

Step 1:- Download and install the trial version of AXURE, if being a UI developer, you have not used it till now and wants to get the awsome feel of working with AXURE. Then based on your experiences, if required can push your manager to buy the licenses.

Step 2 :- Download and install the SAP Icon fonts to your windows system by double clicking the SAP-icons.ttf file which is part of OpenUI5 SDK.

Step 3 :- After installing the SAP Icon fonts, Download the Design Stencils to visualize your SAP Fiori Ideas. And open Axure RP Pro to load SAP Fiori Axure design stencils.

Step 4 :- Load the libraries of Design Stencils by locating the folder location where you have extracted the design stencils.

Step 5:- After adding the libraries, you can select the library according to your requirement like Fiori_Stencils_Wave8M (For Mobile), Fiori_Stencils_Wave8S (For Smartphone). And can kick start your prototyping/wireframing by just drag & drop the UI5 controls and icon.

cheers!!! ???? ???? ????

Deepak Sharma