Notey's World - In‑game helper
A contextual helper where Notey diagnoses why a beginner is stuck, teaches with his own guitar, and hands control back fast. Designed in Figma, playable in the browser.
- Game UX
- Learning design
- Playable prototype
Notey's World · Take-home challenge
Getting unstuck, without leaving the game
A contextual helper where Notey diagnoses why a beginner is stuck, teaches with his own guitar, and hands control back fast.
Florian Gouloubi · Senior Product Designer
01 · The moment
The first tab mission is where the gap catches up
For the first time, several concepts collide: read a tab, map lines to strings, count frets, place a finger. Earlier missions can be passed without really understanding any of it.
I played it as a true beginner on a real guitar, and got stuck right here.
Normal gameplay: play C, D, E (frets 1, 3, 5) to cross the platforms.
02 · Benchmark
Competitors teach with a filmed teacher. Notey teaches with a game.
Yousician
Simply Guitar
JustinGuitar
Coach Guitar
Gibson App
FretPro
Melorun
WHAT I LOOKED AT
How each app transfers knowledge in its tutorials: who teaches, what is shown, how the player gets feedback.
WHAT NOTEY MISSES TODAY
Help to place fingers in the right spot on the guitar, and visual feedback on the hand. Most competitors rely on video teachers for this.
THE BET
No filmed teacher, so turn it into an advantage: video game codes and the mascot do the teaching, without hurting learning.
03 · The insight
One "stuck" moment hides four different problems
THE NOTE
"Where do I put my finger?"
Unsure which fret, and how hard to press.
Show it: note card, then Notey's guitar.
THE RULES
"Which line is which string?"
Nobody says the tab is the guitar seen from above.
Teach it: the basics, in the world.
THE MIC
"I played it. Why nothing?"
The system cannot hear the guitar.
Fix it: mic settings, one tap.
THE GUITAR
"I'm right, but it says wrong."
Out of tune, and nothing tells you.
Fix it: tuner, only when needed.
The helper has to diagnose before it teaches. Two are learning problems, two are system problems.
04 · Principles
Six rules the helper never breaks
Notey is the helper
No new mascot, no Clippy. He is loved and already plays guitar, so he demonstrates instead of explaining.
Inside the world
No support widget. The camera zooms into the 3D level and Notey teaches where the player already is.
Text first, player paced
Like a DS or Game Boy tutorial: short bubbles, tap to continue. The game already works without voice.
The guitar is the controller
Every teaching step ends with the player playing, not reading. Even a hint closes by playing the note.
Escalate gently
The lightest help first. The full lesson only when the signals say the player needs it.
Phone first
Designed on an iPhone: the hardest screen, and the one every player has.
05 · Levels of help
Three levels of help, from a whisper to a lesson
LEVEL 1 · 2 MISSES, THEN 3 MORE
A hint the game doesn't stop for
A small "?!?" bubble first. Then the note card: C, B string, fret 1, finger 1. It closes when the player plays the note.
LEVEL 2 · 3 MORE MISSES
An offer, never a takeover
"Still feeling lost?" with Watch the basics or Not now. Past 5 misses, the bubble leads straight here: a level-zero player needs more than a diagram.
LEVEL 3 · PLAYER OPTS IN
The basics, taught by Notey
The camera zooms into the world. Short chapters, each closed by a guitar check, then straight back to the level.
06 · User flow
Every path ends back in the level
START
Gameplay
2 MISSES
"?!?" bubble
+3 MISSES
Note card
+3 MISSES
"Still lost?" offer
OPT IN
Basics lesson
CHECK
Transfer test
MASTERED
Back in the level
Exit points
Solved alone · "Not now" · X, then "Going solo?" · Mastered it. All return to the level with the score.
Shortcuts and loops
Past 5 misses, the bubble opens the basics offer directly. Skip forward between chapters. +3 misses on the test: Notey shows the fret, then a new note.
System detours
Mic not heard: settings. Guitar out of tune: tuner. Available any time, the game keeps running.
Full flow and prototype in Figma: Notey Case Study prototype
07 · The lesson
Every chapter ends with the player playing
1 · TABLATURE
Six lines, six strings. "It's like looking at your guitar from above."
2 · FIRST INPUT
Copy Notey on the thinnest string. A "Perfect!" unlocks the next step.
3 · FRETS
Counted from the head. Press hard, slightly behind the metal strip.
4 · NUMBERS
"When you see 1, play fret 1." Then fret 1, then fret 2.
Visual cues match each sentence: a pointing glove, the string lighting up, the fret glowing, numbers drawn on the neck. Pause, previous and next are always there.
08 · The key decision
Copying is not understanding
Until now, every check stayed on one string. The last one deliberately changes string: "Now play the notes on the tab below."
It proves the player can read a tab on their own, not just imitate the teacher.
09 · Input states
A wrong note and a missed note are never the same message
CORRECT
Instant praise and unlock. Small, frequent wins.
INCORRECT
After 3 misses, Notey zooms on his guitar and shows the exact spot.
MISSING
"I don't hear you correctly." Notey's own mic looks broken. One tap to settings.
UNCERTAIN
"Your guitar sounds a little off." A tuner button appears only when needed.
When the system is unsure, Notey shares the problem instead of judging the player. The player can keep playing.
10 · Player control
Leaving the help is celebrated, never shamed
- Exit any time with X, confirmed in Notey's voice.
- Skip what you know with previous, pause, next.
- Come back later from the bubble, a pattern already learned.
11 · Trade-offs and scope
What I chose, and what I left out on purpose
Accessibility, within the brand
I fixed contrast and button affordances in the UI, without changing the app's look. Text-first bubbles also work without sound.
Settings and tuner: entry points only
Redesigning mic settings and the tuning flow was out of scope. The helper routes the player there at the right moment.
A complete lesson, by caution
Without user tests, it is easier to remove content later than to leave guidance gaps that block learning and autonomy. Shorten it once tests show quality holds.
Notey and text, not a new voice
A new mascot or voice acting would add cost and dilute the brand. Notey already plays guitar, and the game already works without voice.
12 · Design questions, 1 of 2
When help appears, and how it stays out of the way
Automatic, manual, or both?
Both. Signals escalate the help on their own, and the bubble lets the player call Notey at any time.
How does Notey know?
Repeated misses on one target, error density early in the session, and signal quality: silence means mic, a steady pitch offset means tuning.
Not interrupting, not patronising?
The first help is tiny and ignorable, the bigger one is opt-in. Two audiences get two depths of help.
Dismiss, pause, revisit?
X with a friendly confirm, chapter controls to pause or skip, and the bubble to come back whenever needed.
13 · Design questions, 2 of 2
Momentum, trust, and proof of progress
Preserving momentum
The hint doesn't pause the game. The lesson lives in the same world, with a camera zoom and no context switch. Steps are short, and the exit drops the player straight back into the level.
Trust when unsure
Recognition confidence sets the response. High: judge the note. Medium: "Play it again for me?", no miss counted. Low: don't judge, check the mic or tuning.
Actually unblocked?
The player proves it by playing: the transfer test on a new string, one extra note after a recovery, then success back in the real level.
14 · Measuring it
What I would track after launch
First-try success
on the next note after help
Fewer re-entries
into help on the same note
Mission completion
helped vs. not helped players
Skip rate per chapter
shows which content to cut
15 · Next
What I would test first
Bubble affordance
Do players understand that the "?!?" bubble can be tapped? It is the entry point to everything.
Thresholds
Calibrate the 2, 3 and 5 miss triggers and the confidence bands with real play data, possibly per age group.
Kids and pressure
Feedback on pressing hard enough without pain. Children often press too softly.
Turn a moment of failure into the moment the player learns to read guitar.
Play it with a real guitar (allow the microphone). No guitar? Press C right note, W wrong note, T out of tune, S mic can't hear, or use the demo buttons on a touch screen.