Art Bibles

Styles / utopian-scholastic

Utopian Scholastic

The world as an encyclopedia that loves you back

edutainment 90s CD-ROM early 3D optimistic museum specimen

The world as an encyclopedia that loves you back. It is the optimism of learning things: white pages, labelled specimens, models that explain themselves, a voice that is dignified but has a twinkle. It lives where the 1960s science exhibit, the 1990s multimedia CD-ROM and the old school museum meet, along with the pride of early 3D, when chrome spheres and marble floors were a marvel. The tone is utopian: knowledge is a gift, everyone can learn, and the future is bright and well lit. It can be mid-century and printed, mid-90s and rendered, or glossy and 2000s, as long as the picture explains itself and the mood is generous.

Touchstones

Where the vibe comes from. Click a picture to see it large; pick one or two and say what you took.

Software and games

Print, exhibits and design

Mathematica: the Multiplication Machine

Charles and Ray Eames, Mathematica: A World of Numbers… and Beyond (1961) and Powers of Ten (1977)

maths as a playground; clean exhibits; wonder at scale.

More: Mathematica photos on Commons ↗
DiscomedusaeAscidiae

Ernst Haeckel, Kunstformen der Natur (1904)

specimen plates; symmetry; the beauty of classification.

More: all 100 plates ↗
Broad stair and pink towerBinomial cubeGolden beads

Montessori materials

bead stairs, golden beads, number rods; counting you can hold.

3D and screens

POV-Ray glasses3D Pipes screensaverBryce render

Early rendered images (POV-Ray, Bryce, the Windows 95 screensavers)

chrome spheres, checkerboard floors, marble, perfect lighting; the pride of the newly possible.

More: POV-Ray on Commons ↗

Film, TV and sound

The core

Keep these. Everything else is open.

  1. 1
    The picture explains itself Models, diagrams, specimens and labels before paragraphs.
  2. 2
    Optimistic and airy Light grounds, clean primaries, room to breathe; the world is well lit.
  3. 3
    Dignified, with a twinkle Serious about knowledge, never stuffy; one small kindness or joke in every scene.
  4. 4
    Pride in the made thing Whether rendered, printed or built, the craft shows and is a pleasure to look at.

Dials

Pick a position on each on purpose, and try a different one next time. Set them in the brief builder.

Era

Mid-century exhibit (Eames, flat print, Isotype)1990s CD-ROM (rendered chrome, dither, Times) or 2000s gloss (Frutiger Aero)

Medium

Paper and print (cut-outs on white, plates, labels)Rendered 3D (spheres, marble, checkerboards)

Institution

Kindergarten (bead stairs, cubbies)Oxford college or science museum (stone, brass, glass cases)

Tone

Earnest teachingAbsurd and playful (Zoombinis, Lehrer)

Density

One specimen on a white pageA cabinet of curiosities, every shelf full

Colour

White, navy and pure primariesWarm institutional (plaster, oak, brass, green baize)

Directions to try

  • Eames exhibit flat mid-century shapes, bold primaries on white, numbers as sculpture in a gallery you walk through.
  • Eyewitness page every object a cut-out photograph or render on white with leader lines and small labels; the whole game is one encyclopedia spread.
  • Museum after hours dim galleries, glass cases lit from inside, specimens that wake up when touched.
  • Frutiger Aero lab glossy bubbles, sky gradients and water droplets; the 2005 version of the utopia.
  • Slate and chalk monochrome blackboard, white and coloured chalk, a teacher's hand drawing the game live.
  • Haeckel plates numbers as natural specimens, classified and drawn with symmetrical elegance.

Traps

  • Condescension: cartoon mascots talking down, flavour text explaining what the picture already shows.
  • Modern flat-design defaults (rounded cards, gradients, sans-serif everywhere) that lose the period's dignity.
  • Clutter with no quiet areas, so nothing reads.
  • Gloss for its own sake: glow, bloom and candy shine that make objects look cheap instead of crafted.
  • Losing the twinkle: all specimen, no joy.

Palette

Click a swatch to copy its hex. Variants list only the roles they change; the rest keep the starting colour.

Starting palette

from Abacus Overflow (northpop/KernelAbacus): the starting palette and type are its choices

ink on background 16.1:1 AAink on surface 17.6:1 AA

Eames exhibit

mid-century gallery: flat primaries on white (Mathematica, 1961)

ink on background 16.5:1 AAink on surface 13.6:1 AA

Museum after hours

dim galleries, cases lit from inside, brass labels

ink on background 13.7:1 AAink on surface 11.4:1 AA

Frutiger Aero

glossy, airy mid-2000s: sky, water and glass

ink on background 10.8:1 AAink on surface 11.8:1 AA

tokens.json starts from Abacus Overflow's palette (cream and white, navy keylines, primaries, brass, a classroom wall) and Times-style serif type. Its variants offer an Eames exhibit palette, a museum-after-hours palette and a Frutiger Aero palette.

Type

The samples are editable: type your own words to try the faces.

displayTimes New Roman 700 · 40pxLiberation Serif, Times, serif

Utopian Scholastic

bodyTimes New Roman 400 · 16pxLiberation Serif, Times, serif

The world as an encyclopedia that loves you back. It is the optimism of learning things: white pages, labelled specimens, models that explain themselves, a voice that is dignified but has a twinkle.

numeralTimes New Roman 700 · 20pxLiberation Serif, Times, serif

The world as an encyclopedia that loves you back. It is the optimism of learning things: white pages, labelled specimens, models that explain themselves, a voice that is dignified but has a twinkle.

Sound

marimba counting patterns soft drums mellow reed tune vibraphone tape low-pass lo-fi jazz bed music box bead clicks timpani ticking clock

Refs

Pictures from projects that used this style, kept in refs/.

bg_classroom.png: a baked classroom (grade II), fitted into the room value band.
bg_classroom.png a baked classroom (grade II), fitted into the room value band.
kab.png: Kab's expression strip.
kab.png Kab's expression strip.
kitB_collage.png: early mockups (`docs/design/reference/`), when the game was "Nubbuster". They show the airy CD-ROM page, navy and primaries, serif titles and playful overlap. The shipped game is quieter.
kitB_collage.png early mockups (docs/design/reference/), when the game was "Nubbuster". They show the airy CD-ROM page, navy and primaries, serif titles and playful overlap. The shipped game is quieter.
v5_full_screen.png: early mockups (`docs/design/reference/`), when the game was "Nubbuster". They show the airy CD-ROM page, navy and primaries, serif titles and playful overlap. The shipped game is quieter.
v5_full_screen.png early mockups (docs/design/reference/), when the game was "Nubbuster". They show the airy CD-ROM page, navy and primaries, serif titles and playful overlap. The shipped game is quieter.

From northpop/KernelAbacus.

Seen in

Abacus Overflow (northpop/KernelAbacus, its CLAUDE.md "Design rules" and docs/design/reference/): the dials set to the 1990s CD-ROM, rendered 3D (SDF chrome, marble, glossy balls), a climb from kindergarten to college across classrooms, playful, a fairly dense room kept quiet behind the play, and white, navy and primaries over warm classroom walls. Kab, a glossy blue sphere in a mortarboard, and numbers as engraved balls carry it. Everything is baked on a 2px dithered texel (see shared/techniques/baked-texel.md), cards are plain with no flavour text, and type is all serif. Mockups and bakes are in refs/.

Brief builder

Set the dials and pick a direction, then copy the brief into a prompt for Claude or a note for a teammate. Your choices stay in this browser.

Dials
Era
Mid-century exhibit (Eames, flat print, Isotype)1990s CD-ROM (rendered chrome, dither, Times) or 2000s gloss (Frutiger Aero)
Medium
Paper and print (cut-outs on white, plates, labels)Rendered 3D (spheres, marble, checkerboards)
Institution
Kindergarten (bead stairs, cubbies)Oxford college or science museum (stone, brass, glass cases)
Tone
Earnest teachingAbsurd and playful (Zoombinis, Lehrer)
Density
One specimen on a white pageA cabinet of curiosities, every shelf full
Colour
White, navy and pure primariesWarm institutional (plaster, oak, brass, green baize)
Touchstones to draw on