Examples
Examples
Whole pages and assets built only from the system: the test that the system is complete, and the thing to copy. To make something new, copy the closest example and follow BUILD.md. Part of the SoR design system.
By kind
Each kind has a guide (how to make it) and examples to copy. Each has its own folder under examples/.
| Kind | Guide | Examples |
|---|---|---|
| Website | website.md | Six pages |
| YouTube | youtube.md | Thumbnails · channel art |
| Podcast | podcast.md | Podcast kit · show art |
| Social media | social.md | Instagram kit |
| Slides | slides.md | Study and Gathering decks |
| print.md | The Wisdom paper | |
| Diagrams | diagrams.md | Figures and charts |
Email has a guide, email.md, but no template yet.
Photographs in the examples are placeholders (photography.md). Polyamine and Restora are not yet licensed: nothing public, PDFs and Canva included, until they are.
Website
Pages for the Seeds of Renaissance website, one per register.
| Example | Register |
|---|---|
| Home | Landing page |
| Manifesto | Long reading |
| Gatherings | Events and community |
| Join | Joining |
| Magazine | Publication |
| White paper | Research |
YouTube
Thumbnails, podcast covers and channel art. How to make them: youtube.md.
- Thumbnails and podcast covers, 1280×720, full size and in a feed.
- Channel art: banner, avatar, lower third, watermark.
Podcast
The episode cover, episode posts, show art and episode art, all on the swallows-and-fingerprints ground. How to make them: podcast.md.
- Podcast kit: the episode cover in Canva, with PNG layers, guides and step-by-step positions. Seen with the other thumbnails in examples/youtube/.
- Show art and episode art, 3000 × 3000.
- Episode posts for Instagram are in the Instagram kit.
Social
Instagram posts on the swallows-and-fingerprints ground, as a Canva kit. Rules and sizes: social.md.
- Instagram posts: podcast episode, quote card, announcement, statement, carousel; 4:5 and 1:1. Canva kit: README.
Slides
Decks on a fixed 1920 × 1080 artboard, in two registers. How to make one: slides.md.
- Slide examples: Study, fifteen slides on the Wisdom paper, and Gathering, ten slides for a community call.
Diagrams
Figures, frameworks and charts in the house style. How to make one: diagrams.md.
- Diagram examples: the wisdom gap, polycrisis to metacrisis, and three charts (lines, ranked bars, before and after), each in light and dark, at 400px and in black and white; on a page of a paper and in a web article; and the Wisdom paper's published figures.
- Built by
examples/diagrams/build.py, whose functions are the starting point for a new figure.
Papers as one A4 PDF, read on screen. How to make one: print.md.
- Print examples: the Wisdom paper page by page (covers, title page, imprint, contents, a chapter opening, body pages with a figure, quotes and a summary box), and a link to the whole PDF.
- Built with Typst in
pdf-report-publishing(typst/build-paper.sh), from the--print-*tokens.