Mobile is no longer a trend but the new standard. In 2014, mobile continued to pave its way to the forefront of the marketing, digital and consumer worlds. Mobile apps have greatly influenced design this past year and will continue to do so in 2015, with Apple and Google in the forefront of the design aesthetics world each time they launch a new OS.
When you look from web to mobile and even at interfaces in video game consoles, you see similar design paradigms throughout: the hamburger menu, ghost buttons, and simple flat icons and colors are all prevalent. Here are some of the most important design developments that will influence mobile apps in 2015:
In their living spec document Google describes the relationship Material Design has set out to achieve compared to other design standards: “Surfaces and edges of the material provide visual cues that are grounded in reality. The use of familiar tactile attributes helps users quickly understand affordances. Yet the flexibility of the material creates new affordances that supercede those in the physical world, without breaking the rules of physics.”
Undoubtedly Material Design will continue to grow in popularity, along with the use of modular layouts, also known as card style. Pinterest.com is a great example of where card style started to really catch on and become more widely recognized in both mobile and web.
More and more websites and apps are offering users subtle, nuanced movement called microinteractions. They’re things like the unexpected wiggle of a pop-up window, or the soft sliding movement from the new panel you just tapped open, or the way a button looks, slides or clicks when you turn something on/off. Microinteractions have surfaced as a technique when developing mobile app interfaces, and even now stemming into some web layouts.
Users are responding to the surprise and delight of these little movements, without even knowing that they have been engaged in a brand or product the whole time. The most infamous microinteraction is AOL’s “You’ve got mail!” from back in the 90s. And Facebook’s “Like” button has become the current-day staple microinteraction that most people identify with, even though they don’t know what to call it.
If the Like button were removed it would be as if part of the overall brand was removed. Further, deleting this microinteraction would grossly decrease user engagement. Things like microinteractions make users want to engage in your mobile app or website. Without them you could be just like any other brand they didn’t choose.
Stemming directly from microinteractions, apps are becoming smarter about how their users interact with them. The focus is shifting from “how can we get all this information onto one screen and entice the user to click everything” to “what is the user going to want to do first”. The focus has gone from simply selling a product to selling the user/customer an entire experience.
The concept of storytelling has become a great solution to those questions. You can see these wonderful narratives being created when you visit websites about businesses or even on blogs. For example the NY Times article Snow Fall does a great job of creating an even more engaging story by either using video or parallax or a combination of both.
In mobile it’s a bit easier to apply the storytelling technique than on the web because the type of interaction is easier to achieve with a touch screen. Swiping a screen closely mimics the action of flipping pages of a book, or being able to navigate a character through a game. Using your finger is just the new way to play video games that would use a hand-held controller. A great example of this is Chipotle’s lauded game, Chipotle Scarecrow, which engaged its user with a spectacular moving video and story of how food is processed.
With the growth of video, parallax, transparency, retina displays and the use of any type of animation in general, designers and developers alike are going to have to keep looking for new ways to optimize image/file sizes. With varying screen sizes (mobile screens are getting larger but support for smaller is still needed, while desktop monitors are going retina or growing to 30+ inches in diameter) and internet bandwidth ranging from 3g to broadband or cable, its going to be a struggle but this may finally lead to SVG file types becoming the go-to solution.
SVG files are not something new, they’ve been around since 1999, and finally both desktop/mobile browsers and native phone apps are starting to actually support the file type. As time goes on, and gaps for screen size continue to increase, we will see other solutions to this problem sprout up.
I’m excited to see the microinteractions, the storytelling and the unexpected innovations on Android and iOS platforms in 2015.