Civil: a design story

tl;dr: As a personal side project I had a go at Civil’s brand (circa spring 2018). Apologies all around and caveat emptor.

A story worth telling
I’m a fan of Civil. I came across them in a Twitter ad (IKR? Who notices Twitter ads?) and was intrigued by their plan to apply the blockchain to journalism.

The jist of Civil is to use tokens to fund newsrooms and the immutable ledger to record facts. Tokens get rid of ad models (and bad actors who can’t afford to mine), and the ledger establishes “truth” in the community. It’s an ideal marriage.

But it’s also a tricky story to tell. On one side you have journalists who are just trying to grok the tech—let alone put their faith in crypto. On the other is the crypto community who are in such demand they can easily overlook what Civil offers. Where do you point the story? What do you emphasize? And, for me at least, how can design help?

registry-visitor-accepted
© Civil Media Company

I was thinking about this as I studied Civil and the familiar communication issues they face at this early stage. Like all startups, their story and visual choices could be smoothed out and made more consistent. But their immediate challenge consists of:

• establishing character
• building trust
• paying homage to their roots

I think Civil can simplify and humanize their story and, in the process, establish a tone that is reassuring to the writers and engineers they need to build their community.

And, since I was rooting around for a design side project, I decided to make this challenge my challenge.

I started with their name.

Establishing character

“Civil” is most commonly used to denote politeness. But the root and weight of the word belongs to the citizens of a society and their interrelations. Civil is a word about community.

The founders likely chose Civil for just this reason. It’s the perfect word to invoke the spirit of collaboration among the journalists, developers, and readers they hope to cultivate and unite. For that, I think it’s a great choice.

I’m less bullish on the choice of Century Gothic for their wordmark. To be fair, it’s a perfectly reasonable choice: even the word Oatmeal looks classy set in Century Gothic. But it looks classy in a way that a few men in rented tuxes look classy: generically.

Sexy Oatmeal.jpg

Mind you, the company Civil keeps doesn’t often distinguish itself either. Much of it is Sans. Often uppercase. Mostly black. And to that extent, slipping your name into standard formalwear isn’t a terrible strategy. Civil is busy rethinking journalism. On the blockchain. With limited runway. Century Gothic will do just fine, thank you very much. They’ve got an ICO to launch.

You can have any font you want so long as it's black sans.jpg

Except.

Except that journalism is undeniably about character as much as it is about credibility. In many ways, journalistic credibility is the byproduct of a distinct, telegraphic character. And in the same way that a journalist or publication must build on their character to earn the trust of their readers, so too with Civil.

For me, that distinct character started by switching away from the cordial uppercase of Century Gothic to the casual lowercase of ITC Century. Not a dramatic change (certainly in name), but one designed to step out of the ballroom and into the newsroom. In the newsroom—and the open source community for that matter—the tone is friendlier. Less pretentious. Often workaday.

Civil upper to lower.jpg

In moving to a lowercase serif I also stumbled onto a small visual gift. Civil has two “i”s, which when set in lowercase begin to resemble stout little characters—feet firmly rooted, heads bobbing up above their collars, arms outstretched. And when you flip the first “i” to face right rather than left…magic happens. You still have a word that reads “Civil,” but the slight shift causes you to notice that there are two people turned towards each other, arms outstretched, with the “v” forming a table around which they’ve gathered.

Civil .jpg

You have not only civility, but community.

Building trust

If establishing character is the first act of Civil, then building trust is the second.

While every startup has to build trust with its stakeholders, Civil has the additional burden of building on a volatile stack that is misunderstood, filled with scams, and legitimately in its infancy and still figuring itself out.

This drama injects more doubt into the viability of Civil than if they operated outside of the blockchain. Will I see a return if I invest? Will the platform work if I build on it? Will I have a job in a year if I accept the offer? Trust, I suspect, is in the “threats” column of their SWOT slide.

How do you (quickly) build trust?

From a design context, you pair a convincing story with the right visual cues. You make something appear, as Jony Ive might say, “inevitable.”

Broadly, this means organizing—and editorializing—your story, presentation, imagery, colour, and typography into a compelling narrative. Giving it a POV. Assigning it a voice.

For Civil, this means:
• Highlighting the co-founders forceful storytelling
• Using classic aesthetics to ground Civil and pay homage to the community it serves
• Choosing powerful imagery to heighten the emotional impact of the story

In short, treat Civil like the great publications it hopes to create or save.

1. Let’s start with storytelling.

Right now, it’s all over the place—figuratively and literally.

Civil story_1.jpg

Civil story_2.jpg

Parsing bits of your elevator pitch among several divs/sections of a site isn’t uncommon: after all—who has time to read anymore? But in Civil’s case it’s a bit counterintuitive to their mission and audience. These are journalists and engineers who read 2400-word policy essays in the Times or Wait But Why mega-posts on Tesla. They’ll take the time to read if you take the time to explain things.

What’s slightly maddening is that Civil does a great job of explaining themselves—on Medium. Here’s an example of them explaining what they are:

We’re a marketplace for journalism: writing it, reading it, reacting to it and supporting it. We aim to reignite a more direct connection between readers (or “Citizens,” as they’re known on Civil) and journalists (“Newsmakers”), while taking advertisers, publishers and other third-parties out of the equation. We’re not a news publication: we‘re a blockchain-based platform on which journalists can independently found and run Newsrooms focused on local, policy and investigative journalism.

We believe that the ad-driven business model is slowly killing good journalism — which is itself a critical foundation for free, democratic societies. So, we’re introducing a new model.

Or this, on “why crypto?”

Civil’s cryptoeconomic model seeks to enable a more direct, transparent relationship between journalists and citizens, while using blockchain to also strengthen protections for journalists against censorship and intellectual property violations. The goal of Civil is to create a sustainable, global marketplace for journalism that is free from manipulative ads, misinformation and outside influence. Civil will differ from current media companies, both platforms and publishers, where a centralized operator controls the distribution of content to the public. By improving transparency and autonomy through a decentralized approach, Civil aims to strengthen trust between citizens and traditional news reporting, creating a renewed appreciation for the value of financially supporting journalism directly.

So, first order of business: organize and edit the best writing to explain what Civil is and why it matters—and place it front and centre.

What should the centre look like? That’s next.

2. The presentation layer.

If we aim to treat Civil like the great publications it hopes to create or save, then some care has to be taken in a) the space it reserves for stories and b) how it uses imagery (particularly photos) and elements like colour and information design to both frame the story and signal various journalistic cues.

Here are some bits to consider:

Civil_Presentation Layer 1.jpg

Civil_Presentation Layer 2.jpg

Civil_Presentation Layer 3.jpg

 

Looking at these elements, I began to build on these ideas:
• A story-driven layout with a dense information grid to immediately explain what Civil is, why it matters, and how it works
• Marquee photojournalism to dramatize the urgency of the story (and put photos on the same level as text), and general colour photography to add a bit of life to the setting
• A slightly meatier typeface (Libre Baskerville) than the current choice (Spectral) to emphasize the workaday newsroom feel and improve readability
• The use of red, rather than blue, as the spot colour. It’s better for signalling, and—along with black and white—is part of the classic printer’s triumvirate, which is a nice nod to heritage while also looking mighty fine

Here’s where I landed.

 

Civil_Website_Desktop_Home.jpg

 

Not all pages need marquee photos. Here’s a detail page without one…

 

Civil_Website_Desktop_About.jpg

 

Here’s how it holds up on mobile:

 

Mobile.jpg

These elements (story, photojournalism, typeface, colour), along with the voice and character established earlier, compound as they’re extended to other purposes.

General imagery

Voice 1
Photo © Zach Gibson / Getty Images
Voice 2
Photo © Evelyn Hockstein / Guardian
Voice 3
Photo © Evelyn Hockstein / Guardian

 

Presentations

Presentation 1.jpg

Presentation 2.jpg

 

Documents

Civil constitution.jpg

 

Advertising

Inalterable journalism .jpg

 

And some fun…

Inquiry
“Inquiry”
Curiosity
“Curiosity”
Solidarity
“Solidarity”

There’s more to do, of course. (Least of which is admit this is all just opinion and conjecture.) The ideas need to expand across formats and mediums. Photos require licensing or excessive begging to acquire. A general massage applied to smooth out the rough edges and integrate elements into the Civil CMS. Etc. But it’s a foundation on which to build.

Every startup is a story. But beyond the initial hook there needs be some deeper meaning—something for the audience to read into and project their hopes and values. For Civil, this requires them to clarify their story while making it more urgent. It means connecting the past to the future, while juggling an unpredictable present. Done right, it’s an opportunity to re-establish the authority, dignity, and civility of news.

SaveSave