適用対象
Brandfolder
- Brandfolder
機能
この機能を使用できるユーザー
- 管理者
コンテンツ自動化ブランドを設定する
コンテンツ自動化ブランドを設定する方法を解説します。
ご利用可能なユーザー
プラン:
- Brandfolder
ブランド システムは、コンテンツ自動化内の設計管理ツールです。ここで、ロゴ、色、タイポグラフィなど、ブランドに必要な要素を定義できます。その後、ブランド システムがこれらの要素をコード化し、開発者が設計システム、アプリケーション、Web サイト、テンプレートで使用できるようにします。
コンテンツ自動化ブランドを設定するには
- [Settings (設定)] > [Brand System (ブランドシステム)] の順に移動します。
- 最初に設定したいブランド要素に応じて、サブメニューの [Colors (色)]、[Logos (ロゴ)]、[Typography (タイポグラフィ)]、または [Tokens (トークン)] に切り替えます。
色
ブランド システムに色を追加するには
- [New Color (新しい色)] を選択します。ブランド領域に以前から色がある場合は、[Import from Account Settings (アカウント設定からインポート)] を選択します。
- 色に名前を付けます。
- 色の HEX、RGB、または CMYK の値を入力します。HEX と RGB は常に同じ色を参照します。ただし、必要に応じて、CMYK のリンクを解除して値を追加することもできます。
- わかる場合は、SPOT 値を入力します。
- すべての色を追加した後、[Finish editing (編集を終了)] を選択します。
ブランド カラーをカラー パレットに整理するには
- [New Palette (新しいパレット)] を選択します。
- [New color (新しい色)] を選択します。パレットに名前を付けます。
- パレットに追加する既存の色を選択します。間違った色を選択した場合は、色の横にある 3 点リーダー (⋯) を選択し、次に [Delete (削除)] を選択してパレットから削除します。
- 色を並べ替える場合は、色名の横にある 6 点アイコンをクリックしてドラッグします。
- すべての色パレットを追加した後、[Finish editing (編集を終了)] を選択します。
ロゴ
ブランド システムにロゴを追加するには
- ロゴがアカウントのアセット ライブラリにアップロードされていることを確認します。次に、[Account Settings (アカウント設定)] > [Brand System (ブランドシステム)] > [Logos (ロゴ)] の順に戻ります。
- [New logo set (新しいロゴ セット)] を選択します。
- ロゴ セットに名前を付けます。
- [New logo (新しいロゴ)] を選択します。
- ロゴに名前を付けます。
- [Change (変更)] を選択します。
- ステップ 1 でアセット ライブラリにアップロード/確認したロゴを検索します。
- ロゴを白、灰色、または黒のどの背景に表示するかを選択します。
- すべてのロゴを追加したら、[Finish editing (編集を終了)] で確定します。
タイポグラフィ
ブランド システムに書体を追加するには、[Typeface (書体)] を選択し、該当する手順に従います。
カスタム フォントのアップロード
- 新しく作成した書体で [Upload (アップロード)] を選択し、フォントのアップロード モーダルを開きます。
- ここでフォントに名前を付けて、単一の書体またはフォント ファミリーとしてアップロードするカスタム フォント ファイルをローカルに参照するか、ドロップします。たとえば、Helvetica 書体を作成し、細、中、中斜体、太字、黒のフォント ファイルをアップロードして、その書体に保存できます。
- フォントのアップロード フォームに追加したら、各フォントにウェイトとスタイルの値を設定する必要があります。ドラッグ アンド ドロップ テンプレートをサポートするには、数値を設定する必要があります。
100 = Thin (細)
200 = Extra Light / Ultra Light (極細/超極細)
300 = Light (細)
400 = Regular (中細)
500 = Medium (中)
600 = Semi-bold / Demi-bold (中太)
700 = Bold (太)
800 = Extra-bold / Ultra-bold (極太/超極太)
900 = Black (黒)
重要:
- アップロードする各ファイルのスタイルを、通常、斜体、または下線として設定できます。
- アップロードを完了するには、フォント ファイルのサイズが 50 MB 未満でなければなりません。ブラウザでアセットを作成する際は、エンド ユーザー エクスペリエンスを向上させるために、5 MB 未満のフォント ファイルを使用することを検討してください。
- OTF、TTF、WOFF、WOFF2 フォント形式をサポートしています。
- 標準外のウェイト (上記のリストに含まれていないもの) には対応していません。
- 大幅にカスタマイズされたフォントには、ブラウザやレンダリング技術との互換性に問題が発生する可能性があります。
- [Create Font (フォントの作成)] を選択して、新しい書体 (フォント ファミリー) の作成を確定します。
カスタム フォントのアップロードは、InDesign テンプレートでは自動的に利用可能になり、コード化されたテンプレート、ドラッグ アンド ドロップ テンプレート、InDesign テンプレートでサポートされます。
Adobe フォント
- 新しい書体の [Upload (アップロード)] の横にある分割ボタン矢印を選択します。
- Adobe フォントの URL を入力します。typekit.net の URL 形式である必要があります。
- Adobe フォントをリンクすることにより、テンプレートでフォントを使用するための適切なライセンスを持っていることを保証できます。
- [Add Source (ソースの追加)] を選択して送信します。
コード化されたテンプレートおよびドラッグ アンド ドロップ テンプレートでのみサポートされています。
Google フォント
- [Upload (アップロード)] ボタンの分割ボタン矢印から [Google Font (Google フォント)] を選択します。
- 提供されたテキスト フィールドで Google フォントを検索します。これは、Google Fonts API にリンクされた検索パネルです。
- 必要なフォントを選択し、[Add Source (ソースの追加)] を選択します。
コード化されたテンプレートおよびドラッグ アンド ドロップ テンプレートでのみサポートされています。
タイプ スケールの追加
- [New type scale (新しいタイプ スケール)] を選択します。
- タイプ スケールに名前を付けます。
- サイズ (rem)、フォントの太さ、行の高さ、文字間隔、下線や斜体などの高度な処理など、タイプ スケールの詳細を指定します。
- すべてのタイプ スケールを追加したら、[Finish editing (編集を終了)] で確定します。
トークン
ブランド システムにトークンを追加するには
- [New token type (新しいトークン タイプ)] を選択します。
- トークン タイプに名前を付けます。トークン タイプは、似たようなトークンをグループ化する手段です。
- [Add set (セットを追加)] を選択します。
- セットに名前を付けます。トークン セットは、タイプ内のトークンをグループ化する手段です。
- [Add token (トークンを追加)] を選択します。
- トークンの詳細 (名前、キー、値) を入力します。この名前は、トークンをすばやく識別する方法として使用できます。重要なのは、開発者がトークンの参照に使用できるよう簡潔な記述にすることです。また、値はトークン情報です。
- [Finish editing (編集を終了)] で確定します。