ジャカルタ・インディペンデント・スクール

ブランドガイド

プレゼンテーションからウェブサイトに至るまで、あらゆる素材において一貫性があり、自信に満ち、洗練されたブランドを維持するためのガイドライン。

バージョン 1.0 · 2026年2月

01 当社のブランドアイデンティティ 理念と原則

このガイドはISJの全関係者を対象としています。ロゴ、カラー、タイポグラフィ、メッセージングの使用方法について明確な指針を示し、あらゆる資料において一貫性とプロフェッショナルなブランドを維持するためのものです。プレゼンテーション、ニュースレター、学校イベントのポスター、ソーシャルメディアコンテンツなどを作成する際、このガイドに従うことで、ISJのアイデンティティが明確かつ統一された形で反映された成果物を確実に生み出せます。

私たちのブランドは私たちの本質を映し出します。一貫した使用がブランドを強化します。

デザイン哲学

ISJのビジュアルアイデンティティは、控えめなラグジュアリーの伝統に根ざしています——温かみがあり、自信に満ち、抑制が効いています。当社の資料は、パンフレットではなく、明るく照らされた読書室のような感覚を与えるべきです。私たちは、ゆとりのある余白、温かみのあるトーン、熟考されたタイポグラフィ、そして視覚的な雑音の排除を通じて、静かな威厳を伝えます。

基本原則

冷たさより温もり。クールなグレーも、無機質な白も使わない。ニュートラルカラーは全て温かみのある——クリーム、ストーン、サンド。私たちの配色は、学校コミュニティを反映した、親しみやすく居心地の良い雰囲気を創り出します。

装飾よりも抑制。各要素は存在意義を持つ。装飾は目的なく追加しない。整然としたレイアウト、意図的な余白、静かな自信は、視覚的な雑然さよりも力強い。

説得よりも確信。ISJは大声で主張する必要はない。私たちの品質は、抑制が効き、思慮深く、確信に満ちた姿勢を通じて伝わる。

ストック画像よりも本物らしさを重視。ISJ教材は、学校生活の写真や生徒が制作した作品を通じて視覚的な魅力を高め、あらゆる媒体で本物らしく魅力的な表現を維持しています。

02 声とトーン 私たちの話し方

もし私たちのブランドが人なら、こんな風に話すでしょう。私たちの声は本物で、思慮深く、自信に満ちています。気取った口調は避けましょう。明確に、シンプルに語り、私たち自身の視点ではなく、聴衆の視点で世界を見たいのです。


言語と用語

言語の一貫性は、ブランドアイデンティティの強化に寄与し、あらゆるコミュニケーションにおける明確性を保証します。

ルール詳細
イギリス英語すべての文書はイギリス英語の綴りを使用します色、行動、プログラム
生徒、学生ではない子どもを指す場合は「生徒」を使用してください「私たちの生徒たちは成長しています…」
主語は大文字で始める学術科目の名称は常に大文字で表記する数学、科学、英語
学校名フルネームを先に、その後ISJ「ジャカルタ・インディペンデント・スクール(ISJ)…」
ザ・スクールズ・トラスト常に冠詞「The」を含める「ザ・スクールズ・トラストの一員」
03 なぜISJなのか ブランドピラー

ISJは英国の私立学校が築いてきた最良の伝統を継承しています。それは人格形成への取り組み、学問的卓越性、そして全人的教育への確固たる姿勢です。道徳的誠実さ、リーダーシップ、自己規律を重視しつつ、活気ある芸術活動、スポーツ、課外活動との調和を図っています。こうした伝統は、グローバル化した世界で成功を収める準備が整った、バランスの取れた自信に満ちた人材を育みます。

幸せで、温かく、安全で、歓迎される

ISJは、すべての児童が理解され、尊重され、支えられていると感じられる、幸せで育みのある学校です。私たちのコミュニティは温かく、包み込むように受け入れ合い、信頼と思いやりを基盤として築かれており、児童と家族双方に帰属意識を生み出しています。私たちは、幸福が成功の尺度であるだけでなく、達成の基盤でもあると信じています。安全で自信に満ちた子どもたちは、自由に探求し、挑戦し、自らの可能性を最大限に発揮することができるのです。

学業の優秀さ

私たちは、生徒一人ひとりに注がれる個別指導に根ざした学問的卓越性を追求しています。校長と教師陣は全児童を個人的に把握し、それぞれの強み、興味、志を理解しています。献身的な教育チームが提供する国際的に認められたカリキュラムは、探究心、厳密さ、自立した思考を育み、全ての生徒が最高の成果を収め、生涯にわたる学びへの愛を育むことを保証します。

全人的教育

ISJでは、学びは教室の枠をはるかに超えています。総合的な教育方針のもと、学業とスポーツ・音楽・芸術・野外学習の充実したプログラムを両立させています。こうした経験を通じて、生徒たちは創造性、自信、そして困難に立ち向かう力を育みます。私たちは、世界への好奇心を喚起し、人格形成、チームワーク、リーダーシップスキルを育むことで、子どもたちが人生に備えられるよう導くことを目指しています。

キャラクター

人格教育は私たちの活動の中心です。敬意、親切心、良き行動に関する価値観と期待は、日々の学校生活に織り込まれています。生徒たちは誠実に行動し、共感を示し、自分自身と他者に対する責任を果たすよう促されます。これらの習慣は、教育期間を通じて、そしてその後の人生においても彼らを導く道徳的指針を形成します。

場所

緑豊かな家族向けのポンドック・インダ地区に位置するISJは、南ジャカルタにおいて安全で便利な立地を提供しています。モダンなキャンパスには開放的な緑地が広がり、学びと遊びのための穏やかで刺激的な環境を創出しています。都心部において、子供たちが学問的にも人間的にも成長できる稀有な環境です。

グローバルパスポート

ISJの教育は世界への扉を開きます。国際的に認められたカリキュラムと40以上の国籍を代表する多様なコミュニティを通じて、生徒たちはグローバルな視点と、あらゆる場所で成功するための自信を身につけます。私たちの教育方針は、世界中のトップスクールや大学へ進学し、相互につながった世界で意義ある貢献をするために必要な知識、スキル、そして人格を生徒たちに備えさせます。

04 カラーパレット ブランド&ウェブカラー

当社のカラーパレットは、清潔でプロフェッショナル、かつ一貫性のあるブランドアイデンティティを保証します。ISJブルーは信頼性、安定性、そして学術的卓越性を象徴する基調色です。赤は極力控えめに使用してください。ゴールドはより頻繁に使用できますが、節度を持って使用してください。

主要ブランドカラー

ISJ ブルー
#182B55
ISJゴールド
#E79819
パウダーブルー
#B0D0E8
ISJ グレー
#C0C0C0
ISJ ホワイト
#FFFFFF
ISJ レッド
#E30513
アラートのみ
HEXCMYK
ISJ ブルー#182B5571.76%、49.41%、0%、66.67%
パウダーブルー#B0D0E828%、10%、0%、9%
ISJゴールド#E798190%、34.2%、89.18%、9.41%
ISJ グレー#C0C0C00%、0%、0%、24.71%
ISJ レッド#E305130%、97.8%、91.63%、10.98%

推奨テキストカラー

使用方法
本文と見出し#333333
境界線と二次アクセント#666666
Web専用:拡張カラーシステム

ウェブサイトの背景色

ウェブサイトでは、標準的なグレーの背景を温かみのある魅力的な色調に置き換えています。各セクションがこれらの色調を順番に切り替えることで、視覚的なリズムを生み出しています。

クリーム
#faf9f7
デフォルトセクション
温かいクリーム
#f8f6f1
カード、サイドバー
ディープクリーム
#f3efe8
強いコントラスト
パウダーティント
#EAF2F8
主要情報パネル

背景の回転

背景いつ~周波数
クリームデフォルトの内容40%
交互に、写真に隣接して20%
パウダーティント主要情報、統計データ、「一目でわかる」15%
海軍CTA、引用、インパクトの強い10%
ゴールド強調文5%
ルール:同じ背景を持つセクションを連続して2つ以上配置してはならない。

海軍使用ガイド

文脈価値注記
完全な背景#182B55大規模な豊かさ
カードのアクセント (3px)#182B55上または左の境界線
本文はネイビー#1d3461ライター — 暗すぎる読み取りを回避
大きな見出し#182B552rem以上のみ
05 私たちのロゴ マスター、スポーツ&ハウス

マスターロゴ

当社のブランドを視覚的に表現する主要な要素です。あらゆるプラットフォームにおけるブランドコミュニケーションの基盤となります。ロゴは常にオリジナル形態で使用し、クリアスペース、プロポーション、色彩の整合性を維持してください。

2つの主要なバージョン:白地に紺(明るい背景、ウェブサイトのヘッダー)紺地に白または金(暗い背景、フッター)

マスターロゴ画像 — Squarespaceの画像ブロックで追加

立入禁止区域

ロゴには十分なスペースを確保してください。安全領域の単位は、ロゴの四辺すべてにおいてマークの高さです。この領域には侵入しないでください。これにより、ロゴがページ上で際立つようになります。

立入禁止区域図 — Squarespace画像ブロック経由で追加

スポーツロゴ — ライオンズ

「LIONS」の盾型バッジはスポーツおよびチーム関連で使用されます。紺色の盾に金色の獅子(立ち姿)が描かれています。ロゴ文字にはRegan Slab Ultraフォントが使用されています。

ライオンズのスポーツロゴ — Squarespaceの画像ブロックで追加
要素CMYKRGB
ゴールドC=3.65 M=40.6 Y=99.96 K=0.27245, 149, 2
海軍C=95.88M=72.06Y=40.51K=45.4711, 24, 50

ハウス制度

四つの寮は、それぞれ独自の紋章、マスコット、カラーパレットを持つ。全ての寮のロゴマークにはケルト・ガラモンド第2書体が使用されている。

ルイス
マウス・グリーン
ポッター
ウサギ・ゴールド
ローリング
スタッグ・レッド
トールキン
ウィザード・ブルー
家の紋章の画像 — Squarespaceの画像ブロックで追加
06 タイポグラフィ フォントとタイプスケール

ISJは二種類のフォントシステムを採用しています:見出しにはセリフ体、本文には洗練されたサンセリフ体を使用します。この組み合わせにより、権威性と可読性のバランスが取れています。

役割フォント注記
見出しリブレ・バスカヴィルセリフ体。すべての見出しレベルと本文テキスト。
本文ロボトサンセリフ体。段落、キャプション、ラベル。
その他アルマライナビゲーションとUI要素。

タイプ スケール

H1 · メイン見出し
ジャカルタ・インディペンデント・スクール
Libre Baskerville Bold · 20pt · #333333
H2 · セクション見出し
世界トップクラスの教員陣
Libre Baskerville Bold · 17pt · #333333
H3 · 小見出し
牧会ケアとウェルビーイング
Libre Baskerville Bold · 15pt · #333333
H4 · 小見出し
遊びを通して学ぶ
Libre Baskerville Bold · 13.5pt · #333333
P1 · 本文
当校の専任教員チームは、国際的に認められたカリキュラムを提供し、探究心、厳密さ、そして自立した思考を育みます。
Roboto · 11.5pt · #333333
引用文
注釈はRoboto Italicで設定され、左側に2~3ptのダークグレーの枠線が引かれます。
Roboto Italic · 12pt · #333333 · 左枠 #666666
Web特化:タイポグラフィのルール
重要: カスタムコードブロック内でSquarespaceの本文フォント宣言を上書きしないでください。Libre BaskervilleとRobotoはグローバルに設定されています。明示的な宣言のみを使用してください。 フォントファミリー カスタムコードでヘッダーにセリフ体が必要な場合。
レベルサイズ(デスクトップ)重量使用方法
表示2.8–3.5rem400ヒーローの宣言
H12–2.4rem400ページタイトル
H21.6–1.8rem400セクション見出し
眉毛0.72rem700大文字のラベル · 1.8pxの間隔

眉毛のパターン

font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 1.8px; color: #E79819;
07 画像と写真 ガイドライン

画像は、おそらく私たちが使う最も効果的なコミュニケーションツールです。優れた画像は 好奇心や喜び、集中といった本物の瞬間に、幸せで熱心な生徒たちの姿を示します。物語を伝え、感情を呼び起こす特別な瞬間を捉えているのです。

優れた写真はまた、明瞭で余分なものがなく、生徒たちとその経験にとって最も重要な点に注目を集めます。適切に撮影されたこれらの画像は、学校生活の真実味のある魅力的な反映を生み出し、保護者や将来の家族に永続的な印象を与えます。

するしないで
自然な、作り物ではない瞬間を捉えるステージ用人工グループポーズ
没頭すること——好奇心、集中力、喜び汎用的なストックスタイルの画像を使用する
背景はすっきりさせ、雑然とさせないようにする注意散漫な看板や雑然としたものを設置する
私たちのコミュニティの多様性を示す1種類の活動のみを撮影してください
緑地と近代的な施設を強調する屋内専用ショットの過剰使用
自然光が望ましい過度にフィルター処理された画像または彩度過剰の画像
例:写真 — Squarespaceの画像ブロックで追加
08 Webデザインシステム コンポーネントとコード

Squarespace上のISJウェブサイト向けコンポーネントライブラリ、間隔ルール、およびコードパターン。

レイアウト

文脈最大幅
記事/散文700ピクセル
広いコンテンツ(表)900ピクセル
フル幅(フッター、ヒーロー)1200ピクセル
文脈デスクトップモバイル
セクションの余白60px 40px40px 20px
カードパディング24–28px18–20px
CTAブロック60px 40px48px24px

コンポーネント

トラストグリッド
.trust-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; max-width: 1200px; margin: 0 auto; } .trust-item { background: #f8f6f1; padding: 28px 20px; text-align: center; } @media (max-width: 900px) { .trust-grid { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 500px) { .trust-grid { grid-template-columns: 1fr; } }
統計行
.stats-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; text-align: center; padding: 32px 0; } .stat-number { font-family: 'Libre Baskerville', Georgia, serif; font-size: 2.4rem; color: #182B55; } .stat-label { font-size: 0.85rem; color: #4a4a4a; margin-top: 4px; }
カードとパネル
.card { background: #faf9f7; border: 1px solid #e8e6e3; border-top: 3px solid #182B55; padding: 28px 24px; transition: box-shadow 0.3s ease, transform 0.3s ease; } .card:hover { box-shadow: 0 8px 24px rgba(24,43,85,0.07); transform: translateY(-2px); } .card--gold { border-top-color: #E79819; } .card--blue { border-top-color: #B0D0E8; } .info-panel { background: #EAF2F8; border: 1px solid rgba(176,208,232,0.4); border-left: 3px solid #B0D0E8; padding: 24px 28px; }
CTAセクションとボタン
.cta-section { background: #182B55; padding: 60px 40px; text-align: center; color: white; border-radius: 12px; } .cta-section h2 { font-family: 'Libre Baskerville', Georgia, serif; font-size: 2.2rem; color: white; } .btn-primary { padding: 14px 36px; background: #E79819; color: white; border-radius: 50px; border: 2px solid #E79819; } .btn-primary:hover { background: #d08a15; } .btn-secondary { padding: 14px 36px; background: transparent; color: #E79819; border-radius: 50px; border: 2px solid #E79819; } .btn-secondary:hover { background: rgba(231,152,25,0.1); }
引用とメモ
.quote-block-navy { background: #182B55; padding: 60px 40px; text-align: center; } .quote-block-navy p { font-family: 'Libre Baskerville', Georgia, serif; font-size: 1.8rem; color: #E79819; } .note-box { border-left: 3px solid #E79819; padding: 16px 20px; background: rgba(231,152,25,0.05); } .note-box--blue { border-left-color: #B0D0E8; background: #EAF2F8; } .note-box--navy { border-left-color: #182B55; background: rgba(24,43,85,0.03); }
ナビゲーション(パンくずリストとサイドバー)
.breadcrumb { font-size: 0.82rem; color: #666; } .breadcrumb a { color: #666; text-decoration: none; } .breadcrumb a:hover { color: #E79819; } .sidebar-nav { background: #f8f6f1; padding: 28px 24px; border: 1px solid #e8e6e3; } .sidebar-nav__title { font-family: 'Libre Baskerville', Georgia, serif; font-style: italic; font-size: 1.1rem; } .sidebar-nav__link { font-size: 0.82rem; text-transform: uppercase; letter-spacing: 1.2px; color: #333; } .sidebar-nav__link:hover, .sidebar-nav__link--active { color: #E79819; }
テーブル
.data-table { width: 100%; border-collapse: collapse; font-size: 0.95rem; } .data-table thead th { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 1.2px; color: #182B55; padding: 12px 16px; border-bottom: 2px solid #182B55; background: #faf9f7; } .data-table tbody td { padding: 12px 16px; border-bottom: 1px solid #e8e6e3; } .data-table tbody tr:hover { background: rgba(176,208,232,0.06); }
フッター
.footer-columns { display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px; } .footer-heading { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; color: #E79819; } .footer-link { color: rgba(255,255,255,0.7); font-size: 0.92rem; } .footer-link:hover { color: #E79819; } @media (max-width: 640px) { .footer-columns { grid-template-columns: 1fr; } }

ホバー状態

要素行動
テキストリンク色 → #E79819
カードtranslateY(-2px) + 影
カード枠線#B0D0E8
金のボタン#d08a15
テーブルの行rgba(176,208,232,0.06)

ブレークポイント

px変更
9004-col → 2-col
7683列 → 1列; サイドバーはスタック表示
640フッターが折りたたまれます
480ボタン(全角)

よくある間違い

しないで代わりに
すべてのセクションをデフォルトでクリーム色に設定背景を回転させる
使用 #182B55 小さな文字用使用 #1d3461 または #333
パウダーブルーを無視する枠線、情報パネルに使用
Squarespaceのフォントを上書きする継承; 見出しにはセリフ書体を宣言するのみ
コードに画像を埋め込むブロックに分割する;画像ブロックを使用する
すべての角を丸くするボタン(50px)とCTA(12px)のみ
「学生」と書く「生徒」と書く

クイックリファレンス

/* ISJ カラーリファレンス ネイビー: #182B55 ネイビーテキスト: #1d3461 ゴールド: #E79819 ゴールドホバー: #d08a15 パウダーブルー: #B0D0E8 レッド: #E30513 背景クリーム: #faf9f7 背景ウォーム: #f8f6f1 背景ディープ: #f3efe8 背景パウダー: #EAF2F8 テキスト: #333333 セカンダリー: #4a4a4a ターシャリー: #666666 ミュート: #888888 ボーダー: #e8e6e3 ボーダーライト: #f0eeeb コンテンツ: 700px ワイド: 900px フル: 1200px */
青色の背景に、王冠をかぶった白いライオンと右側に「ISJ」の文字。ジャカルタ国際学校ロゴ
紺色のライオンが王冠を戴き、白い背景に「ISJ」の文字が配されたロゴ。ジャカルタ国際学校ロゴ。
黒い背景に王冠をかぶったオレンジ色の紋章の獅子。ジャカルタ国際学校ロゴ
白い背景に、ベージュ色のライオンの頭部と爪のシルエット。ジャカルタ国際学校 ロゴグラフィック
ライオンをマスコットとするスポーツチームのブランドスタイルガイド。ジャカルタ国際学校向けで、紺と金色の盾と王冠を持つライオンのチームロゴ、太字のオレンジと紺色のチーム名「LIONS」を含む。