ズラっと並んでるスマートフォンやタブレットの中からどれかひとつを選んで、そのディスプレイ部分に任意の画像を表示させたモックアップ画像を作る事のできるサイト。各デバイスは当然ディスプレイ解像度が異なるので、あらかじめそれぞれに合ったサイズで画面用の画像を作っておく必要があります。ちなみにiPhone 5は640px * 1136px、iPhone 4 and 4Sは 640px * 960pxです。Androidは色々あり過ぎて分かりません。デバイスを選ぶとディスプレイ解像度が表示されるので、あとは「Drop files here」の部分に画面用の画像を放り込むだけでOK。生成した画像はPNGで保存する事ができ、またこんな感じで固有リンクを使った共有もできます。UIデザインする際に他のメンバーや顧客とデザイン共有する際に便利そうです。
薄いドットが等間隔に並んだテンプレート紙を印刷するためのPDFジェネレーター。うーんなんか日本語として変な感じがするけど、まぁPDFをダウンロードできるサイトです。ドットの付いた紙って垂直線や水平線を書きやすいので、仕事柄日常的に使ってるけど、ここでPDFを生成すればプリンタでガシガシ印刷できて経済的です。このサイトのイイところは、ドットの感覚をカスタムできる所。カスタムした結果はプレビューエリアに反映されるので、ちょうどイイくらいの感覚でドットを書く事ができます。デザインする際、またプロトタイピングの際に便利っすね。
自分が使っているデバイス向きのメディアクエリジェネレーター。サイトにアクセスすると使っているディスプレイの解像度を調べてくれます。ただしインチ数だけは手動入力で、ここ入力するとDPIを計算してくれます。ページ下部にはサイトにアクセスしているデバイス向けのメディアクエリを書き出してくれて、さらにその指定がアクティブであるかどうかも色で判断してくれます。PCからアクセスしている人は、ブラウザウィンドウを縮小してみると色が緑から黒になって指定がアクティブでなくなる様子が分かると思います。メディアクエリ使う機会増えましたからね、なかなか便利なジェネレーターですな。
Webデザイナーのためのオンラインツールをまとめた記事。38個のサイトが紹介されてます。コードスニペット、モバイル端末のディスプレイサイズ一覧、プロトタイピングに役立つPDF、CSSフレームワーク、各種JS（うーん大雑把。そしてこれが一番多い）、CSSデバッガ、Webフォントなどがその内容。最近のWebデザイナーにとって役立つツール類が多く紹介されててなかなかナイスなまとめ記事。
UIデザインに役立つオンラインツールをまとめた記事。UIの作例集やボタンなどのパーツ素材集、モック制作のためのジェネレーター、カラーパレット生成、プロトタイピングツールなどがあります。ワイヤーフレームをオンラインで描いて共有するツールなんかは、デザイナーだけでなくディレクター的な役割の人にも役立ちそう。UI Paradeには自分もよく世話になってます。
Webデザインで使えるオンラインツールがまとめられた記事。33のツールが紹介されてます。背景素材、テクスチャジェネレーター、カラーパレット、プレイスホルダー生成、Photoshopプラグイン、ワイヤーフレームなどの手書き用PDF、ローダーなどのアニメーション素材ジェネレーター、トリミングやリサイズツール、Jpeg圧縮、画像加工、アイコン素材などが主な内容。数が多いのでなかなか盛りだくさんです。これ系の記事はよく見るけど、初見のサイトもあったので紹介しときますね。
画像をアップロードして消したい背景と残したいオブジェクトを簡単に選択するだけで、背景部分をアルファチャンネル化してくれるサイト。例を見るとすごい簡単な感じがしたので、試しに江頭先生の画像を使ってやってみました。左のサムネールがその様子。これスゴいっすわ。髪の毛のモヤっとした感じとか綺麗に切り取ってくれます。背景がゴチャっとしてる画像は苦手だろうけど、切り取り作業中に輪郭部分に黄色く太い線が出る様子とかスゴく分かりやすいです。Photoshopがない時の代替や、デザイナーでない人にオススメのツール。いやこれ良く出来てます。
画像の簡易的な編集ができるオンラインジェネレーター。やれる事は画像の切り抜き（トリミング）、回転、リサイズ、簡単なエフェクト。編集はサイト上で確認でき、JPG、PNG、GIF、BMPの各種フォーマットで保存できます。手元にPhotoshopがない時や、デザイナーではないけど画像の加工をしたい場合などに便利ですね。
