The ostrakon
The potsherd an Athenian scratched a name onto to vote a man out of the city.
Every sherd is cut from the same disc, so neighbouring edges rhyme like pieces of one pot on a museum shelf — give it `assemble` and they close back into the vessel. Choosing a filter is the sherd straightening itself out of the scatter. The cells live in one coordinate space and are only ever translated and rotated, never scaled, because two complementary edges scaled differently stop matching and it becomes a tray of random polygons.
Integration
<link rel="stylesheet" href="anthemion.css">
<script type="module" src="anthemion.js"></script>
<anthemion-ostrakon seed="7" tilt="4" gap="14">
<form method="get">
<fieldset>
<legend>Filter by type</legend>
<div class="anthemion-ostrakon__tray">
<label><input type="checkbox" name="type" value="residential"><span>Residential</span></label>
</div>
</fieldset>
</form>
</anthemion-ostrakon>Slot
Filtering an index of work, journal entries or awards.
Custom properties
--ostrakon-clay
Budget
- One per page, above the index it filters.
- Six to fourteen sherds. Fewer is not a broken pot; more and the words stop fitting on their own piece.
- One or two syllables a sherd. The pot is sized from the room each piece gets, so a row of long words makes a tall tray or an unreadable one — a filter's categories are short in any case.
- Never scale a sherd to fit a slot. The rhyming edges are the component; uniform chips are a tray of polygons anyone can draw.
- Give it a real terracotta through `--ostrakon-clay`. Grey polygons read as archaeology, not as Greece.
Restraint is the aesthetic, and it does not survive being applied generously. These limits are the specification, not advice.
Also in structure
- pinaxA catalogue entry that will not be half-filled
- colophonThe tailpiece, once you have finished
- echinosThe questions, inside the jar
- syngrapheAn account cut in stone, and checked
- kylindrosWork turning on an optical drum
- stoaThe column under load is where you are
- entasisA dock of columns that swells where you look
- aetomaA pediment over a hero or modal header