Webやアプリのデザイントレンドを紹介。たまに雑談。

Browse By

Tag Archives: Typography

[Logo Design] The Logo Site free placeholder logos daily – プレイスホルダーとしてのロゴ

  • Pocket
  • このエントリーをはてなブックマークに追加

プレイスホルダーとして使えるロゴデザイン。1日1つずつ追加されているようです。サイトやApp制作における、企画やモックアップレベルの段階で使えそうです。「んなもん作った方が早ぇYO!」とか思っちゃいましたが、ノンデザイナーの人とかにはこういうの有用かも、と思ったので紹介。まだそれほど数は多くないので今後増えると使い勝手も良くなりそうです。

[Web Design] FontFit – 既存Webサイトのフォント指定をいじくれるサイト

  • Pocket
  • このエントリーをはてなブックマークに追加

既存Webサイトのフォント指定を、アレコレいじくる事のできるサイト。画面左上の入力フォームにURLを突っ込む事でサイトがロードされ、場所ごとにフォント指定を変更する事ができます。場所の指定はタグで行い(デフォルトはAタグ)、次にFont Faceやサイズ、スタイルなどを変更します。Font FaceについてはGoogle Fontsがロードされているようです。変更するフォント指定ができたら、ページ右上にある「Share / Export」ボタンからフォント指定のタグを取得する事ができます。サイトのフォント類を再考したい時なんかに、見た目を確認しながら作業できるのがイイですねこれ。

[Typography] Blade Runner | Typeset In The Future – ブレードランナーのタイポグラフィーを検証した記事

  • Pocket
  • このエントリーをはてなブックマークに追加

みんな大好きBlade Runnerの作中に出てくる、大道具・小道具のタイポを検証した記事。Tyrell Corpのロゴから始まり、新聞記事や街中の看板、ディスプレイに表示されるUI、広告に至るまでのあらゆるタイポを検証してます。元になったフォントなどの情報もあるので、Sci-Fiテイストのデザインする時の参考にもなりそう。またタイポ検証だけにとどまらず、舞台やモチーフとなった場所なども紹介されていて、Blade Runner好きにも楽しめる内容。ちなみにこの人、以前にAlienのタイポも検証してます。この時代のSF映画はタマりませんな。

[Photoshop] Fontea – Google Fontsをフォトショップで使えるプラグイン

  • Pocket
  • このエントリーをはてなブックマークに追加

Google FontsをPhotoshop内で使う事ができるようになるプラグイン。インストールする事でGoogle Fontのフォントラインナップの中から任意にチョイスして使う事ができます。現在700のフォントが用意されているそうなので、いやまぁこれなかなかスゴい数ですな。カテゴリーなどから抽出する事もできるようです。しかもこれ無料で使えるようです。フォント収集癖のあるタイポおじさんに超オススメ。俺も早速入れてみます。

[Logo Design] LogoEvolve – 企業の今のロゴと昔のものとを見比べる事のできるサイト

  • Pocket
  • このエントリーをはてなブックマークに追加

企業ロゴの今と昔を見る事のできるサイト。一覧に表示されているのは現在のロゴで、マウスオーバーする事でその企業の最初のロゴを見る事ができます。AppleやMicrosoft、Google、Twitterといったテック系企業だけでなく、PepsiやLegoといったテック系以外の企業ロゴなども用意されています。Amazonの旧ロゴ分かる人は多分オッサンです。オッサンの俺が分かったのでね。Canonとかヤバいですね。もうなんか呪いとかこめられてそうだし。

[Typography] FontReach – フォント名から、それらが使われているサイトをリストアップしてくれるオンラインツール

  • Pocket
  • このエントリーをはてなブックマークに追加

フォント名を入力する事で、それらがどんなサイトで使われているのかを調べてくれるサイト。例えばHelvetica Neueと入力すると、FacebookやYahoo、Twitter、eBay、Redditなどで使われている事が分かります。使われているフォントのランキングなどもあり、それを見るとArial、Verdana、Helvetica Neueなどがよく使われている事が分かります。サイト内で使うフォントチョイスに役立つかも。ちなみに自分はMonacoとかMyrad Proあたりが好きです。

[Typography] 25 Insanely Creative Text Effects You Can Use For Free! – クールなテキストエフェクトの作例まとめ

  • Pocket
  • このエントリーをはてなブックマークに追加

いやー5連休終わっちゃいましたな。けど人によっては9連休だそうで。9日も休んだらなんだか社会復帰できなくなりそうで恐いとか思ってしまうくらいの社畜っぷりではあります。はー家に引きこもって1日中メタルギアしたい。
そんなわけでこの記事で紹介されているテキストエフェクト、なかなか趣味がイイので紹介しておきます。リンク先からPSDをダウンロードできるので、テキスト情報の再編集も簡単に出来そうです。ロゴや見出し作る際のネタ帳としてナイスです。
けど2日仕事したらまた休みじゃーん! ヒャッハー!

[Misc] Improving Typography One Symbol at a Time – 特殊文字の出し方ガイド

  • Pocket
  • このエントリーをはてなブックマークに追加

特殊文字の出し方を一覧で見せてくれるサイト。®とか©とか™とか∞とか、主にキータイプを使って入力する事のできる特殊文字が紹介されてます。いわゆるHTMLを使った特殊文字ではないので数は少ないですが、紹介されている文字類についてはHTMLでの記述法についても併記されています。またシンボルを右クリックする事でクリップボードにコピーできるので、コピペしまくる用途にも使えます。あの文字どうやって出すんだっけ・・・って時なんかに便利。