UI開発者に最適なツールはどれですか?


ベストアンサー

UIデザイナー:

スケッチ

はじめに

システム:Mac

利点:完全に「インターフェース」設計用

Sketchは、UI設計をよりシンプルかつ効率的にする、軽量で使いやすいベクトル設計ツールです。 。このプラットフォームは、特にUX / UIデザイン用に設計されたPhotoshopおよびIllustratorで使用される機能を簡素化します。 Sketchの前は、デザイナーはPhotoshopとIllustratorを切り替えて、ベクトルやその他の写真効果などの特定の機能を取得する必要がありました。現在、Sketchを使用すると、ユーザーは肥大化した機能を取り除き、ユーザーエクスペリエンス/ユーザーインターフェイスデザインに集中して、UIデザインを最大限に活用できます。 Sketchの最も優れた機能の1つは、ソフトウェアに含まれていない機能を補うためにプラグインをインストールする機能です。

ただし、これは、Androidアプリのユーザーインターフェイスを設計するための最も実用的なツールの1つであり、SketchによるAndroid側のリアルタイムプレビューのサポートはあまり効果的ではありません。ユーザーはSkalaPreviewをダウンロードする必要があり、一連の面倒な操作を行った後にのみ表示できます。電話側のAndroidインターフェースの実際のデザイン。

iDoc

システム:MacとWindows

利点:オンラインコラボレーションデザインとハンドオフデザインUIデザイナーと開発者向け

まったく新しいコラボレーションおよびハンドオフツールとして、iDocには Photoshop、AdobeXDからのファイルのインポートをサポートする強力なプラグインがあります。 、およびSketch 。プラグインの助けを借りて、iDocは仕様とアセットを生成することができますUIデザイナーが使用するために自動的に。静的設計ファイルをインタラクティブでアニメーション化されたhi-fiプロトタイプにするには、ファイルをiDocのプロトタイプモジュールにアップロードするだけです。

インビジョン -デザインをすばやく公開するWebベースのプロトタイピングツール

費用:1プロジェクトで無料(3プロジェクトで15 $ /月|無制限プロジェクトで25 $ /月|チームで99 $ /月)

互換性:MacとWindows

機能:

  • InVisionを使用すると、設計者はデザインファイルをアップロードし、アニメーション、ジェスチャー、トランジションを追加して、静的な画面をクリック可能なインタラクティブなプロトタイプに変換できます。 5分以内に忠実度を高めます。
  • PNG、JPG、GIF、AI、PSD形式のファイルをサポートします。 InVision Appは、設計ドラフトでのコラボレーションや、同僚やクライアントからのフィードバックの収集に最適です。
  • 魔法のような新しい設計から開発へのワークフロー。スタイルシートを作成し、ピクセルパーフェクトなカンプを取得し、設計上の課題について話し合い、適応的にエクスポートし、任意の設計要素の実際のコードを生成します。

価格-個人は無料使用

-グループ/月あたり1人あたり12ドル

はじめに:Figmaは、実際の最初のインターフェース設計ツールです -時間のコラボレーション。リアルタイムコラボレーション、ベクターネットワーキング、バージョン管理の3つの優れた機能があります。簡単に言うと、Figmaは、リアルタイムコラボレーションを備えたブラウザベースのスケッチのようなものです。

個人的な経験:最初はFigmaに懐疑的でした。ブラウザベースのインターフェイスデザインツールであるため、ユーザーエクスペリエンスが向上します。しかし、後で使用するのに非常に敏感であることがわかりました。さらに、ブラウザツールには、受信者が何もインストールする必要がなく、ブラウザを開くだけでよいという利点があります。プロジェクトに参加するためにコンピュータ上で。 Figmaファイルは、Mac、Windows、Linux、およびモバイルデバイスで利用できます(表示のみ)。

回答

開発者から「いいえ」と言われた場合は、まず理由を尋ねて、いいえと言う理由を理解してください。デザインの課題に取り組むためのより良い方法があることが判明した場合、私はデザインを変更することをいとわないでしょう。

ただし、開発者は通常、任意の機能をコーディングし、UIデザイナーをデザインすることができます。思い付く。 William Hurleyがこの回答で指摘したように、ソフトウェアに関してはほとんどすべてが可能です。

「x機能」が可能かどうか、または特定の機能を果たすように設計をコーディングできるかどうかをソフトウェア開発者に尋ねました。

そうは言っても、UIデザイナーとしての目標はすべきではありません複雑なデザインを作成します。目標は、ユーザーにとってインターフェイスをできるだけシンプルで直感的にすることです。

そのため、最近のプロジェクトではGoogleマテリアルデザインの原則を使用しました(マテリアルデザインを使用する5つの強力で実用的な理由)。

これにはいくつかの利点があります:

  • ユーザーへの親しみやすさ -Gmail、YouTube、Evernote、Buzzfeed、その他の多くのアプリはマテリアルデザインを使用しているため、アプリのユーザーがその方法に精通している可能性が高くなります。インターフェイスの外観と動作。
  • 既存のフレームワーク-開発者が使用できる既製のコンポーネントを含む多くのフレームワークが作成されています。 CSSのマテリアライズ AngularJSマテリアルマテリアル-UI 。これにより、設計者は開発者がすぐに利用できるものを確認し、それらのコンポーネントを設計で使用できます。
  • より迅速な意思決定-開発者と設計者が同じコンポーネントパレットから作業できるため、設計と開発のプロセスが高速化されます。

これは、リリース前であっても、Googleが多数のアプリのルックアンドフィールを一貫させた方法に関する優れたビデオです。マテリアルデザイン。設計者は、当時と現在使用している原則を適用することで、より優れたインターフェースを作成し、開発者の語彙から「いいえ」を事実上排除できます。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です