GUI設計に最適なソフトウェアは何ですか?


9

私はPhotoshopを多用してきましたが、実際のところ、Photoshopは写真編集ツールです。ドロップシャドウや内部グローと外部グローなど、いくつかの複雑な効果が組み込まれていますが、グラフィカルインターフェイスを設計する場合は十分ではありません。たとえば、複数の編集可能なグラデーションを追加することはできません。また、ツールがそのように設計されていない場合は、ツールをだまして、必要な効果を引き出す必要があります。

私もFireworksを使い始めましたが、丸みを帯びた長方形のカーブを変更し続けることができるなど、いくつか気に入っている点がありますが、そのプログラムのカラーピッカーは使用できません。Macのカラーピッカーを開くと、Fireworksがカラープロファイルを正しく処理していないため、色が実際のものとは異なると表示されます。これにより、色の調整が非常に困難になります。そして、全体としてのソフトウェアはプレリリース版のように感じます(そして多分それはそうあるべきです)。

だから、私は誰もがGUIを作成するためにどのようなソフトウェアを推奨するのでしょうか?素晴らしいグラフィックを作成するために必要な他のすべてのツールと一緒に、変更、順序の変更、いつでも移動できるさまざまな編集可能なエフェクトを使用できるようにするいくつかのソフトウェアが必要です。


ここでのすべての回答に基づいて、質問を明確にする必要があります。私はあなたが実際のGUI要素を作成するためのソフトウェアを求めていると思います...アイコン、ボタンなど。あるいは、あなたはワイヤーフレーミングについて尋ねていますか?
DA01

回答:


7

GUI設計のための普遍的な「最良の」ソフトウェアはありません。それはあなたのソフトウェア/ワークフロー設定に依存します。

フォトショップ

「複数の編集可能なグラデーション」の意味がわかりませんが、Photoshopには、想像できるGUIを設計するために必要なすべてのツールが用意されています。ツールの「トリック」は必要ありません。

その名前にもかかわらず、Photoshopは単純な写真編集/操作ツールをはるかに超えて進化しており、GUI設計ができない理由はありません。Photoshopはおそらく、市場に出回っているグラフィックスプログラムの中で最も包括的なラスターイメージ編集ツールのセットを提供しており、デジタルペインティングからコミックブックのカラーリング、イラスト、WebおよびUIデザイン、ビデオ制作、3Dゲームアートの作成、さらには写真まで、あらゆる用途に使用されています法医学。

調整マスク、レイヤースタイル、ベクターパス、スマートオブジェクト、レイヤーコンプなどの機能により、インターフェイスと深い機能セットに既に精通しているユーザーにとって、UIデザインには当然の選択です。もう1つの利点は、Illustrator、Flash Catalyst、および多くのサードパーティのアプリ/プラグインなどのツールとうまく統合されていることです。

花火

FireworksはWebデザインのために特別に設計されたものであるため、多くの人がFireworksを好みます。このため、FireworksはGUIデザインのための優れたツールでもあります。オブジェクト指向でサポートするページ、シンボル、およびスタイルであるため、FireworksはUXデザインワークフローに非常に適しています。多くの人々は、Fireworksが定規、ガイド、または測定ツールに頼ることなく、より優れたピクセルパーフェクトコントロールを提供することも知っています。

さらに、Fireworksには、グラデーションディザリング、ASEスウォッチ、Photoshopよりも優れたタイポグラフィコントロールなど、多くの優れた機能があります。FireworksのWebレイヤーとAdobeのDevice Centralとの統合により、複数のデバイスのプロトタイプを簡単に迅速に作成することもできます。

イラストレーター

UXデザイナーの間で人気のあるもう1つのアプリはIllustratorです。これはFireworksと多くの長所を共有しています。Fireworksと同様に、シンボル、高度なオブジェクトスタイル、複数のアートボード(ページと同様)、さらに優れたベクター編集機能をサポートしています。

Photoshop、Fireworks、Illustrator、およびInDesignはすべて、ワイヤーフレーム/ステンシルキットとUXテンプレートをWebで利用できますが、再利用可能なシンボルライブラリをサポートしているため、IllustratorとFireworksではモジュラーUX設計が簡単です。

Illustratorは文字スタイルと段落スタイルもサポートしており、タイポグラフィデザイン機能をPhotoshopやFireworksよりもはるかに優れています。さらに、Illustratorはイラストレーションに最適であるため、作成するアイコンやWebグラフィックを同じプログラムで作成できます。

InDesign

InDesignは、IA、IxDなどの間で非常に人気のあるアプリです。グラフィックデザイン機能は限られている可能性がありますが、ページ、段落と文字のスタイル、スニペット、およびオブジェクトライブラリのサポートにより、多くのUXデザインタスクに最適です。InDesignには、非常に高度な組版機能もあり、グリッドレイアウトをサポートしています。これは、InCopy統合とAdobe Digital Publishing Suiteとともに、雑誌用のモバイルアプリのデザインを検討している印刷メディア企業にとって自然な選択です。


しかし、結局のところ、どのツールにも長所と短所があります。Axure、Balsamiq、OmniGraffleなどの最もUX固有のアプリには、レイアウト/ワイヤーフレーム/インタラクションデザインのためのUX固有の優れた機能がたくさんあります。しかし結局のところ、実際にはUIのグラフィックを実際に設計する必要があります。これには、Photoshop / Fireworks / Illustratorなどのグラフィックデザインツールが必要です。

これが、ほとんどのUI設計ワークフローに複数のアプリが含まれている理由です。したがって、ワイヤーフレーム化、UXライブラリの構築、プロトタイピングなど、UI設計プロセスの単一の部分のみに関心がある場合を除いて、単一の「最適なソフトウェア」は存在しません。


2

鉛筆は小さくて使いやすいGUI設計ツールです。

Top features:
Built-in stencils for diagraming and prototyping
Multi-page document with background page
Inter-page linkings!
On-screen text editing with rich-text supports
Exporting to HTML, PNG, Openoffice.org document, Word document and PDF.
Undo/redo supports
Installing user-defined stencils and templates
Standard drawing operations: aligning, z-ordering, scaling, rotating...
Cross-platforms
Adding external objects
Personal Collection
Clipart Browser
Object snapping
Sketchy Stencil
And much more...

ここに画像の説明を入力してください


これは素晴らしいワイヤーフレームツールですが、OPはグラフィック編集ツールを探していたと思います。
DA01

1

私が働いている場所ではIndesignを使用しています。私たちは注意深い活版印刷スタイルできれいなグリッドベースのレイアウトを作成する傾向があり、それらのためにIndesignは素晴らしいです。文字、段落、オブジェクトのスタイルを細かく制御できるため、CSSにうまく変換でき、プロセスの任意の時点でこれらの要素を微調整できるだけでなく、より一貫したレイアウトを実現できます。グラフィック要素をエクスポートする場合はそれほど良いことではありませんが、トレードオフの価値があることがわかります。


1

最も予期しないGUIプロトタイピングツールの1つは、実際にはKeynoteです。私はそれを誓う一流のUIデザイナーをかなり知っています、そしてKeynotopiaはKeynoteをこのように使用するための素晴らしいリソースです。それがそれほど効果的に使用されているのを見ていなかったとしたら、おそらく信じられなかっただろうが、それはかなりうまくいく。Macを使用している場合は、ぜひお試しください。


0

私はピドコで働いています

当社のプロトタイピングツールを使用すると、ウェブサイト、モバイルアプリ、ソフトウェアのプロトタイプを開発できます。AppStoreおよびGoogle Playから無料のPidocoアプリを使用して、デスクトップ、スマートフォン、またはタブレットでモックアップを直接シミュレートできます。

主な機能は次のとおりです。

  • リアルタイムのコラボレーション
  • HTML、PDF、Word、PNG、SVGにエクスポート
  • たくさんのステンシル
  • テンプレート
  • カスタムステンシル
  • SaaSなので、どのブラウザーからでも使用できます

2
ワイヤーフレームについて尋ねるすべての質問であなたの会社を宣伝しないでください。あなたがそこにいる従業員であることをオープンにしてくれてありがとう。
DA01 2014年
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.