Case study · Personal project

Amigo Screen

From idea to live product. An AI assistant that watches your shared screen and talks you through unfamiliar software, one step at a time: designed, built and launched by one person, with AI-assisted development.

StatusLive in early access at amigoscreen.com. Real accounts and Stripe subscriptions run through it today.

  • AI product
  • Personal
  • Live

Overview

A patient guide, not a search result

For people who get stuck in software they don't know and would rather be talked through it than hunt for a help article. You share your screen and speak. The assistant sees what is on screen and gives one short spoken instruction, then checks in before the next.

Role
Product Designer & Developer
Scope
End-to-end product
Platform
Web app
Development
AI-assisted (Claude Code)
Status
Live · early access
The live session screen: an 'Amigo session' header reading 'Connected · Sharing your screen', the 'Listening' state with the greeting 'Hey Mirko, what are we working on today?', a message box and four quick prompts, the floating controller's chat window at the right, and Chrome's 'amigoscreen.com is sharing your screen' bar with Stop sharing A guided programme card: 'Launch a Shopify Store in a Weekend', Shopify, Beginner, 6 hours, marked free, with a progress bar at 3 of 20 steps The floating controller's compact bar over another app: an avatar and the status 'Listening…', then chat, microphone, speaker, end-session and minimise buttons, under the browser's amigoscreen.com title bar

The opportunity

Help usually lives somewhere else

Documentation and video tutorials make you leave the task, find the right page and translate it back into clicks. Amigo takes the other route: an assistant that sees your screen and tells you the next step while you work.

  1. Get stuckIn a tool you don't know: Shopify, Meta Ads, Canva and the rest
  2. Ask, out loudAmigo looks at the shared screen only when it needs to
  3. Finish the taskOne spoken step at a time; you do every click

What people try first

  • Search
  • A video tutorial
  • A chat assistant
  • A support ticket
  • Paying someone

Each one means leaving the screen you are stuck on.

What Amigo does instead

  • Sees the actual screen
  • One step, then a check-in
  • Never clicks for you
  • Any app or site you can share

The product's own line: “Software shouldn't become the reason the work stops.”

Who it's for

  • Individual users

    Anyone with basic computer literacy who works across web apps and hits one they have never used. Amigo gets them through the unfamiliar part instead of stalling the task.

  • SaaS companies

    Exploring, not built

    A possible second audience: Amigo embedded inside a product, so its users work through a new feature or a migration on the spot instead of opening a support ticket.

  • Shopify
  • Meta Ads Manager
  • Webflow
  • Canva
  • WordPress
  • Figma
  • Google Workspace

How the audience took shape

  1. Four groups draftedBusiness owners, freelancers, marketing teams, everyday users
  2. Replaced by real tasksThe landing page now shows three use cases instead of a segment list
  3. Signals collectedA welcome-email question, signup source and a company access form

Drawn from the landing page's code history and the app's own forms, not from interviews.

Product discovery

From an idea to an interaction model

Six decisions turned “an AI that can see your screen” into something you can use and trust.

  1. 01Understand the problemGetting stuck is a workflow problem, not a skills problem.
  2. 02Define the journeyShare, ask, one step, check-in, next step.
  3. 03Choose the capabilitiesVoice in and out, on-demand screen reading, guided programmes.
  4. 04Design the voice and screen interactionOne short spoken instruction, then it waits for you.
  5. 05Structure the appHome, Discover, My Projects, Settings and the live session.
  6. 06Privacy and controlYou choose what to share, stop any time, and do every action yourself.

The core loop

  1. Share your screen
  2. Voice session opensOne live OpenAI Realtime connection
  3. Screen checked on requestA single screenshot, only when Amigo needs to look
  4. One spoken stepThen a check-in before the next

The app, in one map

Application structure: every screen, what it does and where this case study shows it
ScreenWhat it doesShown in
App · signed in6 screens
HomeDescribe a task, start a session, or continue a project.The product
DiscoverBrowse guided programmes with search, filters and sort.The product
My ProjectsYour programmes: in progress, saved, completed, archived.The product
Live sessionVoice and screen sharing, with the floating controller.The product
Help panelSearch help, ask the guide, practise, or reach a person.The product
Invite Not live yetInvite a teammate by email; sending isn’t connected yet.Not shown
Settings · signed in5 tabs
AccountYour name and email, password reset, sign out.Not shown
ConnectionsApps like Shopify that Amigo can change once you approve.Product discovery
AssistantLanguage, custom instructions, mute key, saved details.The product
PlanPlan and hours used, top-ups, and a refer-a-friend link.Launch & go-to-market
BillingPayment method, subscription and billing history.How it’s built
Public · no sign-in needed5 pages
Landing pageEleven sections, each answering one visitor question.Launch & go-to-market
PricingThree plans, billed monthly or yearly.Launch & go-to-market
FAQAnswers to common questions before sign-up.Launch & go-to-market
Sign in and sign upGoogle, or email and password.Launch & go-to-market
Privacy, terms, cookiesThe policies, and the consent that gates analytics.Product discovery

Blue names are the three destinations in the sidebar. Each row is checked against the app’s source or its live screens.

The idea, in one picture

You

Stuck in software you don’t know. You pick what to share and do every step.

Amigo

Listens, looks only when it needs to, and gives one short spoken instruction.

A website on your shared screen with Amigo's floating controller sitting over it: an amigoscreen.com title bar, then 'Listening…' with chat, microphone, speaker, end-session and minimise buttons

Your screen

The tab or window you chose to share, with the floating controller over it. It stays yours to click.

You click, type and scroll. Amigo never does.

A diagram of the idea. The picture on the right is a real capture of the controller.

You stay in control

  • You choose the window or tab to share; nothing starts before the browser's own permission prompt.
  • Stop sharing with one click, mid-session.
  • Amigo never moves your mouse, clicks or changes a setting. You perform every action.
  • Shopify changes are proposed first and wait for your approval.
Chrome's 'Choose what to share with amigoscreen.com' dialog, with Chrome tab, Window and Entire screen options and the user's screens as thumbnails, shown before any screen access begins

Screen video and microphone

Streamed live for the session and discarded. Not recorded, not stored.

Screenshots

One is sent to the AI provider only when Amigo needs to look, then discarded.

Transcripts

Saved to your account so you can revisit a session. Deleted on request.

Not claimed, because the privacy policy doesn't support it yet: end-to-end encryption, zero data retention, GDPR or CCPA certification.

The product

The shipped product, logged in

Real screens from the authenticated app.

Key features

Four features that turn a chat into guidance

Programmes keep a task on track, the assistant reads the screen when asked, the floating controller stays with you in any tab, and your progress waits for you.

Guided programmes

A task, broken into steps that can be checked

Each programme has modules, and each module has small steps with a clear “done” condition.

Programme

Launch a Shopify Store in a Weekend

  1. 1Set up your store
  2. 2Add your first product
  3. 3Pick and customize a theme
  4. 4Set up payments and shipping
  5. 5Configure checkout and policies
  6. 6Go live

One step: Name your store

Do
In Settings > General, set your store name to something you'd be comfortable customers seeing.
Done when
The Store details page shows a non-default store name has been saved.
The course detail page for Launch a Shopify Store in a Weekend: a Shopify hero with Free, Saved and Share, a progress panel reading 1 of 6 modules and 3 of 20 steps done, and the module list with 'Set up your store' marked completed

How a step gets completed

  1. See the stepInstructions and what “done” looks like
  2. Do it yourselfIn the real tool; Amigo never clicks for you
  3. Ask Amigo to checkIt looks at your screen against the “done” condition
  4. You mark it doneAmigo can verify a step, never complete it

Real-time assistance

It looks only when it needs to

Voice runs over one live connection. The screen is read on demand, so a normal turn stays fast. Mid-session the assistant can:

  • Look at your screen
  • Remember a fact about you
  • Check a step
  • Call a person

Every turn

TurnScreenshotTurnScreenshot

On demand

TurnTurnScreen mentionedTool call: view screenReply
Shopify's admin on the Metaobjects page with Amigo's floating controller open over it: an amigoscreen.com title bar, 'Session ready.', the greeting 'Hey James, what are we working on today?', a message box, and the controller bar showing 'Listening…' with chat, microphone, speaker, end-session and minimise buttons

Floating controller

A small window that stays above your work

It opens when a session starts and sits over whatever app or tab you are using, so you never switch back to Amigo to mute, type or stop.

  1. Avatar that moves with the voice
  2. Status: listening, thinking, analysing your screen, speaking
  3. Chat: type a message or send an image
  4. Mute your microphone
  5. Mute Amigo's voice
  6. End the session
  7. Minimise the window

Built on the browser's Picture-in-Picture window, so it runs in Chrome and Edge.

Webflow's website in the browser with Amigo's floating controller sitting over its lower right corner: an amigoscreen.com title bar, then 'Listening…' with chat, microphone, speaker, end-session and minimise buttons
  1. The floating controller's compact bar over another app: an avatar and the status 'Listening…', then chat, microphone, speaker, end-session and minimise buttons, under the browser's amigoscreen.com title bar
  2. The floating controller with its chat open: 'Session ready.' and the greeting 'Hey Mirko, what are we working on today?' (shown twice), a message box with an image button and a send button, and the control bar underneath
  3. The floating controller minimised to one slim row: an amigoscreen.com title bar with a microphone icon, then the avatar and the latest reply, 'Hey James…', a microphone button and an expand button

Progress and projects

Come back where you left off

Every programme you start is a project. Home offers to continue the last one; My Projects keeps them in four lists.

  • In progress
  • Saved
  • Completed
  • Archived

Progress is stored per programme (current module and step) and per step, with a record of whether Amigo verified it or you marked it yourself.

The My Projects page: In Progress, Saved, Completed and Archived tabs, with the Launch a Shopify Store in a Weekend project at 3 of 20 steps
  1. A guided programme card: 'Launch a Shopify Store in a Weekend', Shopify, Beginner, 6 hours, marked free, with a progress bar at 3 of 20 steps
  2. The course detail with 'Set up your store' expanded and marked completed: three steps, Create your Shopify account, Name your store and Pick a plan, each ticked and offering Revisit, under a progress panel reading 1 of 6 modules and 3 of 20 steps done

How it's built

Every layer connected by one person

Two different AI roles: Claude Code helped build the product; OpenAI Realtime powers the live assistant. Every product and architecture decision was made and checked by me.

Built with

  1. Claude Code: AI-assisted development
  2. Codex: independent plan review
  3. GitHub

Browser

Web app

React 18 · Vite · Tailwind CSS · Relume UI

Voice and screen

Microphone and screen share, through the browser's own permission prompts

Floating controller

Picture-in-Picture window

Supabase

Auth

  • Google sign-in
  • Email + password
  • Breached-password check
  • Lockout after 5 tries

Postgres

Row-level security: people can only read their own data

Edge Functions

  • Voice relay
  • Checkout
  • Stripe webhook
  • Billing
  • Welcome email
  • Shopify

Services

OpenAI Realtime

Voice in and out, plus on-demand screen reading

Stripe

Embedded payment form, subscriptions, webhooks

Shopify

Connect a store; every change waits for your approval

Resend

Welcome email

PostHog (EU)

Analytics, only after you consent

Voice travels from the browser over a WebSocket to a Supabase Edge Function and on to OpenAI. The provider key never reaches the browser, and credits are checked before a session connects.

Ship

  1. GitHub, main branch
  2. Netlify, auto-deploy with security headers
  3. amigoscreen.com

Designer to builder

I don't stop at designing how a product should work

AI speeds up the build. The experience, the implementation decisions and the final quality are still mine to get right.

  1. 01DiscoveryProblem, audience and the core loop, written as briefs before any build.
  2. 02UX strategyVoice first, screen on demand, and the user does every action.
  3. 03UI designPublic site and app, art-directed against a written brief.
  4. 04AI-assisted developmentBuilt with Claude Code: 346 commits between August and October 2026.
  5. 05IntegrationSupabase auth and data, the OpenAI relay, Stripe checkout and webhooks, Shopify OAuth.
  6. 06TestingPlans reviewed by Codex; cost fixes verified with token counts from test calls; usage logged before cutting more.
  7. 07DeploymentNetlify deploys every push to main, with security headers set.

Launch & go-to-market

A page that answers one question at a time

The brief behind it: a first-time visitor understands the product in five seconds, and companies get their own way in.

The live Amigo Screen marketing site: 'Get unstuck. Keep the work moving.' with a Shopify screen-share demo showing the assistant asking about store performance
  1. 01HeroWhat is it?
  2. 02Tools stripDoes it work with my software?
  3. 03How it worksHow does it work?
  4. 04Use casesWhat do people finish with it?
  5. 05BenefitsWhy not just search?
  6. 06Ask anythingShow me.
  7. 07Privacy and controlIs it safe?
  8. 08PricingWhat does it cost?
  9. 09Company accessCan my team use it?
  10. 10FAQAny doubts left?
  11. 11Final call to actionStart.

From first visit to paying

  1. DiscoverThe landing page
  2. UnderstandHow it works, use cases, privacy
  3. RegisterSign up with Google or email
  4. ExperienceA first guided session
  5. SubscribeFrom £12 a month; yearly 25% off; top-ups

Live plans, checked 8 October 2026

  • Basic £12 · 5 h a month
  • Advanced £32 · 20 h
  • Black Premium £64 · unlimited
  • Yearly 25% off
  • Hour top-ups

Priced low on purpose while real usage shows what it is worth; the pricing page says so to subscribers.

Acquisition in place

  • Referral invites
  • Welcome email
  • Company access form
  • Consent-gated analytics

No paid acquisition or content plan is documented yet.

The live pricing page: Basic £12 a month for 5 hours, Advanced £32 for 20 hours (most popular) and Black Premium £64 unlimited, with a monthly or yearly toggle
The onboarding screen shown after sign-up: Welcome, here's how it works, with three tips (share your screen, just talk or type, hold Alt to mute) and the choice to try a practice run or skip to Home

Outcome

A real product, not a prototype

What shipped, what was measured, and what isn't claimed yet.

  1. Authenticated web appHome, Discover, My Projects, Settings, live session
  2. Voice assistantLive speech with on-demand screen reading
  3. Guided programmes7 programmes and 4 short tasks, each in checkable steps
  4. Floating controllerPicture-in-Picture session controls
  5. Accounts and sign-inGoogle or email, with row-level security
  6. Subscriptions and paymentsStripe checkout, billing and webhooks
  7. Public marketing siteLanding page, pricing, FAQ, legal pages
  8. Production deploymentNetlify from GitHub, live at amigoscreen.com

Scale

Commit history, 18 Aug to 6 Oct 2026

  • 346commits
  • 162source files
  • 13Edge Functions
  • 3,631lines in the voice engine

Three decisions that made it fast and affordable

  1. Challenge

    Slow voice turns

    Decision

    One OpenAI Realtime connection

    Result

    −2 network hops

    removed per turn

  2. Challenge

    A screenshot every turn

    Decision

    On-demand screen capture

    Result

    Fewer vision calls

    and faster turn-taking

  3. Challenge

    High running cost

    Decision

    Fixed prompt caching, gated the mic in silence

    Result

    ~30–60% lower

    roughly, than the modelled cost

Technical breakdown: provider comparison and running costs

All figures are raw AI cost before margin, for a five-hour allowance. The entry plan, Basic, charges £12 for those 5 hours.

Entry pricing

£12/mo

The entry plan: 5 hours at £2.40/hour, about a 50% margin over raw AI cost. Set low on purpose to learn from real usage.

Raw AI cost

Modelled
$22.50
Audited
$9–16

Modelled at $22.50, audited at $9 to 16 after the caching fix.

Biggest cost line

$5.76

$5.76 was mic audio streamed during silence, before the gating fix.

Modelled raw cost per five-hour session

OpenAI Realtime
~$22.50
Claude + speech layer
~$11.50

Claude plus separate speech-to-text and text-to-speech was about half the cost, but three moving parts and a hop of latency each. Gemini was evaluated, not modelled to five hours. Cheapest on paper wasn't cheapest to ship: voice has to feel instant, so I stayed on OpenAI Realtime and cut the cost inside it.

  1. Fix prompt caching

    A recap rewrote the start of the prompt about every 100 seconds, so the cache never held. Made the prefix static and verified with cached-token counts from a test call.

  2. Gate the mic in silence

    Settings that existed but were never wired in, now connected with a pre-roll and a hangover so soft speech isn't clipped. Estimated saving: $3 to $4 a session.

  3. Measure before cutting more

    A cheaper model tier could save about $7 a session but risks weaker screen reading, so it is being tested first. Talk time and screenshot frequency are now logged.

One mismatch worth naming: the product charges in sterling and pays OpenAI in dollars, so the margin moves with the exchange rate as well as with usage.

What's next

  • Test the cheaper model tier without losing screen reading
  • Bank the silence-gating saving
  • Revisit pricing once real usage data is in

No usage numbers, retention or revenue appear on this page, because none have been independently verified yet. What the project does show is one person carrying a product from the first brief to a live, paid service: the interaction design, the build, the infrastructure and the launch, with every decision traceable to the code that shipped.

Portfolio

Explore additional projects

Next

Building something similar?

I help teams design AI features that are honest about what they know and what they don't, from the interaction model through to a production build.