Bins
Sixty boxes
A ring of sixty, each one a destination the rules can name.
basically Sorter
The basically Sorter is an open source LEGO® sorting and kitting machine. It is the first sorting machine that is reproducible and mass-manufacturable.
The LEGO® Sorting Machine
The idea
01 · Swiss
A hard left edge, a strong grid, black type on off-white, generous space. The layout never decorates. It only orders.
02 · The object is the hero
The machine is photographed, or rendered as if photographed, on a photo stage. Type stands behind it or beside it, never on top of it.
03 · One accent at a time
Yellow highlights the one line that matters, and every link while the pointer is on it. Cyan is the brand panel. They do not share a surface, and neither is used as a tint, a border, or a text color.
04 · Plain words
Sentence case. Short sentences. Facts before adjectives. The tone of someone who built the thing and would rather show it than sell it.
Type
One family, Sofia Sans, from Cindy’s banner and poster. Display and headings are Black (900) with tight tracking and a line height under 1. Body is Regular at 18 px. Labels are bold, small, and letterspaced uppercase; they are the only uppercase on the page.
Sofia Sans Extra Condensed at 900 is the second register, used for stamped labels and the brick line, as on the card.
Display · 900 · 0.82 · -0.04em
Sorter
H1 · 900 · 0.92 · -0.03em
How does it work?
H2 · 800 · 1.0 · -0.02em
Bulk pieces come in through the top
Lead · 400 · 1.3
It’s also the first sorting machine that is reproducible and mass-manufacturable.
Body · 400 · 18/1.45
Clumps of pieces are broken apart and singulated. They’re classified by exact part and color with Brickognize. According to user-defined rules, pieces are put into a specific box.
Condensed · 900 · uppercase off
the basically brick
Label · 700 · 13 · +0.08em · uppercase
How can it sort?
Color
Six values, sampled from the banner. Paper and ink do almost all the work. The two chromatic colors are loud on purpose and are rationed for it: both are extreme highlights, made to be a block with type on them, and neither can carry a thin mark on a light ground.
Paper#F6F7F7
Every page. Never pure white.
Ink#1A1917
All type, every line that draws a box, all line drawings.
Cyan#03FFFF
The brand block: the panel the brick and wordmark sit on.
Yellow#FFD710
The highlight, always at full strength. One per view.
Line#A1A1A1
A line that draws no box, in both modes. Technical drawings and secondary strokes.
Mute#D0D0D0
The ground under inline code in prose, and a fill in a chart.
Highlight
Yellow behind the words, the way a marker does it: padded to the cap height, square corners, and only ever around the words. When a phrase wraps, each line gets its own yellow exactly as long as that line. It is how the banner carries its tagline. One yellow, at full strength, and one highlight per view, not counting links: every link wears it while the pointer is on it.
On the banner
Automatic LEGO® Sorting Machine
As the tagline
The LEGO® Sorting Machine
Inside a sentence
The basically Sorter is an open source LEGO® sorting and kitting machine. It is the first sorting machine that is reproducible and mass-manufacturable, and it is built to be made in numbers.
A token
Reservations are refundable. The stated first-run price is $8,000, invoiced when a unit is scheduled.
Imagery
Two registers and nothing between them.
The photo stage. The machine on a white cyc, lit softly, with a small contact shadow and the floor bouncing light back up. Renders are made to match that photo, never the other way round. No drop shadows, no floors, no rooms.
The line drawing. Black lines on a white sheet, always, in both modes: an engineering view of the empty machine, no shading, no fills, the figure itself is the sheet. It carries the technical story so the photo stage never has to.
Motion
A turntable is a photo stage that turns. Same light, same floor, one full revolution at a constant speed, no cuts, no easing. Video sits inside the grid like a still, and loads like one: nothing fetched until it is on screen, playing only while it is. Two renders of the same turn, since video has no transparency: on white, multiplied onto the light stage, and on black, screened onto the dark one.
Icons
Lucide, and only Lucide, except a brand mark beside its place's name. Every icon draws at 1.5 px whatever its size, with square caps and mitre joins, so it sits with the 1 px lines instead of looking softer than them. Three sizes: 18 in text and in controls, 22 after a lead-size label, as in the fill button, and 24 on its own; the one larger is the link band's arrow, set with its H1 title. An icon never stands alone: it sits beside a word, or an icon button carries an aria-label. Close is an X, the menu is three lines, a picture that enlarges says so with the cursor.
ArrowRight
Check
ChevronLeft
ChevronRight
Download
Info
Mail
Menu
Moon
Pause
Play
Sun
TriangleAlert
X
The set is src/lib/icons.ts: an icon the site uses is named there and nowhere else, so the set stays one set. Add one by adding a name.
Links
Every link wears the highlight while the pointer is on it. At rest a link in running text is an ordinary link, a 1px grey underline: not blue, not bold, no arrow. A link that stands alone is a tertiary button: bold, ending in an arrow, or a mail icon for an email address, which the button adds itself. A link in the nav or a label is the label itself. A link that leaves the site looks the same as one that does not, and opens a new tab.
The Sorter is open source, and every part of it is documented so anyone can build one.
Reservations are refundable; the terms say how. Hover a link to see its highlight.
Forms
A field is a paper box with a 1px ink line and the label above it. Focus is the same 2px grey ring as a button: quiet, since the cursor is already there. Checkboxes and radios are 1px squares that fill with ink; radios are square too. Errors are words under the field, not red. One primary button per form.
Prose
How markdown renders: a blog post, a doc page, a policy. Every element gets what the system already has and nothing more. Measure is 42rem. Emphasis is an underline, because there are no italics. A quote is a 1px grey line on its left with its source as a label, and a rule between parts is grey too: neither draws a box. A link is underlined in grey and wears the highlight on hover.
Sorting at scale
The basically Sorter is an open source LEGO® sorting and kitting machine. It is the first one that is reproducible and mass-manufacturable, which is the whole point: a machine you can build from the drawings, and a company that can build a thousand.
How does it work?
Bulk pieces come in through the top. Clumps are broken apart and singulated. Each piece is classified by exact part and colour with Brickognize, and a rule sends it to a box.
The rules
- One rule per bin.
- Rules are yours: by part, by colour, by set, by whatever the catalogue knows.
- Sixty bins in a ring, so sixty rules at once.
- Pour.
- Wait.
- Take the bins out.
I don't like sorting.Spencer, the card
A note on names
The machine is the Sorter. The company is basically, lowercase. The config file is sorter.toml and the command to run it is:
sorter run --rules rules.toml --bins 60| Stage | What happens |
|---|---|
| Input | Bulk pieces, through the top |
| Singulation | Clumps broken into single pieces |
| Output | A rule routes each piece to a box |
Written by the person who built it.
Overlays
Three, and they share one look: a paper panel with a 1px ink line and no shadow. The line is what separates it from the page. A popover hangs under its trigger and closes on a click outside or Escape. It is light inside, small text with room around it, and 24rem wide, so a few sentences read at a comfortable measure; on a phone it spans the screen less its margins instead, so it can never run off an edge. A modal is the native dialog, centred, with the page under glass behind it, and always a visible Close. Nothing slides, fades or bounces. The lightbox is the modal for a picture; click any figure.
Notices
A bordered block with a label that says what it is. No red, green or blue: the word does the work, and the one that matters gets the highlight. Inline, in the flow, never a toast that floats in from a corner.
Note
Estimated ship is spring 2027, after the crowdfunding campaign.
Important
Reservations are US only. Outside the US, email for an evaluation unit.
Done
Your reservation is in. We will write when a unit is scheduled.
Components
Square corners everywhere. Every line is 1 px. A line that draws a box is ink: borders, rules between sections, rows in a table. A line that draws no box, like the ones between the items of a list, is grey. There is no thicker line, and two lines never sit next to each other. Nothing is rounded, gradiented or shadowed, except the stage floor. Glass is in four places and no others: the sticky nav, paper at 90% over a blur, the caption of a filled figure, where the picture shows faintly through, the two ends of a scroller's row, and the page behind a modal or the lightbox.
Facts
60
bins
4
stages, top to box
1
piece at a time
open
source, all of it
Numbers over a one-line caption, and no line above them: the numbers stand on the page. A live number rolls over when it changes, each digit in a slot of its own, so nothing on the line moves as it counts.
Spec list
- Input
- Bulk pieces, through the top
- Singulation
- Clumps broken apart into single pieces
- Classification
- Exact part and color, with Brickognize
- Output
- User-defined rules route each piece to a box
- Bins
- 60, in a ring
- Source
- Open
Ruled list
- What is the Sorter?
- An open source LEGO® sorting and kitting machine. Bulk pieces go in at the top, and each one is sent to the bin its rule names.
- How many bins?
- Sixty, in a ring, so sixty rules at once.
- Can I build one?
- Yes. It is open source, and every part of it is documented so anyone can.
Lines between the items and nowhere else: none above the first, none below the last. They are grey because they separate and draw no box. The spec list above is one too, a label beside each value.
Cards
Feeder
One at a time
The feeder turns a pile into a line of single pieces.
Sorter
The whole machine
From the bucket at the top to the bins at the bottom.
Low
From low down
Its bins in stacked rings, under the funnel.
Funnel
The funnel
Bulk pieces go in at the top.
Channels
Down the channels
Each piece rides its own lane to the camera.
Docs
Build one
Every part is documented.
Source
Read the code
Open, all of it.
Reserve
Hold a place
Refundable, in the first run.
One card, three ways to carry a picture. Where the card sits decides which: a few cards across a wide grid take the big picture, a list of many takes the narrow column, or keeps a video's thumbnail whole beside the text, a card that is only words takes none, and one row never mixes them. The picture fills its whole box, or fits whole inside it on a paper sheet that stays light in both modes when it was shot on white, and never zooms. A card with a link is the link, and one that leaves the site opens a new tab. In a narrow column, like a scroller's, a card sets its title at lead size.
Groups
Cards that fall into kinds, like the shop's Kits and Parts, are a column page with the kind's name above its cards at H2 size and a wide gap between one kind and the next. The cards are the posts page's: one to a row, their picture keeping its shape beside the text.
Figures
The grid decides a figure's shape, and whether it fills decides what the picture does in it. Filled, it covers the box edge to edge, cropped to it, and the caption is glass with the picture faintly through. Fitted, it sits whole inside with room around it. A photograph or a video fills; a render cut out on the stage and a line drawing fit, unless, like this render with its shadow stopping at its edges, it has to fill. A picture shot on white fits too, multiplied onto a paper sheet that stays light in both modes.
Gallery
Pictures and nothing else, in rows that each keep one shape: drawings of the whole machine three across and tall, renders on the stage two across and wide. No captions, and each still opens larger.
The mark
The mark is a hollow brick, two studs, drawn in isometric line. It is made of two things and nothing else.
The outline is the black of the original logo: the six outer edges, the three edges that meet at the front corner, each stud’s rim, and the far wall seen down each stud.
The fill is the white of the original logo: the three faces and the two triangles inside each stud. The fill is the brick’s material. What is not fill and not outline is a hole, and the background shows through it.
Outline + fill
Outline + fill on cyan
On dark: fill only, paper
Fill only, ink
Two ways to draw it and no third. On a light background, outline with fill: the logo as it is, faces in paper. On a dark background, the fill alone in paper, no outline, the lines left as gaps. Fill only in ink exists for the odd light case. The outline is never drawn alone: hollow lines with a colour showing through the faces is not the mark.
Brand block
basically www.basically.website
Brick above wordmark, outline in ink with the fill in paper, hard corners, and the panel runs to an edge of the page it lives on.
Compact links
Carousel
One picture of a set at a time, every one in the same box, and the count between back and on.
The set fills or fits its box together, as one figure does.
1 / 5
1 / 3
Scroller
Bucket Step 1
Pour bulk in the top
Bulk pieces are fed in through a bucket at the top.
Rotary feeders Step 2
Separate
Our rotary feeders, intelligently controlled by cameras, untangle clumps of pieces.
Bucket and feeders Step 3
Classify
Singulated pieces are fed into a final classification stage, which uses Brickognize to classify them by exact part and color.
Bin rings Step 4
Categorize
According to user-defined rules, the piece is categorized, and that category is allocated a bin.
Bins Step 5
Put in a bin
The piece is dumped into a chute, which dispenses it to its bin.
Link band
A whole section that is one link to another page: the system's big button. What it has to say goes above its title, and anywhere in it is the link.
Learn more about Sorter
Check out the Sorter
Sound
A page plays one thing at a time, through one transport, and every control on it shows the same state. A song is a play button, its waveform and its time; a release's songs are a ruled list of links, the chosen one underlined and the playing one saying so; its stems are a mixer, closed until opened. This section is laid out as a column, its title and its content in the middle eight columns, as a page read top to bottom is.
Track list
Each row is a link to its song: the number, the title and the length. Choosing one plays it and chooses it. The chosen song is bold and underlined, as the nav marks where you are, and the one playing says so in words.
Player
0:00 / 1:41
The waveform is a chart: a column for each stretch of the song as tall as its loudest moment, the played part ink and the rest grey. It is one tab stop that seeks: the arrows move five seconds, and a click goes where it lands. Pointed at or focused, it shows a grey rule and the time there above it. A link that downloads ends in its icon.
Mixer
Stems
Opening it loads every stem, counting them in, and then the stems play in place of the master from the same point, as loud as it was at their full level. Each has a level, drawn as the meter and set like a slider, and mute and solo as square checks. Closing it goes back to the master.
Now playing
While a song plays, or waits paused, a bar along the foot of the window shows it: its cover and title, back, play and on, its waveform at the small size and the time. It stays in view however far the page scrolls, and the page grows by its height so it covers nothing. Play a song above to see it.
Dark
Paper and ink swap. That is the whole of dark mode. Yellow stays yellow with ink on it, cyan stays cyan with ink on it, and the photo stage follows the mode, a lit floor on ink, while a line drawing stays black on its white sheet. A box's lines and the buttons follow the swap: paper lines, paper buttons with ink text. A line that draws no box stays grey in both.
It follows the system preference until the toggle in the nav is used, and then remembers. Every dark rule is a dark: modifier next to its light one; a custom class carries its own inside its rule.
Light
Sorter
The LEGO® Sorting Machine
basically
Dark
Sorter
The LEGO® Sorting Machine
basically
Build
How a page of ours is made, so the design survives the code. The long version is design-system/engineering.md in the repo.
Stack
SvelteKit with the static adapter, Tailwind 4, Sofia Sans from Google Fonts. Tokens live in one @theme block; the markup uses them by name and never a raw hex.
Custom CSS
A short list: the rule, the highlight, the stage, the label, the figure, the word behind an object. Everything else is a utility on the element. A new class is a discussion.
Dark
A dark: modifier beside every light one, on the element. No second stylesheet, no theme object, no colour that only exists in one mode.
Lines
One pixel, and never two together. Ink when it draws a box; grey, with no dark variant, when it only separates, as between the items of a list. A section owns its top rule, a row its bottom, a card its border and its internal dividers. Check the seams every time two of them meet.
Every page has a card
A page is registered with its title, description and image before it exists. The head is written from that, and so is its social card, rendered from the page's own components at 2400 × 1260. An unregistered page fails the build.
Images
Never in git. They live in the asset service, and the page fetches each one when it is viewed, at the width its slot needs, behind a skeleton of its shape. Renders are trimmed to the object so a layout can trust the image's edges.
The object
Text behind an object is sized from the figure, not the viewport, so the overlap is the same everywhere. A turntable is two videos, on white multiplied onto the light stage and on black screened onto the dark one.
Check it
After any change: both modes, the seams between lines, the four widths that break layouts, the card for every page. Then look once more at the mark.
Voice
Say what it does. Say what it is made of. Say what it costs. Then stop.
Do
- I don’t like sorting.
- Bulk pieces come in through the top.
- The first sorting machine that is reproducible and mass-manufacturable.
- Sixty bins. One rule per bin.
Don’t
- Revolutionize your workflow with AI-powered sorting!
- THE ULTIMATE BRICK SOLUTION
- Unleash the power of automation.
- Any exclamation mark.