使い方ガイドへスキップ
Critique Typography作者 owl-listener

Critique Typography スキル。

描画された文字を、読みやすさと既存のタイポグラフィ体系に照らして評価します。

  • タイポグラフィ
  • 読みやすさ
ソースレビュー · critique-typographySKILL.md
タスク 描画された文字を、読みやすさと既存のタイポグラフィ体系に照らして評価します。 成果物 スケール、読みやすさ、一貫性、トークン準拠ごとに整理した指摘。 始める前に 画面単位の評価には実際の出力が必要です。CSS 宣言の一覧だけでは不十分です。
記事用の要約 · ソース確認日 2026-11-02 · 生成された例ではありません

01 機能概要

描画された文字を、読みやすさと既存のタイポグラフィ体系に照らして評価します

画面のタイプスケール、読みやすさ、一貫性、トークン準拠を確認し、具体的な指摘と修正案をまとめます。

ソースに基づくワークフロー実行ベンチマークではありません

作業の進め方

Critique Typography は、描画された画面で文字が実際にどう使われているかを調べます。スケールの使い方、読み心地、一貫性、トークン準拠を確認します。有用な指摘では、目に見える状態と、その箇所に適用すべき既存のスタイルやトークンの両方を示し、具体的な不一致を修正できるようにします。

ソースは行長、行高、字間、コントラスト、意味上の役割といった具体的な観点を含みます。同等の要素が同じ扱いになっているかも確認します。そのため、画面の構築後、特に個別調整が重なって元のタイポグラフィ体系が崩れてきた場合に役立ちます。

想定される成果物

  • スケール、読みやすさ、一貫性、トークン準拠ごとに整理した指摘。
  • 各問題に対する観察、説明、実行可能な修正案。
  • 確認した観点ごとの、合格・軽微な問題・重大な問題の評価。
サンプルブリーフを見る

ブリーフからレビューまで

  1. 01
    描画された文字体系を読む

    定義済みの文字スタイルやトークンと画面を照合します。見出し、ラベル、本文、キャプションを実際の役割に応じて識別します。

  2. 02
    文字の読みやすさを評価する

    サイズ、行高、行長、字間、コントラストを文脈に沿って確認します。ソース内の数値指針は、製品要件に照らして評価するための基準として扱います。

  3. 03
    同等の要素を比較する

    繰り返し現れるラベル、見出し、テキストブロックで、太さ、配置、スケール段階が一貫しているか確認します。その場限りのスタイルや任意の中間値を特定します。

  4. 04
    指摘を修正案につなげる

    各観点で、中立的な観察を問題と修正案から分けます。既存の定義が適用できる場合は、適切なトークン名を示します。

02 利用場面

使いどころ

画面単位の評価には実際の出力が必要です。CSS 宣言の一覧だけでは不十分です。

向いているケース

  • タイポグラフィのずれ構築済みの画面に、任意のサイズや太さの調整が積み重なっている場合。
  • 焦点を絞った視覚評価レイアウトは固まっているものの、文字の階層や読み心地に改善が必要な場合。

確認すべき制限

  • 描画結果の証拠画面単位の評価には実際の出力が必要です。CSS 宣言の一覧だけでは不十分です。
  • 既存体系を前提とする初期スケールの定義は、別の typography-scale スキルの対象です。
  • 評価範囲を限定文字組みのレビューは、完全なアクセシビリティ認証や製品全体の監査ではありません。

用意する入力

  • 描画された画面重要なサイズと状態のインターフェースを用意します。
  • 文字スタイルの定義タイポグラフィトークンと、想定する役割を提供します。
  • 内容の背景実際の文章、言語、読む際の条件を含めます。

03 重要な判断

重要な判断

  1. 具体的な修正

    適用すべき正確なスタイルやトークンを修正先として指定できます。

  2. 比較可能な観点

    スケールの問題を、読みやすさや一貫性の問題から分けて報告します。

  3. 見える証拠

    レビュー担当が実際に観察できる内容を指摘します。

04 依頼例

目的を絞った依頼文を試す

以下のサンプルブリーフはテストされていません。使用前にスキルのセットアップを確認してください。

ソースとセットアップを確認する

重要なサイズと状態のインターフェースを用意します。

アップストリームのソースファイル
https://github.com/owl-listener/designer-skills/blob/9a6930cf84a822eb458624bd11c61aac5bbdf224/visual-critique/skills/critique-typography/SKILL.md

以下の参照先から、提供元の手順を確認できます。利用前にリポジトリのセットアップ要件を確認してください。これはインストールコマンドではありません。

一つの成果物から始める

スキルを実行する前に、このブリーフの範囲、素材、制約を調整してください。

サンプルブリーフ
critique-typography を使い、デスクトップ幅とモバイル幅で描画された分析概要画面を確認してください。見えている見出し、ラベル、数値、本文をタイポグラフィトークンと比較してください。スケールの使い方、行高、読みやすい行長、コントラスト、同等の要素間の一貫性を評価してください。各観点について中立的な観察、問題の説明、具体的な修正案を示し、定義がある場合は正しいトークン名を付けてください。合格・軽微な問題・重大な問題で評価してください。現在のレイアウト方針を保ち、測定済みの属性と、さらに確認が必要な判断を区別してください。

結果を確認する

実際の出力を、次の観察可能な基準に照らして確認してください。

  • 各問題が、見える要素とその文字の役割に対応している。
  • 推奨トークンはプロジェクト内の実在する定義に基づいている。
  • 評価に観察と具体的な修正案が伴っている。

OpenDesignは、コーディングエージェント向けのローカルデザインワークスペースを提供します。この掲載は、スキルが同梱されていること、または外部ツール、認証情報、ソフトウェア依存関係が含まれていることを意味しません。

05 ソースとライセンス

ソースとライセンス

このページは、下記にリンクされた固定のソースリビジョンについて説明しています。アップストリームの挙動や要件は変更される可能性があります。

ソースの所有者
owl-listener
スキルファイル
SKILL.md
ライセンス
MIT
確認したスナップショット
2026-11-02 · 9a6930cf84a8
編集部によるソース要約
描画された文字を、読みやすさと既存のタイポグラフィ体系に照らして評価します。

リンク先のソースに基づく、OpenDesignによるオリジナルの要約です。リポジトリのスター数は日付時点の人気の指標であり、スキルの利用状況や品質スコアではありません。

06 開始前の質問

始める前の質問

新しいタイプスケールを定義しますか?

ソースは使い方のレビューに重点を置き、スケール作成は別のスキルに委ねています。

指摘はどのような形式ですか?

各観点に、観察、問題の説明、実行可能な修正案、問題の深刻度評価を付けます。

ハードコードされた文字の値も調べますか?

はい。トークン準拠の確認には、フォントファミリー、サイズ、太さ、行高、字間が含まれます。

OpenDesign

依頼内容とデザイン作業を一つの場所に。

ブリーフ、ソース資料、デザイン作業をローカルワークスペースにまとめて管理できます。ワークフローに追加する前に、スキル自体のセットアップを確認してください。

アップストリームのソースファイル
https://github.com/owl-listener/designer-skills/blob/9a6930cf84a822eb458624bd11c61aac5bbdf224/visual-critique/skills/critique-typography/SKILL.md