Rachel McClung / Senior Visual Designer, Workiva

TYPETRIALS

The purpose of typography in user interface design is

The purpose of typography in user interface design is to communicate.

Newer isn’t always better.

Print Screen Web

A

Garamond / Claude Garamond, 16th c.

Bodoni / Giambattista Bodoni, 18th c.

Century / Linn Boyd Benton & Morris Fuller Benton, 1894

Gill Sans / Eric Gill, 1926

Futura / Paul Renner, 1927

Univers / Adrian Frutiger, 1957

Helvetica / Max Miedinger & Eduard Hoffmann, 1957

Good type endures.

Print Screen Web

Chicago / Susan Kare, 1984

Refit and repurpose what works.

MS Sans Serif / Microsoft, 1990

Georgia / Matthew Carter, 1993

Georgia is a serif font designed specifically for

low resolution screens.

VERDANAsans-serif.is a modern classic

Simplicity has universal appeal.

Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt

Uu Vv Ww Xx Yy Zz1234567890

Arial / Robin Nicholas & Patricia Saunders, 1982

R 1a GR 1a G

Arial

Helvetica

Ideas beget other ideas.

Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt

Uu Vv Ww Xx Yy Zz1234567890

Tahoma / Matthew Carter, 1994

Lucida Grande / Charles Bigelow & Kris Holmes, 2000

Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss

Tt Uu Vv Ww Xx Yy Zz1234567890

Type reflects the tech and trends of its day.

monospace

for codesuitable

Consolas / Lucas de Groot, 2005

Cambria / Jelle Bosma, 2004

serifscalable

LEGIBLE

Corbel / Jeremy Tankard, 2005

sans-serif

typehumanist

Calibri / Lucas de Groot, 2004

rounded

condensedOFFICE DEFAULT

Consider more than a single use case.

Segoe UI / Steve Matteson, 2004

Type can unify platforms and experiences.

Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss

Tt Uu Vv Ww Xx Yy Zz1234567890

Helvetica Neue / updated 1983

Light

Regular

Don’t lose sight of legibility.

San Francisco / Apple, 2015

Evolve with your product.

Print Screen Web

ArialCourier New

GeorgiaImpact

Times New Roman

Trebuchet MS

Verdana

Arial and images

Arial and images

Verdana, Arial, and Times New Roman

Verdana and Times New Roman

Times New Roman and images

Trends fade. Good type endures.

2009

Hail side project experimentation.

2016

Make sure usability and aesthetics run parallel.

Noto Sans / Google, 2012

no more tofu

Consider the implications of an international product.

Roboto / Christian Robertson, 2011

Type can be agile, too!

HARD WORKING UX PRO

Research the pedigree of your proposed web font.

Unique Letterforms

CancelOK

Customer Data

Sales Figures

Internal Costs

Market Data

Import Settings

Include these sections in the quick data import ABOUT US

Our clients range from FTSE 300 companies, to large

charitable organisations and some small local businesses

who are striving to expand. Use our Data Analysis service to

inform their strategic decision making and their targets for

the immediate, mid-term and long-term future.

Learn more

High contrast serifs

CancelOK

Customer Data

Sales Figures

Internal Costs

Market Data

Import Settings

Include these sections in the quick data import ABOUT US

Our clients range from FTSE 300 companies, to large charitable organisations and some small local businesses who are striving to expand. Use our Data Analysis service to inform their strategic decision making and their targets for the immediate, mid-term and long-term future.

Learn more

Condensed Type / Extended Type

CancelOK

Customer Data

Sales Figures

Internal Costs

Market Data

Import Settings

Include these sections in the quick data import ABOUT US

Our clients range from FTSE 300 companies, to

large charitable organisations and some small local

businesses who are striving to expand. Use our Data

Analysis service to inform their strategic decision

making and their targets for the immediate, mid-term

and long-term future.

Learn more

Geometric letterforms

CancelOK

Customer Data

Sales Figures

Internal Costs

Market Data

Import Settings

Include these sections in the quick data importABOUT US

Our clients range from FTSE 300 companies,

to large charitable organisations and some

small local businesses who are striving to

expand. Use our Data Analysis service to

inform their strategic decision making and

their targets for the immediate, mid-term

and long-term future.

Learn more

Small x-height paired with tall ascenders

CancelOK

Customer Data

Sales Figures

Internal Costs

Market Data

Import Settings

Include these sections in the quick data importABOUT US

Our clients range from FTSE 300 companies,

to large charitable organisations and some small

local businesses who are striving to expand.

Use our Data Analysis service to inform their

strategic decision making and their targets for

the immediate, mid-term and long-term future.

Learn more

Designed for screen use

CancelOK

Customer Data

Sales Figures

Internal Costs

Market Data

Import Settings

Include these sections in the quick data import ABOUT US

Our clients range from FTSE 300 companies, to

large charitable organisations and some small

local businesses who are striving to expand.

Use our Data Analysis service to inform their

strategic decision making and their targets for

the immediate, mid-term and long-term future.

Learn more

Good user interface type is often unremarkable. And that’s the point.

icon-24x24

icon-24x24 icon-24x24

Icon fonts offer rapid prototyping opportunities and reduce maintenance.

IN THE WILD

Be intentional.

THE FUTURE

Type as interface: what options do our users have?

Hello there!

MAKE GREATNESS.