SpecEnvoy
EN·中文

The Language of Music

Sheet music can look like a foreign alphabet. It isn't — it's a simple picture of two things: how high a sound is and how long it lasts. This page teaches the words on a score from scratch, and every idea has a live example you can hear, see and click.

Tap any ▶ or note to turn on sound

01Start here: music is a graph

A written score is a plot with two axes. Left → right is time (earlier notes are on the left). Up → down is pitch (higher on the page = higher sound). That's the whole idea. Everything else is just notation for marking points and spans on this graph.

The two axes, in motion

Press play: a line sweeps left→right (time) while the dots rise (pitch). You'll hear each one.

02The staff, pitch & clefs

The five lines are called a staff (plural staves). A note sits on a line or in a space; the higher it sits, the higher it sounds. Notes are named with just seven letters — A B C D E F G — which then repeat. The jump from one letter to the same letter higher up is an octave.

The swirl at the far left is the clef. It's the key to the map — it tells you which line means which note. Treble clef is used for high instruments (violin, right hand of the piano); bass clef for low ones (cello, left hand). Toggle it below and watch every note's name change, even though the dots don't move.

Click a note to hear it

The lonely note hanging below on its own little line is middle C — the note in the middle of the piano, everyone's landmark.
Every dot is one letter-name higher than the last.

…and here's the same thing as a keyboard

The white keys are the plain letters A–G. The black keys are the "in-between" notes. From any key to the very next key (black or white) is one semitone — the smallest step in Western music. Twelve semitones make an octave.
Click the keys — the matching note lights up on the staff above.

03Sharps, flats & keys

A little symbol before a note nudges it by one semitone. A sharp (♯) raises it, a flat (♭) lowers it, and a natural (♮) cancels back to the plain letter. (There are rare double versions too.) One quirk worth knowing: an accidental lasts until the end of that bar, then resets — it's scoped, like a variable inside a block.

Raise it, lower it

Same letter D — hear how a sharp and a flat shift it by a semitone.

Rather than write a sharp on every single note, music collects them into a key signature — a group of sharps or flats printed once at the start that applies all the way through. The keys are related in a ring called the circle of fifths: each step around adds one sharp (or removes one flat), so a key can be stored as a single number — 0 is C, going one way counts sharps (+1…+7), the other way counts flats (−1…−7). In our code that number is literally called fifths.

The circle of fifths

Click any key. You'll hear its "home" chord and see how many sharps or flats it has — and its fifths value.
C major
no sharps, no flats
fifths = 0

04Rhythm & time

The other axis is time. A steady pulse you'd tap your foot to is the beat; beats are grouped into bars (or measures) by vertical barlines. The stacked numbers at the start — the time signature — say how many beats fill each bar (top number) and which note counts as one beat (bottom). 4/4 means four beats per bar.

How long is each note?

Note lengths are simple fractions of a whole. Pick one and watch it fill a single 4-beat bar — and hear how many fit.
Quarter notes: 1 beat each, so 4 fill a 4/4 bar. A dot after a note adds half its length again (a dotted quarter = 1½ beats).

The metronome

The steady clock every musician practises with. Beat 1 of each bar gets an accent (pink) — that's how you feel where a bar begins.
Tempo96 BPM
Beats per bar:

The one everyone mixes up: tie vs slur

They're both curved lines. They mean completely different things — this trips up beginners (and tripped up our code).

Tie — joins two notes of the same pitch into one longer sound. You hear one note, held for both lengths added together. It's how you sustain across a barline.

Slur — joins notes of different pitches, meaning "play them smoothly, connected" (that's legato, or "one bow" for a string player). You hear every note; nothing is held together.

Splitting the beat: triplets

Usually a beat splits into 2, then 4, then 8 — powers of two. A triplet squeezes three even notes into that same beat instead. Play both and feel the difference.
Because triplets don't fit the tidy power-of-two grid, they're the trickiest thing to store in a music file — it's why some famous pieces (the Moonlight Sonata is all triplets) need special handling.

05Chords, voices & texture

Play notes one after another and you have a melody — a tune. Play notes at the same instant and you have a chord — harmony. A single line at a time is monophonic (an unaccompanied violin); several independent lines at once is polyphony, and each independent line is a voice.

Same three notes — apart, then together

C, E and G. First as a melody, then stacked into a chord.

Two voices at once

A tune on top and an independent lower line underneath — the essence of piano and string-quartet writing. (This is why the piano needed two staves and a much bigger engine.)

06Expression: how it's played

The dots tell you which notes; a stack of Italian words tells you how to play them. These are the terms that turn "correct" into "musical."

Tempo — the speed

Measured in BPM (beats per minute). The same little tune, faster or slower.
Tempo100 BPM

Dynamics — how loud

Marked with letters: p (piano = soft) up to f (forte = loud). In a MIDI file this is one number per note called velocity (0–127) — "how hard it was struck."
Soft → loudmf · 80

Articulation — legato vs staccato

Legato = smooth and connected, notes flowing into each other (what a slur asks for). Staccato = short and detached, each note clipped with air around it.

Ornaments — the curly decorations

Tiny flourishes that decorate a note. Hear the plain note first, then each ornament of it.
Trill: a fast wobble between the note and the one above. Mordent: a single quick flick up and back. Grace note: a tiny note crushed in just before the main one. (In a MIDI file these become a cloud of very short notes — the "note dust" that's hard to notate cleanly.)

A few more words you'll hear

Phrase
A musical "sentence" — a run of notes shaped together and breathing as a unit.
Rubato
Flexible, expressive tempo — gently pushing and relaxing rather than strict clockwork.
Vibrato
The warm little pitch-wobble a string player adds with the hand.
Voicing
On a keyboard, balancing a chord so the melody note sings out above the rest.
Pedal
The piano's sustain pedal — lets notes ring on after the keys are released.
Double stop
A string player bowing two strings at once, to sound two notes together.

07The shapes of a piece

A big work is built from movements — self-contained sections, each with its own speed and mood, like tracks on an album. Here are the piece-names that fill our timelines.

Sonata
A multi-movement piece for one or two instruments (solo piano, or violin + piano). A sonatina is a little one.
Concerto
A solo instrument set against a full orchestra — the soloist's showcase.
Symphony
A large multi-movement work for the whole orchestra.
String quartet
The classic four: two violins, a viola and a cello. Our ensemble mode is built from these.
Suite / Partita
A set of dance movements in one key — gavotte, minuet, sarabande, gigue — played in a row.
Prelude
A short introductory piece. Bach wrote 24 — one in every key.
Nocturne
A lyrical, dreamy "night piece" (think Chopin).
Étude
A "study" written to drill one technique — but the great ones are concert pieces too.
Rondo
A form with a recurring refrain: A B A C A — the tune keeps coming back.
Lied / Lieder
German art song(s) for voice and piano (Schubert). Many string "arrangements" borrow a Lied's melody.
Variations
A single theme restated again and again with changes.
Intermezzo · Bagatelle · Caprice
Names for short, characterful stand-alone pieces.

The four eras (roughly)

Baroque ~1600–1750
Bach, Handel, Vivaldi. Counterpoint, the harpsichord, the birth of the keyboard repertoire.
Classical ~1750–1820
Haydn, Mozart, early Beethoven. Balance and clarity; the sonata and the string quartet.
Romantic ~1820–1900
Chopin, Schumann, Brahms, Tchaikovsky. Big emotion, the modern piano, the virtuoso.
Impressionist & Modern ~1890–1940
Debussy, Satie, Rachmaninoff. New colours and harmonies — the edge of the public domain.

Decode a catalogue number

Those letters after a title (BWV, K., Op.…) are just stable ID numbers — a primary key into a composer's catalogue. Tap one.
Tap a label to see whose catalogue it is.

08Music ↔ code — how this site plays a score

If you build software, these are the terms that are really our file formats and tools. A printed score, the sound, and the highlight that follows along are three views of the same data.

The pipeline

Source scoreABC or MusicXML text
→
Verovioengraving engine
→
SVGthe printed page
MIDIthe sound
timemaplinks the two

The timemap is the join key: it maps each note's on-screen id to the moment it sounds, so when the audio clock reaches a note, we light up its dot. That's the "score that follows along."

A single note, as data

Click a note. This is roughly what it becomes inside a MIDI file — pure numbers.
note
—
MIDI number
—
frequency
—
velocity (loudness)
—
start tick (PPQ 480)
—
MIDI
Not audio — a list of events: "note 60 on at tick 0, velocity 80; off at 480." A performance as data.
tick / PPQ
MIDI's clock. PPQ = ticks per quarter-note — its time resolution. beats = ticks ÷ PPQ.
ABC
Compact text for a single-staff melody. Great for cello & violin; can't do a piano grand staff.
MusicXML
Verbose XML that can do two staves, many voices and triplets — so piano uses it.
quantize
Snapping loosely-timed notes onto a clean grid. Why triplets & ornaments are hard — they don't sit on it.
transpose
Add a constant to every pitch. An octave shift is ±12 — how we move a melody between instruments.

Prefer a compact written reference, with the "why it bit us in code" notes? See the Music glossary. Spotted something a cellist would wince at? It's meant to be corrected and to grow.