ascii-cli-logo-banner について
ASCII CLIバナーの実装方法を選ぶためのルーティングスキルです。要件を整理し、組み込みPython版またはFIGlet版のスキルに振り分けますが、生成自体は行いません。
主な機能
- 01バナー依頼を実装スキルに振り分け
- 02名前、幅、スタイル、任意情報の収集
- 03通常版とコンパクト版の出力指定
- 04プレーンテキストのフォールバック要件
活用シーン
- 01CLI起動バナーの実装方法の選択
- 02サービスのウェルカム画面向け要件の整理
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/ / github.com/ full-stack-skills/ ascii-skills --skill ascii-cli-logo-bannerインストール後、Claude Code で/ascii-cli-logo-bannerを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
LICENSE.txtagents/openai.yamlexamples/banner-80.mdbanner-compact.md詳細
このスキルを使用するタイミング
重要なトリガールール
- ユーザーがスキル名
ascii-cli-logo-bannerを正確に明示した場合にのみ、このスキルを使用してください。
ユーザーが次のことを希望している場合に、このスキルを使用してください:
- CLI またはサービスのスタートアップバナー/ロゴ/ウェルカム画面
トリガーフレーズの例:
- "ascii-cli-logo-banner"
- "use ascii-cli-logo-banner"
- "用 ascii-cli-logo-banner"
- "使用 ascii-cli-logo-banner 生成启动 Banner"
- "用 ascii-cli-logo-banner 做一个 ASCII Logo"
範囲
- このスキルはルーティング/選択のエントリーポイントです。独自の生成機能は提供しません。
- 組み込み(外部フォントエンジンなし)の場合:
ascii-cli-logo-banner-pythonを使用します。 - TAAG/FIGlet スタイル(FIGfont 仕様、スムージングレイアウト)の場合:
ascii-cli-logo-banner-figletjsを使用します。
このスキルの使用方法
入力(推奨)
- brandName(必須)
- version(任意)
- author(任意)
- repoUrl / docsUrl(任意)
- width(デフォルトは 80)
- slogan(任意。ロゴの下に中央揃えで表示する行)
- hint(任意。スローガンの下に中央揃えで表示する行)
- glyph(ascii | block、デフォルトは ascii)
- center(デフォルトは true)
- rule(デフォルトは true。ロゴのみのヒーロー出力にする場合は false を設定)
- style(block | outline | thin、デフォルトは block)
- colorMode(none | ansi256、デフォルトは none。スクリプトではロゴのみ)
- includeCta(デフォルトは true)
出力(必須)
- bannerPlain:ASCII のみで構成されたバナー全体(ロゴ領域 + 情報ブロック + 水平線)
- compactPlain:
width < 60の場合のコンパクトなバナー(1 行のタイトル + 水平線 + 1~2 行の情報) - plainTextFallback:ANSI が有効な場合の色なしフォールバック(bannerPlain と同じ構成)
- embedNotes:埋め込みに関するメモ 3~5 件(CLI の起動/サービスの起動/README/チケット)
手順
- 幅とフォールバックを決定します:
- デフォルトは
width=80 width < 60の場合はcompactPlainを出力し、大きな文字のロゴは省略します
- デフォルトは
- ASCII のみで構成されたロゴを生成します:
- 全角文字や幅が曖昧な Unicode 文字は避けます
- 各行が
<= widthになるようにします
- バナーの構成を組み立てます(推奨順序):
- ロゴ領域(またはコンパクトモードでは 1 行のタイトル)
- 水平線:
width文字ちょうど(-または=) - 情報ブロック:Name / Version / Repo / Docs / Author(値が指定されているフィールドのみ含めます)
- 任意の CTA:例:
Run: <command>またはDocs: <url>
- ANSI による色付けは任意です(位置合わせを崩さないこと):
- 表示文字のみを色付けし、スペースは色付けしません
- 必ず
plainTextFallbackを用意します
スクリプト(任意)
- Python 実装には
ascii-cli-logo-banner-pythonを使用します。 - figlet.js/FIGfont 実装には
ascii-cli-logo-banner-figletjsを使用します。
例
- 2 つの実装スキルにある例を参照してください:
ascii-cli-logo-banner-python/examples/*ascii-cli-logo-banner-figletjs/examples/*
品質チェックリスト
- 80 桁で折り返されたり位置がずれたりしないこと。末尾にスペースがないこと
- ログ/メール/チケットにきれいにコピー&ペーストできること
- シークレット(トークン、内部 URL、個人データ)を決して出力しないこと
キーワード
英語: ASCII、バナー、ロゴ、CLI、ターミナル、起動、ウェルカム、プレーンテキスト、ANSI、色なし 中国語: ASCII、起動バナー、ターミナルバナー、CLI ロゴ、ウェルカムページ、プレーンテキスト、ANSI 色付け、色なしフォールバック
よくある落とし穴
- バージョンの互換性:フレームワークのバージョンと依存ライブラリの互換性に注意してください。バージョンによって API が異なる場合があります
- 設定ファイルの形式:設定ファイルの形式の誤りは最もよくある問題です。エディターの構文チェックを使用することをおすすめします
- 環境変数:必要な環境変数がすべて正しく設定されていることを確認してください。機密情報をハードコードしないでください
- 依存関係の競合:複数のバージョンを共存させる場合は依存関係の競合に注意し、lock ファイルを使用してバージョンを固定してください
- パフォーマンス上の落とし穴:大量のデータを扱う場合はパフォーマンスの最適化に注意し、N+1 クエリなどのよくある問題を避けてください
使用手順
Step 1: 環境の準備
開発環境に必要な依存関係とツールがインストールされていることを確認します。
Step 2: 設定の初期化
プロジェクトの要件に応じて基本設定を行います。
Step 3: コア機能の使用
サンプルコードに従ってコア機能を実装します。
Step 4: テストと検証
テストを実行して、機能が正常に動作することを確認します。
Step 5: デプロイ
開発完了後、デプロイと監視を行います。
コメント
Markdown 対応