diff --git a/system/public/aesel/index.html b/system/public/aesel/index.html index 9e56480c2b..c25860e419 100644 --- a/system/public/aesel/index.html +++ b/system/public/aesel/index.html @@ -3,37 +3,35 @@ -Aesel — A notebook for making things. +Aesel - + - +
Aesthetic Computer Support
-
-

Aesel.

-

A notebook for
making things.

-

Start with an idea. Write it, change it,
and watch it come alive.

+ +

aesel

Download the Mac beta

0.8.3 beta · Apple silicon · macOS 14+

-
-
-

Tell it an idea.

A drawing, a sound, a playful experiment. Give your notebook somewhere to start.

Work it out together.

Keep writing. See your piece change in the live preview, and revisit earlier versions.

Let someone play.

Share your piece on Aesthetic Computer. A link takes it out into the world.

-
The Aesel notebook: a list of short requests, each answered with what changed, beside a live preview of the piece
A real notebook, four versions in: a maple leaf that learned to spin and curl. Each line asks, each answer says what changed, and the preview keeps up.
A Mac desktop tiled by Slab: the Aesel notebook in one pane beside coding-agent terminals, each tinted by its state
Aesel next to your agents: Slab tiles the notebook into the same wall as the terminals.
-

A little unfinished.
A lot to make.

This is the native Mac beta. Bring your Aesthetic Computer account and a little curiosity.

Open the DMG, drag Aesel into Applications, then launch it. After that, aesel in a terminal opens the app and aes runs Aesel in the terminal itself.

Running coding agents too? Slab, the menu bar companion, tiles Aesel into the same wall as your terminals.

Send feedback
-

Before you begin: Aesel requires sharing conversations and artifact revision references with authorized Aesthetic Computer staff for product improvement, including when using your own provider. Read the privacy policy.

+
+
An Aesel notebook with four revisions of a spinning maple leaf beside its live preview
+
Aesel tiled beside coding agents on a Slab desktop
+
+
+
Install & open

Drag Aesel to Applications, open it, and sign in with your Aesthetic Computer account.

aesel opens the app from a terminal. aes runs it in the terminal.

+

Use requires sharing conversations and artifact revision references with authorized Aesthetic Computer staff for product improvement, even with your own provider. Privacy policy

+
- + diff --git a/system/public/aesel/style.css b/system/public/aesel/style.css index 117e568aa6..2d9a1dc93a 100644 --- a/system/public/aesel/style.css +++ b/system/public/aesel/style.css @@ -1,2 +1,5 @@ @font-face{font-family:Pixel;src:url('/pixel.woff') format('woff');font-display:swap} -:root{color-scheme:light;--paper:#f5f0df;--ink:#302845;--purple:#6950aa;--line:#d4cdbb}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.5 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}a{color:inherit;text-underline-offset:4px}a,button{cursor:pointer}a:focus-visible{outline:3px solid var(--purple);outline-offset:6px}a:hover{color:var(--purple)}.masthead,main,footer{max-width:1344px;margin:auto;padding-left:64px;padding-right:64px}.masthead{height:98px;display:flex;align-items:center;justify-content:space-between;font-size:15px}.masthead a{text-decoration:none}.maker{font-weight:650}.maker span{margin-left:9px}.hero{display:grid;grid-template-columns:1fr 1.05fr;align-items:center;min-height:645px;gap:54px;padding:34px 0 74px}h1{font:normal clamp(90px,10vw,146px)/.95 Georgia,serif;letter-spacing:-9px;margin:0 0 26px}.period{color:var(--purple)}.lead{font:normal clamp(35px,3.5vw,49px)/1.1 Georgia,serif;letter-spacing:-1.7px;margin:0 0 24px}.description{font-size:19px;line-height:1.6;margin:0 0 31px}.download{display:inline-flex;align-items:center;gap:24px;background:var(--ink);color:var(--paper);font-size:17px;font-weight:650;padding:17px 21px;border-radius:5px;text-decoration:none;box-shadow:0 4px 0 #b8aac9;transition:transform .15s,background .15s}.download:hover{background:var(--purple);color:#fff;transform:translateY(-2px)}.download span{font-size:23px;line-height:1}.requirements{font-size:13px;margin:16px 0 0;color:#625a6b}.art{padding:30px 0 10px 8px}.paper{position:relative;min-height:471px;transform:rotate(3deg);background:repeating-linear-gradient(to bottom,#fffbed 0,#fffbed 32px,#cbd6d3 33px,#fffbed 34px);border:1px solid #d6cfbb;border-radius:5px 16px 16px 5px;box-shadow:5px 8px 0 #e2dbc8,6px 9px 0 #cfc5ae,18px 24px 40px #4b365317;padding:21px 27px 30px 46px}.paper:before{content:'';position:absolute;left:29px;top:0;bottom:0;border-left:1px solid #e3a8a1}.paper-title{display:flex;gap:12px;align-items:center;justify-content:space-between;font-family:Pixel,monospace;font-size:20px;margin-bottom:21px}.revision{color:#6b528c}.drawing{background:#ef86af;transform:rotate(-6deg);box-shadow:0 4px 10px #31244b21;border:9px solid #fffdf1;margin:20px 0 30px 3px}.drawing svg{display:block;width:100%;height:auto}.handwriting{font:20px/1.5 Pixel,monospace;white-space:nowrap}.caret{height:22px;width:2px;background:var(--purple);display:inline-block;vertical-align:middle;margin-left:4px}.donkey{position:absolute;width:90px;height:128px;background:url(/donkey.png) 0 -256px / 512px 512px;right:-19px;bottom:-31px;image-rendering:pixelated;transform:rotate(-3deg)}.steps{border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);gap:52px;padding:42px 0 55px}.steps h2{font:27px/1.2 Georgia,serif;letter-spacing:-.5px;margin:15px 0 12px}.steps p{font-size:16px;max-width:290px;margin:0;color:#625a6b}.beta-note{border-top:1px solid var(--line);padding:49px 0 46px;display:grid;grid-template-columns:1fr 1fr;gap:60px}.beta-note h2{font:40px/1.15 Georgia,serif;letter-spacing:-1px;margin:0}.beta-note p{margin:0 0 15px;max-width:450px}.beta-note a{font-weight:600}.privacy-note{font-size:13px;line-height:1.6;color:#625a6b;max-width:800px;margin:4px 0 38px}footer{border-top:1px solid var(--line);padding-top:24px;padding-bottom:30px;display:flex;gap:25px;font-size:13px}footer>span{margin-right:auto}.shots{border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1.35fr;gap:40px;align-items:start;padding:46px 0 52px}.shots figure{margin:0;min-width:0}.shots img{display:block;width:100%;height:auto;border-radius:10px;box-shadow:0 1px 0 #cfc5ae,0 18px 40px #4b365326}.shots figcaption{font-size:14px;color:#625a6b;margin-top:14px;max-width:460px}@media(min-width:1500px){.hero{min-height:720px}}@media(max-width:900px){.masthead,main,footer{padding-left:30px;padding-right:30px}.hero{gap:25px;min-height:580px}h1{font-size:108px}.paper{min-height:380px;padding-left:37px;padding-right:16px}.paper-title{font-size:16px}.handwriting{font-size:15px}.lead{font-size:38px}.description{font-size:17px}.steps{gap:25px}.steps h2{font-size:24px}.download{font-size:15px;gap:15px}.requirements{font-size:11px}}@media(max-width:650px){.shots{grid-template-columns:1fr;gap:32px;padding:34px 0}.masthead,main,footer{padding-left:24px;padding-right:24px}.masthead{height:76px;font-size:13px}.hero{display:flex;flex-direction:column;align-items:stretch;gap:42px;padding:24px 0 65px}.intro{padding:0 4px}h1{font-size:112px;letter-spacing:-7px;margin-bottom:24px}.lead{font-size:42px}.description{font-size:18px}.download{font-size:16px;padding:17px 19px}.requirements{font-size:12px}.art{padding:0 18px 0 4px}.paper{min-height:380px;max-width:420px;margin:auto}.paper-title{font-size:18px}.handwriting{font-size:18px}.drawing{margin-bottom:24px}.steps{grid-template-columns:1fr;gap:31px;padding:33px 0 40px}.steps h2{font-size:28px;margin-top:9px}.steps p{max-width:100%}.beta-note{grid-template-columns:1fr;gap:23px;padding:34px 0}.beta-note h2{font-size:36px}.privacy-note{font-size:12px}footer{flex-wrap:wrap;gap:18px}footer>span{width:100%;margin:0}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}} +:root{color-scheme:light;--ink:#393047;--soft:#65546e;--purple:#79568b;--line:#ddcedc;--mono:"Berkeley Mono Variable",monospace} +*{box-sizing:border-box}body{margin:0;color:var(--ink);background:radial-gradient(ellipse 650px 520px at 95% 0%,#f6cedf80,transparent),radial-gradient(ellipse 600px 600px at 0% 8%,#e1d7f480,transparent),radial-gradient(circle,#ae8cb32b 1px,transparent 1px) 0 0/24px 24px,#fcf0e9;font:16px/1.6 -apple-system,BlinkMacSystemFont,sans-serif}a{color:inherit;text-underline-offset:4px}a:hover{color:var(--purple)}a:focus-visible,summary:focus-visible{outline:3px solid var(--purple);outline-offset:5px}.masthead,main,footer{max-width:1008px;margin:auto;padding-left:24px;padding-right:24px}.masthead{padding-top:24px;display:flex;justify-content:space-between;font-size:14px}.masthead a{text-decoration:none}.hero{text-align:center;padding:64px 0 42px}.icon{display:block;width:144px;height:144px;border-radius:32px;margin:0 auto 20px;transform:rotate(-6deg);filter:drop-shadow(0 8px 0 #d9c6de)}h1{font:normal 96px/1 Pixel,monospace;color:var(--purple);text-shadow:3px 4px #e2cdea;margin:0 0 26px}.download{display:inline-flex;align-items:center;gap:20px;padding:13px 24px;background:var(--purple);color:white;border:2px solid #684478;border-radius:999px;box-shadow:0 5px #d2b6df;text-decoration:none;font-weight:600;transition:transform 120ms ease}.download:hover{color:white;transform:translateY(-2px)}.requirements{font-size:13px;color:var(--soft);margin:18px 0 0}.shot{margin:0}.shot img{display:block;width:100%;height:auto;border-radius:18px;border:1px solid var(--line);box-shadow:0 6px #ddcfdf}.setup{max-width:680px;margin:42px auto 0}details{border-top:1px solid var(--line);padding:16px 0}summary{cursor:pointer;font-weight:600}details p{color:var(--soft);margin:14px 0}code{font-family:var(--mono);font-size:.88em}.hash{overflow-wrap:anywhere;font-size:11px}footer{display:flex;flex-wrap:wrap;gap:20px;font-size:13px;color:var(--soft);padding-top:32px;padding-bottom:36px}footer a:first-child{margin-right:auto}@media(max-width:600px){.hero{padding:48px 0 32px}.icon{width:112px;height:112px;border-radius:26px}h1{font-size:80px}.masthead,main,footer{padding-left:20px;padding-right:20px}.requirements{font-size:12px}.setup{margin-top:30px}.shot img{border-radius:10px}}@media(prefers-reduced-motion:reduce){.download{transition:none}} + +.shots{display:grid;grid-template-columns:1fr 1.18fr;align-items:center;gap:28px}.shots figure{margin:0;min-width:0}.shots img{display:block;width:100%;height:auto;border:1px solid var(--line);border-radius:18px;box-shadow:0 6px #ddcfdf}.shot-main{transform:rotate(-2deg)}.shot-wall{transform:rotate(2deg)}.privacy-note{color:var(--soft);font-size:13px;margin:24px 0 0}.setup{margin-top:48px}.icon{transform:rotate(6deg)}@media(max-width:600px){.shots{grid-template-columns:1fr;gap:28px;padding:0 4px}.setup{margin-top:32px}.shots img{border-radius:12px}} diff --git a/system/public/slab/index.html b/system/public/slab/index.html index 6f8a4b602b..19fa5bb8e3 100644 --- a/system/public/slab/index.html +++ b/system/public/slab/index.html @@ -3,13 +3,13 @@ -Slab — a desk for running many coding agents at once +Slab - + @@ -28,481 +28,34 @@ - -

slab

- +
Aesthetic ComputerAesel ↗
-
- Slab icon: a dark stone with a glowing rune carved into it +

slab

-

A desk for running many coding agents at once.

-

A macOS menu bar app from Aesthetic Computer. Every Claude Code, Codex or Aesel session on the machine gets a colour, a name, a stone, and a place on the wall.

- -
- A Mac desktop tiled by Slab: four agent terminals and the Aesel notebook. Three panes are tinted lavender for complete, one peach for awaiting, one green for working, and each terminal carries a small pixel-art stone with a name in its corner. -
-

frisbee, a sunday afternoon. four agents, four rocks, one aesel notebook. nothing blurred, nothing staged but the tasks.

+ Download for Mac +

1.1 · 7.0 MB · macOS 12+ · Intel & Apple silicon

- -
-

what you're looking at

-
-
- -

The colour is the state.

-

Each terminal is re-skinned by the session inside it: one tint while the agent works, another when it stops to ask you something, a third when the turn is done. From across the room you know which pane wants you.

-
-
-

The title is the task.

-

Slab reads the transcript and titles the window with what the session is doing, so the Window menu reads like a to-do list instead of six copies of bash.

-
-
-

The stone is the session.

-

Top-right of every pane, a prompt rock. It spins while the agent works, slows when it is waiting, and carries a pet name so you can say "poke veguri" out loud.

-
-
-

The grid is one keystroke.

-

⌘⌥T tiles every agent terminal into a wall. ⌘⌥S scatters them again. The Aesel notebook tiles in beside them as a pane of its own, and Aesel sessions in a terminal get a live preview of the piece they are making, pinned to their pane.

-
-
-
- -
-

prompt rocks

-
- Five pixel-art stones with names under them: nilemi, veguri, zevo, kepu, vol -
-

One rock per live prompt.

-

Its shape grows from the session and the prompt in flight, so the stone re-forms when the work moves on. Its motion is the status channel: spin speed and direction say working, awaiting, complete, and a poke from another session makes it blink and rattle. It carries a pet name in bubble letters. Pointing at a rock wakes a small seeded percussion voice; clicking it reveals what the session has done so far. Sweep across the wall and the rocks are a tiny drum kit.

-

An Aesel rock is also a code. Point a phone at it and the piece that session is making opens on the phone.

-
- -
-

walking the wall

-

Slab holds a few global shortcuts. They all work whether or not the menu is open.

- -
- -
-

the ear's version

-

Three short cues, synthesized so they share one voice and differ only in contour. You learn to tell them apart without looking up.

-
-
- -
complete · two notes falling a third. A resolve: "done".
-
-
- -
awaiting · three notes climbing a triad. A question: "you?"
-
-
- -
disconnected · one tone sliding down an octave, with a beat in it. "gone".
-
-
-
- -
-

where it came from

-

Slab started in April 2026 as a sleeping laptop. Close the lid while an agent is still working and the Mac plays a slow pentatonic bed through its own speakers, answers claps and hums with little pluck arpeggios, and puts itself to sleep with a chime when the last job finishes. The name is from that: a closed MacBook on a desk, humming.

-

The lid daemon is still in the box. The menu bar grew around it once the sessions multiplied and one laptop became four Macs on one desk.

-
- -
-

one menu bar on every mac

-

Each Mac in the studio runs the same Slab. They share a ledger of live sessions over the tailnet, so an agent on one machine can name a session on another as host:name and find it instantly. A frame is a picture of any desk with its text and buttons located; a puppet acts on what the frame saw. Rocks stay local. A machine never draws another machine's stones.

-
- -
-

getting it

-

Free, signed, and about seven megabytes.

- -
- - Download Slab - for macOS - -

- macOS 12 or later, Intel and Apple Silicon. Notarized by Apple, so it opens without a warning. -
- -

-
- -

Drag it to Applications and launch it. On first run it asks once whether it may add its hooks to your Claude Code settings, which is how it learns when a session starts, stops, or wants you. It backs up that file before touching it, and the Slab menu can take the hooks back out again.

-

macOS will ask for Accessibility the first time Slab moves a window, and for Screen Recording only if you ask it for a frame. Both live in System Settings under Privacy & Security, and Slab tells you when it needs one.

-

This is an early public build, and it is honest about its age. The fleet half of Slab, the parts that reach across machines, stays quiet until it is configured. If something is wrong, the source is right there and so am I.

- -

Rather build it yourself? The repo is the studio version, symlinked so an edit lands immediately:

-
git clone https://github.com/whistlegraph/aesthetic-computer.git
-cd aesthetic-computer/slab
-./install.sh --prompt-host        # hooks + session markers; no audio, no sudo
-./menubar-swift/install.sh        # builds and launches the menu bar
-

view source · read the README

-
- -
-

recent changes

- -
- +
Slab tiling four agent terminals and an Aesel notebook, with pastel session colors and named prompt rocks.
+
+
Install & shortcuts +

Drag Slab to Applications and open it. Allow Accessibility when prompted so it can move windows. The first-run dialog offers to add Claude Code hooks; it backs up your settings first.

+

⌘⌥T tile · ⌘⌥S scatter · ⌘⌥←↑↓→ move between windows · ⌘⌥X focus rocks.

+

Screen Recording is requested only when you capture a frame. Multi-Mac features need separate setup.

+

Signed and notarized by Apple. Documentation

+

+
+
- - +