iOS development: Best Practices for interoperable prototypes

Many UX and PM students are still accustomed to using the traditional Axure RP product prototype, the author felt that the Axure RP in the IOS prototype phase still has advantages, such as can be very convenient interactive mode of innovation and detail, do not rigidly adhere to native controls.

First of all roughly in the iOS central presentation has this several requirements:

Must be full screen

Follow the scene online or offline operation prototype

If you import into the App, use the ITunes native method

No escaping.

1. Previous preparatory work

1 fit IOS in Prototype setup (v6.5)

Mobile/device dialog box in Generate prototype

Tick Include Viewport Tag

Upload Home screen icon

Tick Hide Browser nav (when launched form IOS Home screen)

2 fit IOS in Prototype setup (v6.0)

If you're still using v6.0, you'll need to reinvent your prototype HTML file.

In which you append two lines of code to implement the basics of the app Full-screen and home screen icon support

If you use this code intact, please place the Icon.png in the prototype HTML sibling directory

3 The prototype of the page name as far as possible in English, to avoid errors in Chinese coding

4 when accessing the prototype, do not access the index.html, but directly access the specific page

We have summed up 2 practical solutions to meet most of the needs, advantages and disadvantages in the actual work of the comparison:

Web App Way

If you only support online viewing, Axure RP v6.5 native Web App prototype scenario. Of course, the v6.0 prototypes we have manually modified the code also support.

Simply say, because it's already set up.

Only need:

1 Safari Open website

2) Select Add to Main screen

3 on the desktop click on the main screen software can

Need help Click here to view the official instructions, meet special circumstances, such as mobile phone can not access the office network, you can upload the prototype to the virtual host or cloud.

Documents in App Way

If you want to use for customer research or private demo, you can use the Documents in APP's program, this model is convenient for users to study and customer interviews when the network environment thousand change.

Buy Atomic Web Browser software, price only $0.99 (RMB 6.00)

As shown in the following illustration, modify the settings of the Atomic Full-screen mode to avoid interference with the prototype.

Compress the prototype into a zip file and upload the zipped document into the Atomic in ITunes.

Unzip extract documents in Atomic and access HTML files on the main page

Enter Full-screen mode

At this point, you can implement a prototype demo on your iOS device (three fingers slide down to exit Full-screen mode)

Hopefully the above two approaches will help students who are bothered by how to implement interactive prototypes on the iOS platform.