Best practices for interoperable prototypes in IOS

Source: Internet
Author: User
Keywords Can practice interact with prototypes if Full-screen

"Editor's note" reproduced in this article from Baidu Ued, the author is @yoyicue. Friendship hint, this classmate "hide" very deep.

It is easy to find a variety of iOS component libraries on the Internet to implement controls, so this article does not include how to implement the same interaction with iOS. But solving a puzzle, how to gracefully present prototypes on IOS devices?

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 according to the scene online or offline operation prototype if imported into APP, use iTunes native way without jailbreak 1. Previous preparation 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 icon.png in the prototype HTML sibling directory

<meta name= "apple-mobile-web-app-capable" content= "yes"/><link "rel=" Apple-touch-icon "href=" />

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 programs to meet most of the needs, advantages and disadvantages 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 Click on the main screen software on the desktop

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.

Original link: Best practices for interactive prototyping in IOS

 

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.