注意:

  Typekit は、Adobe Fonts に名前が変わりました。これは、Creative Cloud などのサブスクリプションに含まれています。さらに詳しく

デスクトップフォントを使用して Web 出力を作成し、パブリッシュした場合、再生時に最適な結果が得られないことがあります。Animate には、あらゆるフォームファクターに一貫した字体を提供する Google フォントが導入されています。Google フォントは、Google のサーバーから提供される無料のオープンソースフォントです。Google フォントおよびオリジナルフォントのデザイナーの詳細については、https://fonts.google.com/about および https://fonts.google.com/attribution を参照してください。

Google フォントを使用するメリット:

  • キャッシュ:初回ダウンロード後、フォントはローカルシステムに保存されるので、繰り返しダウンロードする必要がありません。そのため、テキストを高速にロードできます。
  • オープンソース:無料で使用でき、要件に基づいて再配布または変更できます。
  • 互換性:広告や Web コンテンツでシームレスに機能します。
  • レスポンシブ:あらゆるフォームファクターにレスポンシブなコンテンツエクスペリエンスを提供し、一貫した見やすい表示を維持します。
  1. HTML5 Canvas ドキュメントを開き、ツールパネルでテキストツールを選択します。

  2. プロパティパネルで、「ダイナミックテキスト」を選択します。 

  3. 「Web フォントを追加」アイコンをクリックして、「Google Fonts」を選択します。

    google_fonts_add
    Google フォントダイアログボックスを選択

  4. Google フォントダイアログボックスには、利用可能なすべての Web フォントが一覧表示されます。様々なフォントをざっと閲覧したり、特定のフォントを検索したり、フォントの属性でフィルタリングしたりして、デザイン上のニーズに最も適したフォントを選択できます。

    • 検索:名前でフォントを検索します。
    • カテゴリ:利用可能なカテゴリに基づいてフォントをフィルターします。
    • 並べ替え:以下のカテゴリに基づいてフォントを並べ替えます。
      • 人気:フォントの人気に基づいて並べ替えます。
      • アルファベット:フォントをアルファベット順に並べ替えます。
      • 追加日:フォントがドキュメントに追加された日付に基づいて並べ替えます。
      • スタイル数:各フォントファミリで利用できるスタイル数に基づいて並べ替えます。
      • トレンド:フォントカテゴリのトレンドに基づいて並べ替えます。
    • ヘルプ:Google フォントのオンラインヘルプを表示します。
    • キャンセル:フォントの選択をキャンセルします。
    • 完了:選択したフォントをドキュメントに追加します。
    2b
    Google フォントダイアログボックス

  5. ドキュメントにフォントを追加するには、使用するフォントをクリックして、「完了」を選択します。チェックマークが表示されている場合は、そのフォントが選択されていることを示します。 

    注意:

    複数のフォントを選択して追加することもできます。 

  6. Animate CC で追加されたフォントを表示するには、プロパティインスペクターで文字/フォントファミリーを選択します。

    Selected Google font in the Family menu
    プロパティインスペクターで選択された Google フォント

  7. 文字/フォントファミリーのドロップダウンリストで、HTML5 Canvas ドキュメントで使用する Google フォントを選択します。

    Webfonts-under-Font-menu
    選択したフォントをドキュメントで使用

関連項目

本作品は Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License によってライセンス許可を受けています。  Twitter™ および Facebook の投稿には、Creative Commons の規約内容は適用されません。

法律上の注意   |   プライバシーポリシー