Introduction

Welcome to Annotune! This guide will help you understand what this app does and how to use it in just a few minutes.

What is Annotune?

Annotune is an intelligent music notation editor that helps you visualize, customize, and annotate music scores in powerful ways. It combines traditional music notation display with modern annotation tools to make learning and teaching music more effective.

What you can do

• Upload and display MusicXML scores with professional rendering
• Add note names as lyrics below each note in multiple notation systems
• Customize visual aspects of your score in real time
• Color-code notes by pitch or note type to identify patterns
• Selectively show or hide notation elements like time signatures, measure numbers, and fingerings

Who it’s for

• Music students learning to read sheet music
• Teachers creating annotated scores for lessons
• Self-learners who want to understand music notation better
• Composers who need to annotate their work

Explore the Editor

The editor displays your score using OpenSheetMusicDisplay (OSMD) with powerful annotation tools layered on top.

Core features

• Multi-page navigation – Scroll through your score page by page
• Zoom controls – Adjust from 30% to 300% zoom
• Real-time updates – Changes apply instantly to your view
• Non-destructive editing – Your original MusicXML file remains untouched
• Audio context integration – Built for potential audio playback features

Note Name Annotation System

Annotune’s most powerful feature is adding note names directly to your score.

Multiple notation systems

• Scientific – C4, D♯4, E4
• Helmholtz – c', d♯', e'
• Solfege – Do, Re♭, Mi
• German – C, D♯, E, H (B-natural)
• Latin – Ut, Re, Mi

Customizable display options

• Show or hide octave numbers
• Include accidentals as symbols (#, ♭) or letters (s, f)
• Toggle uppercase or lowercase note names
• Adjust font size, weight, and family
• Apply custom text colors

Smart chord handling

• Automatically detects chords in multi-voice scores
• Stacks chord note names vertically
• Separates treble and bass clef notes

Color Coding for Better Understanding

Visual patterns help with music comprehension.

• Per-note color assignment – Assign different colors to C, D, E, and more
• Two coloring modes
  1. Notehead coloring – Colors the actual noteheads
  2. Text coloring – Colors only the annotation text
• Pattern recognition – Helps identify scales, chords, and repeated motifs

Great for

• Sight-reading practice
• Music theory analysis
• Memorization through visual association
• Teaching demonstrations and explanations

Selective Note Annotation

You don’t have to annotate every note.

• All notes – Annotate the entire score
• Melody only – Top staff (commonly the right hand)
• Bass only – Bottom staff (commonly the left hand)
• Custom selection – Choose specific notes to include or exclude

Score Display Customization

Control which notation elements appear.

• Time signatures
• Measure numbers
• Metronome marks
• Fingerings (if present in the MusicXML)

Export and Save Options

• Export as SVG – High-quality vector output for printing
• Export as PNG – Raster images for sharing
• Save your configuration – Store annotation settings with the score
• Update score titles – Easily rename your scores

Quick Start Guide

1. Upload your MusicXML file or open an existing score
2. Enable note names from the options panel
3. Choose your preferred notation system
4. Adjust display and font settings
5. Apply color coding if desired
6. Use zoom and navigation to explore the score
7. Export your annotated score

Technical Details

Annotune is built with modern web technologies.

• React / NextJS for the user interface
• OpenSheetMusicDisplay for music notation rendering
• MusicXML as the underlying file format
• SVG-based rendering for crisp, scalable output

Ready to start?
Load a score and explore the options panel to begin customizing your music notation experience.