ブランドアイデンティティ
bikedo.app ブランドの使い方。
ワードマーク、パレット、タイポグラフィ、そして製品についての話し方の短いガイドです。パートナーサイト、プレスキット、コミュニティ投稿で BikeDo の素材を使うなら、これが正本です。
ワードマーク
二色、二ウェイト、Clay のアクセント一つ。Inter Black、トラッキングをやや詰めて。
黒の上
明るい背景の上
モノクロ(最終手段)
小(ファビコン/アプリアイコン)
ワードマークは常に 「bikedo.app」(小文字)。「.app」の部分は常に Clay。
ワードマーク周囲のクリアスペースは「b」の字高以上。詰め込まない。
本文中では製品名を BikeDo(CamelCase)と書く — 「BikeDo App」「BikeDo API」は不可。
アイコン
アプリのマーク — 暗いタイル上の Clay 色の小文字「b」。同じマークがアプリアイコン、ファビコン、フッターや署名のアイコンとして機能します。
マークの色を変えたり、変形・回転させたりしないでください。比率と余白を保ってください。
アイコンには暗い背景が組み込まれています — 別の暗いタイルの上に余白なしで置かないでください。
壁紙
ブランドカラーのデスクトップ壁紙 — charcoal 上のワードマーク、5K。マークのみ、またはスローガン入りを選べます。
スマホ用



ソーシャル / シェア
カラーパレット
キャニオン由来。暖色のアクセント(Clay)一つ、ダーク二つ、ニュートラル二つ、テキスト二つ。各色には役割がある。レーンを守る。
Clay
#C45E3A主要アクセント。CTA、リンク、フォーカス、アクティブ状態。ページ背景には使わない。
Black
#1A1A1Aページ背景(ダークサーフェス)。モバイル/Web のデフォルトキャンバス。
Charcoal
#2D2D2Dダーク面のカード/パネル背景。Black より一段明るい。
Stone
#4A4A4Aダーク面のボーダー、ディバイダー、ヘアライン。30〜60% 不透明度で繊細なセパレーターに。
Text light
#F5F5F5ダーク面のプライマリ文字。見出しと本文を Black/Charcoal の上に。
明るい色 — Charcoal もしくは Black のテキストと組み合わせる。
Text muted
#78716Cセカンダリ文字、キャプション、ヒント、プレースホルダー。本文サイズで Black に対し WCAG AA。
Sand
#E8DED5明るい面のボーダー(マーケティング、モックアップ)。Light bg と相性が良い。
明るい色 — Charcoal もしくは Black のテキストと組み合わせる。
Light bg
#F8F6F3ライトテーマ/モックアップのオフホワイト。純白は使わない。
明るい色 — Charcoal もしくは Black のテキストと組み合わせる。
タイポグラフィ
製品と本文には Inter。マーケティング面の編集見出しには Playfair Display。混在禁止 — 一つの面に一つの役割。
UI + 本文
Inter
いろはにほへと ちりぬるを わかよたれそ つねならむ
編集見出し
Playfair Display
いろはにほへと ちりぬるを わかよたれそ つねならむ
H1 — Playfair、48〜60px
あなたのバイクのためのシンプルな家。
H2 — Playfair、28〜36px
スプレッドシートなしの整備履歴。
本文 — Inter、16〜18px
整備を 2 タップで記録。写真を添える。ショップとシェア。所有者が変わってもバイクと一緒に履歴が移動する。
キャプション — Inter、12〜13px
最終整備:14 日前 ・ 1,240 km
トーン&ボイス
BikeDo はバイクに詳しい、落ち着いた頼れる友人のように話す。自信があり、具体的で、決して大げさにしない。叫ばない。
する
ワードマークは「bikedo.app」、「.app」は Clay で使う。
Inter Black/Bold と組み合わせ、呼吸させる — 「b」の字高以上のクリアスペースを。
本文中では製品名を「BikeDo」(CamelCase)と書く。
文の中では CamelCase の方が小文字ワードマークより読みやすい。
Clay は控えめに — Black/Charcoal ページ上で唯一のアクセントとして。
すべてをアクセントにすると、何もアクセントでなくなる。Clay は次のアクションへ視線を導く。
見出しとボタンはセンテンスケースで。
センテンスケースの方が人間らしく、企業的でない響き。
しない
本文で「BikeDo App」「BikeDo Mobile」「BikeDo API」と書かない。
あくまで BikeDo — アプリと API は実装の詳細であり、名前の一部ではない。
ワードマークの色分けを変えない。
「bikedo」は常に Text light(ダーク背景)か Charcoal(ライト背景)、「.app」は常に Clay。
Clay の上に Clay を載せたり「.app」を再着色したりしない。
ブランドを支える識別シグナルが失われる。
純白を背景に使わない。
Light bg(#F8F6F3)を使う。土系のパレットには純白は冷たく見える。
ワードマークの横にタグラインを並べない。
タグラインが必要なら、ワードマークの下に Text muted で別行に置く。






