2015 mobile UI / UX Design Trends


By , October 29th, 2015 , Tags: , 0 Comments

2015 mobile UI / UX Design Trends

Whether in the app interface, web browser or smart watch, the design is driven user participation of the most important driving force. From the flat design to Material design, I analyzed the design trends of development, some conclusions to share with readers, to see what design trends? Why are these trends benefit to users? And how to design products to meet the trend?

1. More lightweight design

1wHLooLtTZTh4b1vZPT2iSA

What

“Flat design” removes excess tilt and shadows, to adopt a more lightweight aesthetic in the app, the interface is more simple, just focus on obtaining core information, put aside all unnecessary design elements.

Why

Lightweight design eliminates the confounding factors, to focus on meaningful content on the screen, allowing users to operate more simple, while the interface is more elegant and modern.

2. The only one font

1-6W8wgRwwCAEdeY7w87UToA

What

Reduce the number of on-screen fonts can truly discover the power layout. Designers do not need to use a variety of fonts, with only one font, accompanied by italic, bold, change the font size and other means, also can distinguish different content areas.

Why

In the app, the mobile terminal and PC terminal site using a single font helps to enhance the brand’s unity, the whole experience optimization platform. In addition, users also prefer a single font brought simplicity.

3. Using blank and card design – no more lines

2015-08-07_17.40.25

What

Before, people would use separate lines and a variety of symbols to distinguish between different regions on the interface, but in fact it seems that way now would be too crowded.Remove the line in the design and presentation content by blank card, it can be to create a more clean interface.

Why

Remove the clear lines and separator can make the interface more stylish and easier attention to function. Pictures and fonts can be more enlarged, the interface is more clear, the product’s ease of use will also increase. Moreover, the use of blank space to distinguish between the different modules is also not as unexpected dash.

4. Stresses digital

1-8wWjJZ6LViCUO4XsiiUT2w

What

Now users tend to be more simple interface, so use a large font size and highlight color to better ensure that the digital center in people’s attention. Depending on the target consumers, it emphasized numbers can vary.

Why

Use a larger font size or color can be more prominent user’s attention to a specific area on the screen, but also do not need to push very loud, do not require the user to operate. The end result is that users faster access to critical information, the entire page of a better browsing experience.

5. The micro-interaction

1-9u_Q6CdhqeeaLvcfnIiUsw

What

Micro interaction refers to the subtle visual effects enhancements (such as animation or sound). Complete user transactions, Add to Favorites, or you can set a small pop-up message when the interaction, will draw attention to the appropriate location, make your product unique.

Why

These micro-interaction can be used as a signal for a user to complete the operation. Better product to use the micro-interaction will be more easy, fun and a sense of user involvement is also stronger.

6. Use cleaner color scheme

1-w3OQf58AIVLEBU8t9nvpVQ

What

Since 2013 began to spread its flat design, the use of more simple color scheme has become a trend. Designers and users tend to use fewer colors to keep the interface clean.

Why

Proper use of color can create a situation, the user’s attention directed to the appropriate location, emphasizing the critical functions, improve the whole process of using the app experience. Also it can enhance the user for the brand recognizable.

7. The layered interface

1-1I8p4EyiQ0Co3zXmCY8mZw

What

Previously, the user interface is materialized, the material selected from the thing itself, such as electronic calendar looks and paper desktop calendar, like the establishment app icon design body also imitate the traditional touch-tone telephone. Now, flat design with tiered approach to the performance of depth and level of things, to create a more “tangible” feeling.

Why

Our real world is 3D, previously people used to the interface is intended to matter, so the risk of making a flat design may occur is “too flat”, causing the user’s suited, and hierarchical design is to solve this methodological issues, put an object on top of another object, make full use of vertical hierarchy to help users sort out the relationship between different objects, to focus on a specific location.

8. virtual buttons

1-h_mVzj6mMWPNlY4KArH05Q

What

Virtual button refers to the button is transparent, no color fill, outline the edges by thin rectangular or square, or rounded corners are right angles. The button text is also minimalist.

Why

These elegantly designed keys can grab the user’s attention, it looks very clean, stylish and not fancy. Button on the same page also can be different design and location to the performance of priority, such as using virtual button to display the options or intermediate steps. In some cases the material design, you can also use subtle shades to help users understand the hierarchy of the button.

9. gesture

1-7rSzeXkTl8EJSTexLWscKA

What

With the popularity of the gyro and motion sensors, users can click on the screen using the device not only, but also in real life some gestures can be applied to the screen.

Why

Many gesture is in line with the user’s intuitive, such as when you need to delete something, regardless of age or gender of the user will think this thing thrown screen. Gestures can significantly enhance the product experience, to help users accomplish more with fewer clicks interaction.

10. The dynamic effects

1KGPf3e1on7KtnT8adpAelA

What

With advances in software technology, designers can now take advantage of style sheets to control the dynamic effect of the screen, such as the transition to display stereoscopic 3D animation and even imitate. Dynamic effects of the use of the design can promote user involvement, and appropriate emphasis on certain elements.

Why

Dynamic effects can be the user’s attention to a specific area, or let them not pay attention to an area. Through visual feedback, it can increase the participation of users, to please users, and even make them feel amazing.

11. The shorter user operating procedures

1-hkvH_hf33gkxKo5JSxUKUA

What

Previously, people could complete a deal to jump several pages, but now in a screen you can complete these steps, saving time and effort. For example, after completing a task the user highlights the need for the next operator or automatically open a new page.

Why

It is now a faster pace of life, often using a mobile phone, so simple and quick operation more popular when walking. According to this line of thinking to design products operating procedures can help users save time and effort, increase conversion rates and improve the user opens the app frequency.

12. The optimal design specifications

1-YA_O646mRbL3ZXzmbTYI4Q

What

Design specification is in the beginning of the project to develop a visual language specification, including standard colors, icons and the overall style and other aspects.

Why

Develop design specifications can be maintained within the application and consistency between the various platform design language, while in the development process to minimize errors, but also more convenient to make changes in the future.

13. The use of the continuous improvement of the prototype

1-g1JVPIONmdk0UCb-kU8Rag

What

Prototypes can provide valuable guidance for the development of design features. Make a correction early in the product design, to avoid the basic shape if modified products, a waste of time and effort.

Why

Through low-cost ‘experiment’, we can test the product for each functional requirements, through iterative improvement products, with less time to develop a better product.






I founded CSS Matter in 2013 with the sole ambition of design, development, creativity and innovation on the Internet, which recognize and promote the best web designers, developers and web users in the world. I'm skilled, talented, creative and very passionate about my work. I like to work closely with people to ensure that each stage of a project goes great every step of the way. I like to ensure that all of my finished projects/work reflect how highly I would like to be perceived. I'm confident that with your ideas and my expertise we can create something that makes us both smile. If you like what I do, and think we could work together then don't hesitate to get in touch with me. Skype IM : cssmatter And Email

Want to write for CSS Matter?

If you're interested in becoming part of the CSS Matter team of authors, please send an email to Manish Salunke. It's best if you already have article ideas in mind – but if you don't, he'll help you find a good topic to cover.



Get Updates On Twitter

Do you want to get real-time updates, interesting web links, site news and announcements via Twitter? Follow CSS Matter on Twitter.



Subscribe to the RSS feed Today

The best way to keep up with CSS Matter articles regularly is by putting the CSS Matter RSS feed into your feed reader.