10. More immersive “multimedia” longform
When we’re looking to publish longform content, it can be tempting to just throw a long text field onto the page and call it a day — especially when our longform content is powered by a CMS, where a single layout does the heavy lifting for content ranging from 200-word blurbs to detailed, short-story-length tutorials.
But some designers and writers are heroically resisting the temptation and returning to the concept of feature stories — combining custom layouts with copy carefully tailored to the presentation to tell riveting, lengthy stories that enrich the narrative with video, sound, charts and graphs, maps, and much more.
To be fair, this is hardly a “new” trend — in fact, I’d call it a keystone of the long-running conversation around web publishing — but with all the tools for web publishing arising right now, ourselves included, it seems like the perfect time for this facet to become even more prominent in 2018.
Take this CNN story on global warming’s impact on Greenland — and the rest of the world.
The story comes as close to literally taking you there as it can. Which is vital for an issue that still seems abstract — unreal even — to far too many. It also smartly turns a complex topic into a series of easily-digestible paragraphs. You never feel overwhelmed by the total volume of content, because it doesn’t call attention to itself. Instead, you find yourself reading every word because it’s just so darn easy and absorbing.
Note that I’m not criticizing CMSs here: in fact, it’s possible to deliver these sorts of experiences via a CMS. It just takes a little ingenuity — all of the visuals from this story can be delivered via background images and videos — and careful attention to consistency across stories, as you’re writing, designing, and developing them. And yes — a content model that differs from your standard “blog posts.”
It’s worth noting that these more diverse approaches to longform can play with either a broken grid, or with a standard column, as seen in the New York Times piece above.
11. Variable fonts!
Looking at the web today, it’s hard to believe that just a few years ago, we were forced to rely on a sparse handful of typefaces to deliver all our textual content.
Today, the web abounds with a massive diversity of gorgeous typefaces, leading to revolutionary levels of interest in typography, typeface design, and good ole conspicuous consumption — of fonts.
And it’s only going to get better with the release of variable fonts. A joint project between the biggest names in tech (and typography) — Apple, Google, Microsoft, and Adobe — the variable font project enables a whole new form of typeface design. Officially an addition to the OpenType format, it:
allows type designers to interpolate a font’s entire glyph set or individual glyphs along up to 64,000 axes of variation (weight, width, etc.), and define specific positions in the design space as named instances (“Bold”, “Condensed”, etc.).
If (like me) that sentence leaves you scratching your head a little, focus on John Hudson’s much more direct version, in which he says that a variable font is:
A single font file that behaves like multiple fonts.
But maybe it’s best, when discussing a visual art like letterform design, to stick with the visual:
That’s variable fonts in a nutshell: a single font file, capable of going from Thin to Black in a jiff. Without calling 16 different fonts in your CSS.
It’s gonna be big.
12. Content hubs — or webooks? — get cool
(To be clear: content has always been cool. 😎)
As a content geek, I’ve been thrilled to see a bunch of beautiful, content-focused websites serving up heaping helpings of helpful, well-written information in 2017. And I’m guessing we’ll see many more in 2018, given all the success 2017’s batch has seen.
It’s also been fascinating to see a lot of leading brands ditch the familiar gated PDF approach to ebook distribution and fully embrace the web’s potential for publishing longform content in what I like to call “webooks.”
What am I referring to? Well:
Stripe Atlas Guides
Our own ebooks site.
Need I go on?
13. CSS grid!
As Robin Rendle so eloquently put it on CSS-Tricks:
Well, CSS Grid is the first real layout system for the web. It's designed for organizing content both into columns and rows and it finally gives developers almost God-like control of the screens before us.
Cue evil laughter.
Note: Webflow will support CSS grid, but no official date on that yet.
14. The quest for the perfect digital design tool
2017 was a big year for in-depth discussion of the nature of design tools and how well-suited they are to our work.
Bryn Jackson of Spectrum advanced his case for:
An intermediary format between design and engineering tools to enable more efficient, capable tooling for product teams generally and designers especially.
In a post called, simply, “Interface.” He goes on to posit that, “Every popular design tool available today is optimized for illustration.”
(Though it should be noted that he categorizes “illustration” as any design work that results in “an image, icon, illustration, typeface, advertisements, print media, or some other visual communication medium without native interactivity,” which is a debatable assertion. Aren’t reading and seeing forms of interaction, after all?)
Concerns over the definitions of illustration and interactivity aside, it’s not hard to see Jackson’s point: at base, most modern design tools fixate on the production of images, not interfaces.
Designer and engineer Adam Michela hit many of the same notes in “I’m a Designer at Facebook, and This Is What’s Missing in Design Tools Today.” There, he argues that most designers spend the vast majority of their time creating artifacts of little to no tangible value because they merely represent the final product — the digital interfaces that quickly diverge from said representations.
He ends the piece on a hopeful note, saying “there is opportunity to create tools that blend (rather than bridge) design and implementation.”
Which is exactly what we’re trying to build here at Webflow. Like Michela, we envision a design deliverable that isn’t a schematic of a website, but is the website itself. Not a documentation of the interface, but the interface itself. Constantly evolving in perfect sync with the site, but continuously generating a timeline of versions that can be reviewed and even restored with the click of a button.
We’re not all the way there yet, but with your help, that’s the direction we’re moving in.
15. Diversity and inclusion as design challenges
Webflow is an equal opportunity employer. We’re dedicated to building a team where diversity in both ideas and identities is not only welcomed, but encouraged.
– Our job listings
Here in the United States, where Webflow is based, an increasingly heated political climate is driving an intense focus on the role of diversity and inclusion in design.
We’re acknowledging that design choices as seemingly small as deciding which options to include in gender dropdowns — or even including gender dropdowns at all — matter deeply to many of our fellow humans. We’re seeing — all over again — how powerful the wording of error messaging and the mechanics of data validation can be in the dynamics of human-computer interactions. We’re realizing that making race a filter in advertising tools can have downright racist effects, and thereby uphold existing power relations many of us would love to see upended.
And we’re realizing that if our teams aren’t diverse and inclusive, our design solutions can’t be either.
Some of us, anyway.
On the other hand, we’re also seeing gender bias rear its ugly head in obviously contradictory and marginalizing ways — turning conversations we usually regard as mostly virtuous, such as providing feedback, into glaring examples of double standards.
Ultimately, as user experience (UX) professionals, it’s our job to provide everyone, regardless of their specifics, with a usable and ideally pleasant experience.
In other words: our job is all about inclusion. Let’s make 2018 the year for all of us to focus on doing our job to the fullest.
16. The “pivot to video” plays on
Despite the fact that approximately none of us are clamoring for video to become the web publishing medium du jour, publishers continue to be amazingly bullish about the switch.
You see it everywhere: from the news sites that practically insist that you watch the video rather than read to the shortform “stories” pushed by first Snapchat, then Instagram, and finally Facebook. Surely Excel will hop on the bandwagon soon!
But like most things in tech, this is hardly a neutral development. Thousands of journalists have lost their jobs in this pivot away from text toward the moving image.
And the outlook may not be so good for sites making the switch either. According to the Columbia Journalism Review:
Publishers who pivoted to video have forfeited the majority of their hard-won native audiences in only a year of churning out undifferentiated, bland chunks of largely aggregated “snackable” video.
Independent journalism is suffering regardless — thanks, Trump — but the move to video hasn’t exactly helped.
One positive note: according to Digiday, “video CPMs are much greater than display CPMs” (CPM being “cost per impression”). In an ideal world, that would mean that newspapers could get away with including fewer ads in their stories.
But of course, that won’t happen.
In the face of all this, it’s worth remembering the strengths of text as both a creative and informational medium:
- It’s relatively quick to produce
- It’s cheap
- It’s still the primary format of most communication on the web
That last point may make you scratch your head. But I’d encourage you to hop over to whatever major social networks and take a scroll. Unless you’re hitting up Instagram, Pinterest, or Snapchat, chances are you’re seeing a whole lot of writing. And even on those visuals-first platforms, text still plays a key supporting role.
Because while a picture may be “worth a thousand words” in capturing a scene, they rarely capture context — the who, what, when, where, why, and how that make images meaningful.
Which leads us rather naturally to our next point:
17. The rise of the UX writer continues
Anyone who influences what the design becomes is the designer. This includes developers, PMs, even corporate legal. All are the designers.
I touched on this a bit in last year’s design trends piece, but today I’d like to focus even more on the rise of the disciple called “UX writing.”
Put simply, a UX writer focuses on the content found within UIs, mostly for larger digital products and web apps. Now, when I’ve explained that I write in-product content for companies like Webflow and, in the past, LinkedIn, people have a remarkable tendency to say “what?”
But rest assured: UIs are packed with written content. And that content often plays a key role in you understanding:
- What you can do within a UI
- How to do those things
- What limitations and complexities you might run into along the way
But UX writing can do much more than that. The words within an interface can also be a powerful tool for shaping perceptions of the brands behind our favorite UIs. Just think of all the tweets you’ve seen highlighting a hilarious line of copy in a web app, or all the 404-page showcases with witty messaging designed to drive action in a suboptimal moment.
This becomes most obvious in the UI format known as the chatbot. Generally speaking, these UIs consist of nothing but words. Words become the UI. The chatbot’s personality — or brand — can only be expressed through language. With maybe a few carefully chosen emoji thrown in for spice.
As an experienced UX writer, I’m so excited to see this key role getting more of the acknowledgement it has long deserved.
We’re designers too. We just work in syllables and letterforms. We can’t wait to work with you.
18. Design. Systematized.
Now that design has earned its “place at the table,” the conversation has shifted away from assertions of value to a more mature analysis of how to make design’s successes more systematic, scalable, and cohesive across a brand’s many outputs and environments.
Design systems focus on translating brand aesthetics and approaches to functionality into modular components that can be mixed and matched to meet (ideally) any UI’s unique needs. When a design language is systemized, it simplifies decision-making, cuts down on development times, and frees up designers to work on higher-profile projects where design patterns haven’t already been established.
And brands are, per usual, right on top of the trend. UXPin launched Systems, a tool for creating and maintaining design systems. Shopify launched Polaris to high praise for its unique merger of content, design, and development guidelines (something I feel pretty passionate about). UX Power Tools launched a library that attempts to make Sketch a viable design systems tool (we’ll see!).
Expect to see much more of this in 2018.
19. Principles-first design
The design world has long been obsessed with one of those chicken-or-the-egg debates: content-first or design-first.
I’ve always been on the content-first side of the argument. And not just because I’m a “content guy.” To me it just seems like pure logic to nail down the message before you decide how to package it.
But lately, as I’ve moved away from designing content strategies for specific deliverables to more systems-oriented work (brand-level content strategies), I’m warming to the idea that our work shouldn’t start with design or content.
It should start with principles.
Everything else — how it looks, how it works, how it sounds — should flow from and depend upon a set of well-defined and precisely articulated principles.
Or as Shopify senior UX lead Amy Thibodeau put it in her beautiful article “Locating Polaris”:
If the system is created to enable real work, it should reflect how an organization makes things and what it values. A design system that doesn’t include anything about principles, or an approach to content, for example, may not prioritize thinking about those things in the practical day-to-day.
Principles provide a framework for all other decision-making, from how long the copy in the hero should be to what image provides the backdrop for the content. After all, brands are founded on principles: a mission, a vision, and a promise. Each of these things requires underlying beliefs to animate them, to make them relevant to others.
In other words: principles provide the why.
For example: at Webflow, our mission is to empower designers, entrepreneurs, and creative professionals to bring their ideas to life on the web. That mission infuses everything we do, from the aesthetic approach Ryan created for us to the voice and tone standards I’ve designed.
And it’s those standards that guide our first drafts, inform our feedback to each other, and that hopefully suffuse every blog post, email, marketing page, etc. So far, it's a great place to start.
What do you think 2018 will hold for digital design?
Every time I put together one of these lists, I’m overwhelmed by how much I could talk about — and how much my constraint of year + 1 forces me to prioritize.
That’s why I’ve left out some obvious forces — like AR and VR, which we mentioned last year — that have to date had limited impact on the web. With that in mind, what would you add to this list?
(Please note that if you include links in your comments, they’ll be flagged as possible spam. So feel free to leave out the links — give us enough to Google it and we should be good to go.)
And, hey: thanks for reading.