A record of the prompts that produced the Sole prototype.
Sole is a running-coach app prototype built in Claude Design. This is the record of how it came together — the prompts that shaped it, and what each one produced.
My process usually starts with long-form voice transcriptions, sometimes minutes at a time. I run those through ChatGPT to tighten them into a more focused prompt before handing it to Claude — it saves tokens, and ChatGPT is good at that kind of refinement. From there it's iterative: one version, a reaction, additions, subtractions, another pass.
A couple dozen prompts went into this build. These are the ones that moved it the most.
An app for high-performance endurance runners. The phone app is geared toward the athlete — structured training, measurable progress.
It uses a combination of AI, athlete input, and coach input to align planning, execution, and feedback in one shared environment. The AI surfaces patterns, detects change, and highlights what matters. Coaches and athletes apply judgment. Technology amplifies decision-making; it does not replace it.
Athletes start sessions. Biometric data feeds in from a smartwatch. They see VO2 max, endurance and recovery numbers, and can compare sessions to see progress. Metrics are chosen for what high-end competitive runners care about: training data, performance insights, speed, recovery time — possibly rhythm and gait.
The AI coach is based on a custom training program, informed by experts and coaches in the industry. It's conversational — athletes can talk to it and get instant feedback. Wellness check-ins monitor biometrics pulled from the watch.
Positioning: a cutting-edge training and coaching platform for endurance runners and their coaches. It transforms athlete data into personalized, real-time insights. For runners pushing their limits, or for coaches managing multiple athletes. The AI augments coaches rather than replacing them, and serves as the coach for athletes who don't have one.
Core functionality: deep dives into performance trends across sessions and races, fatigue tracking, integration with wearables and sensors, and a centralized platform for performance, recovery, and wellness — all built on scientifically backed metrics.
Brand: neutral tones, Apple-adjacent. High-tech, elite, smooth. Light blues and a saturated sky blue. Clean white space, light gray, thin lines — strong tech vibe.
Name: Sole. S-O-L-E.
Hi-fi interactive prototype. Build it tweakable.
A navigation bar of clean icon buttons sits at the bottom for easy movement between the main sections.
Home screen gives a general overview. At the top, today's recommended action with the ability to edit it, and a button to start the workout. Show the date, acknowledge who's logged in, and put an inbox in the top right for new messages from the coach. Below that, a few tiles: recent feedback from the coach, some results, and a small grid of metrics — resting heart rate, sleep quality (if they're wearing a ring or watch at night), and so on. End with a weekly overview showing the week's plan at a glance.
A training plan page laid out as a calendar, with each day's plan populated by the coach — human or AI. Scroll through multiple days, see days check off as they pass, click into any day to adjust.
An insights page with detailed graph-based views of the metrics being trained for — left-to-right line graphs showing change over time. Below that, AI- or coach-generated observations explaining the trends.
A chat-with-coach page. Basic running chat, with a way to toggle who you're talking to — AI coach or real-life coach — and a clear indicator of which conversation you're in. Landing page for this looks like a messaging app: individual chats with different coaches, with room to add friends later.
An athlete profile page: history of goals hit, and where you connect your devices and coaches.
A splash / loading screen on app open.
A start-session screen — the active workout view. Timer running, live metrics: heart rate, distance, elapsed time, training zones. Keep it simple and at-a-glance; this needs to work on a watch too. Big, easy start and stop buttons, nothing over-designed.
After a session, a debrief screen with the session's results in more detail, plus a quick feedback capture — a 1–10 scale on how the session felt or how the athlete is feeling overall.
The prototype scaffolded end to end: Home, Session Detail, Live Session (dark), Post-Summary, Training Plan, Insights, AI Coach, Wellness Check-in, Profile. Hairline dividers, thin-stroke charts, generous white space. A tweaks panel exposing athlete name, readiness value, and screen jumps.
Now that the structure is wireframed, let's start layering in the brand. I've built out a logo in a separate session and done a few passes on it — some of it in Photoshop — to get it to a place where it holds up in the app. Uploading the final files now.
Direction for the visual design: generous white space, clean whites and soft grays, a high-end luxury feel. Apple-adjacent in its restraint — quiet, confident, premium. Sky blue as the accent color, used sparingly. Fine hairline rules, crisp type, nothing heavy or ornamental. The surface should feel elite, precise, a little clinical in the best way — like equipment worthy of a serious athlete.
Logo placed into headers across every screen. Palette tuned to whites and pale grays with a single sky-blue accent. Hairline dividers, clean thin-stroke icons, and a more premium, Apple-adjacent read throughout.
Seeing it as an actual app now, I want to switch directions. Move the whole thing to dark mode and let's see how it sits. Keep the fine lines, the clean spacing, the crisp icons. Use shading and shadows only where they earn their place — very restrained.
Introduce jewel tones to bring color and interest. Each metric gets its own color, and the color should mean something. Heart rate in a ruby red leaning toward purple, bright and saturated. Goal-oriented things in emerald green. Data-driven things in sapphire blue. Topaz yellows where they fit. Clean, bright, saturated throughout — tie a color to an attribute wherever possible.
For type: heavy-weight sans serif for headlines and section headers. For content and data readouts, a thinner, more lightweight compressed face — the kind commonly used on phone apps where readability at small sizes is the whole job.
Full dark-mode pass. Metric-specific color system replacing the single-accent scheme — each data type keyed to its own jewel tone. Heading font swapped to a heavier lowercase treatment, with a compressed sans for data-dense readouts.
A few things. First, clicking the logo anywhere in the app should bring you back to the loading screen. Second — the black-and-white runner photos I had you drop into some of the section headers aren't working. They're distracting from the functionality and the data. Pull them out of those headers.
Instead, let's bring that idea onto the home screen and make it a moment of focus. Use the black-and-white runner photos as full-bleed background images. A slight zoom-out feel. Dark gradient at the bottom so an inspirational quote can sit cleanly on top. Logo centered, quite large, floating over the image. Let the screen linger for four or five seconds so there's actually time to read the quote and settle in.
Image and quote both rotate on reload — so every time the app opens, a different pairing. For now, use the two photos I've uploaded and five or six quotes that I'll paste in. We'll expand the library later.
Splash rebuilt as a dark, full-bleed rotating-photo hero with the white logo centered and the quote weighted heavier. Logo-tap handler wired across Home, Plan, Insights, Coach, and Profile. Quote rotation moved to visit-based, so every tap surfaces a new pairing. Photo headers removed from Profile and Insights.
Throughout the build, I had Claude stand up a custom tweaks panel inside the prototype — real-time control over font sizes, colors, spacing, line weights, background colors, and actual text. Everything fully adjustable in place, without another round-trip through the model. I used it to dial in the final look.
The prototype. Interactive, with a tweaks panel.