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

Browse By

Tag Archives: Prototyping

[Sketch] Wireframe Prototyping System – プロトタイピングに便利なSketch用テンプレート

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

プロトタイピングに便利なSketch用テンプレートファイル。PC用とMobile用があり、またダーク系・ライト系合わせて4種類のテーマが同梱されています。まとめて全部ダウンロードする事ができ、$0で指定すれば無料で手に入れる事ができます。ワイヤーフレーム描く時に使えそうです。WebディレクターやIAやってる人などに是非。

[Freebie] Must-Have Sketch Templates for New UX Designers – UXデザイナーのためのSketchテンプレート

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

UXデザイナーのためのSketchテンプレートのまとめ記事。グリッドレイアウト素材、画面遷移のパーツが用意されたもの、アイコン、ワイヤーフレーム素材、iOSやAndroid、FacebookなどのUIモックアップ、カラーパレットなどのSketchファイルが紹介されています。Webディレクター、UXデザイナー、UIデザイナーといった職種の人にオススメ。

[Prototyping] sketchsheets – 手書きのプロトタイピングに使える印刷用PDF

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

手書きのプロトタイピングをする際に便利な、印刷用PDF。用意されているテンプレートは、iPhoneやiPadなどのタッチデバイスの他に、ブラウザウィンドウなどもあるので、モバイルAppだけでなくWebデザインの現場でも使えます。またiPadのものはSlide Over(2画面表示のアレです)表示時の画面分割されたものも用意されていて、気が利いてるなーと思いました。

[Prototyping] 24 Free Mockup and Wireframe Tools for Web Designers – Webのモック制作やワイヤーフレーム描きに使えるツールまとめ

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

Webのモックアップ制作やワイヤーフレームを描く際に使える、便利なオンラインツールをまとめた記事。ドロー系のグラフィックツール、パーツのテンプレートが揃ったモックアップ制作ツール、サイトマップ作るのに便利そうなツリー作成ツールなど色々あります。この手のオンラインツールはローカルアプリと比べても機能的に遜色が無い場合も多く、またオンラインでの共有もしやすいのが便利ですね。

[UI Design] Top 50 iOS Apps for User Experience Design – UIデザインやプロトタイピングに使えるiOS App

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

UIデザインやプロトタイピングを行う際に便利なiOS Appを50例紹介した記事。UIデザインだけでそんなにAppがあるのか・・・と思いましたが、ホントに色々あるようです。WebやMobile Appのワイヤーフレームを描くのに便利なツール、モック制作、遷移図作成、Evernoteへのスケッチ投稿ツール、リファレンス系ツールなどがあります。自分は最近手書きで遷移図とか作る事はほとんどなく、ちょっとしたメモ程度ならiPad miniでするようになりました。今はPencilが欲しくてしょうがないです。早く日本でも買えるようなるといいなぁ。

[PDF] iPhone & iPad printable sketching templates – iOSデバイスのUI設計に役立つPDF

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

iPhone 4系、iPhone 5系、iPadの3種類が用意されており、それぞれA4サイズとUSレターサイズをダウンロードできます。PDFをダウンロードすると、描いた画面の諸情報(スクリーン名やプロジェクト名、バージョンや日付など)を書き込むエリアがあり、iPad版についてはポートレイトとランドスケープのどちらでも描きやすいように工夫されています。画面内にはドットもあり、なかなか気の利いているスケッチテンプレートです。

[PDF] Printable Paper – 様々なフォーマットのプリントできるPDF

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

プロトタイピングに使える、様々なフォーマットの印刷可能なPDF。よくあるドットベースのものやブラウザウィンドウがベースとなっているもの、iPhoneやiPadの筐体デザインをベースにしたもの以外に、あまりこの手のPDFで見かける事のない斜めの格子線のものなんかもあります。「俺はワイヤーフレームは手書き派だぜ!」な方にオススメです。こういうのまとめて印刷してストックしておくと便利ですよね。

[Prototyping] moqups – ワイヤーフレーム描画に便利な、ブラウザ上で動作するプロトタイピングツール

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

Webサイトのワイヤーフレームを描くのに便利な、ブラウザ上で動作するプロトタイピングツール。Webのレイアウトに特化したPowerpointみたいなオンラインツールです。フォームパーツやテキストやボタンなどのボックスパーツ類、テーブルやグリッドなど一通りのパーツ類が揃ってるので、左側のツールバーから右のキャンバスエリアにポイポイ放り込むだけで最低限のものは完成します。デザインツールが入っていないPCでこういうの組みたい時なんかに便利ですね。