Adds original OpenScribe illustrations and elevates the whole site from a plain
scaffold to a polished, animated product site.
What changed:
- assets/img/: original SVG artwork (CC-BY-SA, no third-party photos):
- openscribe-wearable.svg - the wearable recorder with a breathing status LED (SMIL
animation that plays even when embedded via <img>).
- openscribe-kit.svg - the dev/kit build: ESP32-S3 board + I2S mic + microSD + LiPo,
with amber trace connectors.
- favicon.svg - the "12" studio mark; wired as the site icon and header logo.
- index.html: two-column hero with the floating device, a trust strip, a featured
showcase (device image + sync diagram), project cards with device thumbnails, and a
new "why open beats a locked box" comparison table (our own words, no competitor art).
- projects/openscribe.html: device hero, the AI picker in a proper panel, and a new
"two ways to build it" section with product figures (wearable + kit) and descriptions.
- assets/styles.css: full theme refresh - atmospheric background, gradient headings,
hero float, hover lift + shadows, product/figure styles, comparison table, and
scroll-reveal transitions (honours prefers-reduced-motion).
- assets/app.js: IntersectionObserver scroll reveals alongside the provider picker.
- README: documents the artwork and that it is original/publishable.
Why:
- The user asked for product images with descriptions, then to "make it amazing" - this
delivers IP-safe original device imagery and a genuinely polished, animated site.
Notes:
- Still zero dependencies and no build step. Validated: app.js passes node --check, all
SVGs are valid XML, HTML section tags balanced, every local link/asset resolves.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Initial static site (no framework, no build) for the 12 Hobbies Studio maker
studio, featuring OpenScribe as the flagship project.
What changed:
- index.html: studio home - hero, featured OpenScribe block with sync diagram,
projects grid, about. British spelling, dark warm theme.
- projects/openscribe.html: OpenScribe product page. Leads with the "bring your
own AI" differentiator, an interactive provider picker, the feature set, a
four-step build guide, and licensing.
- assets/styles.css: all styling (palette, cards, featured layout, picker, code blocks).
- assets/app.js: dependency-free provider picker that swaps a sample server .env
snippet across Ollama / OpenAI / Anthropic / Groq / LM Studio - on message with
OpenScribe's any-AI design.
- README, LICENSE (MIT for site code), .gitignore.
Why:
- The user asked to develop a site on 12 Hobbies Studio; this is the first cut,
showcasing OpenScribe and the connect-to-any-AI capability. Branding uses sensible
defaults and is trivially editable (noted in README).
Notes:
- Pure static files; deploy to any static host or Forgejo Pages. Validated: app.js
passes node --check; HTML section tags balanced.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
