Steve Jobs once said, “Design is not just what it looks like and feels like. Design is how it works,” meaning that when designing user experiences, you shouldn’t just be considering how intuitive the experience is in theory, as much as how efficacious the underlying product is in practice.
It used to be the case that web design was only concerned with a few screen sizes and a primary method of interaction—point and click via mouse. Now users need to be reached on and across a variety of different devices and platforms—and the experience needs to remain cohesive, the message consistent, as the context of interaction varies across formats, devices, and modes of interaction.
Patterns of Design Philosophy
So when it comes to user experience design, it’s useful to think in terms of patterns of design elements. One form of design pattern is the “long scroll” (check out the product pages on Apple’s website). The long scroll works by rendering page elements as one continuous experience that progressively reveals more information as the user scrolls downward. This design pattern works well for brands seeking to tell a story and aiming for the narrative of such to run in tandem with the user’s engagement.
Creative use of parallax scrolling, animation, and graphics can create an experience that’s as informative as it is compelling. And as mobile web browsing continues to establish itself as the dominant format, the long scroll holds a strong advantage over competing design patterns for its inherent compatibility with such. However one disadvantage worth mentioning is that the long scroll presents difficulties for users seeking to navigate between “pages” (although a floating navigation menu can usually solve this problem).
Another popular design pattern is the “hamburger menu.” Most sites with a hamburger menu will encapsulate close to the entirety of the site map within a “hamburger” element (that square stack of three horizontal lines) floating somewhere on the page—usually the top right corner—ready to be clicked and expose a navigation menu for the site.
The advent of smaller screened devices has made the hamburger menu a popular solution to the problem of minimal screen real estate; however, this pattern has recently drawn criticism from designers and users alike for its lack of what’s known as “information scent” as it reduces the layout of a site to a hidden bundle of page elements that are out of sight and out of mind as soon as the user navigates away from any given one of them. Without an intuitive feel for the site map, users won’t experience a given site as much as they’ll need to think their way through it. Nevertheless, this UI pattern solved a lot of design problems in the early stages of UX for the web and thus makes for a familiar means of engaging users.
Ease of use and navigation are also important considerations for the design of a website or digital product. And most recently, a rising trend in the philosophy of design is the notion of “design language.” Design Language as defined by Wikipedia is an overarching scheme or style that guides the design of a complement of products or architectural settings. Think of a design language of a given site as influencing all of its UI elements, icons, logos, graphics, fonts and anything else that contributes to its visual identity.
Very popular in UX design these days is what’s known as a ‘flat design’ language, characterized by a minimalistic aesthetic and emphasis on usability. Microsoft began using flat design in it’s Windows 8 desktop OS in 2010 and Apple adopted it beginning with its iOS 7 mobile OS and started using it with OS X Yosemite. Solid colors and simple, cartoony graphics are hallmarks of flat design, counterposing the gradients and hyper-realistic graphics of skeumorphic design language of years passed.
A more recent example of a company evolving its product design from skeumorphic to a flat design is the photo sharing app Instagram. The previous design for the logo was a skeumorphic camera icon, and the UI elements within the app had different colors and competed for attention with the photos, text, and other elements within the interface. The UI of the app has evolved to be simpler, underpinned by a white background with black UI elements that draw way less attention from photos shared via the product.
The beauty of flat design is hinged on the notion of simplicity—a concept that drives the user’s experience of products toward their core value propositions (in the case of Instagram and related social products: Sharing compelling visual content/rich media). Solid colors and uncomplicated graphics make it much easier for these kinds of products to this type of value proposition across different screen sizes and resolutions. So while flat design only rose to prominence about five years ago, its emergent relationship with UX-driven digital product development would seem to suggest that this design language will be around for a while.
Designing What’s Next
To sum up this brief overview of current trends in digital product design, note that the way information is consumed is constantly changing. A few years ago people couldn’t have imagined the web browsing experience on a mobile device would be as rich as it is today. Since then the long scroll and hamburger menu have become staples in design that seem to have established themselves as fixtures for at least the medium term. And while flat design language has made the visual presentation of sitemaps flexible and appealing to the modern eye, with the unpredictability of innovation in the digital product space—as well as the capricious nature of consumer behavior—only future generations of users can dictate the next compelling experiences.