Ein Blick aufs Handgelenk dauert kaum länger als eine Sekunde. In dieser Zeit muss ein Zifferblatt verraten, wie spät es ist, und zwar im Halbdunkel, im Gehen und aus dem Augenwinkel. Kaum eine andere Gestaltungsaufgabe hat so wenig Platz und so wenig Zeit, und kaum eine verzeiht so wenig.
Uhrendesign ist deshalb eine eigene Sparte zwischen Produktdesign, Typografie und Interface-Gestaltung. Wer ein Zifferblatt entwirft, entscheidet über Zeigerformen, Striche, Ziffern, Farben und Abstände auf einer Fläche von wenigen Zentimetern. Bei Smartwatches kommen Anzeigen für Wetter, Termine oder Schritte hinzu, die sich denselben Raum teilen.
Dieser Ratgeber zeigt, was ein lesbares Zifferblatt ausmacht, was du von zwei Klassikern lernen kannst, welche Regeln für digitale Zifferblätter gelten und wie du ein eigenes Zifferblatt in einem Vektorprogramm aufbaust.
Was macht ein Zifferblatt auf einen Blick lesbar?
Eine klare Rangfolge: Erst die Zeiger, dann die Stundenmarken, zuletzt alles andere. Das Auge sucht zuerst den Winkel der Zeiger und gleicht ihn mit den Marken am Rand ab. Ziffern lesen wir dabei kaum, wir erkennen Positionen. Deshalb funktionieren Zifferblätter ganz ohne Zahlen, solange die Marken bei 12, 3, 6 und 9 kräftiger sind als die übrigen.
Das macht ein Zifferblatt lesbar
Die vier Stellschrauben für den Blick in einer Sekunde
- Stunden- und Minutenzeiger klar verschieden lang und breit
- Marken bei 12, 3, 6 und 9 kräftiger als die übrigen
- Kontrast von mindestens 4,5:1 als Richtwert
- Schrift mit offenen Formen, 3, 6, 8 und 9 gut unterscheidbar
- Freie Fläche rund um die Zeiger
- Schmale, verzierte Schriften in kleiner Größe
Quellen: W3C (WCAG 2.1, Kontrast), Redaktion TutKit
Vier Stellschrauben bestimmen, ob das klappt:
- Zeiger: Stunden- und Minutenzeiger müssen sich in Länge und Breite deutlich unterscheiden. Der Minutenzeiger reicht bis an die Minutenstriche, der Stundenzeiger endet sichtbar davor.
- Kontrast: Dunkle Zeiger auf hellem Grund oder umgekehrt. Für Text auf Bildschirmen verlangen die Web-Richtlinien WCAG ein Kontrastverhältnis von mindestens 4,5:1; das ist auch für Zifferblätter ein brauchbarer Richtwert.
- Typografie: Wenn Ziffern, dann in einer Schrift mit offenen Formen, bei der sich 3, 6, 8 und 9 klar unterscheiden. Schmale, verzierte Schriften verschwimmen in kleiner Größe.
- Weißraum: Jede zusätzliche Anzeige, jedes Logo und jede Zeile Text nimmt den Zeigern Fläche weg. Ein gutes Zifferblatt lässt bewusst Platz frei.
Ob die Rangfolge stimmt, prüfst du mit einem einfachen Versuch. Druck drei Entwürfe in Originalgröße aus, häng sie nebeneinander an die Wand und geh zwei Schritte zurück. Lass dir von jemandem Uhrzeiten zeigen und miss grob, bei welchem Entwurf du am schnellsten antwortest. Meist gewinnt nicht der schönste, sondern der mit den klarsten Zeigern und den wenigsten Elementen.
Was lernst du von der Bahnhofsuhr und von Max Bill?
Dass Reduktion die Ablesbarkeit verbessert. Die Schweizer Bahnhofsuhr entwarf der SBB-Ingenieur Hans Hilfiker 1944. Sie kommt ohne Ziffern aus und arbeitet nur mit kräftigen Strichen und schwarzen, breiten Zeigern. 1953 ergänzte Hilfiker den roten Sekundenzeiger, dessen Form an die Kelle des Zugpersonals erinnert. Der Sekundenzeiger braucht für eine Runde etwa 58,5 Sekunden und wartet oben kurz auf den Impuls der Hauptuhr, mit dem der Minutenzeiger weiterspringt. So wird aus einem technischen Ablauf ein Detail, das man sich merkt.
Zwei Klassiker des Uhrendesigns
Schweizer Bahnhofsuhr und Max Bill für Junghans
- 1944Hans Hilfiker entwirft die Bahnhofsuhr der SBB
- 1953Roter Sekundenzeiger in Form der Kelle des Zugpersonals
- 1956Max Bill gestaltet mit Ulmer Studierenden eine Küchenuhr
- 1961Das Zifferblatt kommt auf Armbanduhren
Quellen: Wikipedia (Swiss railway clock), Watchtime
Max Bill, der am Bauhaus in Dessau studiert hatte, entwarf 1956 mit Studierenden der Hochschule für Gestaltung Ulm eine Küchenuhr für Junghans. Ab 1961 kam das Zifferblatt auf Armbanduhren. Typisch sind fein getrennte Minutenstriche, etwas längere Striche bei den Stunden, arabische Ziffern in Bills eigener Typografie und drei gut unterscheidbare Zeiger. Der Gedanke dahinter ist funktionalistisch: Ein Gegenstand soll seine Aufgabe so gut wie möglich erfüllen, und alles, was der Ablesbarkeit nicht dient, fällt weg.
Beide Entwürfe sind über 60 Jahre alt und wirken bis heute zeitgemäß. Das liegt daran, dass sie keine Mode bedienen, sondern eine Frage beantworten: Wie liest ein Mensch in Bewegung die Zeit am schnellsten ab?
Was ist bei digitalen Zifferblättern anders?
Ein digitales Zifferblatt ist zugleich Uhr und Benutzeroberfläche. Apple beschreibt in seinen Gestaltungsrichtlinien, dass Menschen mehrmals am Tag auf die Uhr schauen und dabei nur kurz interagieren. Kleine Zusatzanzeigen auf dem Zifferblatt, im Uhrenfach und bei Apple Komplikationen genannt, sollen deshalb wichtige, aktuelle Informationen zeigen, die man beim Anheben des Handgelenks erfasst. Eine Anzeige, die nie etwas Neues verrät, bleibt nach Apples Einschätzung seltener an gut sichtbarer Stelle auf dem Zifferblatt.
Google gibt für Wear OS ähnliche Grundsätze vor: klare Schriften, lesbare Symbole, einfacher Aufbau und eine Uhrzeit, die immer gut sichtbar ist. Dazu kommt eine technische Grenze. Wenn das Display im Ruhezustand dauerhaft leuchtet, dürfen höchstens 15 Prozent der Pixel leuchten, Schwarz ist die Hauptfarbe. Für Gestalter heißt das: Jedes Zifferblatt braucht zwei Fassungen, eine farbige für den aktiven Blick und eine reduzierte mit Umrissen statt Flächen für den Ruhezustand.
Außerdem sollen alle wichtigen Elemente innerhalb des Gehäuserands bleiben, damit nichts abgeschnitten oder verdeckt wird. Bei runden Displays fallen die Ecken eines rechteckigen Entwurfs ganz weg. Ordne Anzeigen deshalb entlang von Kreisbahnen oder im inneren Quadrat an, nicht in den Ecken.
Wie gestaltet man Uhren für Kinder?
Für Kinder kehrt sich die Regel „weniger ist mehr“ teilweise um. Lernuhren zeigen bewusst mehr Information als eine Erwachsenenuhr: Die Stunden stehen innen, die Minuten in Fünferschritten in einem äußeren Ring, oft in zwei Farben, die zu den Zeigern passen. So verbindet das Kind den kurzen Zeiger mit dem inneren Ring und den langen mit dem äußeren. Sobald es die Uhr lesen kann, wirkt dieselbe Fülle überladen, und ein ruhigeres Zifferblatt ist besser.
Bei einer kinder smartwatch kommt eine zweite Ebene dazu, denn hier wird das Zifferblatt zur Bedienoberfläche für jemanden, der vielleicht noch gar nicht liest. Große, eindeutige Symbole ersetzen Text, wenige Funktionen stehen auf der ersten Ebene, und eine Funktion wie der Notruf liegt auf einer eigenen, fühlbaren Taste statt in einem Menü. Dazu kommt das Gehäuse: Es muss Stürze, Regen und Sandkasten aushalten und sich mit kleinen Fingern bedienen lassen.
Für Gestalter ist das eine lehrreiche Aufgabe. Wer ein Zifferblatt so entwirft, dass ein Sechsjähriger es ohne Erklärung versteht, entwirft meist auch für Erwachsene klarer.
Wie entwirfst du ein eigenes Zifferblatt?
Am saubersten in einem Vektorprogramm, weil du das Zifferblatt später ohne Qualitätsverlust in jeder Größe brauchst. So gehst du vor:
- Einen Kreis als Zifferblatt anlegen und die Mitte mit Hilfslinien markieren.
- Einen Minutenstrich oben an den Rand setzen und ihn um die Mitte drehen: 60 Kopien im Abstand von 6 Grad ergeben die Minuten, 12 Kopien im Abstand von 30 Grad die Stunden.
- Die Stundenmarken dicker oder länger machen als die Minutenstriche, die Marken bei 12, 3, 6 und 9 noch einmal kräftiger.
- Zeiger als einfache Formen zeichnen, den Minutenzeiger bis an die Minutenstriche, den Stundenzeiger deutlich kürzer.
- Ziffern, falls gewünscht, in einer offenen Schrift setzen und auf einer Kreisbahn ausrichten.
- Für ein Smartwatch-Zifferblatt eine zweite, reduzierte Fassung für den Ruhemodus anlegen: schwarzer Grund, Umrisse statt Flächen.
- Den Entwurf in Originalgröße auf dem Bildschirm prüfen, also etwa 4 Zentimeter breit, und auf Armlänge ansehen.
Das Drehen mit Kopie um einen festen Mittelpunkt ist dabei der wichtigste Handgriff. Wie das funktioniert, zeigt die Lektion zum Drehen und Spiegeln in Illustrator.
Ein flaches Zifferblatt auf weißem Grund sagt wenig darüber, wie es am Handgelenk wirkt. Leg deinen Entwurf deshalb zum Schluss in eine fotorealistische Szene, etwa mit einer Mockup-Vorlage für eine Smartwatch. Erst dort siehst du, ob Kontrast und Größen auch mit Spiegelungen und Gehäuserand funktionieren.
Was das für dich bedeutet
Uhrendesign ist eine gute Schule für alle, die Oberflächen, Icons oder Infografiken gestalten. Die Regeln sind streng, die Fläche winzig, und jeder Fehler fällt im Alltag sofort auf. Was auf einem Zifferblatt funktioniert, funktioniert fast überall.
- Entwirf ein Zifferblatt ohne Ziffern, nur mit Strichen und Zeigern, und teste, ob du die Zeit in einer Sekunde ablesen kannst.
- Prüf jeden Entwurf in Originalgröße und auf Armlänge, nicht vergrößert auf dem Bildschirm.
- Leg für digitale Zifferblätter von Anfang an eine reduzierte Ruhefassung an.
- Gestalte einmal für eine Zielgruppe, die nicht liest, etwa Kinder. Das schärft den Blick für Symbole und Rangfolge.