People Innovation Excellence

Working with Variables in Axure XP for Prototyping the User Interface

Variables are an Axure RP feature that allows you to create and use variables in a pretty advanced way. Variables will give you an edge when prototyping functions and mathematical computations. Many people are often afraid of approaching this feature, as it sits at the more complicated end of the feature list. Don’t panic! I’ve got some tips to help you get to grips with them and get your Axure prototypes to the next level. Learning how to use variables can be extremely useful. So, let’s get started!18

Types of variables

There are two different types of variable in Axure XP – Local and Global.

  • Local Variables – for use when dealing with information within a single page.

e.g. an e-commerce price total changing if you change the quantity of items.

  • Global Variables – for use when carrying information between pages.

e.g. passing text to the next page to read ‘Thank you, Tom’ after I have entered my name in a form field earlier in the process.

For most prototypes, the global variables are more useful. The prototypes are being able to change the content on the next page dynamically depending on user choices is really handy. For more complex use of variables, in an e-commerce purchasing process for example, you may have to use a combination of Local and Global to achieve the functionality you’re looking for.

Setting up variables

Regardless of which you use, there are 3 basic stages to setting up variables in Axure: Save, Store and Show. If you have a go at setting up variables and they’re not working, I guarantee there will be something wrong with one of these stages.

  1. Save
  • What information are you capturing?
  • Where does it come from?
  • Which action updates the variable?

Example Save stage: Form submit button saves the ‘Name’ field

  1. Store
  • Create your variable and name it.
  • Which variable are you updating?
  • Is it a Local or Global variable?

Example Store stage: ‘NameVariable’ is updated to reflect field data

  1. Show
  • What are you using the variable data for?
  • Which widgets will the data change?
  • When do you need to display the data?

Example Show stage: OnPageLoad, update widget to ‘NameVariable’

The Top Tip:

Make sure you name everything (within reason)! Naming things using easy or sensible words! It makes your life much easier in Axure when you start playing with interactions, conditions, and variables. It’s very difficult to work with 100 widgets all called ‘Shape’.

References

Stewart, T., 2016. Working with variables in Axure. [Online]
Available at: https://www.webcredible.com/blog/may16-working-variables-axure/
[Accessed 3 May 2017].


Published at : Updated
Leave Your Footprint

    Periksa Browser Anda

    Check Your Browser

    Situs ini tidak lagi mendukung penggunaan browser dengan teknologi tertinggal.

    Apabila Anda melihat pesan ini, berarti Anda masih menggunakan browser Internet Explorer seri 8 / 7 / 6 / ...

    Sebagai informasi, browser yang anda gunakan ini tidaklah aman dan tidak dapat menampilkan teknologi CSS terakhir yang dapat membuat sebuah situs tampil lebih baik. Bahkan Microsoft sebagai pembuatnya, telah merekomendasikan agar menggunakan browser yang lebih modern.

    Untuk tampilan yang lebih baik, gunakan salah satu browser berikut. Download dan Install, seluruhnya gratis untuk digunakan.

    We're Moving Forward.

    This Site Is No Longer Supporting Out-of Date Browser.

    If you are viewing this message, it means that you are currently using Internet Explorer 8 / 7 / 6 / below to access this site. FYI, it is unsafe and unable to render the latest CSS improvements. Even Microsoft, its creator, wants you to install more modern browser.

    Best viewed with one of these browser instead. It is totally free.

    1. Google Chrome
    2. Mozilla Firefox
    3. Opera
    4. Internet Explorer 9
    Close