New trends in mobile application design

Many excellent designs emerged in the 2011, with the updating of the operating system and the improvement of hardware performance, the user's demand for mobile applications is also rising, and the interface design is promoted to a new height. Mobile application is no longer to move content from the Internet to mobile devices, but to solve the problem of the equipment itself, according to user needs from the visual feelings, style trends, operating methods, information architecture and content rendering in various aspects of mining design possibilities, to bring users a new experience.

This article summarizes the hot products this year's interface design, from which the next year will need to focus on the design trend for your reference.

Trend One: Minimalist application icon

From the dynamic design of the famous foreign products in the App Store, the icon design of the startup software is approaching the minimalist design.

Minimalist style design, visual representation of the elements of simplicity, can enable users to quickly memory application products. LBS product Gowalla, at the beginning of 2010 the application of the icon as shown below the left effect, the application icon presented as a complex kangaroo shape and go letter combination, performance element modelling complex; After more than 1 years of product upgrade iteration, at this time the Gowalla icon is already the right effect map, Typical minimalist application icon, simple and beautiful.

The application icon design of the path software as shown in the following figure, from the original three-dimensional design evolved into a minimalist, relatively flat micro-gradient design style. Minimalist application icon design, background color unification, highlighting the brand "P", visually convey to the user a full sense of quality.

also such as shortlisted 2011 Best product Tools category Baidu Search, the application of the icon design also tends to minimalist design style. From the original relative image of the graphic representation to the minimalist design style, from the visual transmission point of view, improve the application of the overall sense of the icon and the sense of quality.

Trend II: Adaptation to diverse resolution

Looking back over the past few years, from the initial phase of smartphone development 240x320 resolution of mobile phones, to the current mainstream 480x800 resolution of mobile phones, mobile phone resolution has diversified and to high-precision development, the current Galaxy Nexus resolution even reached 1280x 720, so screen adaptability is one of the important metrics of operating system.

Android3.0 After the important improvement is to enhance the suitability of the graphic graphics to facilitate horizontal stretching, the resolution is increased, the top can be merged into a column of two columns, mobile phones and tablets can use the same program, so the application will be more considering the high resolution display effect.

Imagine that when we design an application interface, we need to take care of a variety of resolution mobile phone users, is not a very easy thing to grasp. Pay close attention to the mobile hardware market, understand the usage of mobile phone users with diverse hardware resolution, and analyze the methods of designing diverse resolution interfaces, which is one of the trends that we designers need to pay attention to and study in the 2012.

Trend three: Flat visual style

Since WP7 uses Metro style, the WINDOWS8 interface will push this emerging design style into the mainstream, with the Metro feature simple and intuitive, with no overly flashy background and exquisite feature icons.

In addition to Windows 8 design, X box360 and other products are also used in this design style, interface style design also presents a flat, lattice wind design trends, simple and gorgeous design to bring users a new visual experience, strengthen the unified Metro brand sense. The following figure:

In addition, the Android 4.0 system's visual design style is also the overall trend of flat, lattice wind trends. The visual design of the Android 4.0 system gives up the original design style, and the whole is evolving toward the plane, lattice wind design direction. Although not as strong as Metro design, this is enough to reflect the influence of Metro style. As shown in the following illustration:

Flatness, lattice wind is popular, and is affecting the many mobile applications of visual design, but the future mobile applications will not strictly comply with official standards, on this basis will derive more innovative design, enrich this design style.

Trend four: More and more rich dynamic effect

Dynamic design is closely related to interactive vision, and it is a kind of interactive behavior of user feedback effects. Excellent dynamic design, can increase user interaction affinity and fun, improve the product user experience. Dynamic performance will be more and more platform software applications, smart phone hardware upgrades, to the dynamic experience design brings the opportunity to display, to the SOFTWARE PRODUCT user experience upgrades provide a greater space.

As pictured above is a map of the South Korean naver of the software, it uses amplification contraction of the dynamic effect. Users click on the map, the map itself to enlarge, and then into the Street View interface, users close Street View, the use of contraction of the dynamic restore to the map interface. The dynamic design of this detail gives the user a cool feeling while enhancing the consistency of the changes between the interfaces.

The dynamic design of the lower-left corner of the path above is the representative design of the 2011. This software has many uses to use the dynamic effect, uses just right, has won the good user reputation for the product, has added the massive user for the product in the short time class.

In addition, the PC side of the dynamic effect has been widely used in metro design, see the Apple Computer cool dynamic experience design can win the user's Lai. The dynamic design enriches the interaction, complements the vision, and the appropriate application of the dynamic effect can improve the user experience of the product.

Trend five: The opening interface of the film

A good opening is half the success, more and more applications will use dynamic panoramic photos as their opening interface, or using high-fidelity images as the first screen of the application of wallpaper. This gorgeous visual effect, for the application of a good first impression, so that applications become more vivid and fascinating.

Flipboard is a gorgeous reading product, the first launch of the ipad version, has launched the iphone version, it allows you on the phone can also have a general reading experience of the magazine. Flipboard on the iphone version, launched the cover story feature, will be hot news and pictures, directly on the cover of the show. Users can also customize what appears on the cover story, but you can also close it.

After the iphone Flickr client starts, it is a series of high-precision pictures of the dynamic carousel, allowing you to experience the colorful visual impact.

Chinese photography magazine Photomagazine opening, it is like a carefully crafted shearing animation, a number of lenses appear in turn on the screen, a picture of beautiful photos foil The bright portrait and scenery, so that photographic magazine's literary atmosphere. The movie starts the interface, may enhance the user to the product favorably, but also must consider the multiple picture size, and the animation effect loading efficiency question.

Trend Six: Reasonable user guidance

Because of the limited capacity of the mobile interface, the continuous expansion of product function, it is necessary to inform the user of some novel functions after opening the application, guide him to complete some of the main task flow, so that users are not lost in the unfamiliar application. To help users quickly master the use of applications, experience the fun of the application, the novice led into a must consider the design link.

Tweebot will be at the start of the program, with a few pages to tell you the advanced use of the application techniques, some hidden features can make you more convenient to perform the operation, such as double click to see the details, long by the call out operation, slide to the right to view the history of dialogue, long by the tab bar can customize the label content.

Foursquare and Gowalla will remind you that you can perform an action at the right time. A button to move the position, quickly to add friends, start to sign in and share pictures with friends. This kind of tips in the form of telling users to focus on the state of the system, guide users can continue to go where, can start a good help users familiar with the role of the application.

The direct goal of user guidance is to help users better use products, the ultimate goal is to enhance customer satisfaction. Although, in most cases, we can use reasonable design, as much as possible to simplify the function, so that users without guidance and help, you can complete the necessary tasks. But in fact, the limitations of mobile phone products and the pursuit of powerful features, leading to this goal is difficult to achieve, so more and more applications began to use user guidance to help users quickly familiar with the product.

Trend Seven: Highlights key Features

Product positioning and core functions determine the layout of the main interface, for different information architecture products, the main interface will be very different, but how to make products from similar products in the same interface to stand out? The answer is: focus.

For mobile applications that have "open and use" design strategies, multiple and full functional points and complex application structures do not apply. Clicks from the main screen more than three times to operate the function is very low probability, ordinary users will not be willing to use the deep interface is hidden function

Similarly, there are data indicating that highlighting the visual features of a feature in the interface will increase the user's chances of using the feature; For mobile applications with features such as "leveraging Fragmentation Time" and "small display area", allowing users to choose from multiple feature buttons can also be a factor in influencing the user experience.

Therefore, be sure to identify the core features of the product and highlight it in the main interface.

Integram is a vertical social network with pictures as the media, and for this product, pictures are just the form of a carrier, and the core value is to share established friendships. So in the main interface of the product, the style of the "Share" button is differentiated from other labels, highlighting the core features.

In the application of photography and sign-ins, the main function is highlighted in the tab bar, and the usage of main function is also an important index to measure product interaction.

Another factor that affects visual design is the emphasis on design and the usage of a single feature.

In the UGC mode of photography and check-in applications, from the user to get content is the difficulty in the design, and "Photo" is the use of a higher function, so in the label bar visual design highlight the "photo function."

Trend VIII: Hidden sidebar Menu

Some mobile applications because of the long development time, has become a bit "bloated", the default five tab bar has not met the architecture needs. Like pad sidebar More and more of the current mobile phone interface design, help reduce the level of interface, make full use of display space, or make directory-type data easy to operate in the lower resolution interface.

Facebook&path

If you return to the previous level to jump the page, will greatly increase the user to find information difficult, the use of sidebar can make the application of the architecture clearer.

Sidebar can ensure the stability of the visual, if the interface and the operation does not conflict, you can rely on the left and right to pull the side of the sidebar, suggesting operational efficiency. The sidebar can also place action buttons, but it may cause the interface to look crowded, and more sidebar styles and applications require the designer to keep trying.

Sidebar is also a new way of mobile phone interface architecture, to accommodate more functions, but also to ensure that the interface level of clear relationship.

Trend Nine: Revolutionary voice interaction

The device hardware provides the technical basis for replacing other terminal products and realizing novel functions, and the interaction between user and device is not only limited by touch screen, voice and shooting played a great role in mobile applications in the 2011, and promoted the popular products such as micro-letters and Instagram.

Siri is hailed as a revolutionary product, whether it is exaggerated or not, it successfully introduced voice interaction into mobile devices, more intelligent than voice commands, giving it a humane character. Speech can be used to manipulate the interface, initiate search and input content, but the whole process is like talking to people, to a certain extent, reduce the cost of learning, while making the application rich emotional.

Baidu Mobile Browser Android pioneered the introduction of voice search, the purpose is to liberate both hands, to provide a more natural way of operation. Voice interaction is more difficult to design than simple touch, in addition to solving the most basic identification problems, it also requires interaction to solve the problem of recognition rate and noisy use environment.

Language chat may be the most popular feature this year, audio allows users to communicate more conveniently, on the basis of which can be derived from a richer voice interaction, such as voice expression, Internet telephony and video telephony and so on.

Voice input is the basic application of speech recognition, technology is basically mature, 2012 is expected to be widely implemented in the mobile phone input method for the user's input method to bring convenience.

New interactive technology will inevitably have a variety of defects, the need for interactive design to play their own design advantages, the full use of the advantages of technology, as far as possible to avoid the technical immaturity caused by experience problems, a certain procedure is to promote the development of technology.

Trend Ten: Gesture manipulation in evolution

With N9 as the representative, the slide gesture replaces the home key and goes into multitasking, feature list, or application, and can be manipulated using sliding gestures. The slide operation will appear very frequently in the touch screen operation, in the design of the use of sliding gestures to replace the Click has many advantages, such as the avoidance of clicks caused by misoperation, improve operating efficiency, hidden controls and save display space, and so on, Baidu Mobile input method of original sliding input is also a representative case of early gesture operation.

N9 Mobile Phone

Banning keystrokes is an inevitable trend for future mobile phones, and sliding gestures can play a bigger role.

The iphone version Flipboard up and turns the page, but the effect is too strong and visually incoherent, but it is also an attempt to design a sliding gesture in mobile applications. The sliding gesture can be used not only to manipulate the jumps between the peer interfaces, but also to act as a way to enter the upper and subordinate interfaces.

Baidu Mobile Browser WP7 version of the original single refers to the slide toolbar can scale pages, arbitrary control of the proportion of the page, there will be more in the future gestures used in the common interface. or the browser uses two fingers to slide the new interface or go to other multiple tabs, define the sliding gesture as a quick operation, and improve the operation efficiency for the advanced user. At the same time, it is helpful to guide the user to learn the special gesture operation, which can help to improve the user's use viscosity.

Conclusion

The research design trend is to grasp the latest design information and cutting-edge research direction, from the many design awareness of the law and can be flexibly applied to their own design, and even lead the design trend, which is an essential element of innovative design.

"2012 Mobile application Ten Design Trend report Download"

Reprint please specify from "Baidu Mux"