Typography Scalevon Owl-Listener

Typography Scale Skill.

Erstelle aus wenigen dokumentierten Textstilen eine gut lesbare Hierarchie.

UI-Design
Typografie

OpenDesign herunterladen Nutzungsanleitung ansehen

Quellenprüfung · Typography ScaleSKILL.md

Aufgabe UI-Design Ergebnis • Eine benannte Textstil-Skala mit Größe, Schriftschnitt, Zeilenhöhe und Laufweite. • Schriftrollen-Zuweisungen für Fließtext, Überschriften und technische Texte. • Responsive Nutzungsregeln und Prüfungen mit echten Inhalten. Vor dem Start Für eine aussagekräftige visuelle Prüfung sind die tatsächlichen Schriftdateien oder verfügbare Plattformschriften erforderlich.

Redaktionelle Zusammenfassung · Quelle geprüft 2026-10-07 · kein generiertes Beispiel

01 Funktionen

Ein stimmiges Typografiesystem aufbauen

Eine Referenz für Typografiesysteme zu modularen Größen, Schriftschnitt, Zeilenabstand, Laufweite, Schriftrollen und responsiver Nutzung.

Quellenbasierter WorkflowKein Ausführungs-Benchmark

Die Arbeitsweise

Typography Scale verbindet Größenverhältnisse mit Schriftschnitt, Zeilenhöhe und Buchstabenabstand. Ein Typografiesystem wird dabei als mehr als eine Folge von Schriftgrößen verstanden: Bildunterschrift, Textabsatz, Überschrift und Display-Zeile brauchen unterschiedliche Rollen und Einsatzbedingungen.

Die Quelle enthält Beispiele für modulare Verhältnisse und Schriftrollen sowie mobile Hinweise zu Überschriften und Zeilenlänge. Das sind Ausgangsregeln, die mit echten Inhalten getestet werden sollten. Es wird nicht behauptet, dass ein mathematisches Verhältnis allein lesbare Typografie für jede Schrift oder jedes Schriftsystem garantiert.

Erwartete Ergebnisse

Eine benannte Textstil-Skala mit Größe, Schriftschnitt, Zeilenhöhe und Laufweite.
Schriftrollen-Zuweisungen für Fließtext, Überschriften und technische Texte.
Responsive Nutzungsregeln und Prüfungen mit echten Inhalten.

Beispiel-Briefing ansehen

Vom Briefing zur Prüfung

01
Basisverhältnis wählen
Wähle eine Fließtext-Basis und ein Verhältnis, das zu Inhalt und bestehender Marke passt.
02
Vollständige Stile definieren
Ordne jeder Größe Schriftschnitt, Zeilenabstand, Laufweite und eine klare Einsatzrolle zu.
03
Echten Text testen
Prüfe lange Überschriften, Textabsätze und mobile Breiten; führe keine unnötigen Größen ein, um einzelne Fälle zu beheben.

02 Einsatzbereiche

Wann es passt

Für eine aussagekräftige visuelle Prüfung sind die tatsächlichen Schriftdateien oder verfügbare Plattformschriften erforderlich.

Gut geeignet

Uneinheitliche TextstileNützlich, wenn ein Produkt nahezu doppelte Überschriften und Labels angesammelt hat.
Neue UI-GrundlagenLegt Schriftrollen fest, bevor einzelne Screens eigene Skalen erfinden.

Zu beachtende Grenzen

Nicht nur ZeilenlängeDie Zeilenlänge ist wichtig, doch dieser Skill behandelt ein umfassenderes Typografiesystem.
Keine SchriftlizenzSchriftauswahl und -nutzung erfordern weiterhin passende Lizenzen und Verfügbarkeit auf der Plattform.

Diese Eingaben mitbringen

Schriften und MarkeGib freigegebene Schriftfamilien, verfügbare Schnitte und bestehende Vorgaben an.
InhaltsbeispieleFüge realistische Labels, Überschriften, Absätze, Code oder Zahlenanzeigen bei.
BildschirmkontexteBeschreibe Anforderungen für Mobilgeräte, dichte UIs und das Lesen langer Texte.

03 Wichtige Entscheidungen

Entscheidende Punkte

Stile tragen Rollen
Dokumentierte Anwendungsfälle verringern willkürliche Entscheidungen zwischen benachbarten Größen.
Mobil, ohne alles zu verkleinern
Die Quelle unterscheidet zwischen dem Skalieren von Überschriften und dem Beibehalten einer lesbaren Fließtext-Basis.

04 Beispielbriefing

Ein fokussiertes Briefing ausprobieren

Das folgende Beispiel-Briefing wurde nicht getestet. Prüfe die Einrichtung des Skills, bevor du es verwendest.

Einrichtung prüfen

Nutze den dokumentierten Installationsweg des Repositorys und behalte alle referenzierten Begleitdateien bei. Dieser Eintrag beschreibt eine fokussierte Designmethode, keine ausführbare Anwendung.

Originaldatei der Quelle

https://github.com/Owl-Listener/designer-skills/blob/9a6930cf84a822eb458624bd11c61aac5bbdf224/ui-design/skills/typography-scale/SKILL.md

Für eine aussagekräftige visuelle Prüfung sind die tatsächlichen Schriftdateien oder verfügbare Plattformschriften erforderlich.

Mit einem Ergebnis beginnen

Passe Umfang, Quellmaterial und Vorgaben dieses Briefings an, bevor du den Skill ausführst.

Beispiel-Briefing

Nutze typography-scale für eine Recherche-Lese-App mit Artikeltext, Notizen, Navigationslabels und Codeauszügen. Definiere eine zurückhaltende modulare Skala mit vollständigen Stilwerten und Verhalten der Überschriften auf Mobilgeräten. Teste mit den gelieferten langen Titeln und Absätzen statt mit Platzhaltertext.

Ergebnis prüfen

Prüfe das tatsächliche Ergebnis anhand dieser beobachtbaren Kriterien.

Jeder Stil enthält mehr als nur eine Schriftgröße.
Häufige Textrollen verwenden eine begrenzte Anzahl von Stilen.
Lange Überschriften und Fließtext bleiben bei schmalen Breiten lesbar.

OpenDesign bietet einen lokalen Design-Arbeitsbereich für Coding-Agenten. Diese Auflistung bedeutet nicht, dass der Skill mitgeliefert wird oder dass externe Tools, Zugangsdaten und Softwareabhängigkeiten enthalten sind.

OpenDesign herunterladen Schnellstart lesen

05 Quelle und Lizenz

Quelle und Lizenz

Diese Seite beschreibt die unten verlinkte, festgelegte Quellversion. Verhalten und Anforderungen im Upstream können sich ändern.

Quellen-Inhaber: Owl-Listener
Repository: Owl-Listener/designer-skills
Skill-Datei: ui-design/skills/typography-scale/SKILL.md
Lizenz: MIT
Geprüfter Stand: 2026-10-07 · 9a6930cf84a8

Redaktionelle Quellenzusammenfassung

Eine Referenz für Typografiesysteme zu modularen Größen, Schriftschnitt, Zeilenabstand, Laufweite, Schriftrollen und responsiver Nutzung.

Originalzusammenfassung von OpenDesign auf Grundlage der verlinkten Quelle. Repository-Sterne sind ein datiertes Popularitätssignal, weder Skill-Nutzung noch Qualitätswert.

06 Fragen vor dem Start

Fragen vor dem Start

Wählt eine modulare Skala die Schrift aus?

Nein. Das Verhältnis ordnet die Größen; Schriftauswahl und tatsächliche Darstellung erfordern weiterhin Urteilsvermögen.

Sollten alle Desktop-Größen auf Mobilgeräten schrumpfen?

Die Quelle empfiehlt, Überschriften zu verkleinern, dabei eine lesbare Fließtextgröße beizubehalten und die Zeilenlänge anzupassen.

Wie viele Stile sollten regelmäßig verwendet werden?

Die Quelle empfiehlt, die routinemäßige Nutzung auf wenige Stile zu begrenzen und zusätzliche Rollen wie Bildunterschriften oder Display-Text zu dokumentieren.

OpenDesign

Schaffe Raum für die nächste Design-Iteration.

Bewahre Briefing, Quellmaterial und Designarbeit gemeinsam in einem lokalen Arbeitsbereich auf. Prüfe die Einrichtung des Skills, bevor du ihn in deinen Workflow aufnimmst.

OpenDesign herunterladen Design-Skills durchsuchen