Agent skill

japanese-brand-design

Japanese brand design guidelines with traditional color palettes (伝統色), typography (ゴシック体/明朝体), ma (間) spacing, wabi-sabi (侘寂) aesthetics, and logo design for Japanese characters. Triggers on requests for 和風デザイン, ブランドデザイン, 伝統色, 日本語タイポグラフィ, ロゴデザイン, 配色ガイド.

Stars 163
Forks 31

Install this agent skill to your Project

npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/other/other/japanese-brand-design

SKILL.md

日本語ブランドデザイン ガイドラインスキル

概要

日本の美意識・伝統文化に根ざしたブランドデザインガイドラインを生成するスキルです。伝統色パレット、日本語タイポグラフィ、間(ma)の設計原則、侘寂の美学を統合的に活用し、日本らしいブランドアイデンティティを構築します。

伝統色パレット

日本の伝統色を基調としたブランドカラーの基本パレットです。

色名 HEX 印象・用途
藍色(あいいろ) #264348 信頼・誠実。企業ブランド、ヘッダー
茜色(あかねいろ) #B7282E 情熱・活力。アクセント、CTA
桜色(さくらいろ) #FEDFE1 優美・柔和。背景、女性向け
若草色(わかくさいろ) #B9D08B 成長・新鮮。環境、ヘルスケア
山吹色(やまぶきいろ) #F8B500 豊穣・注目。警告、ハイライト
藤色(ふじいろ) #BAA5C8 上品・神秘。プレミアム、クリエイティブ
墨色(すみいろ) #343434 重厚・洗練。テキスト、フッター
金色(きんいろ) #C9A84C 高級・伝統。装飾、プレミアムライン

詳細な伝統色一覧は palettes/traditional-colors.md を参照してください。

日本語タイポグラフィ ガイドライン

書体の選択

書体 特徴 推奨用途 代表フォント
ゴシック体 均一な線幅、モダン、視認性が高い 見出し、UI、Web本文 Noto Sans JP, BIZ UDGothic, 游ゴシック
明朝体 横細・縦太、伝統的、可読性が高い 長文本文、格式ある文書、印刷物 Noto Serif JP, 游明朝, 源ノ明朝
丸ゴシック体 角が丸い、親しみやすい カジュアルなUI、子供向け M PLUS Rounded 1c, ヒラギノ丸ゴ

フォントペアリング(日本語 + 欧文)

日本語フォント 欧文フォント 印象
Noto Sans JP Inter / Roboto モダン・クリーン
Noto Serif JP Playfair Display / Cormorant エレガント・格式
游ゴシック Helvetica Neue / SF Pro ビジネス・プロフェッショナル
M PLUS Rounded 1c Nunito / Quicksand カジュアル・親しみ

テキスト階層

h1: 32px / font-weight: 700 / letter-spacing: 0.05em / 明朝体 or ゴシック体
h2: 24px / font-weight: 700 / letter-spacing: 0.04em
h3: 20px / font-weight: 600 / letter-spacing: 0.03em
本文: 16px / font-weight: 400 / letter-spacing: 0.05em / line-height: 1.8
キャプション: 14px / font-weight: 400 / letter-spacing: 0.04em
注釈: 12px / font-weight: 400

行間・字間の設定

  • 行間(line-height): 日本語本文は 1.82.0 を推奨(欧文より広めに取る)
  • 字間(letter-spacing): 0.04em0.08em で読みやすさを確保
  • 段落間: 本文の 1.52.0 倍の余白を設ける
  • 禁則処理: 句読点・閉じ括弧が行頭に来ないよう word-break: keep-all を考慮

間(ma)— 余白の設計原則

「間」は日本の美意識の根幹を成す概念です。単なる「空き」ではなく、要素間の関係性を定義する積極的なデザイン要素として扱います。

間の三原則

  1. 引き算の美学: 要素を足すのではなく、不要な要素を引くことで本質を際立たせる
  2. 呼吸する余白: 余白は「無」ではなく「気配」。コンテンツが呼吸できる空間を確保する
  3. 関係性の表現: 要素間の距離で、関連性の強弱を視覚的に表現する

実装ガイドライン

要素 推奨余白 説明
セクション間 80px120px 大きな間で区切りを明確に
見出し上部 48px64px 新しいトピックの始まりを示す
見出し下部 16px24px 見出しと本文の近接性を保つ
段落間 24px32px 読みやすいリズムを生む
カード内パディング 24px40px 内容に呼吸する余裕を与える

侘寂(wabi-sabi)の美学

三つの美意識

概念 意味 デザインへの応用
不完全の美 完璧でないものに宿る美しさ 手書き風要素、非対称レイアウト、テクスチャの活用
簡素 余計なものを削ぎ落とした本質的な美 ミニマルなUI、限定的な色数、必要最小限の装飾
自然さ 人工的でない、有機的な美しさ 自然素材のテクスチャ、有機的な曲線、季節感の反映

デザインルール

  • 色数の制限: メインカラー1色 + アクセント1色 + 無彩色で構成する
  • テクスチャの活用: 和紙、墨、筆のかすれなど自然な質感を取り入れる
  • 非対称バランス: 完全な左右対称を避け、動きのあるレイアウトを心がける
  • 季節の反映: 四季に応じた色彩・モチーフを取り入れる

ロゴデザイン ガイドライン

漢字ロゴ

  • 筆文字スタイル: 書道の力強さ・躍動感を活かす。飲食・伝統文化向け
  • 角ゴシックスタイル: 現代的・力強い印象。テクノロジー・メーカー向け
  • 明朝スタイル: 格式・信頼感。金融・法律・高級ブランド向け

ひらがなロゴ

  • 柔らかい曲線: ひらがなの有機的な曲線を活かし、親しみやすさを表現
  • カスタムレタリング: 既存フォントをベースにオリジナルの調整を加える
  • 余白の確保: ひらがなは画数が少ないため、周囲の間を広めに取る

ロゴ設計の注意事項

  1. 縦書き・横書き両対応: 日本語ロゴは縦横両方の配置を想定して設計する
  2. 小さいサイズでの視認性: ファビコン・SNSアイコンサイズでも判読できるか確認
  3. 背景色の考慮: 明背景・暗背景の両方で使えるバリエーションを用意する
  4. 英語表記との併記: 海外展開を見据え、英語ロゴタイプも同時にデザインする

ブランドボイス ガイドライン

トーン設定

ブランドの性格 推奨トーン 語尾・表現
格式・伝統 丁寧・荘厳 です・ます調、漢語多め
親しみ・温かみ 柔らかい・包容的 です・ます調、やまとことば多め
先進・革新 シャープ・簡潔 体言止め、短文、カタカナ活用
遊び・創造 カジュアル・自由 くだけた表現、オノマトペ活用

ブランドボイス定義テンプレート

markdown
## ブランドボイス定義書

### 私たちは…
- 【形容詞1】で【形容詞2】な存在です
- 【ブランドの信念・ミッション】

### 話し方
- **使う言葉**: 【例: やまとことば中心、専門用語は避ける】
- **使わない言葉**: 【例: 上から目線の表現、過度なカタカナ語】
- **文体**: 【です・ます調 / だ・である調 / 体言止め】

### トーンの幅
- 最もフォーマル: 【例: 公式プレスリリース】
- 標準: 【例: Webサイト・パンフレット】
- 最もカジュアル: 【例: SNS投稿】

生成時の確認事項

ブランドデザインガイドラインを作成する前に、以下を確認してください:

  1. 業種・業態: 何のブランドか(飲食、テクノロジー、伝統工芸等)
  2. ターゲット: 主要な顧客層(年齢、性別、趣味嗜好)
  3. ブランドの性格: キーワード3〜5個(例: 信頼、革新、温かみ)
  4. 和の度合い: 伝統寄り / モダン和風 / 和洋折衷
  5. 使用媒体: Web / 印刷物 / 店舗 / パッケージ
  6. 既存素材: 既にあるロゴ・カラーなどの制約

Expand your agent's capabilities with these related and highly-rated skills.

Didn't find tool you were looking for?

Be as detailed as possible for better results