10 Great user Experience design guidelines for ipad apps

Source: Internet
Author: User

Like many good products, the success of the ipad app depends on a number of factors, such as the core value of the product and the user experience model. In addition to games, most types of applications must be able to help users solve specific problems in a certain context. It should be simple enough to make it easy for users to get started without having to do complex setup and learning.

But the product in the visual appearance, the interaction way, the emotion connection and so on aspect's performance also directly affects the user to the application experience satisfaction. In this article, we will work together to understand some of the guidelines that you need to carefully consider and implement in your design work. We won't be able to explain the complete design process for creating an ipad app, or spend time on small method tips in almost any of the details mentioned in the mobile app design article. The main purpose of this article is to help you make more rational and correct product design decisions in your actual ipad application.

1. Aiming at core requirements and simplifying product functions

An excellent ipad app usually allows the user to complete one or more very specific mission objectives in the simplest way possible. You need to have a targeted selection and rejection of functional patterns at the conceptual stage of the product. Try to use a goal-oriented approach to judging the value of functionality in the product: In terms of the direction and conceptual model of your product, imagine what the user will be using in a typical demand use case, documenting any conceivable requirements and mission objectives. Next, brainstorm with your team to get a comprehensive list of features that users might be able to use to accomplish these tasks. Then, in this list of features, you distill a set of the most streamlined features that ensure that you achieve your requirements. Finally, you can add some features to this minimized feature blueprint that will help improve the user experience of your product.

Take a look at some examples. Epicurious This recipe app is fairly well-focused on the intensive aspects of core functionality-no complicated interface and operation, and the user can learn to actually work and enjoy the culinary delights. Especially in the horizontal screen state, the left side is a very clear raw material configuration list, and the right side of the main content area is a detailed cooking operation process. The user can also easily record the next step of the current cooking process with a draggable anchor tag. In addition, the comments and technical tips about the current recipe are integrated into the tab view below, which ensures that the interface is simple and clear, and allows users to easily view the content when needed.

Whole Foods is also a type of cooking aid, and if you want to try some recipes, it can help you make the ingredients you need to be a shopping list. Unfortunately, this app ignores the problem of having the same ingredients in different recipes, so that the resulting shopping list tends to create duplicates on some items. We can see in the following, banana Mulberry has appeared three times:

In addition, do not use the button-type visual interaction everywhere, in many cases, the operation of control behavior can be completed by hand gestures. For example, the memo that comes with iOS does not have a regular edit mode entry, the user can enter the editing state by tapping the interface, and the content will be saved automatically, so the user does not need to perform related actions. iOS native selection, cut, copy, paste and other editing functions only need simple basic gestures to complete. The undo operation is relatively special and requires shaking the fuselage; remember to hold on.

2. Create a more intelligent and personalized product experience

No one likes to spend money to buy back an app must also be complex before it can be used properly. To make the best use of the ipad and related Web services, the technical capabilities of the user in the context of the various aspects of the characteristics of a more subtle and accurate understanding and analysis. Consider whether it is possible to use the user's geo-location information, calendar, Weibo feed, Gmail account subscriptions or contacts, etc., so that your application can provide users with more intelligent, more personalized content and functions.

Zite is a stunning content-reading app that reads information about users ' content in Google Reader, Twitter, and delicious accounts, analyzes their personal preferences, and, based on this, recommends articles from other content sources to users. I tried to authorize my delicious account in this app, and within five seconds it completed an analysis of the articles I had collected and generated a fully personalized magazine based on my interests, allowing me to read more new articles of interest to me. Such apps are similar to services like Pandora, and the more you use them, the more they know about you, and the more personalized the content output will be. Although many people think that Flipboard UI design and related interactive experiences are more attractive than zite, Zite can still take advantage of intelligence and personalization.

3. Note the context in which the product is applied

Consider what typical scenarios your users will use, based on the core needs your product is facing. The common uses of the ipad include restaurants, airports, driving directions, or kitchens, bedrooms, and study rooms in the home. Is it necessary to consider the impact of using scenario factors on existing design patterns as you plan your product's functionality and experience patterns? For example, in the case of recipes, there may be a big difference in the need for a user's use in the kitchen when used in the bedroom.

OpenTable mainly provides services for ordering meals. On its web side, the display of restaurant search results is a very traditional list of information. The product concept of its ipad client application reflects the high degree of relevance between the mobile application context and the functional requirements. The user interface in its default view consists mainly of a list of maps and restaurants, and users can search directly for restaurants near their current location. Compared to the web-side product model, these features in the ipad app are more in line with the actual needs of users when using mobile devices to complete related tasks.

Awesome Note is also a good example. The default classification that it provides is an accurate reflection of the common environment and demand use cases for people using the ipad. Groceryiq is a shopping list type of application, it is an important feature is to allow users to follow different stores to summarize and filter their own needs to buy goods, very well in line with the actual shopping needs of people in the mental model.

4. Consider multi-user and multi-device scenarios

It is common for family members to use the same ipad to accomplish their own needs, and the scenes that the whole family sits around together for common use. Unlike mobile phones or personal computers, the ipad has a relatively weak personal color, which is more like a magazine on a coffee table and has a strong share. In many types of ipad apps, account management features are essential, including the most basic account switching, as well as account tips for the current login status. For some content class apps with multiple device versions, an important part of account management is keeping content synchronized between devices like ipad and iphone.

For example, Flipboard allows multiple users to log in through different accounts and displays the name of the current login in the home page. FedEx's ipad app, although the overall style of the interface is very gloomy, but the login account information can still be clearly identified. ebay's clients are slightly less than that, and users must click on "My ebay" at the top left to view current account information.

5. Create a reasonable interaction model

You can try a variety of complex and dazzling interactions in games or other entertainment-type products, but for other types of applications that are often used, the navigation structure, browsing patterns, and the corresponding forms of visual interaction are kept as simple as possible. While innovation in interactive mode is an important factor in driving the success of an application, it must not adversely affect the usability of the product itself in the pursuit of a differentiated experience.

Martha Stewart Living Magazine's browsing style is a great way to combine creativity with usability. The x-axis scrolling operation is used to view different article pages, while the scroll screen on the y-axis is used for browsing in an article. The content profile for the current article page appears above the page queue, and the user does not need to go into a single article to get an overview of the content. The scroll bar at the bottom of the queue can clearly reflect the position of the page in the book where the current focus is pointing. These seemingly simple and straightforward ways of doing things can provide users with an easy-to-use, well-perceived interaction experience.

Many people will dock their left thumb near the upper-left corner of the screen when the ipad is flat, and the zite design makes it easy to close the current article. In addition, users can click anywhere outside the article container on the screen to close the article interface. This scheme is highly resilient, and users who are accustomed to using ipad in other poses can operate effortlessly. The New York Times ipad app allows users to close the article with two-finger kneading, and the toolbar at the bottom of the article contains a button that can be returned to the home page, and the toolbar is automatically hidden after a few seconds after the article's interface remains open. The pinch is more liberal than the close button and does not require the user to operate on an interactive element, but its drawbacks are obvious: the user may need to temporarily change the position and posture of his hands to ensure that one hand can perform gestures freely.

When trying and experiencing a variety of applications, pay attention to the details of your experience, especially those that make you feel great, or the interactions that make you feel uncomfortable and even interfere with the flow of the operation. Find applications that are in the same field as your products, analyze their functionality and experience patterns, and consider how to differentiate in their own products. In many ways, the ipad application still has a certain frontier, the application market will continue to emerge a variety of new and dazzling features and interactive ways, in this case, more need to use a pragmatic mentality to plan their products user experience design, avoid blind unconventional.

6. Provide home view

People are accustomed to the concept of home page. The home view can often help users navigate through the features of the product and provide them with quick access to common operations. The home page can provide users with a sense of security, so they don't have to worry about losing their way in the app when exploring features and browsing content.

Let's take a look at the visualization Explorer from NASA, which has no home view mode, and the user opens it and is brought directly into the latest piece of content. To browse through other articles, you can click the arrows on the left and right of the article to view them in order, or click the icon in the lower left corner to bring up the list of articles and select them. The degree of freedom to view through the article list is higher than the first, but is still limited by the size of the container, and each article entry in the list can contain only a small thumbnail and a short article title, and the user cannot directly get an introduction to the article itself.

In contrast, the pulse experience is a lot better. Its home view is a content navigation in which users can view the latest articles in different content sources directly in a list, and each content entry includes a large thumbnail, article title, and introductory content (depending on the article itself), and the user can clearly determine what they are interested in. In the horizontal screen state, when the user selects an article, the entire Homepage navigation screen will move to the left, the complete article content will expand from the right side. This is a very coherent interaction experience, and users do not feel that the index and content are in two unrelated interfaces. While the vertical screen, the navigation structure will be collapsed in a single article to the bottom of the interface, although this approach is similar to NASA's approach, but pulse can always let users through a larger and clearer list of article entries to view the article in the queue overview.

7. Use the Popup effect with caution

In the ipad, the pop-up effect that helps users access the content and navigation structure is awesome. However, if used poorly, this interaction pattern can also cause trouble in the operational process. In a design scenario, be sure to limit the height and width of the pop-up layer, and try to avoid putting too much information in it. Once again we take awesome note as an example, but this time the angle is relatively negative. Although we mentioned earlier, its default folder classification is in line with the needs of users, but to do the relevant editing of these folders, but need to be in a pop-up layer. The folder is rendered in a way that is almost identical to the main interface, only slightly different in size, and for such an important collection of objects, if repeated in the same visual representation in the same interface, the user is largely confused. And for the visual style of the folder and related editing operations, such a pop-up layer seems a bit small.

In fact, from the point of view of container size and space utilization, we have seen the same problem with the NASA Article List pop-up layer. In some cases, it is more reasonable to open a new interface separately than a pop-up layer. Unless the relevant actions in the pop-up layer have context dependencies that are hard to block with the content in the current interface, they can all be put into a new interface-more usable space, more rational layout, easier reading and manipulation, and why not.

8. Avoid the use of unnecessary splash screen

In the traditional web domain, many sites use flash or other technology-based "splash screen", they are mostly meaningless, and it takes a lot of time to load, users can easily lose patience and turn away. Meaningless splash screens can be even more frustrating for apps running on mobile devices such as the ipad. If your app needs to load a lot of content when it starts up, and you decide to show a splash screen during that time, so that users are less aware of the wait behavior, at least don't let it stay too long.

It is best to display some of the content that has already been loaded in the splash screen, so that users can maintain a relatively coherent sense of interaction even during the wait process. Zite is still very good at this, it will display some of the loaded article thumbnails in the splash screen to attract the user's attention, while more content is still loading.

9. Correct and reasonable use of gesture operation

Cool and practical gesture manipulation is an important interaction in the ipad, but be sure to use it in the right place at a reasonable density in the product. For example, if the main interaction object in the current interface is a list view that needs to be triggered by sweeping gestures to trigger a scrolling carousel, then no other global sweep gesture should be bound for that interface.

If you need gestures to trigger interactive behavior that is difficult for users to easily gain insight, it is best to give hints in a conspicuous place. Zite is doing just as well in this area, and in the Content Category List view, the tip in the lower right corner makes it easy for the user to see that the next step is to flip through a swipe.

DISCOVR is a music exploration type of application that integrates the cue information of gesture manipulation directly into the interactive object, which is the red circle labeled "Tap Me".

When enough information is available, the text in the red circle changes to "tap and hold Me", prompting the user to complete the next operation by long pressing. This guidance allows users to quickly and directly grasp the critical operations without leaving the current interactive process.

10. Make the touch-friendly interface elements easy to identify and touch

Jakob Nielsen's "read-and-touch" issue, which was noted in the ipad usability report, is quite common in ipad applications. (This is the third time that Nielsen has appeared in our articles.) Two previous topics related to early prototype design and user testing and mobile User experience design

The so-called "reading-touch is not equal", that is, the text size in the interface can ensure clear and easy to read, but for touch operations still appear too small, the user in many times it is difficult to accurately touch, or do not know where to touch operation. The following ad interface from Martha Stewart Living, in which a list of headings with an arrow icon in the middle is actually clickable, but it's really hard for the user to notice because the arrow is not a common icon to represent clickable actions, and it's also on the left. In your design, it is important to be able to touch the interactive elements are clearly marked out, it is best to be eye-catching and beautiful, so that users do not have to find and think to understand their role.

The picture area above the Cool hunting interface is actually a set of pictures that can be swept, but it's really hard to see this. In fact, you might want to show a small part of the next picture on the right, letting the user know that this is a set of images that can be browsed continuously.

In addition, iOS itself in this aspect also has the bad place, we must resolutely spit the trough. As you know, double-clicking the Home button will bring up the multi-task bar from below the current interface, but there is also a set of control panels for music playback on the left side of it, and by default, the switch to lock the screen rotation is here. It's so hidden. There are wood, why not provide some visual hints?

10 Great user Experience design guidelines for ipad apps

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.