Skip to content

Mouse marketing site with dither-boids hero - #18

Draft
ThyFriendlyFox wants to merge 4 commits into
mainfrom
cursor/mouse-marketing-site-6b60
Draft

ThyFriendlyFox wants to merge 4 commits into
mainfrom
cursor/mouse-marketing-site-6b60

Conversation

@ThyFriendlyFox

Copy link
Copy Markdown
Collaborator

Sleek.design–shaped landing page for Mouse, in Mouse’s own visual language.

What’s in site/

  • Hero — full-bleed dither-boids widget (?embed=1) that auto-loads logo + interface screenshots, orbits, and cycles imagery. Copy sits clear on the left; flock biases right.
  • Gestures — the shell law as a six-card grid + the exact gesture-law quote.
  • Screens / gallery — repo screenshots (docs/ + sketches/).
  • Stack — msh / node / git, then clone → push steps.
  • FAQ + CTA — GitHub / build instructions.

Design tokens follow DESIGN.md: IBM Plex Mono, black/white, no accent color, no reassurance microcopy.

Preview

cd site && python3 -m http.server 8765

Hero desktop
Gestures
Screens
Stack
Hero mobile

Notes

  • Widget chrome is hidden in embed mode; standalone dither.html still has the full controls panel.
  • Reveal animations are progressive-enhancement (html.js) so content stays readable without JS.

To show artifacts inline, enable in settings.

Open in Web Open in Cursor 

cursoragent and others added 4 commits August 12, 2026 10:56
Static landing page under site/, structured like sleek.design but in
Mouse's monochrome terminal language: IBM Plex Mono, gesture law,
screenshots from docs/, and the dither-boids widget as the interactive
hero (embed mode auto-loads app imagery and cycles slots).

Co-authored-by: ThyFriendlyFox <thyfriendlyfox@gmail.com>
Moves the marketing site into a dedicated website/ folder and ships the
dark, modern redesign: fully dark theme, pill nav with a live GitHub star
count, badge + headline-first hero over the dither-boids widget (driven by
real app screens), screenshot feature cards, and restyled sections. Keeps
Mouse's IBM Plex Mono / monochrome, terminal-honest identity.

Co-authored-by: ThyFriendlyFox <thyfriendlyfox@gmail.com>
Website: redesigned marketing site under website/
* website: SEO + performance pass

SEO: target 'mobile coding app' and 'apps for builders' in the title, meta
description, keywords, and JSON-LD (SoftwareApplication + WebSite); add
canonical, Open Graph/Twitter cards with a 1200x630 og-cover, robots.txt, and
sitemap.xml; weave the phrases into hero/section copy.

Performance (Lighthouse 63 -> ~98): self-host IBM Plex Mono (drops the
render-blocking Google Fonts request) with preload + font-display swap; defer
the dither iframe until load+idle; and in embed mode only, skip the OCR
(tesseract) path and lower particle density. The standalone dither widget is
unchanged.

Co-authored-by: ThyFriendlyFox <thyfriendlyfox@gmail.com>

* ci: add Lighthouse CI gate for the website

Runs Lighthouse (3x, median) against website/ on PRs and pushes that touch it,
asserting performance >= 0.85 and accessibility / best-practices / SEO == 1.0,
and uploads a public report link. Verified the gate both passes at current
scores (perf 0.97-0.98) and fails when the bar is set impossibly high.

Co-authored-by: ThyFriendlyFox <thyfriendlyfox@gmail.com>

* website: render recognized text in the hero via pre-baked OCR + fade-in

Bake each hero image's OCR (words + boxes) offline with the same tesseract.js
pipeline the widget uses, saved to assets/ocr/<name>.json. In embed mode the
dither now applies this baked data so the flock spells the real terminal/code
text as glyphs, with no tesseract download or OCR at runtime. Add a
fade-in-from-black on the hero iframe once the first screen forms.

Co-authored-by: ThyFriendlyFox <thyfriendlyfox@gmail.com>

---------

Co-authored-by: Cursor Agent <cursoragent@cursor.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants