Laurence
e1bf5a2d7a
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>
115 lines
4.5 KiB
HTML
115 lines
4.5 KiB
HTML
<!doctype html>
|
|
<!-- SPDX-License-Identifier: MIT -->
|
|
<html lang="en-GB">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<title>12 Hobbies Studio - open, self-hosted maker projects</title>
|
|
<meta name="description" content="12 Hobbies Studio builds open-source, self-hosted maker projects. Flagship: OpenScribe, an AI voice recorder you can connect to any AI." />
|
|
<link rel="stylesheet" href="assets/styles.css" />
|
|
</head>
|
|
<body>
|
|
<header class="site-header">
|
|
<div class="wrap">
|
|
<a class="brand" href="index.html"><span class="mark">12</span> Hobbies Studio</a>
|
|
<nav class="nav">
|
|
<a href="#projects">Projects</a>
|
|
<a href="#about">About</a>
|
|
<a href="projects/openscribe.html">OpenScribe</a>
|
|
</nav>
|
|
</div>
|
|
</header>
|
|
|
|
<main>
|
|
<section class="hero">
|
|
<div class="wrap">
|
|
<div class="eyebrow">A maker studio</div>
|
|
<h1>Twelve hobbies, one habit:<br /><span class="accent">build it open, run it yourself.</span></h1>
|
|
<p class="lead">12 Hobbies Studio makes small, open-source, self-hostable projects across
|
|
hardware, software and everything in between. No lock-in, no subscriptions you cannot leave,
|
|
no data you do not own.</p>
|
|
<div class="btn-row">
|
|
<a class="btn primary" href="projects/openscribe.html">Meet OpenScribe</a>
|
|
<a class="btn" href="#projects">Browse projects</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section>
|
|
<div class="wrap">
|
|
<div class="featured">
|
|
<div>
|
|
<div class="kicker">Flagship project</div>
|
|
<h2>OpenScribe</h2>
|
|
<p class="section-sub">An open-source, self-hosted AI voice recorder in the spirit of a
|
|
Plaud device - but you bring the AI. Record on a small ESP32-S3, sync over BLE or WiFi,
|
|
transcribe and summarise with <strong>any AI you choose</strong>: open-standard, local,
|
|
or a commercial API.</p>
|
|
<ul>
|
|
<li>Open hardware, open firmware, open API - build it and own it.</li>
|
|
<li>Connect to OpenAI, Anthropic, Groq, a local model, or your own server.</li>
|
|
<li>Self-hosted transcription and summaries. No mandatory cloud.</li>
|
|
</ul>
|
|
<div class="btn-row">
|
|
<a class="btn primary" href="projects/openscribe.html">Explore OpenScribe</a>
|
|
<a class="btn" href="https://git.discworld.casa/laurence/openscribe">Source</a>
|
|
</div>
|
|
</div>
|
|
<div class="diagram">mic
|
|
-> ESP32-S3 (record to SD)
|
|
| BLE / WiFi sync
|
|
v
|
|
self-hosted server
|
|
transcribe -> summarise
|
|
| (any AI provider)
|
|
v
|
|
phone app + open API</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="projects">
|
|
<div class="wrap">
|
|
<h2>Projects</h2>
|
|
<p class="section-sub">One shipped, more in the workshop. Everything here is open source.</p>
|
|
<div class="grid">
|
|
<a class="card" href="projects/openscribe.html">
|
|
<span class="tag">hardware + AI</span>
|
|
<h3>OpenScribe</h3>
|
|
<p>Self-hosted AI voice recorder. Bring your own AI, open or commercial.</p>
|
|
</a>
|
|
<div class="card soon">
|
|
<span class="tag">in the workshop</span>
|
|
<h3>More soon</h3>
|
|
<p>New hobbies, new builds. This grid grows as projects ship.</p>
|
|
</div>
|
|
<div class="card soon">
|
|
<span class="tag">idea</span>
|
|
<h3>Your idea?</h3>
|
|
<p>Open a discussion on the forge. The studio likes a good excuse to build.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="about">
|
|
<div class="wrap">
|
|
<h2>About the studio</h2>
|
|
<p class="section-sub" style="max-width:680px">
|
|
12 Hobbies Studio is a home for maker projects that are worth doing properly and worth
|
|
sharing. The through-line: build in the open, keep the data with the person who made it,
|
|
and let anyone reproduce the whole thing from the repo alone. Firmware, servers and apps
|
|
are copyleft; hardware is open-hardware licensed; docs are share-alike.
|
|
</p>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<footer class="site-footer">
|
|
<div class="wrap">
|
|
<div>© 12 Hobbies Studio. Built open. <span class="pill">self-hosted</span></div>
|
|
<div><a href="https://git.discworld.casa/laurence/openscribe">OpenScribe source</a></div>
|
|
</div>
|
|
</footer>
|
|
</body>
|
|
</html>
|