Design Systems For Digital Publications

Design Systems For Digital Publications (+ Figma Kits). With examples of public design systems to report news and publish scholarly content — from NewsKit and The Economist to JSTOR and Wikipedia ↓

NewsKit Design System, by Geri Reid, Luke Finch, Marco Vanali, Daniel Georgiev
Docs
Figma kit
Onboarding Figma

NRK Norway
Docs: https://lnkd.in/e3NV86Kc
Figma kit: https://lnkd.in/e5FZSi4E

Codex Wikipedia, by Wikimedia
Docs: https://lnkd.in/emA4su93
Figma kit: https://lnkd.in/emA4su93

Schibsted Design System, by Nathalie Kåvin, Andreas Lewandowski, ann axelsson
Docs: https://lnkd.in/eVH5bChr
Figma kit: https://lnkd.in/et368Nmq 

JSTOR’s design system
Docs: https://pharos.jstor.org/

The Economist
Docs: https://lnkd.in/eBaz_DNT
Visual style guide (PDF): https://lnkd.in/ege9wiFZ
Maps style guide (PDF): https://lnkd.in/ecvKc3_2

The Washington Post Design System
Docs: https://lnkd.in/e3rxCihG
Figma: https://lnkd.in/eeeyGUxJ

The Guardian (style guide)
Docs: https://lnkd.in/e-qPNKrC

Many of these design systems have practical guidelines around editorial, tone and voice, onboarding, infographics, maps, motion design and third-party advertising, which is quite rare in most design systems. You’ll probably explore and discover quite a few gems here and there.And yet again, huge kudos to designers making a strong case for making their work public, and sharing those Figma kits for everyone to explore and learn from. 👏🏼 And if you know any media company that has released their design system (perhaps in a non-English language), please share it in the comments as well, along with the links to their docs and Figma kits. Thank you! 🙏🏾

Design systems for digital publications (example of The Guardian)