OrigamiFrontend Components & Services

May Newsletter#

Posted on by Lee Moody.
Tagged with Newsletter

TL;DR: Origami V3 (o3) is out in the wild and our new, design guideline led website is quickly developing in beta.

Top things

Some of the bigger Origami news since our last update:

o3 in production

Origami components are independently versioned, we iterate regularly. o-buttons is at version 7, o-table is at version 9. The overarching approach we follow to design and build components is also versioned. By comparison to individual components, these standards are remarkably stable.

Origami v1 (o1) launched around 2013; Origami v2 (o2) around 2020; and as of 2024 we’re now moving to Origami v3 (o3). It might be our most significant upgrade ever.

In o3 we’ve reimagined Origami with a renewed focus on design guidelines; aligned designer and engineer tooling; and enhanced multi-brand support (learn more about what’s new in Origami v3 on our beta website).

Since our last update both FT Monetary Policy Radar and Sustainable Views have begun to adopt o3 components 🎉 We’re thrilled to see these in production and the beginnings of us realising the benefits of o3 – massive shout out to the Specialist Team, and Oliver Barnwell from FT Professional, who made that happen.

You’re welcome to try o3 in your project from today, as o3 is designed to work alongside existing o2 components and patterns. Keep a look out for future announcements regarding improved documentation, workshops, and co-ordinated migration plans. The Origami team are here to support you with any questions in the meantime.

New website updates

Our new, design guideline led website is central to o3. It’s still in beta but quickly progressing. We’ve recently added:

We’re continuing to improve the site this quarter. Next up we’re working on a getting started guide for designers; contribution guides; migrating our blog; improved previews & code snippets; and more.

Origami neighbourhood

We don’t want all the components to live within Origami. Origami is helpful to spread tried, tested, and thoroughly documented design patterns we want to encourage across the FT Group. But teams and brands still need to be able to experiment, do their own thing, with custom design patterns which augment Origami. Often these are even shared across a specific set of projects, and sometimes teams, outside of Origami.

These product specific design patterns often lack design libraries or guidelines leading to confusion and inconsistency – for designer, developer, and user! To help, the Origami team is working with the design team on a neighbourhood* of Figma libraries. We’ve made a start by restructuring our Design System team in Figma, with more clear delineations between Origami o2, o3, and other libraries.

* Thanks Chee Rabbits for coining the phrase!

Broader update

A digest list of some other things that have happened since out last update: