The future of web design

Cityscape with illuminated web terms

"The future, always so clear to me, had become like a black highway at night. We were in uncharted territory now, making up history as we went along."

Thus spoke Sarah Connor at the end of Terminator 2. But these prophetic words could just as easily apply to the state of the web industry today.

With new techniques, technologies and movements constantly arriving on the scene, our sense of where things are going is more uncertain than ever. And so we wanted to investigate what the landscape of web design might look like in another 20 years or so.

But don't expect to hear from self-styled 'futurists' and 'thought-leaders' who spend more of their working days giving TED talks and writing Medium posts than actually sitting down and designing.

Instead, we've reached out to some professionals who are doing real-world work, to get a more grounded view of how they think things might progress. Here's what they had to say…

Developer tools will change the game

Pusher homepage

Pusher's developer tools make it easy to build realtime features into your applications

As we move towards the mid-21st century, it's indisputable that web design is going to become increasingly important. As people live more and more of their lives online, digital user experiences will be the rock on which almost every big organisation is built. But there's one slight problem.

"There's a demand for good software but broadly speaking, there aren't enough good developers to build those things," says Craig Frost, designer at Pusher. "And even if there were, infrastructure is something that takes lots and lots of time and attention – time that could be better spent on building features for customers."

But here's the good news: to plug that gap, we're currently seeing an explosion in developer tools.

Pusher's tools, for example, make it easy to build real-time features into applications, so they update automatically without users having to refresh the browser.

"We want to act as a force multiplier, to help end the reinventing of the wheel across the industry," explains Frost. "There's lots of infrastructure and all those types of things that goes into building software, and we want to take that burden away from the product building teams."

Sebastian Witalec, developer advocate for mobility developer relations at Progress, tells a similar story. Its open source framework, NativeScript, enables you to build both desktop and mobile applications on a single codebase. "Once you would have needed five different teams to do that, each with skills that are totally untransferable," he points out. "Now you can leverage the web skills you already have to do it all."

Progress homepage

Progress' open source framework, NativeScript, enables you to build desktop and mobile apps on a single codebase

And the trend for redefining how web systems are created is most obviously (and somewhat) controversially seen in the rise of React and CSS in JavaScript.

"CSS in JavaScript is a big shift in how we design apps," says Haukur Páll Hallvarðsson, an engineer from Pusher. "It's stepping away from the idea that HTML is content, CSS is how it looks and JavaScript is what it does." But he's still fully in favour of it. "Focusing on building reusable components solves a lot of problems," he argues. "I think it's good to change how we do things every now and then, to see if we can improve them."

And the pay-off to all this is that web experiences will become quicker and cheaper to create, adds Frost.

"Building websites used to be slow, expensive, and hard to maintain. And it also meant you had to have a lot of skills, a lot of people. Now we're putting the power back into the product builders' hands. Which means you can spend less time maintaining these applications, more on customer needs. Having conversations with them, building things they need." And how should we discover what users need? Funnily enough, that's something that's changing too…

Data meets design

Fjord homepage

Fjord believes the future of web design lies at the intersection between data and design

The future is going to be all about bringing design and data together, believes Nathan Shetterley from global design and innovation company, Fjord. "I think this will be the underpinning of not just all web design, but all business," he says.

So what exactly does he mean by that? "I'm talking about designing an experience that's helpful to the user and leverages data and analytics to make that personalised and contextualised," he says. "So don't give me an experience that's meant for someone else; don't treat me like a 'between 25 and 40-year-old white male'. Treat me like Nathan Shetterley."

This already happens with ads, he points out. "Google is crawling my Gmail to understand what I'm interested in and providing me with an ad specific to something that I probably have some interest in. But we don't do it very well outside of ads." Yet the technology infrastructure is there, so in his view, it's just a matter of time. And this shift isn't just going to apply to consumer experiences, but employee ones, too.

"How frustrated are you, say, with your internal tools for putting in expenses?" he asks. "Why doesn't the system automatically say: 'Look, I think these are all your expenses, is that true?' And why is that not making your life as an employee that much better? I think that's going to become very pervasive over the next 10 years."

There's a simple way to get on board with this shift in approach, he adds. "Right now, when people start a project they say: 'Okay: design lead, you go over there and do your service design thing. Data lead, you go over there and look at these numbers. And we'll meet back in a couple of weeks and talk. But I think that's a big mistake." Instead, designers and data scientists should be peers in the same team, bashing ideas out together.

"At Fjord, we've found some of the most valuable opportunities for design come when our designers interview a bunch of people and they have these really interesting insights into how they think and feel," he explains. "And then we compare that to a data set."

For instance, they once researched shoppers in a grocery store. "They all said: 'The line is terrible, I can't believe we're waiting so long in line.'" When Fjord analysed the security videos, though, it realised the queuing time was quite short: around 45 seconds. "Yet shoppers were spending an hour and a half in the store, trying to find whatever they were looking for. So we realised it was actually more of a wayfinding issue than a line issue."

In other words, while the human thinks one thing, the data often says something different. "The truth may lie somewhere in the middle and that's where you get some interesting design features," explains Shetterley.

"Apply that to the web, and you find that people tend to remember the last worst experience, yet don't necessarily bring up the small annoyances that go on forever. But you can track those using data, so mixing those two together becomes really valuable."

Conversational interfaces

Sigma homepage

Sigma has been investigating the possibilities of conversational interfaces, and it has some reservations over the practicalities

Understanding how your users think and what they need is going to be key to knowing how to implement new technologies. And that certainly applies to another major cultural shift on the web; towards conversational interfaces. Because the biggest problems here won't be technical ones, they'll be human ones.

UX and design agency Sigma has been investigating the possibilities for some of its larger clients. "And a lot of the challenges we've seen around conversational interfaces align very closely with the challenges around inclusive design: mental models, language, confidence trust, and so on," reveals head of experience, Chris Bush.

His MD, Hilary Stephenson, points out that conversation interfaces fundamentally change the game in a way we haven't really seen before in web design. "It's a big step moving away from a traditional screen-based interface, where people can take their time to navigate around and look at supporting information, policies, terms and conditions," she explains.

"When you've got a screen, you've got something that's giving you cues constantly and keeping you on track, but for conversational interfaces, it's all in your head. That makes exploratory investigation much more difficult for people," she concludes.

That's not to say there isn't a genuine place in the market for them. "For example, consider places where people are using their hands a lot, such as production lines, manufacturing and laboratories," says Bush. "Interfaces that allow people to keep their hands occupied when they're interacting with systems offer clear advantages."

But many dangers are lurking, too: "AI and machine learning have more ground to cover in ethics, privacy and transparency than they have in implementation," comments Stephenson. "The onset of the General Data Protection Regulation (an EU directive that becomes enforceable in May 2018) will encourage privacy for design in the digital community, where we really start to think about what we're asking people.

"And where we do ask people to give data, there should be a very clear policy of usage, on retention, on people's right to withdraw that data. It's quite hard to do that in a conversational interface."

Web animation

CAB Studios homepage

Creative marketing agency, CAB Studios, is fully on board with the new trend for bringing in UI animations

If chatbots take off, copywriting skills may become as important to the industry as visual design skills are right now. And here's another creative skill that's going to be increasingly in demand: animation.

Yes, we once dismissed UI animations as tacky, annoying and obtrusive. But recently they've made a comeback, as a useful way to provide instant feedback when a user takes an action and to guide them through a process.

Why the turnaround? Tommy Mason, web designer at creative marketing agency CAB Studios, credits Google's Material Design and other animation frameworks for raising standards. "Without that, people weren't looking at the small intricacies like the timing, how fast it was coming in, going out, so all these movements that were happening on the screen looked very unnatural," he says.

His colleague, senior developer Mike Burgess, agrees. "UI animation has always been there," he says. "But it's been about finding the balance between making it look sophisticated and making the user know their input has been registered, that they're progressing throughout the site."

Because of the new popularity of UI animation, it is creating a new demand for skilled practitioners, he adds. "You can now specialise in animation on the web, and it's becoming more recognised as an art in itself. We live in a digital world where people scroll through 300ft of content a day, so the more and more we progress in technology, the more this is going to keep escalating."

VR and AR

A-Frame homepage

A-Frame is an open source framework from Mozilla that makes it easy to create web VR experiences

Another skillset that's increasingly in demand by web design studios is 3D. That's most obviously the case when it comes to virtual reality - something Matthew Claypotch, developer advocate at Mozilla, believes is going to be a very big deal. 

"Some developers view VR as a niche or a fad," he says. "But I've given virtual reality demos to children, and they take to it like water. All these kids are going to be brought up in a world where this stuff exists, and we'd be fooling ourselves to think that they won't expect that going forward."

And don't discount augmented reality (AR) either. It may have taken a while, but with the arrival of Apple's ARKit and Google's ARCore, things are progressing fast. Sebastian Witalec of Progress envisages a world in which the web will become part of our day-to-day vision.

"You won't have a screen any more, the web will just be part of what you see through your smart glasses or smart contact lenses," he explains. "So for example, you go to Waterloo train station and, rather than look at all the different screens to find your train, your device already knows where you are going and shows just the relevant times to you."

Jim Bowes, CEO and founder of digital agency Manifesto, wasn't convinced by the possibilities of AR until recently, when he saw a concept for Airbnb homes suggested by interface designer, Isil Uzum. "If you need to explain, for example, how your thermostat works, your renter can pass their phone in front of it and see the relevant information overlaid on the screen. That to me sounds like a genuinely useful application of AR," explains Bowes.

Open or proprietary?

Google Home homepage

Will Google Home beat Amazon Echo in the battle for voice assistants?

All these new technologies hold heaps of promise. But it's important, too, to take a step back and look at the broader picture. Will the open web actually survive over the coming decades?

"We're currently seeing the emergence of a walled garden movement from some of the main players, like Facebook and Google," points out Bowes. And this is proving somewhat of a dilemma for clients. "On the one hand, most of their customer journeys still happen on their own websites. But they want to integrate with things like accelerated mobile pages (AMP), which gives Google the ability to cache everybody's content on their own systems.

"Plus clients are asking: what does it mean if we create a bot entirely in Facebook Messenger? What if we want to break someone out of that environment and make them download this thing, or donate to us, or buy from our shop? These are real big issues we have to face."

But Bowes is among the optimists when it comes to the survival of the open web. "What I love about the internet is that whenever someone makes a move towards a walled garden approach, there's always a bit of an uprising, a punk backlash against it," he believes.

"That's when we'll create the cool new things we don't know about yet." As one of the key players leading that charge, Mozilla has, for example, developed A-Frame, an easy way to create virtual experiences on the web, and right now, it's taking on Amazon Echo and Google Home in the voice assistance space.

Mozilla Common Voice homepage

Mozilla's Common Voice project aims to provide an open source alternative to proprietary voice interfaces

"We want to allow for an open web-based system whereby you can build voice assistants," explains Matthew Claypotch. "So we're building an open commons of voice data called the Common Voice Project, which we're using to train an open and publicly available speech recognition model."

It's this kind of community-led enthusiasm for new, open source developer tools that gives us hope for the future of web design. So count us among the optimists; roll on 2040! 

This article was originally published in issue 300 of net, the magazine for professional web designers and developers – offering the latest new web trends, technologies and techniques. Buy issue 300 here or subscribe to net here.

Related articles: