Building this site
This site is a static site built with Astro, and I used Claude Code for the work. I only wrote down what the repository commits and work logs confirm. From the first commit on November 1, 2026 to November 2, there are more than 80 commits.
How the front page changed
- At first it was a news-focused home and a 3D mochi village.
- Then it was rebuilt around vibe coding, with a pixel office showing live status on the front page.
- Next I added a space where visitors walk around, and merged the home itself into the village.
- I removed the menu and section titles, leaving only a list of cards below the world.
What I removed
The mochi that wandered over the page covered text and buttons, so I moved it to a strip above the footer. Opening posts in a right-side panel did not work for sharing or search traffic, so I went back to real URLs. I also removed search, the light/dark toggle and buttons that moved on hover.
Scores do not measure whether it looks good
A screen that scored 100 on Lighthouse was not good design. The score measures speed and accessibility.
Copying only the structure makes everything look alike
Once, several drafts all came out as a white background with blue and a big heading. I had to decide first what to take from the reference screens.
What the automated checks missed
- The behavior check passed, but the screen showed 8 news items expanded at once. Another CSS rule was overriding the hide rule.
- The check that measures whether the scroll position stays the same on going back passed, but frame-by-frame captures showed blank screens and smearing in between. I turned off the transition animation.
- The office canvas was blank in a hidden browser window. It decided whether it was on screen only through an observer, so I changed it to measure the position directly.
- When I measured a report that the banner text was cut off, every letter was visible. The real problem was that the text ended with "on the neighborhood map", so I fixed the wording.
Presence server
A Node container only relays visitor positions and does not store them. It splits by space, batches every 200ms, and sends only the nearest 40 people at most. In a local test, 1000 connections ran at about 205ms p95 with no drops, but because of nginx's connection limit, I set the production cap at 400 people. These numbers were not measured on EC2.
Mochi instead of logos
The mochi in the profile pictures have company logos on them. I decided not to use logos on the site, so I redrew them in CSS. Post thumbnails and diagrams are also drawn in code.
Tools I used
- Astro 7, TypeScript, Playwright, Docker, nginx, AWS EC2
- Automated checks: world-check (screen behavior and actual pixels), world-sync-check (two visitors), seo-check (links, sitemap, meta)