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

Browse By

Category Archives: Typography

[Typography] Helvetica Neue vs. San Francisco: Can You Tell The Difference? – Helvetica NeueとSan Franciscoの見分けつく?

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

Helvetica Neueというフォントと、San Franciscoというフォントを並べた時に、見分けがつくか?というクイズコンテンツ。YosemiteでシステムフォントがHelvetica Neueになって、その後Apple WatchでSan FranciscoというApple純正フォントが採用され、次のMacOSでは早速Helvetica Neueが用済みとなってSan Franciscoに統一されるんじゃねーか、という背景を知っていると楽しめますな。ちなみに自分がやってみたら75%正解でした。前半はまだ分かるものが多いけど、後半戦はさっぱり分かりません。もうどっちでもイイんじゃねーかって思うw 個人的にはHelvetica Neueの方が好きかなー。

[Typography] Emojis — CopyPasteCharacter.com – コピペで使える絵文字

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

コピペで使える絵文字。クリックするとクリップボードにコピーされるので、あとはペーストするだけです。以前に紹介したコピペで使える特殊文字の絵文字版。Macだと全部フルカラーで見えますが(iPhoneの絵文字準拠)、Winだとモノクロ表示になるようです。ちなみに絵文字をPhotoshopのレイヤーグループ名に使うと、視認性が上がって結構便利だったりします。

[Cheatsheet] Typography Cheatsheet – 特殊文字の入力方法をまとめたチートシート

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

欧文フォントにおける様々な特殊文字や記号類をまとめた記事。それぞれのコピペ用の文字、Mac / Win双方でのキー入力方法、HTMLエンティティを一覧で見る事ができます。クォートとアポストロフィー、ダッシュとハイフンの項目では「本来これらはこう使うべきものですよ」的な解説もされてるのがナイスです。続いて記号類や英語以外の文字の入力方法について解説されています。普段なにげなく使ってるハイフン類にこれだけの種類があったというのが驚きです。「あの文字どうやって出すんだっけ」って時なんかに使えそうです。

[Font] Web Font Load – Google Web FontをMacにインストールする方法

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

GoogleのWebフォントを、Macのローカル環境にインストールする方法が紹介されています。詳しくはGitHubで解説されていますが、ようするに紹介されている1行をTerminalでぶっこめばそれでオッケーのようです。自分の場合はただでさえフォント多すぎるので入れませんでしたが、フォントまとめて欲しいという人には便利かもしれません。ちなみにGoogle Webフォントの一覧はこちらで見る事ができます。数が多いので、時間的にも入れた後の管理的にもそれなりの覚悟が必要な気がしますね。

[Typography] The 25 most admired typefaces by typographers, type designers and letterers – タイポグラファーのためのタイプフェイス

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

タイポグラファーのためのタイプフェイスをまとめた記事。敬服に値する素晴らしいフォントが25種類紹介されています。Georgia, Futura, Gill Sans, Garamond, Helvetica, Metro, Verdanaなどのフォントが作例とともに並んでます。どれも超有名なものなので知ってたり持ってたりはするんですが、まぁなんつーか見てるだけでしみじみと美しいですな。自分この中じゃFuturaとMetroが特別好きであります。欧文タイポ組む時のネタ調としてもナイスです。

[Typography] Collection of Fresh Text Effect Tutorials – テキストエフェクトのチュートリアルまとめ

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

テキストエフェクトのチュートリアルをまとめた記事。いろんなエフェクトが紹介されてますが、モノによっては3Dの機能とか使ってます。レイヤースタイルだけで作れそうなものもちらほら。タイポグラフィーやロゴデザインの際のネタ調としても使えそうです。

[Typography] flipping typical – 任意のテキストで、ローカルにインストールされているフォント一覧を作ってくれるサイト

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

ローカルPCにインストールされているフォントの一覧を作ってくれるサイト。表示する文字列は任意にタイプできます。ロゴ作る時やタイポ組む時に、ベースとするフォントを選ぶ際にとっても役に立ちそう。この手のサイトは他にもあるんだけど、このサイトは日本語フォントもちゃんとロードされる点がナイス。インストールされているフォントが多い人の場合は1回で全てロードされないので、「あのフォント出てねぇじゃねーかYO!」という場合はページ最下部の「Load More」をクリックすると幸せになれます。いやーこれは便利。

[Typography] Trail Type – 登山道の標識ばかりを集めたアウトドアなタイポギャラリー

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

登山道にある標識の写真ばかりを集めたフォトギャラリーサイト。ただの標識とはいえ、こういうものをタイポグラフィーの作例として見るセンスというのはアリだなと思いました。掲載されている写真も世界各地のものがあり、パっと見ただけでもアメリカ、ニュージーランド、マレーシア、そして何かと目にするYosemiteというワードも出てきます。旅行好きの人が運用してるのか、それとも投稿型なのかはよく分かりませんが、山登りとか好きなアウトドア派の人が見ても興味深いんじゃないかと。まぁ今時期的に山登りって色々言われてますけどね。デザイナー的にはフォント当てクイズとかしても楽しそうです。