ソフトウェアオプション
ソフトウェアの場合、Balsamiqは簡単にするのに最適ですOmnigraffle Proは複雑性に優れています（Konigiなどのテンプレートを Graffletopia.com 。
スケッチは最初から始める方が良い
アイデアをすばやく出し、簡単に繰り返すことができ、死ぬ必要のある作品に「愛しすぎ」ていると感じないために、スケッチに勝るものはありません。
スケッチ用ツール
これらは私が使用するツールです。黒、赤、青のウルトラファインシャーピー、黒のファインポイントシャーピー、広幅で細かい先端のプリズマカラーウォームグレー40％マーカーです。その暖かい灰色のマーカーは、あなたが何を意味するのかを明確に伝えるという点で、スケッチを別のレベルに引き上げます。
スケッチのヒント
スケッチは派手である必要はありません。直線、テキスト、小さな陰影…書くことができないボリュームを伝えるために必要なのはこれだけです。そうは言っても、スケッチで残りのストーリーを語らせます。
ソース
Leah Buleyはスケッチに関する優れたリソースを持ち、私が知っていることに影響を与えました。彼女はUXデザイナーとしてAdaptive Pathで働いています。
こちらが Adaptive Pathのお気に入りのスケッチ用ツール です。
Leah BuleyのGood Design Fasterプレゼンテーション のスライド16と25をご覧ください。
- - -更新 - - -
同僚とのコラボレーションを強化し、芸術的な傾向を感じないかもしれないアイデアを誰もがうまく引き出せるようにするため、myBalsamiqを使用しています。
鉛筆と紙は、これまでにない最高で最も費用効果の高いツールです。
すばやく簡単で、最小限の労力で多くのアイデアを（必要に応じて）探索できます。
ゆるいアイデアを（単独または直接）探索するには、紙またはホワイトボードを使用します。忠実度の低いワイヤフレームをプレゼンテーション用に準備するときは、 Balsamiq Mockups を使用します。
私がバルサミクについて好きなこと：
- 多くの既存のドロップインUIコンポーネント（作成されたコミュニティを含む）
- カスタムシンボルを簡単に保存して再利用できます
- キーボードショートカットにより、コンポーネントをすばやく追加できます（私にとって）
- 疑似プロトタイプ形式でワイヤーフレームを接続するための一部の（制限された）クリックスルーサポート
- 独自のツールで解析できるカスタムXML構文（BMML）でスケッチを保存します
彼らは myBalsamiq と呼ばれるコラボレーションに焦点を当てたオンラインバージョンを導入しましたが、まだ試していないため、意見を述べることはできません。
業界をリードするui/uxプロトタイピングまたはスケッチングソフトウェアは、市場に数多く存在します。オンラインとデスクトップの両方。これは主に、インターフェイスでキャプチャする忠実度/相互作用のレベルに依存します。
ちょうど基本-中程度の忠実度のために、すべての異なるライブラリ/ウィジェットをロードした状態でAxureを使用することをお勧めします。
Axureウィジェット
http://www.axure.com/widgetlibraries
http://www.acleandesign.com/2010/04/axure-better-defaults-library-v2/
http://axureland.com/axure_widget_libraries
中-上級の場合は、インターフェース上のデータベースから表示される動的データを含むすべての機能を備えたiRiseを使用できます。ところで、ライセンスは企業だけが買うことができるところに非常に高価です
上記以外に、popluarツールのリストを示します
- ConceptDraw Pro タイプ：Windowsアプリ
- Pidoco タイプ：オンライン
- Balsamiq
- モックアップ タイプ：AIRアプリ
- Mockingbird タイプ：オンライン
- 鉛筆 タイプ：Firefoxアドオン
- iPlotz タイプ：オンライン/ Flash-Flex
- ProtoShare タイプ：オンライン
- HotGloo タイプ：オンライン
- Lumzy.com タイプ：オンライン
- MockFlow タイプ：オンライン
- Gliffy タイプ：オンライン
- Cacoo タイプ：オンライン
- Creately タイプ：オンライン/ Flash-Flex
- 素敵なチャート タイプ：オンライン
- モックアップビルダー タイプ：オンライン/ Silverlight
- 明快なチャート タイプ：オンライン
鉛筆と紙のスケッチの代わりに、Wacomタブレット+ MyPaint の使用をお勧めします。 MyPaintは、以下の機能を備えたドローイングオープンソースソフトウェアで、スケッチに適しています。
- 無限のキャンバスです。マージンがないため、現在のスケッチの任意の側にいつでも描画できます。
- 多数のブラシさまざまなブラシを使用して、カスタムコレクションを作成できます。
- レイヤーのサポート。簡単なキーボードショートカットを使用して、描画、シェーディング、または注釈に異なるレイヤーを使用し、アクティブなレイヤーを変更できます。
- Clean UI。UI要素を表示/非表示にするためのキーボードショートカットを全画面モードで提供します。
- ドラフトを保存します。中間状態を簡単に保存し、前後にナビゲートしてスケッチのバリエーションを試すことができます。
MyPaintは、他の成果物（ワイヤフレームやプロトタイプなど）に適したほとんどの描画パッケージ（Fireworksなど）やプロトタイピングツール（Axureなど）の複雑さをほとんど導入せずに、上記の機能（紙では利用できません）を提供します。
使い方を説明するために、@ tajmoによる手描きスケッチのレプリカを作成しました。
最も重要な部分はさまざまな媒体やスタイルでスケッチする必要がある場合を理解するです。実際のインタラクティブなワイヤーフレームを作成するのではなく、単純な探索である醜い汚いスケッチを作成するタイミングを学びます。
イラストレーターやタブレットを使って描く人も多く、とても速いです。たとえば、このメディアのいいところは、簡単に変更して他の人に送って操作できることです。
ご覧のとおり、メディアとソフトウェアはプロセス内の場所に依存していますが、-習慣それらのスケッチを作成した人。
私が使う
大まかな探索から始めて、プロセスと忠実度の順に使用します。
- 紙+黒ペン
- 紙+厚いシャーピー、黒のペン、グレーのマーカーでハイライトを強調
- 変更が必要になる可能性のあるワイヤーの1つのイラストレーター
- Axure（ただし、これは私の頭ではスケッチではありません。ワイヤーフレームであり、何らかの形で対話性が必要なために使用されます）
ペンと紙は 言及 で十分ではありません。初期の段階での柔軟性は必須です。
その後：私はAxureを使用していますが、Balsamicについても良いことを聞いています。
うん。紙と鉛筆とペンが勝者になります。すべての手のスケッチの経験は、あなたが行うすべての画面「描画」に通知し、それをより良くします。また、スケッチのスキャンや写真を送信するための実践的なシンプルさも紹介します。デザインとは、思考と形作りです。画像を簡単に作成できる画面ツールは、思慮深いデザインには貢献しません。 1時間あたりの効率を上げるだけの画像が必要な場合は、前述の描画ツールのどれでも問題ありません。
ワイヤーフレームについては、Balsamiq、Mockflow、Mockingbird、Hotgoo、Protoshareなどをよく見ました。私はMockflowを選択し、価格、パワー、UI、および結果について満足しています。
pencilとpaperに置き換わるものはありません。そして、これのために、私は アクションメソッドペーパーBehance Networkからのツールをお勧めします。私は彼らのドットグリッドcahierとノートブックを毎日使用し、それは本当にプロフェッショナルで美しいです。
すばらしいのは、彼らがこのペーパーアクションメソッドをweb、ipad、mobileに適合させたことです。ぜひチェックしてみてください。
プロトタイピング/ワイヤーフレームツール（スケッチではない）として、私は個人的にBalsamiqを使用しています。高速で直感的かつ効率的です。また、個人的なプロジェクトを処理するためのベータ版のmyBalsamiq Webサイトもあります。しかし、これは無料ではありません。
私の会社では、Confluence wikiを介してナレッジマネジメントを行っています。 balsamiqプラグインを追加しました。これは、コンテキスト内でワイヤーフレームを処理する非常に強力な方法です。
最後に、中間的な方法として、Wacom Bambooタブレットを購入し、PhotoshopでUIブロックとテンプレートを使用して、すべての世界で最高のものを得ることができます。
これらすべてのアドバイスがお役に立てば幸いです。
Adobe Fireworksをお勧めします。それは素晴らしいです：
- Webデザイン用に設計されているため、非常に高速です。
- ボタンやウィンドウなどの再利用可能な要素に記号を使用できます
- 9スライスのスケーリングをサポート
- コーディングなしで完全にインタラクティブなプロトタイプを構築できます
- このワイヤーフレームキットを使用 設計を混乱させることなく、テストするページをすばやく構築できます
そして、準備ができたら、すぐにスケッチの上にデザインを開始し、すべてをcssおよびイメージとしてエクスポートできます。
私は7年間Fireworksを使用してきましたが、多くの時間を節約できました。
私の意見... Balsamiqは制限することです。フォーチュン100の会社で唯一のUX担当者として、多くのWebアプリケーション/ポータルを担当しています...限られたパレットでBalsamiqでワイヤフレームをスケッチする時間や贅沢はありません。その道を進んでいるので、開発チームはワイヤーフレームの定義を増やす必要があることに気づきました。それが、完全な制御を可能にし、Photoshop設計ファイルへのハイブリッドを提供するIllustratorに移行した理由です。 Illustratorが登場する以前は、ビジネス要件を解決し、要件とアジャイル開発チームの間にギャップを構築するために、細い鋭いペンとグリッドペーパーが不可欠でした。対話型のモックアップツール（花火、iRIse、Axureなど）を調べていますが、事前定義されたウィジェットに限定されたくなく、コーディングする時間もありません。