Design system
Specimens
Specimens are playful, editorial ways of showing content, there to show what each look can do with a story. They use only the package: its tokens, its fonts and its moments. The switches beside this page change them live, look and lights.
They are specimens, not screens of an app. The content is the house sample: the Moteur Journal, a Montréal magazine from the 1970s, in French and English. Each one is a component the site can drop into a page wherever its story fits.
Tracklist
Articles as an LP: side A is on the air, side B is still in the studio, and reading times are track lengths. In Discothèque it comes in a sleeve with a record on it, Shrikhand on the label and stickers on the tracks: print you could hold. Folio plays it straight, as a tracklist with a small mark for a sleeve, its badges and language tags doing the talking. It is a specimen of the looks, not a Studio screen.
Moteur Journal presents
Articles
61 tracks · recorded 1968–1979 in Montréal · 2 waiting to be mixed
Side A · On the air
- A1Sous la glace d’UngavaSophie Marchandremix pendingReading time
- A2Paris, un an aprèsMarguerite FontaineReading time
- A3La garantie de trente ans, expliquéeThéo NguyenReading time
- A4Dix ans en chiffresThéo NguyenReading time
Side B · In the studio
- B1Sept-Îles, la ville qui écouteSophie Marchandin reviewReading time
- B2Un an après la finLouise Gagnondrops Nov 13Reading time
- B3Qui écoute?Jean-François Côténeeds another takeReading time
- B4SIGNAL-1: premières écoutesUnit 7-PASCAL · French onlydemoReading time
Moteur Journal · tracklist
Articles
61 articles · 41 live · 2 waiting for review · reading time as length
Side A Live
41 · showing 5- A1Sous la glace d’UngavaSophie Marchand is editingFREN3 editsReading time
- A2Paris, un an aprèsMarguerite FontaineFRENLiveReading time
- A3La garantie de trente ans, expliquéeThéo NguyenFRENLiveReading time
- A4Dix ans en chiffresThéo NguyenFR
EN not written yetLiveReading time - A5Le garage aujourd’huiLouise GagnonFRENLiveReading time
Side A · 35 min shown
Side B In progress
20 · showing 5- B1Sept-Îles, la ville qui écouteSophie Marchand · asked yesterdayFRENIn reviewReading time
- B2Un an après la finLouise GagnonFRENNov 13Reading time
- B3Qui écoute ?Jean-François CôtéFRENChanges askedReading time
- B4SIGNAL-1 : premières écoutesUnit 7-PASCALFR
EN not written yetDraftReading time - B5Les robots de la GaspésieCéleste Armand · needs Author, Category, BodyFR
EN not written yetDraftReading time —
Side B · 36 min shown
A specimen: its buttons show the look but don’t do anything here.
Recipe box
Authors as lined index cards with A–Z tabs, typed in a typewriter face. Discothèque files them a little crooked, and a card lifts when the pointer finds it, using the lift moment. Folio turns the same people into an A–Z directory with a fact sheet beside it: what is missing, like an English bio, is plain to see. A specimen, not a Studio screen.
The recipe box · Authors
Who writes for us
Sophie Marchand
nº 04Role .... Reporter, oceansSince ... 1972Bylines .. 9 articlesBio (fr) . A suivi le HORIZON-Esous la banquise en 1976.Bio (en) . — to be typed —
Marguerite Fontaine
nº 03Role .... Paris correspondentSince ... 1971Bylines .. 6 articlesBio (fr) . Écrit depuis la ruede Charonne, au-dessus d’un café.Bio (en) . Writes from rue de
Unit 7-PASCAL
nº 07Role .... Columnist (robot)Since ... 1977Bylines .. 4 articles, 2 draftsBio (fr) . RÉPOND À VOS QUESTIONS.N’A JAMAIS DORMI.Photo .... robot-portrait-7.png
Authors
12 people · 3 bios not in English yet
F1
Fontaine, MargueriteParis correspondent · since 1971FREN6 articlesG1
Gagnon, LouiseEditor-in-chief · since 1968FREN14 articlesM1
Marchand, SophieReporter, oceans · since 1972FREN not written yet9 articles(on the fact sheet)N1
Nguyen, ThéoData desk · since 1975FREN5 articlesU1
Unit 7-PASCALColumnist (robot) · since 1977FREN not written yet4 · 2 drafts
Sophie Marchand
- Role
- Reporter, oceans
- Since
- 1972
- Bylines
- 9 articles · last: Sous la glace d’Ungava
- Bio · FR
- A suivi le HORIZON-E sous la banquise en 1976.
- Bio · EN
- Not written yet
A specimen: its buttons show the look but don’t do anything here.
Typewriter memo
A project’s settings as an inter-office memo. Discothèque types it on letterhead, with a routing slip to initial and an APPROUVÉ stamp; press Stamp it again and the stamp moment comes down, and the memo takes the hit. Folio keeps it as a record: what changed is marked, every grant says who gave it, and the last approval is a seal that writes itself. Like the others, it is a specimen, not a Studio screen.
moteur
Industries · Montréal
Note de service
Inter-office memo
Routing slip. Initial the box to grant access; a reviewer must approve before anything goes out.
| Access | Name | Role | Init. |
|---|---|---|---|
| Louise Gagnon | admin | L.G. | |
| Céleste Armand | reviewer | C.A. | |
| Sophie Marchand | editor | S.M. | |
| Unit 7-PASCAL | editor | U.7 | |
c.c. Webhooks: 2 subscribers · API keys: 1 active
Stamped: APPROUVÉ
Settings record
Moteur Journal
Rev. 14 → 15
Last approved Oct 14, 10:42
- Subject
- Who may change the Journal, and how
Access
Each grant keeps who gave it, and when| Person | Role | Granted by | On |
|---|---|---|---|
| Louise Gagnon | Admin | — | 1968-03-01 |
| Céleste Armand | L.G. | today | |
| Sophie Marchand | L.G. | 1972-09-12 | |
| Unit 7-PASCAL | C.A. | 1977-01-04 | |
| Jean-François Côté | new: Editor | L.G. | today |
A specimen: the fields take typing, the stamp and seal replay, and the other buttons don’t do anything here.
Poster
A day’s overview as giant numbers. Discothèque prints a mustard poster in Fraunces, a number to a block; Folio reads the same news as a briefing, with a line of detail under each. The numbers roll in with the counter moment the first time the poster comes into view. Here it is a specimen, not a Studio screen.
moteur journal
Mardi 14 octobre · Louise
2 articles wait for your review.
30 days until Ce qui vient goes out.
7 entries speak only French.
4 new letters in the mailbag.
Tuesday, October 14
Good morning, Louise
2 articles wait for your review.Sept-Îles, la ville qui écoute · Lettre de Baie-Comeau · oldest asked 3 days ago
30 days until Issue 06, Ce qui vient, goes out.14 of 18 articles ready · 2 still drafts · 2 not in English
7 entries are in French only.4 articles · 2 robots · 1 event
4 new messages from readers.Contact form · newest 2 hours ago
A specimen: its buttons show the look but don’t do anything here.