Repository navigation
Conversation
The landing page becomes a felt-pen drawing of a lighthouse on a hill, drawn in a canvas behind paper notes: a one-eyed lighthouse in a pom-pom hat, a fried-egg sun, sheep, ducks, gulls and a sea monster. The light follows the pointer and highlights the headline words it crosses, grass and clouds lean away from it, scrolling brings the evening, the moon tile brings the night, and a click on the hill or the sea drops a surprise there. The bar demos stay: popups, Edit Bar in Place, the right-click menu, the Store review, theme picking and the bar turning into the site header. Each section is a different paper (a taped note, a washing line of themes, a notebook page, a postcard, a recipe card), with its own small scene in the drawing. The terminal, the draggable windows, the disk image mock and the Popups and Every display sections go; the guide covers them. Shantell Sans replaces Host Grotesk for headings, captions and labels. The privacy and terms pages move to the same paper without the drawing. Reduced motion keeps the drawing still, and the page works without scene.js.
The night switch showed the same crescent outlined by day and filled at night, which looks alike at 16 points. It now shows a sun by day and a moon at night, as the old site did. Scrolling past the headline slid the bar into the header in several visible steps: a widget dropped into More widgets, Download grew from nothing and the menus opened late. It now fades out, swaps in one step and fades back in, and stays the header until the headline is well back in view, so small scrolls no longer flip it back and forth. Once scrolled, a white strip slid in behind the bar, where its near-white tiles disappeared. The strip now takes the colour of the sky it covers, so the bar reads as it does over the drawing, by day and by night.
The Download widget that joins the bar once it becomes the header still used the old site's amber and the system font. It now matches the page's Download button at bar size: the highlighter yellow, the display handwriting, a felt-pen outline printed a little off it that boils with the others, and the same tilt on hover.
Three small games between the drawing and the demo bar, all decorative: - Keepy-uppy: a click on the lighthouse, or the key's new Play ball, sends its pom-pom up at the bar. Widgets hop when it hits them, a workspace it hits gets focused, the pointer aims the next bounce, and the rally ends with a splash in the sea and a new pom-pom. - Pointing at a widget lights it from below and hangs a paper tag under it, such as "the keeper is late" under the calendar. Keyboard focus shows the same tag. - Left alone for a while, once per visit, the lighthouse nudges a widget aside and chuckles, then puts it back, whistling, when the visitor moves. None of them changes the bar for good or runs while it's being edited. Under reduced motion only the tags remain. The scene's idle timers now also start when the page loads quickly.
The drawing no longer starts empty: a few sheep, a cow and a duck are already there where the notes leave the hill and the sea in view. Grass sprouts here and there on the hill and leans away from the pointer; sheep and cows wander over in turns, munch it until it's gone and look pleased. The section's little scenes (the desk, the huts, the keeper) are drawn over the animals, and animals don't stay in their way. A white box with a cloud's puffs for a lid drifts across the sky with the clouds, labelled "a sheep (in a box)" while it's in clear sky. In the beam two eyes look out of its air holes, and a click makes it hop and say "baa!". A click in the sky above the sea now drops a duck that falls into the water; sea monsters only surface where the water itself is clicked.
The box drifting with the clouds keeps its own shape again, without the puffs on its lid, and takes the clouds' colours: the top as white as they are, the front with a touch of sky and the side in their shade, changing with them through the evening.
The box sets off from the left edge of the sky when the page opens and drifts right with the clouds from there, instead of starting between the headline and the lighthouse.
On a visit's first page load the drawing starts up in the sky, with the bar in the middle of the screen and the headline waiting below. The camera then comes down to the hill while the bar flies up to its place, and the lighthouse sweeps its light along the bar, widget by widget. It plays once a session, only when the page opens at its top, and never under reduced motion; any scroll, key, click or tap jumps straight to the end. The headline is on screen from the first frame, so the page's largest paint isn't delayed.
The sheep's box no longer drifts in the sky in the clouds' colours. It's a cardboard box again, sitting on the grass where it's seen, with room for its label beside it, and now and then it wobbles as the sheep inside shifts. Animals walk round it and no grass grows under it; the eyes in its air holes, its hop and its "baa!" stay.
The opening plays once a browser tab, only from the top of the page. Adding ?intro to the address plays it again on every load, so it can be watched and reviewed; reduced motion still turns it off.
The opening no longer starts on an empty sky. The whole drawing is there from the first frame, with a title card over it: StableBar in big letters, the bar large and centred under it, and a line about it under that. After a moment the card's bar stretches across the window and rises into the real bar at the top, the card drifts away, the notes come in and the lighthouse sweeps its light along the bar. On phones the card sits low over the sea, its title on two lines. The drawing's own labels wait until the card has gone, and the title stays the page's first large paint.
The title card's StableBar no longer has a yellow mark on its b. Instead the lighthouse swings its beam to the first letter and sweeps it across the word, and each letter glows once the light has reached it. Then the bar expands to the top as before. The glow is drawn behind the letters, so the title stays the page's first large paint.
The opening now starts with the lighthouse asleep: its eye shut, its lamp out and a few z's rising from under its hat. Just before the title is read it opens its eye, blinks once, and its light comes on to sweep across the word. Skipping the opening wakes it at once. The title card's StableBar is now white, outlined in the drawing's black pen, on light and dark skies alike.
The opening now starts at night and holds still: the lighthouse sleeps with z's rising beside its hat, the animals have their eyes shut, and the drawing stops. The first move of the mouse, or the first tap, wakes it up: the day comes, the lighthouse opens its eye and reads the title with its light, then the bar rises into place as before. A scroll or a key still ends the opening at once. It wakes into the light theme, or stays at night for visitors who chose the night with the switch. The tap that wakes it no longer drops a duck or reaches the page's hidden links. The moon now sits as high as the sun, clear of the title.
The opening no longer waits for the visitor. The lighthouse sleeps at night for a moment, then wakes up on its own: the sun comes up over almost two seconds, its light reads the title, and the bar rises into place while the notes come in. The pointer leaves the drawing alone until the opening is over, and a click that ends it no longer drops anything. The sunrise is now an even change instead of the usual quick ease. The card's bar turns its words from light to dark halfway through, so they never fade to grey on grey, and its sun and moon cross over. The drawing's labels fade in, and the notes no longer wait for the bar to settle.
The lighthouse's eye now opens over a second instead of snapping open, its light comes on as the eye opens, and it turns gently toward the title before reading it. Each sweep of the light starts from exactly where it points, so it never jumps, and the sweep along the bar after the opening is slower. Its first blink waits until it has read the title. The click that ends the opening is the only one that doesn't drop anything: the next click works at once.
Knocking on the sheep's box makes it hop higher and say baa louder each time, and the fifth knock in a row lets the sheep out: once the box is back on the ground its flaps burst open, the sheep jumps out onto the grass beside it and joins the others, and the label becomes "a box (empty)". Knocking on the empty box calls the sheep home: it trots back, ignoring the pointer, and hops in, and the flaps close over it. Without motion it simply appears beside the box, and is simply back. A knock while the box is still in the air no longer drops it to the ground, and each new baa replaces the one before instead of piling up on it.
The lighthouse now wakes up in steps: its eye opens looking straight at you, its light coming on toward you, and blinks twice; it looks out to the left and blinks again; then it turns down to the title and reads it. Once it has lit the whole bar after the opening, it turns to look straight at you, glowing, for a couple of seconds before it goes back to turning and following the pointer. The opening now takes about seven seconds before the page comes in.
The opening's sunrise now comes first: the lighthouse sleeps on while the sky, the sun and the moon turn from night to day, and the rest of the drawing holds still. Then it wakes up slowly: its eye opens halfway, grows a little heavier for a moment, then opens all the way, before it blinks, looks out to the left and reads the title as before. Visitors who chose the night don't wait for a sunrise that doesn't come. The opening now takes about eight seconds before the page comes in.
The opening used to play once a browser session, so a reload went straight to the page. It now plays on every load, reloads included, and a reload starts from the top of the page, where it plays, rather than where the page was left. A link to a section still goes straight there, and reduced motion still turns the opening off.
The bored lighthouse's quiet spell started counting when the page loaded, so with the longer opening its trick began right after the page came in, while the light was still looking at you. The count now starts when the opening ends, and the trick waits while the light is busy sweeping the bar or looking at you.
The opening is reordered. At night the lighthouse sleeps under the title card; then the day comes and, with it, the card's bar rises into place at the top, the card drifts away and the notes come in, while the lighthouse sleeps on. Only then does it wake up, slowly, and light the headline word by word before it sweeps the bar and looks at you. The page is ready after about two and a half seconds instead of eight, and the lighthouse wakes up on the page itself. The words it lights stay lit while it reads. The bored lighthouse now also rests for a while after looking at you before its trick.
The new 404 page from main used the old site's colours. It now sits on the redrawn site's paper note over the sky, like the privacy and terms pages, with their browser colour for day and night and a skip link.
Its bored trick, ending in a "hehe", now waits at least 40 seconds after the opening: from the end of its look at you, or from waking up when the opening was skipped. After that it comes, as before, once a visit after a quiet spell.
The opening's wake-up took about 4.5 s after the page came in: the eye opened slowly, blinked, looked out to the left and only then read the headline, so the bar's sweep ended about 10 s after load. Now the eye opens the moment the card's bar reaches the top, its light coming on at the headline's first word. It reads the headline, keeps it lit while it sweeps the bar, then looks at you and blinks. The whole headline is lit by about 3.1 s and the look at you ends at about 9 s. Also stop the light following the pointer for one frame as the sweep ends and it turns to look at you.
The lighthouse's light came on the moment its eye opened, once the bar was up. Now its eye opens while the card's bar is still rising, and it looks at the headline with its lamp out. It squeezes its eye shut three times, trembling, with strain marks either side. The light flickers after the second try and comes on after the third, landing on the headline's first word, and its hat hops. The read, the bar's sweep and the look at you follow as before. The light comes on at about 3.4 s and the opening ends at about 10 s. A skip while it strains brings the page in with the light on at once, and the flickers light none of the headline's words.
… headline The opening now tells a longer story, as asked. At night the lighthouse wakes up on the title card and strains to light its lamp: its light finds the StableBar title, weak and unsteady, nearly going out now and then, and the title's words glow with it. Then the bar rises with the day: the lighthouse blinks its weak light out and strains again, and its light comes on for good as the headline comes in. It reads the headline, sweeps the bar and looks at you as before. The glow sits on the title's own words, so it adds no later paint for the browser to count as the page's largest: the title stays the first large paint, at about 0.13 s on a phone. The weak light lights none of the headline's words, the ball game waits for the light, and a skip at any point brings the page in with the light on at once.
The opening's weak light at night now shows off the bar, the site's subject, rather than the StableBar title. It comes on at the left end of the card's bar and crosses it to the right, each widget glowing as it passes, and it stops at the bar as if the bar caught it. The lighthouse also sleeps a little longer before it opens its eye: about 1.3 s instead of 0.7 s. The rest is as before: as the day comes it blinks the light out, strains again and lights the headline, then the bar along the top, then looks at you; the opening is over at about 12 s. The widgets' glow adds no later candidate for the page's largest paint.
Its eye snapped open in half a second, most of it in the first tenth. In the opening it now eases open over 1.2 s, starting gently and settling slowly, and the squeezes and the weak light on the bar follow once it's open. Woken at once by a skip, it still opens quickly. The opening is over at about 12.4 s.
As asked, the eye now wakes in two goes in the opening: it opens halfway, stays a moment, droops a little, then opens all the way, easing out, over about 1.45 s. The animals on the hill wake as it starts to open, and no longer nap again while its eye droops. The opening is over at about 12.7 s.
The moon is now a croissant (de lune): a crescent of golden dough creased into five, its ends curling in and more baked, still asleep with its closed eye, lashes and small smile. It's a little bigger, so the creases read. The grass is denser: about nine tufts on the hill when the page opens (five on phones), up to fourteen (eight), a new one every 3 to 6 s instead of 6 to 12, closer together and fuller, and twice as many tufts along the ridge. The drawing still takes under 2 ms a frame.
The croissant moon was too fat and too brown. It now keeps the old moon's thin crescent, pointed horns and all, in lighter golden dough, creased into five with its horns a little more baked, and the same sleeping face.
As on the old moon, its closed eye and small smile sit along the crescent's inner edge again. The creases moved out a little so the smile stays clear of them.
The croissant moon goes: the moon is the pale crescent it was before, asleep with its closed eye, lashes and small smile. The denser grass stays.
A click or a tap on the keeper's cottage door says "knock knock", jiggles the door and turns the light to it. The door swings open, the keeper looks out to the left and then to the right, wonders who knocked, goes back in and shuts it, in about 3 s. The doorway is dark by day and lamp-lit at night, its light spilling onto the grass. When the keeper is out on the ridge with his tile, nobody comes; when the door is already open at night, a knock only says so. Nothing drops where you knock, and with reduced motion the door and the keeper change without moving.
When the keeper comes to the door, the room behind it is lamp-lit by day too: the doorway glows warm, its light spills onto the grass, and the window lights up until just after he shuts the door. At night it stays as it was, the window being lit anyway.
…shuts He used to fade away where he stood. Having looked out to the left and to the right, he now turns his back (white hair under his cap, no face) and walks into the lamp-lit room, a little smaller and higher as he goes, and fades into the light; then the door shuts. The visit takes about 3.3 s.
By day the knock's lamp-lit room shows only in the open doorway: the window keeps its glass and no light spills onto the grass. At night it stays as it was, the doorway and window lit and the light spilling out.
One knock was too quick. Like the sheep's box, the cottage's door now counts knocks in a row (each within 2.5 s of the last): it jolts and says "knock", then "knock knock", and on the third, "knock knock knock", the keeper comes to the door.
This branch has not been deployed
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Problem
The website is a tidy but generic product page. This draft redraws it as a hand-drawn scene with some personality and play, keeping the same content: the hero, editing, themes, widgets and the Store, tiling and install. It's up for review as a direction; nothing here is final.
Changes
mainare paper notes over the sky.scripts/set-site-version.shstill finds every version mark in the new page: a dry run on a copy updated the DMG links, the button labels andsoftwareVersion.main, keeping its site name metadata, description, footer wording,robots.txtand 404 page.Testing
All of it ran in headless Chrome, driven over the DevTools protocol, at 1440×900 and at phone size (390×844, touch):
?intro,/#installand reduced motion.Not checked: Safari, Firefox, real phones and slow connections.
The opening, desktop:
The lighthouse waking, close up: it squeezes its eye shut to light its lamp, weak and unsteady across the card's bar, then blinks it out and squeezes again for the steady light on the headline:
The opening, phone, and the sheep's box:
Knocking on the cottage door:
The 404 page:
Merging
Squash. The commits are steps on one redesign, some of them undoing earlier ones, and they are all
docs, so the changelog stays the same either way. A merge commit works too if you'd rather keep the steps.Claude Opus 5.5 via Claude Code