01The redesign deck · September 2026

Day Island

How a flat homepage became one full day drawn as an ink-on-paper island — told through every prompt that asked for it, every design question that shaped it, the paths not taken, and the bugs the build caught on the way.

Open the island ↗ 8 prompts · 27 design questions · 9 rounds daredavil01/daredavil01

02The brief

It started with one open-ended prompt.

Prompt 01 · plan modeverbatim

I want to completely redesign this. Explore options to make this interactive, engaging. Ask questions to clarify requirement. Use full imagination and be as creative as possible. Research the web for ideas if you want.

Light fix: “clarify requirements”.

“This” could have meant the homepage, the README or the whole repo. So the work began with a read of everything the hub linked to — 16 pages, the README and the old homepage’s 3,719 lines — and a first round of design questions instead of a design.

Working agreement for the whole session: plan first, ask before assuming. Every fork in this deck was a question put to the owner, with a recommendation and the option to type something else.

03Before · the Field Almanac

A handsome page with eight hidden rooms.

The old Field Almanac homepage: warm paper, a serif headline 'A developer who runs at dawn and reads past midnight', a nav of eight views — The Field Almanac, top

Further down the old homepage: grids of project cards in two bands — …and its card bands

What the audit found

Eight views (About, Miles, Shelf…) toggled by a go(view) router — no URLs, so no deep links, and Back always went home
The clock said “Pune” but used the visitor’s time zone
Eight <h1>s, no landmarks, nav items that were <span>s
Numbers that disagreed: 20+ vs 21 races, 15+ vs 18 forts, 43 vs 48 books
No dark mode, no reduced-motion handling, 384 inline style=""s
The Shelf promised “spines you can pull” — they were twelve plain <div>s

04Design questions · round 1 of 9

Four questions set the ambition.

The answers pushed every dial to the top: the whole site, any look, a show-stopper, and one journey instead of eight rooms.

Scope

What should the redesign cover? (“this” could mean a few things in this repo)

Homepage only (Recommended)
Homepage + README
Whole site

Aesthetic

How far from the current “Field Almanac” look (warm paper, serif, rust accent) should it go?

Clean break
Evolve the almanac
Surprise me

Intensity

How ambitious should the interactivity be?

Show-stopper
Rich but light (Recommended)
Subtle & editorial

Content

What should happen to the in-page content views (About, Miles, Shelf, Treks, Notes, Now, Stats)?

Keep all, re-imagine
Slim hub
Merge into one journey

05A constraint worth having

The live site already had a map. This one got a clock.

Reading the repo turned up docs/personal-website-redesign.html: sankettambare.in already runs “The Wanderer’s Atlas” — a globe you dive into, an illustrated map of regions, quests and a passport.

A second world organised by place would just be a copy.
The homepage’s own tagline — “a developer who runs at dawn and reads past midnight” — is organised by time.
So: one island, one day. Every chapter is an hour; the scroll is the clock.
No quests, no passport — the only collectible is a quiet count of hidden field notes.

One request was declined along the way: fetching the live site for book and race lists. Everything on the island comes from data already in this repo.

06Prompt 02 · into 3D

Prompt 02 · plan modeverbatim

What are the possible options to convert this in 3d designed world? Give it rich, professional look.

Light fix: “convert this into a 3D-designed world? Give it a rich, professional look.”

Six worlds went on the table — each a different answer to “what is a personal site, spatially?” — every one with the same promise: a real typographic layer on top, deep links, and a plain classic page as the fallback.

Day Island ✓

A floating diorama that runs one full day; drag the clock from 05:30 to 00:30.

  ☀ 05:30 ━━━●━━━━━ 00:30 ☾
         ▲ fort
   ┌───/^\─── tower ──┐
   │ ~~river~~  run   │
   └─[studio]─────────┘

The Ridge

Scroll climbs a Sahyadri trail; campsites are projects, the summit fort is contact.

              ▲ SUMMIT
      ⛺ camp 2 ./
  ⛺ camp 1 ../
 🏠 base   ▁▂▃▅▇ elevation

The Observatory

Projects as constellations, books as a nebula, races as comets.

  ✦ · ✧     ·  ✦
    ✦──✦ Ask the Archive
  ☄ races   ░nebula░
 ▁▂▃▅▇▆▄ Sahyadri

The Studio

A cabin room: the monitor runs the decks, a shelf of pullable books, a medal wall.

The Long Run

A 42.195 km course: km boards are chapters, aid stations are projects.

Open world

A walkable avatar with physics, Bruno-Simon style.

07Design questions · rounds 2–3

A day island, drawn in ink, flown like a film.

Round 2 · the world

World

Which 3D world should the site become?

Day Island (Recommended)
The Ridge
The Observatory
The Studio

Navigation

How should visitors move through the world?

Guided cinematic (Recommended)
Free-roam avatar
Hybrid

Art style

Which art direction gives the “rich, professional” look you want?

Stylized soft-lit
Cinematic luminous
Topographic ink
Photoreal PBR

Assets

Where should the 3D assets come from?

Procedural, code-only (Recommended)
CC0 model kits
Your Blender models

Round 3 · the rest of the site

Sub-pages

“Whole site”: how far should the island look reach into the sub-pages?

Shared chrome (Recommended)
Chrome + re-skin “me” pages
Re-skin everything

README

What should happen to the GitHub profile README?

Island banner + rewrite (Recommended)
Banner only
Text only

Extras

Which extra layers should the island have? (pick any)

Ambient sound
⌘K command palette
Hidden field notes
Live “what’s Sanket doing now”

08Prompt 03 · rounds 4–5

Prompt 03 · mid-planverbatim

Use it from blender

Light fix: “Use it from Blender” — i.e. build the island’s assets in Blender.

The Blender plan (as first drawn up)

pip install bpy==4.5.14 (4.5 LTS) — Blender, headless, in the container
Python scripts model the island; Cycles bakes AO + three sun-shadow keys
A node naming contract — stop_run, cam_build, hot_read_* — so a GUI edit re-exports without touching JS
Freestyle ink renders for the README banners and classic-view stills
Found on the way: no EGL in the container, so Eevee, Workbench and Line Art can’t render headless — Cycles on CPU only

Round 4 · Blender

Blender

“Use it from Blender” — who should build the island in Blender?

You script it in Blender (Recommended)
I’ll model it myself
Hybrid

Blender use

Where should Blender’s rendering be used, beyond the models? (pick any)

Baked lighting/AO
Authored camera & animation
README banner via Freestyle
Classic-view illustrations

Round 5 · the numbers disagreed, so the owner decided

Books

The book count disagrees across the repo. Which is canonical?

48 (infographic)
43

Ratings

Java and C skill ratings disagree. Which is right?

★★★ (README)
★★ (homepage)

No preference → went with ★★★

Option	Visitor download	Repo	Tooling
A · full Blender	~1.5 MB	15–30 MB	1.2 GB install · ~40 min bake
B · Blender-lite	~1 MB	2–3 MB	1.2 GB install · ~3 min
C · in the browser	~0.1 MB	~1.5 MB	none
D · browser, Blender-ready	~0.1 MB	~1.5 MB	none now

Zdog looked light — until it met the model kits.

Round 7 · beyond Blender

Ground

What should the island’s ground be?

Real Sahyadri terrain (Recommended)
Procedural island
Zdog illustrated 3D
Pre-rendered scroll film

Props

Where should buildings and props come from? (pick any)

Procedural code
CC0 low-poly kits
AI-generated models
Browser design tool

Memories

Add photoreal “memories” — 3D scans captured on a phone?

Later, leave a slot
Yes, plan for it now
No

Round 8 · the conflict: Zdog draws its own shapes and can’t load GLB models

Props in Zdog

Zdog can’t load the CC0 model files. How should the props be made?

Zdog-native, kits as reference (Recommended)
Convert a few CC0 props
Switch to three.js

Ground look

What should the island’s ground look like?

Stacked contour layers (Recommended)
Round toy diorama
Flat tile island

11What got built

No Blender, no build step, one static page.

Day Island · a guided camera · topographic ink · three.js 0.186 from jsDelivr through an importmap · free Kenney models plus code. The page is readable before a single module loads.

index.html

Semantic content: 10 stops, 22 registry cards, 12 field notes, meta/OG. Works with no JS.

→

classic scripts

core · registry · router · ui · cmdk · notes — IST clock, deep links, ⌘K. No CDN needed.

→

boot-world.js

WebGL2 + importmap + no reduced motion? → island. Otherwise the classic view.

→

world/ modules

main3d → scene → terrain · props · materials · post · palette · rail

models/

props.glb.gz 145 KB · runner.glb.gz 28 KB — meshopt + gzip, inflated with DecompressionStream

assets/chrome/

One shared “← Home” chip for all 16 sub-pages

tools/ (offline only)

Kenney kits → GLB · still/banner capture · Playwright QA. The site never needs it.

12The island · a laser-cut topographic model

Terrain as stacked contour slices.

A seeded heightmap — 177 × 129 cells, seed 1834 for 18°34′N — with a warped coast, a carved river, bays and flat pads for buildings
Marching squares cut 15 contour levels; Chaikin smoothing rounds each ring
Every level becomes an ExtrudeGeometry terrace; tops and walls merge into two meshes
The fort sits on an irregular Deccan-trap mesa — scarp sides, 7.5 units up
Built in the browser at load, in about 250 ms; the same seed draws the same island every time

The island from the fort stop: a stepped mesa with the fort on top, terraces drawn as ink rings — The mesa, fort on top, 16:00

The fort stop in island view, with its panel on the right: 18 forts and summits, and one 22-hour night march — The same stop with its panel

13The renderer · nothing outputs colour until the end

Four passes turn geometry into a drawing.

Normals + depth → a Sobel filter draws the ink edges (every terrace rim for free)
Ink data — every material writes a packed texel, not a colour
Composite → paper, hatching by tone, ink, rust, glow, grain, distance fade
Glow — beam, stars, moon, lantern halos, depth-tested against pass 1

Channel	Meaning
R · tone	0 = sunlit paper … 1 = deep shade (drives the hatching)
G · ink	extra line work: strata, isobaths, ripples, trails
B · accent	0–0.5 rust; 0.5–1 glow (lit windows, lamps)
A · class	sky · water · land · props · lines

// composite pass: hatch by tone, at CSS-pixel pitch
float h1 = hatchLine(vec2(cp.x + cp.y + wob, 0.0), 5.2, 0.9) * smoothstep(0.30, 0.40, tone);
float h2 = hatchLine(vec2(cp.x - cp.y + wob, 0.0), 5.2, 0.9) * smoothstep(0.52, 0.62, tone);
float h3 = hatchLine(vec2(cp.y + wob * 0.5, 0.0), 3.4, 0.8) * smoothstep(0.74, 0.84, tone);

14Props · free kits, one ink style

Nine Kenney kits became 145 KB.

tools/props/kits.json pins 9 CC0 kits (castle, nature, watercraft, city, pirate, survival, fantasy town, mini characters) by URL and sha256
build-props.mjs flattens 57 prototypes, samples each kit’s colormap under every vertex into COLOR_0, then drops the textures — so mixed kits read as one ink drawing
gltf-transform: weld → dedup → quantize → reorder → meshopt → gzip
The runner is a skinned Kenney character that keeps only its sprint and idle clips — 28 KB — and only comes out at dawn
Code draws what the kits don’t have: the banyan and its chaupal, the lighthouse lamp and beam, the observatory dome, the orb, paper boats

145 KB

props.glb.gz · budget 600

28 KB

runner.glb.gz

57

prototypes, instanced

~190 KB

three.js from the CDN

15One number decides every colour

Ink on paper by day, cyanotype by night.

A single uHour drives the palette keys, the sun and moon, and a shadow map that sweeps as you scroll. After dusk, windows light up one by one, lanterns glow, stars twinkle and the lighthouse beam turns.

The whole island at 09:30: ink on warm paper, the fort on its mesa, the library tower, the harbour studio — 09:30 — the README banner, light mode

The same island at 22:30 in cyanotype blue: pale ink lines, rust-lit windows and a lighthouse beam — 22:30 — the same banner in dark mode

16The guided camera

Scrolling turns the clock and flies the camera.

RUN panel · camera parked · 05:30 → 06:40

spacer · camera flies · 06:40 → 09:00

BUILD panel · camera parked · 09:00 → 11:30

spacer · …

focus = scrollY + vh × 0.5          // 0.66 on phones
inside a panel  → u = k,            hour = in → out
inside a spacer → u = k + ease(f),  hour = out → next in

A Catmull-Rom rail through every stop’s shot, with lifted midpoints so transits arc over the island
setViewOffset keeps the subject clear of the panel; phones get bottom sheets
Links, ⌘K and the scrubber all become a scroll — one source of truth — so Back just works

17The old views, merged into one journey

One day, nine stops.

05:30 · The river mouth21 races, PBs 5:05 / 1:59 / 0:55, RunSmart, RunFolio

09:00 · The studioThe career record, the stack rated honestly, what shipped

13:00 · The library48 books by genre, and Ask the Archive’s wing

16:00 · The fort18 forts, the 22-hour Panhala → Pawankhind march

18:00 · The commonsAI-governance research, foundation sites, the Adivasi survey

20:00 · The pavilionThe Wanderer’s Digital Escape and its orb

22:00 · The lighthouse1,600+ micro-posts, 86,789 long-form words

00:30 · The observatoryNow, socials, and “across the water ↗”

now · The whole islandOpens at the real time in Pune; the map lists everything

18Navigation without a framework

Every place is a plain element id.

The registry: each page is one <article id="stop/slug"> in #map; registry.js moves it to its stop, lists it in its band and indexes it — adding content is one article
Deep links like #read/ask-the-archive land on the card with a “you were here ↩”; Back and Forward fly the camera
⌘K searches 104 entries — stops, pages, races, forts, genres, the stack, socials
12 field notes appear only inside their hour; a found note is remembered, nothing more
The “now” line uses Asia/Kolkata, whatever the visitor’s zone: “It’s 14:07 in Pune — probably back at the studio, shipping.”

19“Whole site” · shared chrome

Every page finds its way back to its own spot.

Four sub-pages, each with the same small chip at top left: a contour glyph, '← Home', and the hour and place it returns to — The same chip on four very different pages

Each page keeps a static <a data-island-return href="…#stop/slug">← Home</a> — it works without JS
chrome.js draws one consistent chip in its place, inside a shadow root, so decks keep their own CSS and arrow keys
It copies the original link’s position and picks ink-on-paper or cyanotype from the background behind it
16 pages, 1–3 lines each; the game and the E20 deck gained the Home link they never had

20For every visitor

The island is an enhancement, not a gate.

The classic view: a vertical day timeline with an ink still of the whole island above the headline — Classic view · light

The classic view in dark mode: cyanotype blue paper with pale ink lines — Classic view · dark (cyanotype)

No WebGL2, prefers-reduced-motion, Save-Data or ?classic → the classic day timeline, with Blender-free ink stills captured from the island and recoloured by CSS masks
No JavaScript → every word and all 22 cards are still there, in the two bands
Phones get the island too, with each panel as a bottom sheet under it
The first paint already knows the hour: after dusk in Pune the page opens in cyanotype, before a single module loads

Island view on a phone at night: the island above, the hero panel as a bottom sheet — Phone · 21:40 · bottom sheet

21Screenshots, not assumptions

What the build caught.

Before the fix: the fort floats above a flat island

1 · The floating fort

Only 2 of 15 terrace levels drew: merging the levels gave each one its own material slot, and only two materials existed.

Fix: merge tops and walls into two meshes.

Before the fix: the lighthouse lamp floats over a tiny stub tower

2 · The tiny lighthouse

Quantized models keep their scale on the node, not the mesh; placing only the geometry shrank a 10-unit tower to a stub.

Fix: carry each prototype’s node matrix into its instances.

Before the fix: orange glowing trees at night

3 · Trees that lit up

“Blue-ish means glass” also caught green leaves and blue-grey stone, so whole forests glowed like windows at night.

Fix: glass is g−r > 0.08 and b−g > 0.05 — Kenney’s real glass swatches.

Before: a washed-out purple panel at dawn

After: the dawn panel readable on rosy paper

4 · Unreadable dawn

Paper and ink swap brightness at dawn and dusk — and the swap landed right on the 05:30 and 18:00 stops.

Fix: swaps moved into the spacers, plus a contrast guard for panels.

5 · The 84-pixel chip

getComputedStyle resolves all four offsets; copying both left and right squeezed the Home chip to 84 px.

Fix: keep only the corner the original is anchored to.

6 · Lagging panels, trusted proxies

A 0.4 s panel colour transition let pale night ink land on a still-light panel mid-flight (found while making this deck). Headless Chrome also couldn’t trust the sandbox’s TLS proxy.

Fix: no colour transition; QA answers the CDN from pinned local packages.

22After

Day Island, live on GitHub Pages.

Day Island at 10:30: the hero panel on the left, the ink-drawn island on the right — 10:30 · the hero over the island

The lighthouse stop at 22:00 in cyanotype: the beam sweeping, the writing panel on the right — 22:00 · the lighthouse

65

files in the Day Island commit

+7,371

lines added · −3,752 removed

9

stops, one day

22

registry cards, incl. this deck

17

sub-pages with the chip

51

QA checks passing

23Prompts 06–07 · round 9

And then: a deck about the deck-maker’s day.

Prompt 06verbatim

Directly commit of all these changes to main and push as well. I want to create a presentation about this re-design efforts and the detailed Redesign Ass this as static Html Slides, add under presentations, and list on homepage. Use illo-skill for drawing illustrations.. Ask questions to clarify requirement. For the presentation, include provided prompts in the slides.

Light fix: “Directly commit all these changes…”, “this redesign effort”, “Add this as static HTML slides”, “use the illo skill”, “clarify requirements”, “include the provided prompts”.

Prompt 07 · resent after a restartverbatim

… For the presentation, include provided prompts, design questions in the slides.

Light fix: “include the provided prompts and design questions”. The rest repeats prompt 06.

Round 9 · this deck

Illustrations

The illo skill isn’t installed in this session. How should the illustrations be drawn?

Match illo house style (Recommended)
Illo style, Day Island palette
Wait for the illo skill

Length

How deep should the deck go?

~12 slides
~20 slides (Recommended)
~30 slides

Content

What should the deck include besides your prompts and the illustrations? (pick any)

Before / after
Real renders
Decision trail
Engineering + numbers

Prompts

How should your prompts appear on the slides?

Verbatim, as typed
Verbatim + light fix
Lightly edited

The illo skill wasn’t available in this session, so every drawing here follows its house style by hand — Blot, warm paper, a 4 px ink line, one teal and one orange accent — as in the Ask the Archive deck.

24Prompt 08 · the rule

New content lands in three places, or it isn’t done.

Prompt 08 · after the deck’s first draftverbatim

continue, now also add instructions in claude.md that whenever such presentation/ doc/ project is added, entry should be added on homepage. readme and claude.md

Light fix: “Continue. Now also add instructions in CLAUDE.md that whenever a presentation, doc or project is added, an entry should be added on the homepage, README and CLAUDE.md.”

Now in CLAUDE.md and AGENTS.md

Whenever a presentation, doc, dashboard, game, prototype or project is added, renamed, moved or removed, update all three in the same commit:

index.html — one registry card in #map, in the right band
README.md — the matching Projects row, plus In This Repo
CLAUDE.md + AGENTS.md — the directory tree, kept in sync

The task isn’t done until all three are updated. node tools/qa.mjs already fails if a page is missing from the homepage.

This deck is the rule’s first customer: the card build/day-island-deck, a Day Island row in the README’s Websites table, and its entries in the tree.

25Appendix · every prompt, in order, verbatim

Eight prompts, twenty-seven questions, one island.

01 · the brief

I want to completely redesign this. Explore options to make this interactive, engaging. Ask questions to clarify requirement. Use full imagination and be as creative as possible. Research the web for ideas if you want.

02 · into 3D

What are the possible options to convert this in 3d designed world? Give it rich, professional look.

03 · Blender

Use it from blender

04 · weight

What are the options for blender, as it is heavy

05 · typed as an answer

Suggest other options for 3D

06 · ship it, then tell the story

Directly commit of all these changes to main and push as well. I want to create a presentation about this re-design efforts and the detailed Redesign Ass this as static Html Slides, add under presentations, and list on homepage. Use illo-skill for drawing illustrations.. Ask questions to clarify requirement. For the presentation, include provided prompts in the slides.

07 · resent

I want to create a presentation about this re-design efforts and the detailed Redesign Ass this as static Html Slides, add under presentations, and list on homepage. Use illo-skill for drawing illustrations.. Ask questions to clarify requirement. For the presentation, include provided prompts, design questions in the slides.

08 · the rule

continue, now also add instructions in claude.md that whenever such presentation/ doc/ project is added, entry should be added on homepage. readme and claude.md