Engines of Expression: Extending Design Systems With Editorial Flair

A presentation at ATypI Brisbane in in Brisbane QLD, Australia by Jason Pamental

Modern design systems for the web and mobile applications have become very good at supporting their content—but that content is usually very narrowly focused and singular of purpose. Their typographic systems are optimized in a similar way: to support the presentation of any content in a consistent and easily understood manner.

But accommodating anything means optimizing nothing—leaving us with endless sameness across the digital landscape. Since the modern web is driven by dynamic content systems, we can embrace modern techniques in CSS (the style language for the web) and technologies like variable fonts to build greater flexibility into those content systems, enabling us to support any content while still customizing the typesetting for individual articles or pages.

We’ll look at examples showcasing how we can typeset headlines that scale with the screen, design promotional elements with flair, and even set variable axes for specific passages or headlines right in the browser during the content publishing process.

Great editorial design truly can make the leap from printed page to pixel screens—it just takes a great typeface, a good eye, and a little technical finesse.