2015 was a year to remember! From the first shipment of the Apple Watch to the landing of the Mars rover, to the long-awaited release of the next instalment of Star Wars (and the inevitable wave of spoilers that followed), it was an eventful twelve months. But as we head into the New Year, it’s worth our effort and time to look forward, and think about what lies ahead for the web design industry.
In last year’s article about what to expect from web design in 2015, I outlined a list of predictions, many of which I am proud to say have come true (the growing popularity of prototyping and Sketch, “collections as an interaction”, and plenty more.) As I see it, this year is going to give us less change and more growth. Let’s take a look at what is to come in 2016.
More “Live-Now” Design and Growth of IoT
In 2015, we saw the continued rise of “live experience” tools like Periscope and Meerkat. We also witnessed the skyrocketing popularity of Slack. Platforms like Producthunt and Reddit continue to host AMAs and live discussions. All of this suggests one very important thing for 2016: real-time applications and experiences are taking over every aspect of digital products, and that will have a major impact on design at every stage, including web design.
The Internet of Things is going to be a part of this growth of real time media. We’ve seen new, connected products enter the market for almost every sector of business.
Orchestrating the data these devices are creating is a wide open space that spells “opportunity.” A great example of the growth of IoT can be found in the Amazon Echo.
With product ordering a few words away, the Echo and devices like it are ushering in a new way of understanding ubiquitous connectivity between our various services, our physical spaces, and our interactions.
What You Won’t See: IoT DIY Adoption
Look, we agree; the Raspberry Pi Zero at $5 is a pretty awesome thing. In fact, these pocket-sized computers driven by open source are going to be cheaper than ever in 2016, edging on the “free” line.
And, while that will increase adoption rates of these little computing wonders, you won’t see all of your neighbors hooking up a bunch of Arduino-powered gadgets all over their houses.
There are quite a few reasons for this, but perhaps the most important is that the learning curve required for doing anything particularly interesting with a Pi or Arduino or CHiP is still pretty daunting to the average non-developer. Not to mention, they aren’t particularly beautiful to look at without some additional casing work. IoT will be adopted first through user experiences that are approachable by the untrained, with little overhead or learning curve, like the Nest or Philips Hue. As always, DIY will remain a small faction of the population.
Plenty of U.S. Political Design Discussion
The U.S. election of 2016 will be responsible for a lot of politically-driven design material and commentary, both from the official candidates, and from the design community. The last election saw a lot of scrutiny of the design decisions in the race for President of the United States, and we can only expect this level of interest to increase. Barack Obama’s campaign is known for digital predictive intelligence and a powerful web team, and the next Presidential candidates are likely to lean heavily on analytics-driven design to win the race.
We can expect a lot of redesigned logos, campaigning materials, and commentary on the design fodder from both sides of the race on the others’ design decisions. Hilary Clinton’s logo has already received mixed reviews, as has Jeb Bush’s, and the opinions will certainly continue to flow as election day nears.
The reality is, while you may see some slight trend-following updates from both sides of the aisle, the safest bet for the candidates is to stay on tone for their audience. This is particularly true of the Republican candidate, and it’s likely that if we see much innovation or daring design decisions, they will be coming from the more progressive and liberal candidates.
What You Won’t See: Drastically Different Official Design Directions from Candidates
The truth is that the design decisions of these major candidate races are made primarily with data, not with artistic integrity, as the driving design justification. While it will be important for the candidates to stay engaged with digital media in its newest forms in a relevant way, we’re unlikely to see a neon color palette falling outside of the Red White and Blue we are already used to.
This would be too much of a departure from what is expected for these candidates, and may alienate audiences who are not ready for change. Want to see a non-political version of this in action? See Facebook.com.
What You Won’t See: Mass Departure from PHP or Rails
Cinemagraphs Will Become Trendy
If you don’t know what a cinemagraph is, you’re not alone, because they aren’t a fundamentally new type of medium. In fact, a cinemagraph is quite simply an image that is mostly still, except for a small portion (typically only one element) which animates on a loop. If you saw any of the Harry Potter movies, think of their family portraits and newspapers.
The cinemagraph won’t get famous because we suddenly like this kind of animation, but rather because the iPhone and other popular tools are making these easier to create. Fundamentally speaking, a cinemagraph may be accomplished with multiple images, a single GIF, or a video element. It creates a new way of thinking about images; instead of static images and video being our only two ways of representing camera-captured content, we also now have an “in-between”–the cinemagraph.
- Cinemagraphs: How to Create Animated Photographs in Adobe Photoshop
- Video Editing in Adobe Photoshop
What You Won’t See: Drastically Less Video
Cinemegraphs will likely become trendy, but they certainly won’t replace video. As we’ve already mentioned, cinemegraphs are a fundamentally different media representation. Video still provides much more content in the same space. We will likely see cinemegraphs as backdrops for text–where video creates legibility issues, but controlled minimal animation works well.
Related: if you’re interested in creating videos straight from your iPhone, check out Envato Video’s recent iOS app release.
Growing Hype for Virtual Reality
The growth of virtual reality will start with gaming, grow into video, and eventually it will become an important medium to consider for any digital experience. When we think of virtual reality, we often discount the uses of a fully immersed experience.
However, the sliding scale from actual reality to virtual reality passes many important, very powerful milestones along the way, including augmented reality. While Google Glass wasn’t necessarily a show-stopper, we should expect VR to provide us with new ways of experiencing, for example:
- Online classroom learning environments
- Behind-the-scenes explanations for movies, bands, and even more traditional corporate environments
- Closer peer-to-peer connection with our communities
- Product launch events, like Apple Keynotes
While we won’t necessarily see huge widespread adoption of VR this year, we will see growing hype (and a lot of Kickstarter projects) that build momentum for future design iterations that include considerations for products like Google’s Cardboard or the Oculus Rift.
What You Won’t See: Browser Standardization for VR APIs
Browsers won’t standardize VR APIs for a few years, as the adoption rate is significantly lower than necessary for widespread adoption, and browser-level VR won’t be incredibly useful in the next year. Gaming engines, on the other hand, will likely have VR best practices well established by the end of the year.
Animation as a Core Skillset
Animation is already becoming an important part of the front-end developer skill set, but this year will bring more animation than ever. Animation is necessary for the fluid nature of design that we see in most products today; people no longer think in terms of pages, but rather in terms of familiar interfaces and patterns. Because of this, the strength of a pattern is increased when a user receives contextual cues from the interface itself. A very powerful way of communicating a contextual cue is through motion; animation.
The above demo is taken from Adding Appeal to Your Animations on the Web by Donovan Hutchinson.
What You Won’t See: New Animation Abilities for CSS
Overlapping Elements, Saturated Gradients, and Big Shadows
This is a very simple trend: overlapping elements. We have seen big aesthetic design leaders like Spotify adopt this trend, and it seems to be sticking. The ghost-button trend of 2015 will be extended to non-clickable elements, and empty elements with outlines that break otherwise-constraining boxes will show up across designs.
Text will be used in a similar way - we are still likely to see strong bold text over images, but the images themselves and the text itself will see a shift to adopt colorization and much higher levels of saturation.
Along with overlaps, we will see the saturated colors in the form of large, sweeping gradients. These gradients will also come accompanied by very large shadows, not to reintroduce skeuomorphism, but instead simply for aesthetic depth.
The Popularity of SVG Will Continue to Grow
SVG as a format is continuing to grow in popularity. With more tooling and use cases than ever, we will see SVG becoming a much more adopted technology in 2016. This will effectively bring more vector-oriented design, animation, and retina-ready graphical elements into web design than ever before. Another side effect could be lighter sites, as the size of an SVG is much smaller than its equivalent PNG, but this is unlikely as images, videos, and fonts (the culprits of heavy pages) aren’t going anywhere any time soon.
Rich In-Browser Media Editing Tools
Media editing will at some point be based entirely in the cloud. We’ve seen strong support for this theory, and it makes the most sense long-term for our device-agnostic world. But it won’t happen this year. Bandwidth is still too limited for mass adoption by major companies with interest in this space; most users wouldn’t be able to perform the necessary heavy actions across the wire that they can perform on their own machine.
As fiber internet reaches major cities around the world, this concept will be introduced slowly, but the necessary physical infrastructure for this to take place isn’t yet ready, and will take more time than one year can provide.
While this year saw a lot of iteration and chance, 2016 will largely be a year of “more of the same”, with some small changes to design aesthetics. We will see a lot of progress on foundational aspects of our existing toolsets and mindsets, however, that will feed into 2017 and beyond. 2016 is the perfect opportunity to look ahead, adopt new tools, and pursue new knowledge about the tools you already use.