Sketch用の、iOS / Andoroidアイコンテンプレート。編集から各サイズへの書き出しまで行う事ができます。またアイコンのコアな部分はシンボル化されているので（Photoshopで言うスマートオブジェクトみたいなもの）、1つ変更すれば全部変わります（iOSとAndroidでは共有化されていないようです）。それぞれデバイスのホーム画面やAppStoreではどのように見えるかのプレビューもできるようになっているので、確認しながら作りこむ事ができます。アイコン制作する時に使えそうです。
Androidの音声認識を使って出来る事がリスト化されてます。人に関する事、時間、天気、株価、単位の変換、計算機代わり、デバイスコントロール、調べ物、アラーム、カレンダー、メモ、電話、メッセージ、Facebookへのポスト、翻訳、リマインダー、マップとナビゲーション、スポーツの試合の確認、飛行機のフライトの確認、Webブラウジング、映画やTV番組の確認、音楽の再生、ストップウォッチなど。最後の方にイースターエッグなんかもまとめられてます。自分の場合宗教上の理由でAndroidは持ってないんですが、Siriたんでもだいたい同じような事ができるので、iPhoneユーザーが見てもわりと参考になるような気がします。
各種タッチデバイスのディスプレイ仕様を一覧で見る事のできるサイト。というかトップページはココで、そちらでは自分が使っているブラウザの仕様を見る事ができるというものなんだけど、個人的にこっちのデバイス確認ページの方が便利だなーと思ったのでこちらを紹介。論理ピクセル数、物理ピクセル数に加えて、ピクセルレシオやPPIについても紹介されています。表のヘッダーをクリックするとソートし直しもできます。モバイルサイトデザインする時の指標として使えそうです。
各種スマホを手に持った状態の画像素材を、Facebookが公式に配布してます。機種はiPhone 6s、Microsoft Lumia 950、Nexus 5x、Samsung Galaxy Note 5の4つで、それぞれ4つのバリエーションが用意されています。ダウンロードするとSketchフォーマットと透過PNGのものが一式入っており、Sketchの方はディスプレイ部分がマスク処理されているので、画面デザインのハメ込みもサクっとできそうです。全機種に4パターンの肌色バリエーションを用意している点が、Facebook公式の素材っぽいなーとか思いました。モバイルAppの紹介ページなどで使えそうです。
モバイルアプリやPCアプリのスクリーンショットを、各種デバイスのディスプレイ部分にハメ込み合成できるサイト。用意されているデバイスはiPhone、iPad、Mac、Apple Watch、Android端末など、多くの種類が用意されています。Apple Watchあるのがレアですね。モバイルApp制作してて、サイト内やチュートリアル画面で使い方を見せる場面の画像制作に使えそうです。サイト内でトリミングができる点もナイス。
モバイルAppとか作ってるBjangoが、各種モバイルデバイス向けAppアイコンのテンプレートファイルを配布しています。iPhoneやiPadなどのiOSに加え、AppleTVのtvOS、Apple WatchのwatchOS用テンプレートも入ってます。あとAndroid用のものも。ダウンロードするとフォルダごとに各種フォーマットが整理されており、PhotoshopやIllustrator以外にSketchやAffinity Designer用のものまで入ってます。最近じゃSketchやAffinityでデザインする人も多いですからね。対応デバイスの数やフォーマットの多さを考えると、コレ系のアプリアイコンテンプレートとしては最強なんじゃないでしょうか。ホーム画面に置いた時のシミュレートとかを考えるとPixelresortのテンプレートとかもイイんですけどね。
iOSやAndroidの各種タッチデバイスのモックアップを、Facebookが配布してます。興味深いのはそのフォーマットがSketchである事。もうすっかりUIデザインの世界じゃPSDやAIではなくSketchが主流なんだなーと思いました。用意されている端末の種類も多いので（Nokia系なんかもあります）、Sketchユーザーの人は素材探しに使えそうです。
Nine-Patch、もしくはNine-Sliceと呼ばれる、主にAndroid Appなどの開発現場などで使われるボタン画像フォーマットのジェネレーター。主に上下左右に大きさが可変する角丸ボタンに使われるアレを、簡単にWebから生成できるというものです。Nine-Patchがどういうものであるかはこのあたりを参照してください。画像の作り方は簡単で、まずは「Select Image」ボタンからNine-Patch化したいPNG画像を選択。ロードされると右側に表示されるので、あとは拡大に応じて伸長するエリアとコンテンツパディングを指定するだけ。またこの際「Trim」のプルダウンメニューから「Stretch Region」を選ぶ事で、必要な画像部位だけにトリミングしてくれます。なのでPhotoshopを使ってUIデザインをしている場合、いつも通りに画像をアセット保存して出力されたフルサイズのボタンPNGを放り込むだけでオッケー。画像を最小サイズにするのはジェネーレーター側に任せる事ができます。いちいち制作サイドで最小サイズにトリミングする手間が省けます。
またこのジェネレーターでさらに便利なのが、画面中央にある「Interactive Preview」という機能。これをクリックすると、現在のNine-Patch指定で画像がどのように伸縮するのかを、実際にドラッグして挙動を確認する事ができます。これがもう死ぬほど便利で、指定ミスによる想定外の挙動を防ぐ事ができます。あとプログラマーに渡す直前に「この動きでオッケーだよね？」的な確認をするのにも便利です。Nine-Patch画像はPhotoshopだけでも作れるといえば作れるんだけど、こういう便利なツールはどんどん使っていきたいですな。
