User Guide for iPad development experience

IPad DevelopmentExperienceUser principlesIs the content to be introduced in this article,IPadThe main embodiment of user experience is content and Interaction: deplaying the programUISo that users can pay attention to the required content. Beautiful content and realistic content. Make full use of the performance of the device to enhance the interaction of the content.

Support all orientations

One of the important factors in an excellent iPad program is that it can run in all directions. A large vertical screen can meet the needs of users to browse the content. When the screen is relatively small, the user will rotate the screen to a horizontal screen, so that a row can display more text ). Users do not pay much attention to the minimum device structure minimaldevice frame. When using the iPhone, when the user holds the mobile phone in one hand, the screen is mostly vertical. When using the iPad with both hands, the Display orientation of the screen is not determined) or the location of the home button. They do not think the device has the default location. This causes the user to expect the program to run in the current position. Therefore, the program should meet the operational requirements of iPad in all directions as much as possible.

Ensure that the primary content is the focus. When the orientation of the iPad is rotated, the user will feel out of control over the program if the key content is changed.

How to display auxiliary information or functions during rotation. Although the previous one can be ensured, you must consider how to display secondary information. For example, in the mailbox function, emails are sent when the primary content is sent, and the secondary content is the list of contacts and inbox.

The secondary content of the horizontal screen is displayed in the left-side view.

Secondary content of the portrait screen is displayed in the bubble box.

Another example is horizontal screen. A game is displayed in a rectangle. When it is rotated to the portrait screen, you need to adjust the display area on the screen. The display space is increased either above or below the display border, used to display auxiliary information, rather than vertically stretching the display area to fill the screen.

Avoid excessive layout changes or unexpected changes. When similar UI layout is displayed in all orientations, retain the original format of information and text as much as possible. In particular, when reading text, it is important to avoid having to skip the rotation and the user cannot find any information to read. If you have to re-layout the page, you can use animations to help you understand the changes on the current page. For example, to add or remove a text box when rotating, you can select a hidden action and simply fade out the text box in the new layout. To help properly design the rotation actions, consider how to interact with them in real life.

Avoid usingUIOr define a rotation gesture to complete the rotation. It should be that the content rotates with the iPad.

Provide a start image for each display location. For example, images of 1004X768 and 748x1024 are provided to meet the display requirements of two orientations.

Consider whether the program can run in all directions. Some programs can only be displayed on a horizontal or vertical screen. At this time:

The display program is displayed normally regardless of the orientation of the current iPad. Do not use the UI element to notify the user to rotate the device. Supports 180 degrees of rotation.

You can perform a special input rotation operation. Some games use the rotating device as an operation method. In this case, the Display orientation of the game is not changed when the screen is switched horizontally or vertically.

Enhance interaction

The best iPad app provides a new way of interaction when users perform specific tasks. Do not add some functionality that is not directly associated with the main task to fill up the entire screen, but improve the user experience of the program.

For example, if the reading program allows users to retain the path during reading, it will improve the reading experience. instead of jumping to another page, it will use a bubble box to change the path. The program allows users to add bookmarks and comments in the text to help users exchange bibliography or compare reading progress.

Flattening Information

The iPad's large screen and new UI elements can display more information. When used properly, you can avoid too many jumps when searching for information. Therefore, it also changes the iPhone's single-screen display structure.

Use a column. The two levels of content are displayed at the same time, flattening the information.

Use a bubble box. You can display controls or tools in the top bubble box without switching the screen.

The section control is displayed on the toolbar. The segment control displays the parallel information.

Use the label bar. The label bar displays different types of information or different program modules.

Reduce full-screen Switching

Similar visual elements, and changes content in a region. The general rule is to convert a single view or component without full screen switching to ensure visual stability and help users understand their location.

Enhance collaboration and contact

Users regard the iPad as a private device, but its proper size can enhance real collaboration and sharing.

Realism

The more similar the program display and real life, the easier it is for users to understand how the program operates and enjoys using it. But it doesn't have to be too precise. exaggerated things usually seem more authentic and can deliver more meaning, as an opportunity to communicate with users and express the nature of the program. Use animations to further enhance the sense of realism of the process sequence. In general, the realistic nature of an action is more important than the appearance of a program. actions that do not conform to the laws of physics will confuse users.

Amazing graphics

The high-resolution iPad screen Supports rich, beautiful, and engaging graphics that appeal to users, so you can try to increase the depth and details of the graphics in the program.

Weaken interface controls

Organize the information framework by designing the UI of the program, reduce the number of controls and fade the display effect, and create controls that are consistent with the program style, which is not prominent but easy to discover.

Minimal Modal Dialog Box

The modal dialog box interrupts a user's workflow. You need:

It is necessary to attract user attention. Avoid data loss caused by misoperations.

Rethink list

Lists, that is, table views, are often used to display a large amount of data information on the iPhone. They are also very useful in iPad. However, you can use a richer method to display the same information. For example, the contact method in iPhone is a very efficient column table. The contact information on the iPad looks like a beautiful address book. The iPad list can display more information.

Multi-touch

The large screen supports custom multi-touch. Even if multiple users use the iPad at the same time, remember that they do not need to respond to nonstandard Touch gestures. If there is one, they only need to execute commands in one way.

Bubble box

The bubble box is similar to the modal view. When the bubble box is displayed, the main view cannot be operated. However, the modal view is modal. However, the bubble box can be used in two paths:

Mode. When a bubble box appears, the surrounding interface fades out and a clear operation is required to cancel.

Non-modal. You can also click the Interface Around the bubble box to cancel the bubble box.

If you use a modal view on your iPhone, consider replacing it with a bubble box. The following questions help you determine whether the use of the bubble box is reasonable:

Do I need different types of input? If yes, use a bubble box. The bubble box is more suitable for displaying a selector or list option.

Whether the user needs to pass through the multi-level view. If yes, use a bubble box. The results of the bubble box are suitable for displaying multi-level pages because the main view is slightly changed.

Can tasks be completed only in the master view? If yes, use a non-modal bubble box. The user can click the main view to cancel the bubble box, allowing the user to abort the operation bubble box and return to the main view.

Tasks require deep user input and are a major function of the program? If yes, you may need to use the modal view. Context conversion of the modal view helps you focus on the task. A large modal view allows you to enter a large number of character segments.

On the other hand, this task represents an important part of the program's functions, but the bubble box is a better choice if you do not need to put your attention into it, lightweight vision is more friendly for frequently executed tasks.

Whether a task is executed only once or rarely, just like an installation task. If yes, use the modal view. Users do not mind staying on the current page to complete such tasks.

Limit the complexity of a modal task

Users are happy to complete a subtask in a modal view, because the context conversion is clear and short-lived. However, if the sub-tasks are too complex, you will ignore the director service. When the modal view is displayed in full screen and contains multiple sub-views, this risk will increase. If a modal task must contain a subview, make sure that you are given a separate and hierarchical path to avoid detours. You can exit a modal task in a clear and safe way to anticipate the consequences of this operation.

Dilute File Management

Although the iPad program allows users to create and operate files, this does not mean users should be conscious of the file system. The iPad does not search for files like Mac OS, and users do not have to interact with files on their computers. Users should not consider the file type and location, such:

The File hierarchy is displayed in the open and save dialog box.

File Access permission information.

A file handler encourages users to preview the content. If the iPad program allows users to create and edit documents, it is best to provide a document type selector for users to open an existing document or create a new document. Ideally, the document selector is:

High-degree graphics. Users can easily identify the required documents when they see the visual form of the document.

The user uses the least touch gesture to find the desired content. For example, to open a file, you only need to translate the horizontal scroll bar and tap the document.

Create a new document. When the user does not find the desired document, the selector provides a document creation function instead of searching for this function on other interfaces.

Users are required to save only when necessary.

The user should be sure that their work is saved in real time unless they explicitly cancel or delete it. If the program helps you create and edit documents, you do not need to explicitly execute the Save command. If the main function of the program is not to create content, but to allow users to switch the browsing and editing modes, You can explicitly ask the user to save the modification content. In this case, the "edit" button is provided in the information display view. After a click, the button is changed to "save" and "cancel. The "edit" button indicates that the current interface is in editing mode. The "delete" button allows you to exit the program without saving the modified content.

Move the work bar to the top

Different from the iPhone program, the toolbar of the iPad is on the top, and all functions in the toolbar can be displayed on the wide screen of the iPad.

Start now

You do not have to wait until the iPad starts. When started, the iPad program:

Display the starting image of the program in the current position to reduce the user's sense of waiting and let the user know that the program is still running.

Avoid slow startup in the process. It is acceptable to display the brand information in the launch image, but remember that the user will see this content every time when starting the program. If you need to use the splash screen), it is clear that the display time is not too long and no user interaction is required.

Restores the last running state of the program.

Avoid requiring users to provide startup information. Replaced:

Refer to 80% of user requirements.

Obtain more information from the system. Retrieving information from the system can avoid input.

The user benefits before entering the information. If the input is inevitable, the user must first obtain valid information.

Ready to stop

Like the iPhone, the iPad program presses the "Home" key after the user, so:

Store data as soon as possible and reasonably.

Save every detail of the interface when you exit.

Summary:IPad DevelopmentExperienceUser principlesI hope this article will help you!