WebフォントライブラリであるFontAwesomeのアイコンを、Photoshop内でも使えるようにする機能拡張。FontAwesome、自分仕事でもよく使いますが、アイコンの種類が多いためすごい便利なんですよね。プラグインをインストールすると専用のパネルが表示され、一覧からアイコンを探してPhotoshopのキャンバス内にベクターデータで貼り付ける事ができます。FontAwesomeのサイト同様、キーワードを使ってアイコンを検索できる点もナイスです。これ使えば、アイコン素材探す時にWebから拾ってくるよりもずっと楽になります。
iPhoneで撮った複数のスクリーンショットを、連続する1枚の絵に結合してくれるiPhone App。スクリーンショットの撮影はiOS標準の「Homeボタン＋スリープボタン」で撮影し、その後Tailorにてマージするという流れのようです。会話の一覧やGoogle Mapsの情報一式を画像として保存する用途に使えるとサイトでは説明されていますが、Web制作者にとっては、制作中のサイトをiPhoneで表示した際のスクリーンショット保存に使えると思います。顧客にデザインカンプを送る時なんかに使えそうです。App内課金があるようですが、基本機能は無料で使えるようです。スマホ対応の仕事をよくする人なんかにオススメ。
レスポンシブレイアウトのパターンというか、手法をまとめたサイト。レイアウト、ナビゲーション、画像、ビデオなどのメディア類、フォーム、テキスト、モジュール類に分けて、それぞれ「PCサイトではこういう表示、スマホではこんな感じ」という感じで複数の手法を紹介しています。例えばレイアウトの項目では、スマホ表示時にどのようにカラムを落とすのか。また落としたカラムを隠すのであれば、どういう再出現手法があるのかなど細かく紹介しています。レスポンシブレイアウトでスマホ対応する際に、表現手法について顧客と相談する際にめっちゃ役に立ちそう。とってもナイスです。
レスポンシブレイアウトとフリック操作に対応したカルーセルメニュー。いわゆるJavascriptを使ったイメージスライダーです。モバイル対応を前提としたサイト制作で使えそうです。フリック操作ですが、タッチデバイスではもちろん、PCブラウザ内でもドラッグにより似たような操作ができます。これはちょっと珍しいかも。導入も簡単で、CSSとJSファイルを読み込むだけ。jQueryなどのJSフレームワークは特に使っていないようです。またオプションも豊富にあるので、様々なカルーセル表現に対応できそうです。ナイスです。
無料で配布されているモックアップ素材をまとめた記事。あらゆるモックアップ素材を1記事にまとめてるので、数がめっちゃ多いです。配布されている素材の種類を紹介すると、Mac、iPhone、iPadのApple製ガジェットのモックアップ。続いて名刺などの印刷物のテンプレート。AndroidやWindows Phoneのモックアップ。Tシャツ、ロゴデザイン、ビジネスブランディングツールのテンプレート、カタログ、ポスター、UIテンプレート、PCブラウザウィンドウの素材、プロダクトデザインテンプレート、誌面レイアウト、Facebookページのテンプレート、アイコン素材などがあります。いやぁ多い。最後まで見るだけでも結構なアレです。PSDやAIの素材探す時にはこういうまとめ記事って助かりますな。それにしてもiPhoneのモックアップ素材の多さにはビックリした。こんなにあるのね。
The Ultimate Collection Of 500+ Free Mockup Templates PSD Designs
様々な種類のデザイン素材の配布サイト。UIテンプレート、Webテンプレート、印刷物テンプレート、アイコン、壁紙、ワイヤーフレームキット、デバイスモックアップ、テキストエフェクトなどのデザイン素材が紹介されてます。各詳細ページからダウンロードできるようです。種類は色々あるけど、UIとWebのテンプレートが多い印象。デザイン素材探す際に重宝しそうです。
OGPでサイトのサムネール画像を指定した際に、実際にFacebook内で表示された時にどのように見えるのかをテストできるサイト。早い話がog:imageのシミュレーターです。og:imageで指定した画像がFacebook内で表示される時って、横長表示の時と正方形表示の時があるんですよね。なので1つの画像でどちらの比率でもそれなりにイイ感じに見えるよう作らなきゃいけない。このサイトに画像ファイルを放り込めば、OGP指定する前に見え方をテストする事ができます。ちなみにOGPの情報はFacebook内にキャッシュされるので、og:imageに限らず何か情報を更新した後はOpen Graph Object DebuggerにサイトURLを突っ込んで「Fetch new scrape information」すると、キャッシュが更新され幸せになれます。
Mobile App内において、よく出来たユーザーフローを動画で紹介するデザインギャラリー。ユーザーがアプリを使って、何かしらのゴールに至るまでのプロセスを考える際の参考になりそうです。各アプリはジャンルごとにカテゴリ分けされており、見た感じユーザーが最初にアプリを使いはじめる際のチュートリアルものが多い印象。動きも含めた確認って、普通アプリをインストールしないと見れないんですが、ここなら動画で紹介してくれるので便利です。
