Zur Nutzungsanleitung springen
Critique Typographyvon owl-listener

Critique Typography Skill.

Prüfe gerenderte Schrift auf Lesbarkeit und Übereinstimmung mit dem vorhandenen Typografiesystem.

  • Typografie
  • Lesbarkeit
Quellprüfung · critique-typographySKILL.md
Aufgabe Prüfe gerenderte Schrift auf Lesbarkeit und Übereinstimmung mit dem vorhandenen Typografiesystem. Ergebnisse Befunde nach Skala, Lesbarkeit, Konsistenz und Token-Konformität. Vor dem Start Eine Kritik auf Ansichtsebene benötigt die tatsächliche Ausgabe, nicht nur eine Liste von CSS-Deklarationen.
Redaktionelle Zusammenfassung · Quelle geprüft am 2026-11-02 · kein generiertes Beispiel

01 Funktionen

Prüfe gerenderte Schrift auf Lesbarkeit und Übereinstimmung mit dem vorhandenen Typografiesystem

Prüfe Schriftgrößenskala, Lesbarkeit, Konsistenz und Token-Konformität einer Ansicht und formuliere konkrete Befunde und Korrekturen.

Quellenbasierter WorkflowKein Ausführungs-Benchmark

Die Arbeitsweise

Critique Typography untersucht, wie Schrift in einer gerenderten Ansicht tatsächlich eingesetzt wird. Der Skill prüft die Verwendung der Skala, den Lesekomfort, die Konsistenz und die Token-Konformität. Ein hilfreicher Befund benennt sowohl das Sichtbare als auch den vorhandenen Stil oder Token, der dafür gelten sollte. So kann das Team eine konkrete Abweichung korrigieren.

Die Quelle enthält konkrete Prüfdimensionen wie Zeilenlänge, Zeilenhöhe, Laufweite, Kontrast und semantische Rolle. Außerdem fragt sie, ob gleichwertige Elemente gleich behandelt werden. Das ist nach dem Aufbau einer Oberfläche nützlich, insbesondere wenn einzelne Anpassungen das ursprüngliche Typografiesystem allmählich geschwächt haben.

Erwartete Ergebnisse

  • Befunde nach Skala, Lesbarkeit, Konsistenz und Token-Konformität.
  • Eine Beobachtung, Erläuterung und umsetzbare Korrektur für jedes Problem.
  • Eine Bewertung als bestanden, geringfügiges oder schwerwiegendes Problem je geprüfter Dimension.
Beispiel-Briefing ansehen

Vom Briefing zur Prüfung

  1. 01
    Das gerenderte Typografiesystem erfassen

    Prüfe die Ansicht zusammen mit ihren definierten Textstilen und Tokens. Identifiziere Überschriften, Labels, Fließtext und Beschriftungen anhand ihrer tatsächlichen Rolle.

  2. 02
    Lesebedingungen beurteilen

    Prüfe Größe, Zeilenhöhe, Zeilenlänge, Laufweite und Kontrast im Kontext. Behandle numerische Richtwerte aus der Quelle als Prüfkriterien, die anhand der Produktanforderungen zu bewerten sind.

  3. 03
    Gleichwertige Elemente vergleichen

    Prüfe, ob wiederkehrende Labels, Titel und Textblöcke konsistente Schriftstärken, Ausrichtung und Skalenstufen verwenden. Finde einmalige Stile und willkürliche Zwischenwerte.

  4. 04
    Befunde Korrekturen zuordnen

    Trenne je Dimension die neutrale Beobachtung vom Problem und dem Korrekturvorschlag. Benenne den passenden Token, wo eine vorhandene Definition greift.

02 Einsatzbereiche

Wann einsetzen?

Eine Kritik auf Ansichtsebene benötigt die tatsächliche Ausgabe, nicht nur eine Liste von CSS-Deklarationen.

Gut geeignet

  • Typografische AbweichungenIn einer fertigen Ansicht haben sich willkürliche Größen- oder Schriftstärkenanpassungen angesammelt.
  • Gezielte visuelle KritikDas Layout steht fest, aber Texthierarchie oder Lesekomfort benötigen Aufmerksamkeit.

Zu prüfende Grenzen

  • Gerenderte NachweiseEine Kritik auf Ansichtsebene benötigt die tatsächliche Ausgabe, nicht nur eine Liste von CSS-Deklarationen.
  • Vorhandenes SystemDie ursprüngliche Definition der Skala gehört zum separaten Skill typography-scale.
  • Begrenzte BewertungEine Typografieprüfung ist weder eine vollständige Barrierefreiheitszertifizierung noch ein umfassendes Produktaudit.

Diese Eingaben mitbringen

  • Gerenderte AnsichtStelle die Oberfläche in den relevanten Größen und Zuständen bereit.
  • TypografiedefinitionenLiefere Typografie-Tokens und ihre vorgesehenen Rollen.
  • InhaltskontextBeziehe echte Texte, Sprache und Lesebedingungen ein.

03 Wichtige Entscheidungen

Wichtige Entscheidungen

  1. Konkrete Korrekturen

    Korrekturen können auf den exakt vorgesehenen Stil oder Token verweisen.

  2. Vergleichbare Dimensionen

    Der Bericht trennt Skalenprobleme von Lesbarkeit und Konsistenz.

  3. Sichtbare Nachweise

    Befunde beschreiben, was die prüfende Person tatsächlich beobachten kann.

04 Beispielbriefing

Ein konkretes Briefing ausprobieren

Das folgende Beispiel-Briefing wurde nicht getestet. Prüfen Sie die Einrichtung des Skills, bevor Sie es verwenden.

Quelle und Einrichtung prüfen

Stelle die Oberfläche in den relevanten Größen und Zuständen bereit.

Upstream-Quelldatei
https://github.com/owl-listener/designer-skills/blob/9a6930cf84a822eb458624bd11c61aac5bbdf224/visual-critique/skills/critique-typography/SKILL.md

Der folgende Verweis öffnet die Originalanleitung. Prüfe vor der Nutzung die Einrichtung des Repositorys; dies ist kein Installationsbefehl.

Mit einem Ergebnis beginnen

Passen Sie Umfang, Quellmaterial und Rahmenbedingungen in diesem Briefing an, bevor Sie den Skill ausführen.

Beispiel-Briefing
Wende critique-typography auf die gerenderte Analyseübersicht in Desktop- und Mobilbreite an. Vergleiche sichtbare Überschriften, Labels, Werte und Fließtexte mit unseren Typografie-Tokens. Prüfe Skalenverwendung, Zeilenhöhe, Lesebreite, Kontrast und Konsistenz zwischen gleichwertigen Elementen. Gib je Dimension eine neutrale Beobachtung, erkläre das Problem und schlage eine konkrete Korrektur mit dem richtigen Token-Namen vor, sofern vorhanden. Bewerte die Dimension als bestanden, geringfügiges oder schwerwiegendes Problem. Behalte die aktuelle Layoutrichtung bei und unterscheide gemessene Eigenschaften von Urteilen, die weitere Prüfung benötigen.

Ergebnis prüfen

Prüfen Sie die tatsächliche Ausgabe anhand dieser beobachtbaren Kriterien.

  • Jedes Problem bezieht sich auf ein sichtbares Element und eine relevante Textrolle.
  • Token-Empfehlungen verwenden tatsächliche Definitionen aus dem Projekt.
  • Bewertungen werden von Beobachtungen und konkreten Korrekturen begleitet.

OpenDesign bietet einen lokalen Design-Arbeitsbereich für Coding-Agenten. Dieser Eintrag bedeutet nicht, dass der Skill mitgeliefert wird oder dass seine externen Tools, Zugangsdaten und Software-Abhängigkeiten enthalten sind.

05 Quelle und Lizenz

Quelle und Lizenz

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

Quellinhaber
owl-listener
Skill-Datei
SKILL.md
Lizenz
MIT
Geprüfter Stand
2026-11-02 · 9a6930cf84a8
Redaktionelle Quellenzusammenfassung
Prüfe gerenderte Schrift auf Lesbarkeit und Übereinstimmung mit dem vorhandenen Typografiesystem.

Originalzusammenfassung von OpenDesign auf Grundlage der verlinkten Quelle. Repository-Sterne sind ein datiertes Popularitätssignal, keine Skill-Nutzung und keine Qualitätsbewertung.

06 Fragen vor dem Start

Fragen vor dem Start

Definiert der Skill eine neue Typografieskala?

Die Quelle konzentriert sich auf die Prüfung der Verwendung und verweist für die Erstellung einer Skala auf einen separaten Skill.

Welches Format haben die Befunde?

Jede Dimension erhält eine Beobachtung, eine Problemerklärung, eine umsetzbare Korrektur und eine Bewertung des Schweregrads.

Werden fest codierte Schriftwerte untersucht?

Ja. Die Token-Konformität umfasst Schriftfamilie, Größe, Stärke, Zeilenhöhe und Zeichenabstand.

OpenDesign

Briefing und Designarbeit an einem Ort.

Halten Sie Briefing, Quellmaterial und Designarbeit in einem lokalen Arbeitsbereich zusammen. Prüfen Sie die Einrichtung des Skills, bevor Sie ihn in Ihren Workflow aufnehmen.

Upstream-Quelldatei
https://github.com/owl-listener/designer-skills/blob/9a6930cf84a822eb458624bd11c61aac5bbdf224/visual-critique/skills/critique-typography/SKILL.md