デザイナーのためのCreative Cloud活用術

Typekitでフォントを追加

全333コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
Webブラウザ上から簡単にフォントを追加できる「TypeKit」を使って様々なフォントを追加し、ロゴに使うものを比較します。
講師:
09:34

字幕

このレッスンでは Typekit を使ったフォントの追加について解説します。それではここにロゴを作っていくわけなんですけどまずそのベースとなるフォントを選んでみましょう。ではまず文字ツールを選んでそしてクリックします。今回は CAR NET というロゴを作るのでちょっとそれをまずIllustrator に付属している小塚ゴシックで打ってみましょう。car-net と小文字だとこんな感じですしまた、これのCAR-NET と大文字版も打ってみました。こうして内容を打った文字を色々とフォントを切り替えてあげてどんな感じがいいかなと選んでいくわけなんですがかなりパソコンの中にも色々なフォントが入ってると思うのですがこの中にもどうもイメージに合うものがないといった時にはTypekit というCreative Cloud に付属しているサービスを使ってフォントを新たにインストールすることができます。では Typekit を使う時なんですがこのフォントの選択の一番上の所に「Typekit からフォントを追加」というのがあります。ではこれをクリックします。そうすると画面が切り替わってきましたけどWeb ブラウザが起動します。 そして Web ブラウザにでてきたこれがTypekit のサービスの画面です。もう最初からフォントが色々と表示されていますが今日本語のフォントがでてますし更に表示を広げていくと日本語に加えて欧文も含めて非常に大量のフォントが入っています。この様に順番に見ていくだけでなくこうした例えば書体の分類どういった書体のデザインの傾向明朝だけにするとこんな感じですね。こういったものかWeb フォントとして使えるか、それとも完全にパソコンに読み込んで使うものかそういった分類や本文向け、見出し向けとかですねあとは太さとかかなフォントのみとか色々な情景で分けることが出来ます。こういったものを使って探していってそして、これちょっと面白そうかなというのが見つかったらクリックすることで詳細の画面に行くことができます。細かい色々な説明もあるんですけど是非試して頂きたいのが「書体の表示確認」という所ですね。「ここをクリックして編集します...」とでてますけど見ての通り、さっき選んだフォントが実際に表示されてます。そしてここの部分ですね。打ち変えてやると今選んだフォントで自分の好きな文章これをブラウザ上に打ち込んでどんな感じかなと見ることができます。 インストールしなくてもこの様な感じで見ることができるので大変便利な機能となっています。ではここに入っているフォントを幾つかパソコンの方にインストールしてそれを比較して、どれがロゴにいいかなと選ぶ手順をやってみましょう。では幾つかフォントをインストールします。今回は同じのをインストールするために検索を使っていきましょう。まずはfatfrank という名前で検索してみて下さい。そうすると、この太いデザインの欧文のフォントが入ってきます。ではこれインストールしようかなという時には「フォントを使用」ですね、これクリックします。そしたら「選択したフォントを同期」という所ですね。これをクリックすることででてきましたね、「フォント FatFrank Heavy が追加されました」とここまででてくれば、これがでてくるとインストールが完了したということです。では同じ手順で例えばindustry というのを検索すると何種類かでてきますけどではこの一番シンプルなやつとかちょっと中に線が入ってるとかいろいろなパターンがあります。そしてこの、さっきの矢印の所クリックするとこの様に様々なバリエーションも表示されます。 ではこの中の、この細い奴ですね。これを選んでこれも「フォントを使用」「選択したフォントを同期」とやってやることでインストールされました。では次はどんどん行きましょう。Fira Sans 2 という奴ですね。これを検索する時なんですけどこの数字の所も半角のスペースが入ってないとでてこないので気をつけて下さい。ではこれ幾つかの太さが混じって入ってますけど「フォントを使用」とやって一応どの太さを入れるかとかチェックで選ぶこともできます。これも同期しましょう。では次が、この Co Headlineというものですね。これもでてくるので「フォントを使用」と。そしたら次はTornac という奴ですね。これも使用します。ちょっと筆記体みたいなフォントですね。では次がPlume Advertisingこれも追加します。相当数あるので、どんどん行きます。では次がSerifa というものですね。こっちの細い方です。こちらも「フォントを使用」をクリックして追加します。そしたらやっと最後の1つですね。Source Sans Proこれもインストールします。これらはもうブラウザ上の機能でどんどんどんどんご覧になってるようにできるので以前のフォントのインストールに比べると非常に楽です。 この様に Web ブラウザ上でどれがいいかなと選んだ上で簡単に追加していくことができます。そしたら Illustrator の方に戻ります。そしたらさっきの操作で全部で8種類のフォントを追加しました。ではそれを比較したいのでこれを8個コピーしましょう。まずドラッグして 選んだ上でMac の方は Option Windows の方は Alt キーを押しながらドラッグするとこの様に複製できるのでこれですね、どんどんどんどん並べていきましょう。そして小文字と大文字両方纏めて選んだ状態でこのフォントの選択ですね。これで、この「フィルター Tk」というのをクリックするとさっき追加した奴がいっぱいありますね。Typekit で追加したフォントだけを表示することができます。ではこれ それぞれさっき追加したフォントに変えていってみましょう。Typekit から入れたのだけが入ってるのでそれぞれを選んでいくだけですね。この様に比較してやることで様々な全然違った種類のフォントが並べて表示させることができます。この様にすると、どういった傾向が合ってるだろうかというのを大変選びやすいので是非 Typekit に入っているフォントも含めて様々なフォントを比べてどういったデザインがいいかなといった所を検討して下さい。

デザイナーのためのCreative Cloud活用術

Creative Cloudに備わっているさまざまなツールを使うと、デザインに関する作業をひと通り行うことができます。このコースではIllustratorによるロゴデザインやCreative Cloudを使った素材の共有、ロゴを効果的に見せるPhotoshopでの写真加工やInDesignを使った名刺デザイン、MuseでのWebサイトの構築などを解説します。

4時間25分 (35 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 3,990
発売日:2016年08月18日

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。