Top 10 Web and Mobile Design Trends for 2015

By Alex Hsiao, Senior Art Director on Jan. 13, 2015 View Comments

Mobile_App_Design.jpgWant to stay on top of the most popular trends in digital design this year? Check out our list of what's hot.

1. Minimalism

The emergence of Flat Design, which was the biggest design trend in 2014, signifies a cultural shift towards greater comfort with two-dimensional user interfaces. Whereas Flat Design was a revolution from Skeuomorphism, or more lifelike design, Minimalism is now evolving from Flat Design as a major design trend.

Minimalism is not a new design language—it’s been utilized by graphic designers for over half a century—but it’s resurging because it helps strip away any visual noise that doesn’t focus on key user experiences, like calls to action, content, and desired user paths. Minimalism will continue to become even more sophisticated in 2015, as designers recognize that good design doesn’t have to be “Flat.” Don't be afraid to add some dimension, as long as it serves a purpose.

2. Mobile First

It was big in 2014 and it’s only going to get bigger, according to Forrester's Research of World Mobile and Smartphone Adoption Forecast. The number of global smartphone users is expected to reach 3.5 billion by 2019, crossing the 50% mark for smartphone penetration by population in 2017 and reaching 59% by 2019, up from 28% in 2013. As brands look for ways to extend their reach to desired target demographics, mobile app development will continue to be the single fastest growing segment. Thinking mobile app design first allows your brand or product to prioritize the single most important message and experience for your audience.

3. MicroUX

Websites, apps, wearables, and touch screen kiosks all require a user interface design that is intuitive and functional. Consider the details of what you can do with a particular UI element, and then provide the necessary affordance to do so. Not all devices and screens are created equal (size and resolution), so the emergence of MicroUX will be key in 2015.

Keep in mind that MicroUX is not exclusively tied to visible user interfaces. Here are some great non-visible examples of MicroUX:

  • AOL’s "You’ve Got Mail" ping
  • AutoComplete
  • Mobile Pull to Refresh
  • Typing Indicator in Chat
Think not just about creating a great design, but delivering delight and a smile to your customers. Good design is invisible…but great design creates a lasting impression.

4. Visual Narratives

Bridging an emotional connection with your audience is a critical component in delivering a message, and the same goes for good mobile app design. Consider crafting a visual narrative to establish a position and help your audience better understand the purpose of your website/product. Remember, a digital narrative is not limited to just text—you can use the appropriate color to reinforce the tone, large imagery to set the stage, and purposeful MicroUX to strengthen your narrative. Go on…tell a story!

5. UI Animations

Thanks to the proliferation of smart phone adoption, deeper engagement of iOS and Android apps, faster bandwidth, and more powerful CPU, customers are getting smarter and more sophisticated. They’re looking for something that will set your brand apart. UI Animations or transitions help provide a far richer user experience, especially in the world of flat design. This is where designers can really flex their muscles and delight users (similar to MircoUX) in a meaningful way. From Apple’s login error “shake” animation to Android’s pull-to-home effect, UI animation—when in conjunction with good design sensibility—can really set an experience apart.

6. Context & Personalization

In an environment full of data-driven mobile design, context plays a key role in how websites and apps are shaped. The stickiness factor is no longer just having a killer feature—one must consider how and where a user is encountering your brand. As users continue to engage your brand, consider allowing your user to create a persona or identity within your product, feature, app, or website. Personalization can go a long way in forming connections with users so that they keep coming back for more.

7. Typographic Sensibility

 A good design is purposeful, meaningful, and strikes a perfect compositional balance. Knowing when to use the right font has always been a go-to part of the designer’s tool kit. With the recent proliferation of accessible web-kits, bandwidth, and supporting browser technology, the web and mobile environment is getting the upgrade it well deserved. Gone are the days where we’re restricted to pixel headlines and individually rasterized font characters.

8. Rapid Prototyping

Ever wonder how a particular interaction leads to the next? We do. A power point presentation or static screen sequence may help illustrate the high level flow for stakeholders to some degree, but it’s not nearly as effective as creating a prototype.

Using the lean methodology, creating a rapid prototype makes highly interactive experiences comprehendible. How would you go about illustrating that great MicroUX idea you just came up with? Or how one feature is associated with three separate functionalities? A rapid prototype helps quickly vet an idea from the beginning of mobile app development, saving you time in the long run. As noted above, UX and UI are getting richer. If you’re creating an experience that is more than three levels deep, consider creating a prototype.

9. Webfont Iconography

Iconography and fonts on the web are converging. Gone are the days of choosing between Arial or Verdana or cutting icons as graphics in mobile design. Icons are now being used as glyphs in a webfont to ensure high quality output in any screen resolution. This allows for the icon to scale almost infinitely, guaranteeing the optimal composition the design was intended to be. FontAwesome and IcoMoon are a few leaders this trend. And as you’ll read below, there are other big reasons for using webfont iconography beyond just production optimization.

10. From Pixels to Percentages

Retina, HD, 4K, and now 8K? Make way, pixels, and make room for percentages! Pixels were great for fixed images that we wanted displayed exactly as specified, a.k.a. “pixel-perfect.” That worked when an 800 x 600 screen resolution was the norm (circa. 2000), but now, screen resolution and dimensions are fluctuating from device to device. Defining pixels as percentage points is an efficient and scalable way to accommodate for this technological trend and design for various touchpoints.

EXTRA: Color of 2015: Marsala (PMS-18-1438)

Much like the fortified wine that gives Marsala its name, this tasteful hue embodies the satisfying richness of a fulfilling meal, while its grounding red-brown roots emanate a sophisticated, natural earthiness. This hearty, yet stylish tone is universally appealing and translates easily to fashion, beauty, industrial design, home furnishings and interiors. http://www.pantone.com/pages/index.aspx?pg=21163

New Call-to-action

 

Posted in: Mobile