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

Browse By

Monthly Archives: 2月 2015

[Web Design] Pure Layouts – Pure.cssのレイアウト集がなんか使えそう

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

Yahooの提供するPure.cssのサイト内に、よく使われるレイアウト紹介のページがあるんだけど、これが結構よく出来ててイイ感じなんです。目的別にいくつかのレイアウトが紹介されており、例えばブログやランディングページ、フォトギャラリーなどでよくあるレイアウトが一覧で紹介されています。各レイアウトはソース一式をまるっとダウンロードする事ができ、シンプルかつ必要な要素がだいたい揃っているので、サイト制作の初動にかかる時間を節約できそうです。pure.cssはオンライン上のものを読み込む仕組みで、同梱はされていません。自分は普段Bootstrap使う事が多いけど、これだけよく出来たテンプレートが用意されてるならPureも今度使ってみようかな、とか思いました。LPのテンプレートがなかなか素晴らしいです。

[Freebie] all-silhouettes.com – シルエット専門の画像素材サイト

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

シルエット専門の画像素材サイト。人物が多いようですが、動物や昆虫、唐草やブラシストロークなどのブラシっぽい素材も扱っているようです。数が多いので、何か探しものがある時は検索しちゃった方が早そうです。シルエット素材って結構よく使うので、こういう専門のリソースは助かりますな。

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

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

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

[Photoshop Plugin] FREE SEAMLESS TEXTURES GENERATOR – テクスチャからタイルパターンを生成してくれる機能拡張

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

1枚のテクスチャ画像から、タイルパターンを生成してくれるPhotoshop用プラグイン。ちょっとこのサイト固定リンクが貼れないのでトップにリンクしてますが、チュートリアルはここから見ることができます。動画見ると分かるんですが、タイルパターン生成のためにの新規書類にまずは画像をペーストして、その後アクションを使ってタイルパターン化しているようです。上下左右にループするよう、複数のコピーレイヤーを生成してます。通常テクスチャをパターン化する場合、だいたいこの流れを手作業でするんだけど、このプラグイン使えばサクっとパターンにできそうです。なかなかイイですなこれ。

[Graphic Design] NiceFuckingGraphics! – クールなグラフィックデザインをまとめたブログ

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

クールなグラフィックデザイン作例を紹介するブログ。英語圏のものではないらしく何が書いてあるのかはさっぱり分かりませんが、紹介されている作例の趣味がイイです。作例だけでなく、例えばPhotoshopを使ったグラフィックデザインのプロセスをアニメーションGifで紹介したものなど、デザイン系の仕事してる人なら楽しめる内容が多いです。一覧での作例の見せ方もウマいです。勉強になりますな。

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

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

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

[Wallpaper] iPapers.co – 様々なデバイスに対応した壁紙配布サイト

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

様々なApple製デバイスのディスプレイサイズに対応した壁紙配布サイト。気に入った壁紙を選んで次に使いたいデバイスを選ぶと、ちょうどイイサイズの壁紙をダウンロードできます。選べるサイズはiPhone 4〜6(Plus含む)、各種iPad、各種MacBook、iMacなど。つまりひと通りのApple製品を網羅しています。細かいトコだと、iOS 8以降のパララックス効果アリ・ナシも選ぶ事ができます。配布されている壁紙の趣味も良く、また細かくタグ付けされている点もナイスです。壁紙探したい時に使えそう。

[Wallpaper] Introducing our Dual-Screen Wallpaper Collection – デュアルスクリーン用の壁紙

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

デュアルスクリーン環境の人向けの壁紙配布サイト。配布されているのが4組と数こそ少ないですが、このサイトアツいのが、左右のディスプレイサイズを個別にチョイスできるという点。例えば自分の場合、職場では左にiMac 27inch、右にDellの24inchを使ってるんですが、これをそれぞれピッタリのサイズでチョイスする事で、左右の背景画像がシームレスにつながるようになっています。試しにダウンロードして壁紙適用してみたんですが、なかなか壮大な景色になってイイ感じです。ちなみにこのページはTwelve SouthというMac周辺機器メーカーの販促ページだったりします。このメーカーの製品趣味がイイからわりと好き。