Konomondo × Edventure · Live Session

AI Onboarding

Learn the ideas, build the LaTeX app, then put it on autopilot with Hermes.

4 HOURS · FULLY HANDS-ON

Emile · Hobo Labs · hello@hobolabs.digital

Today

What we'll do in 4 hours

Three parts: learn the ideas, build & understand the LaTeX app, then put it on autopilot with Hermes.

A build-along: I share my screen, you do every step on your own access.

Part 1 · Walk the onboarding site40 min

Break10 min

Part 2 · The LaTeX app — run & read45 min

Skills in the code + extend30 min

Break10 min

Part 3 · Migrate to Hermes45 min

Handover & wrap15 min

The shape of the day

Ideas → app → autopilot

1Learn the ideasskills · profiles · memory · AGENTS.md · spec-driven

2Build & understand the LaTeX appwhere the image actually comes from — and skills in real code

3Put it on autopilot with Hermesthe operator that drives the app on a schedule

The through-line · spec-driven development

Brainstorm

›

Spec

›

Plan

›

Execute

›

Test

Before we start

Get set up

Onboarding site

ai.konomondo.org

the lessons & the map

Browser VS Code

aiworkspace.konomondo.org

your VS Code password

Hermes dashboard

hermes.konomondo.org

log in trainee / hermes

One kit, three of you. For edit-and-redeploy steps, pair at the shared screen (only one redeploy at a time). For everything else, each open VS Code in your own browser and work in your own terminal.

Hands-on · 15 min

① Everyone gets in

1Open the three URLs and log in

2In VS Code: Terminal → New Terminal

3The projects are already open — latex-starter + hermesmissing them? run clone-projects

4Open the Explorer and confirm both folders

✓

Checkpoint
Everyone sees both folders in the Explorer before we move on.

Part 1 · walk the site

Five ideas that recur all day

Skills

A SKILL.md procedure the agent follows instead of improvising. Same format everywhere.

Profiles & SOUL.md

SOUL.md = who the agent is. Profiles switch whole setups.

AGENTS.md

Project rules and conventions the agent picks up.

Memory

What it remembers across sessions — not just one chat.

Spec-driven

Think before you build — the Superpowers loop.

Watch for skills — you'll meet the same SKILL.md format in the app and in Hermes.

Pause

Break

10 minutes — stretch, water, questions

Up next: Part 2 — the LaTeX app

Part 2 · the LaTeX app

This is the thing that renders

Prove the engine before any AI. The app has the latex + dvisvgm libraries that turn maths into an image — the model just decides what to feed them.

1npm run smoke → an SVG, no model at all

2npm run dev → open it from the Ports panel

3Type a maths prompt → Run agent → image in seconds

Always run smoke first. If smoke works but a prompt doesn't, it's the model — not the renderer. That one habit saves every debugging session.

Part 2 · how it works

Prompt in, image out

Prompta maths topic

›

Flue agentOllama Cloud

›

render_latexthe tool

›

latex + dvisvgmTeX Live

›

SVGin the UI

the code

public/index.html     UI: POST + poll
agents/studio.ts      the agent
shared/render-tools   the render_latex tool
shared/render.ts      runs latex + dvisvgm

The agent doesn't draw anything. It calls a tool; the tool runs the LaTeX library. The model picks the formula; TeX Live makes the picture. Remember this for Part 3 — Hermes has the model half, not the TeX Live half.

Part 2 · skills ⭐

The same SKILL.md — now in the app

Skills are reusable guidance the agent loads. Flue takes the exact SKILL.md format you met in Part 1.

tools = what it can do (run LaTeX). skills = how we want it done (house style). Then extend with Claude Code, spec-first — mind the Copilot-panel trap (use the Claude-logo icon).

in studio.ts

import maths from
  '../skills/maths-visual/SKILL.md'
  with { type: 'skill' };

createAgent(() => ({
  skills: [maths],   // guidance
  tools:  [...],     // capability
}))

One concept, three places: the site lesson, the Flue app, and Hermes next. Learn the format once, use it everywhere.

Pause

Break

10 minutes — halfway there

Up next: Part 3 — migrate to Hermes

Part 3 · migrate to Hermes

Put it on autopilot

Hermes is the operator — it runs skills on a schedule, with memory. First, make it yours.

1Tour the dashboard: Chat · Skills · Memory · Cron

2Edit projects/hermes/SOUL.md — add a Voice line

3commit → push → redeploy → New chat

Two copies, one bridge. You edit projects/hermes/; Hermes reads /opt/data; GitHub bridges them. An unpushed edit never arrives — and it's a redeploy, not a rebuild.

Part 3 · the key idea

Hermes can't render — it calls the app

Hermes skillthe operator

›

POST topichttp://workspace:3583

›

LaTeX applatex + dvisvgm

›

SVGback to Hermes

Hermes has the model, not TeX Live. The daily-latex-visual skill POSTs the topic to the app and waits for the image — then schedule it with Cron + memory.

1Add the skill to projects/hermes/skills/

2Test in Chat → then schedule with Cron

The killer demo: stop the LaTeX app → run the skill → it fails. Start it → it works. That's the dependency, visible. The app must be running, and it's workspace:3583, not localhost.

Handover

How you teach the rest

The site is the curriculum

ai.konomondo.org — concepts, runbooks, roadmap. Walk a new hire straight through it.

Three repos you own

ai-onboarding · latex-starter · hermes. Clone, edit, and push with your own login.

Edit → push → redeploy

Change SOUL, skills, or config in the hermes repo; a redeploy makes it live.

You have everything to train the next person — same kit, same map.

Recap

What you can now do

✓Learn the ideas — skills, SOUL, memory, spec-driven

✓The LaTeX app — the renderer (latex + dvisvgm); run, read, and extend it

✓Hermes — the operator that drives the app on a schedule

The through-line: spec-driven — think before you build.

Questions?

Emile · Hobo Labs · hello@hobolabs.digital

Keep this

Cheat-sheet

Open

Site
ai.konomondo.org

VS Code
aiworkspace.konomondo.org

Dashboard
hermes.konomondo.org
trainee / hermes

Run (in latex-starter)

npm run smoke   # no model
npm run dev     # the app

claude
/plugin install
superpowers@
claude-plugins-official

Remember

Hermes CALLS the app —
keep it running.

Edit hermes repo →
push → redeploy → New chat

The site is your
curriculum