Advertisement
  1. Web Design
  2. Industry
Webdesign

What to Expect From Web Design in 2016

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. 

The (by now, very familiar) Nest Thermostat

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. 

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. 

Mmm Pi

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.

Continued Importance of JavaScript

This year was, in many ways, a Renaissance year for JavaScript. We saw the adoption of ES6 by many very important projects. We saw the launch of React Native. We are also seeing the number of JavaScript-primary repositories growing on GitHub. Large projects like Microsoft’s newly-open-source Visual Studio have strong support for JavaScript, and very large companies with big budgets and a lot of development resources are betting heavily on the future of the language.

Interesting reading: JavaScript Developer Survey Results

What You Won’t See: Mass Departure from PHP or Rails

While JavaScript may arguably have an even bigger year in 2016, we won’t see a mass departure from tools developers already know and love. Languages like Ruby, Python, and PHP still have strong user bases, and are actively being developed. Instead, we will see adoption of new practices in these languages, and a growth in the number of developers. Will some people change over to a JavaScript-only development environment? Most certainly. Will it be a mass exodus? Most certainly not.

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.

For the actual cinemagraph check out cinemagraphs.com

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.

Further reading:

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.

video.envato.com

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. 

Samsung’s Gear VR

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.

Related: Mozilla Launches A-Frame: VR-capable Websites Starting with One Line of Code

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

While CSS is very powerful, the animation API isn’t slated to change much in the coming year. Instead, tooling around CSS animation will likely be developed to allow more granular control over aspects of animation such as easing. More people will begin relying on CSS-only animation (rather than resorting to JavaScript libraries), and because of the limitations of the API itself, the development community will likely build better tooling to handle complex animations.

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.

Long Shots

A Successful Swift-based JavaScript Transpiler or Web App Framework

Swift is open source! The language Apple released for iOS development to replace Objective C has been officially open sourced. This is likely to spur on many open-source tools, but the language is still primarily going to be used for iOS development. While there will almost certainly be a JavaScript-to-Swift (or, more likely, Swift-to-JavaScript) transpiler at some point, I’m betting that it won’t be released in an official version until at least 2017. Watch out for the alpha and beta versions of these tools this year, though!

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.

A JavaScript-Based WordPress Fork

We can all dream of the day when JavaScript is the driving language behind the web’s most popular platform. But the likelihood of this happening in the next year is low; instead, WordPress will most likely continue to work on the lynchpin that made it so successful to begin with: the 5-minute install based on PHP.

Calypso for WordPress–the admin interface client released at the end of 2015

Conclusion

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.

Advertisement
Advertisement
Looking for something to help kick start your next project?

Envato Market has a range of items for sale to help get you started.