Add Realism To Your @AxureRP iPad Prototype With A Page Loader Animation

While building iPad prototypes using the Axure prototyping tool, you can use a simple technique to make users feel like they are seeing a real iPad app. When a page is displayed, you can deliberately display a page loading animation for a second just to give them the illusion that they are seeing a real app, even though they know very well that it is only a prototype.

It helps the audience visualize the final design of the app, and helps you convey the possibilities. This is how you can do it.

1. Create a dynamic panel by dragging and dropping a Dynamic Panel widget.
1a. Name the Dynamic Panel 'Details'
2. Add a rectangle and a  page loader animation gif  in the 'Details' panel.
3. Add a second state to the dynamic panel.
4. Edit the second state and add the content you want to display to the second state
5. Set state 1 as the default state.

Now you want the animation to display briefly when the page loads. To do this add a case to build the necessary interaction when the page loads

When the page loads the animated gif is displayed. You goal is to wait for a second and then set the state of the panel to state 2, where the content is. You can do this by adding a case to 'OnPageLoad' event under Page Interactions.

You will need an animated gif file for simulating the page loader. You can find one on the web. Search for ‘page loader animation’ and save the file to your desktop.