開発者のUIデザインスキルの一般的な不足を克服する[終了]

多くの開発者はUIデザインが得意ではないと言われましたが（これが本当かどうかはわかりません）、少なくとも私についてはそうです。

Web開発では、UI開発の優れたスキルがなければ、優れたコード開発スキルは十分ではありません。

だから、私と私のような多くの開発者にとって、半分のこと（良い開発スキル）しか持っていないので、デザイナーにお金を払う以外の残りの半分をどのように完了するべきでしょうか？

これに最適なソリューションは、ほとんど変更を加えずにオープンソースのWebテンプレートを使用することですか、それとも他のオプションがありますか？

私はデザインもそれほど得意ではない開発者です。できるだけシンプルにするために、デザインをしなければならないプロジェクトに取り組むとき、私は一生懸命努力します。私は非常に論理的なアプローチを取り、ユーザーエクスペリエンスのみを考慮して設計しています。私はそれを本当に美しく見せることはできませんが、ユーザーフレンドリーで比較的目に優しいものにすることができます。

私はこれらの本のいくつか読みました：http://www.uxbydesign.org/2009/06/24/20-user-experience-books-you-should-own/をし、彼らは本当に私を助けました。

そのリストで私のお気に入りを編集するのは、Do Not Make Me Think：A Common Sense Approach to Web Usability、2nd Edition by Steve Krug

（何でも）デザインとは、さまざまな利害関係者（顧客、開発者、ユーザー）のニーズ間の交渉です。利害関係者は通常、自分のニーズを最もよく理解し、他の利害関係者のニーズを上回る傾向があるため、最適な設計を作成するのに適した立場にありません。優れた設計者は、さまざまな利害関係者のニーズ（多くの場合、利害関係者自身が認識していないニーズ）を特定し、すべての人に役立つソリューションを考え出すことができます。

あなたはおそらくこれを何度も自分で見たことがあるでしょう。ユーザーは、通常、すでに慣れ親しんでいる他のシステムの観点から、システムと対話する方法について考えます。開発者は、主にシステムの仕組みについて考えます。顧客は通常、すべての問題を解決するものを求めているか、または非常に具体的な問題を最小限のコストで解決したいと考えています。

優れたデザイナーになるには、何かを実装する方法を事前に考えるのをやめることを学ぶ必要があります。代わりに、他の利害関係者が彼らが必要としているものについてあなたに言っていることに集中しなければなりません、そして、あなたは行の間を読むことができなければなりません。開発者と同様に、顧客やユーザーはしばしば、事前に考えられたソリューションを念頭に置いており、基本的な要件の代わりにそのソリューションを説明する傾向があります。（そうは言っても、顧客は自分が望むものを正確に伝えるとき、彼らが言うことを意味することもあるということを理解することが重要です。

より表面的には、UIの美的デザインも一部の開発者が問題を抱えています。これは、ソフトウェア開発者が美学の訓練をあまり受けていないことが原因の1つであると考えています。CSの学生は美術の授業にあまり時間がないかもしれません。それはまた、部分的に再びあります。なぜなら、私たちは何かがどのように見えるかというよりも、どのように機能するかに興味があるからです。ボタンの角の半径が9ピクセルであるか10ピクセルであるかは気にしません。これら2つの要因は確実に関連しています。UIフレームワークの形の定型ソリューションに依存することでこれを克服できる場合があり、事前に設計されたコンポーネントを使用すると、同じシステム上の他のアプリケーションと視覚的に自分の作業を統一できるという利点があります。他の人の作品を読んだり見たりして、美的スキルを向上させることができます。そして、あなたが過去に無視していたかもしれない視覚的な詳細に細心の注意を払っています。また、視覚的な違いの背後にあるロジックを理解しようとする必要があります。角の丸いボタンは丸いボタンとは異なるものを意味しますか？色はどのように使用されますか？等

ここに私が助けてくれるものがいくつかあります：

• 他のソフトウェアで好きなもの/嫌いなものに注意してください。私たちはプログラマであり、私たちの人生の大部分をコンピューターで過ごしています。ソフトウェアを使用するときに好きなことや嫌いなことを書き留めてください。コンピューターソフトウェア、ビデオゲーム、モバイルデバイスなどは関係なく、便利で使いやすいものとそうでないものに目を光らせてください。

• あなたとあなたのユーザーのためにUIをスケッチするための使いやすいスケッチツールを見つけてください。Balsamiqは高速でシンプルであり、Webバージョンは無料で使用できるため、私はBalsamiqの使用が大好きです。

• あなたが何かを設計するのを助けるためにソフトウェア設計を専門とする誰かを見つける必要はないことを忘れないでください-どんなユーザーでもするでしょう。私は、プロジェクトにまったく関係のない一部の人がスケッチを実行することがよくあります。なぜなら、彼らは一日中ソフトウェアの周りにいることを知っているからです。彼らはしばしば何をすべきかについておかしなアイデアを与えてくれることを心に留めておいてください。

• 詳細な質問については、https： //ux.stackexchange.com/でお気軽にお問い合わせください

正直に言うと、UIの設計はすべて異なるものです。開発者は常に微妙な設計を考えており、設計に関してはあまり創造的ではありません。私が感じる明確なアプローチは、UIデザインのために別の開発者を維持することです。それはコストに追加されますが、間違いなくあなたがより良い結果に到達するのに役立ちますが。

自分で両方のことをする人にとっては、決して最高の結果をもたらさない。そのため、これら2つの異なる側面を2人の異なる開発者に割り当てる必要があります。CMSが異なる場合は、スキニングとテーマ開発のためのHTMLとCSSの知識が少し必要ですが、まったく新しいデザインを開発する必要がある場合は、UIデザイナーに相談してください。

Joel Spolskyの著書User Interface Design for Programmersをお勧めします。この本では、彼はあなたが探しているアプローチをほとんど取り入れています：プログラマーにとってUIデザインが重要な理由を説明しています。一部のオンライン関連資料の場合：

自分の人生に関係するより良いものを持っている人々のためのデザイン

UIデザインは多くの人にとって自然なものではありません。しかし、私は最近、いくつかの簡単な原則に従うことで、はるかに良くなりました。

1. 驚かないでください、あなたが思うほど難しくはありません。

2. 最初にデータ構造とエンジンをモデル化します。明確で現実世界に対応するモデルを作成します。これは明らかに、顧客が何を必要としているかを理解するのに時間をかけていることを前提としています。

3. 今、紙と鉛筆で、座って画面の論理的なレイアウトを描き始めます。これは通常、組織化された方法でユーザーにデータモデルを提示するだけです。あなたの目標は単純であるべきです：

   a。アプリが展開される環境を模倣します。たとえば、Windowsアプリの場合、Windowsアプリのように動作する必要があり、Webアプリの場合、あなたよりも人気のある類似のWebアプリケーションのように動作する必要があります。

   b。あなたの目標は、彼らが予測する方法でデータモデルを通してユーザーを導くことです。ユーザーインターフェイスは、ユーザーがアプリケーションで何かを実行するときに適切に設計されており、ユーザーが期待したとおりに動作します。

   c。これには時間がかかり、学習曲線ですが、誰でもできます。

4. グラフィック、つまりボタン、背景などを心配しないでください。この時点での唯一の目標は、ページの論理レイアウトです。

5. html、gtk、cocoa、android、Windows.Formsなど、使用しているGUIライブラリを習得する必要があります。イベント処理メカニズム、レイアウトエンジン、入力の取得と表示を理解する範囲でデータ。開発者は少なくともこれを行うことができるはずです。

6. ここからグラフィックデザイナーを引き継ぐのは恥ではありません。ただし、少なくとも手順5を通過できる必要があります。これは、アプリ全体のワークロードの95％です。

貧弱なGUIデザイナーから、はるかに優れたGUIデザイナーに私を変えた役に立つ記事があります。

http://www.joelonsoftware.com/uibook/fog0000000249.html

また、「類似」サイトの成功例を探して、レイアウト、グラフィック、デザインのアイデアを得ることができます。お気に入りのペイントプログラムを少し調整するだけで、多くのアイデアを借用して自分で作成できます。完全にコピーしないでください-それは悪いマナーであるだけでなく、おそらくほとんどの場合違法です。

数回借用すると、成功したサイトのデザインをよりよく理解できるようになり、それらのデザインを作成するためのツールを（小さな調整で）知ることができます。

HTMLの導入により、見栄えの悪い単純なサイトを作成することが課題になりました。概念はあるかもしれませんが、正しく機能させるには、いくつかのトリック、ツール、既製のグラフィックス、CSSの知識が必要です。また、見栄えの良いページを作成するには、設計プロセスに影響を与えるユーザビリティ技術やその他の人的要因が必要です。

開発者はほとんどの時間を費やして、複雑な言語、OOP、ORM、SQL、T-SQLなどを学習します。また、Webサイトを作成するためのツールに投資することはほとんどありません（ほとんどが高価です）。

その結果、多くの開発者は、見事なWebページを作成できないことに苦しんでいます。必要なツールを学べば、良いページも作成できると思います。

また、アプリケーション開発プロセスでのロールが何であるかを知ることも重要です。あなたは、ウェブデザインが必須のスキルであるというよりむしろスキルを持っているのが良いとわかるかもしれません。大規模なプロジェクトでは、少なくとも上記の理由から、プログラマーのタスクであってはなりません。

このツールは素晴らしいツールであることがわかりました。

アーティスト

それを見て、デモを試してください、それは本当に良いです。

まだWeb開発では、優れた開発スキルは、設計の優れたスキルなしでは十分ではありません

この声明が真実かどうかはわかりませんが、どこで働いているかによります。

たとえば、小さな会社ではおそらくスキルセットの柔軟性を高める必要がありますが、大企業では同じ期待を持たず、設計チームが設計に取り組んでいる間に実際にすべての時間を費やすことができます。

マイクロソフトは実際にツールセットを更新して、開発者とデザイナーの明確な分離を強調しています。彼らはExpression Blend with WPFを導入しました。これは、開発者がソフトウェアの機能に取り組み、他の誰かがそのための設計を行えることを意味します。両方とも異なるツールを使用し、同時にプロジェクトで作業できますが、一方は機能を実行し、もう一方は設計を実行します。

開発者がデータポイントを指定し、デザイナーがそれらを表示します。

コードだけでなく、デザインもテストできることを忘れないでください。簡単に始めて、少数の人々のグループでデザインを試し、フィードバックを記録してそこから進んでください。これにより、デザインの問題を特定し、何ができる/何をすべきかについてのアイデアを得ることができます。次に、設計を修正して繰り返します。

あなたはそれを偽造し、他のデザインをコピーする必要があります。ユーザーにとって大きなメリットとなる1つまたは2つの機能を除き、派手なものは避けてください。フォント、色、混乱を制限するいくつかの基本的な慣行に従ってください。

UI.stackexchange.comに質問を投稿することを恐れないでください

あなたの専門分野ではありませんが、UIの作成方法を学ぶことは常に興味深いと思います。現在、ほとんどのWebページは非常に動的であり、UIスキルを知っていると、コンポーネントを作成し、ページの要素との相互作用を設定するときに確実に役立ちます。私はバックエンドのみの開発のバックグラウンドから来ましたが、インターフェイスを作成する際にどれだけ関与するかには驚きました。

Webデザインについて読んだ特に良い本があり、それは開発者向けです。

開発者向けのWebデザイン：http : //pragprog.com/book/bhgwad/web-design-for-developers

インターフェイスを作成するときのすべての段階に触れる、読みやすい本です。プレーンなスケッチやプロトタイプのUIからHTML + CSSを使用したデザインの作成まで。

さらに、あなたのUIのスキルを向上させるために、私はまた、ライアン・シンガーでPeepCodeの最新スクリーンキャストをお勧めします。 http://peepcode.com/products/ryan-singer-ux

UX / UI /グラフィックス/タイポグラフィのいくつかの基本を理解することは確かに貴重な努力だと思います。もちろん、常に専門家の「バランスのとれた」チームを持つことはできません。多くの場合、人々は複数の帽子を着用する必要があります。優れた開発者は、自分のドメイン外のことについて時間を費やすことに価値を見出し、少なくともデザインの優れた仕事を認識できるはずです。

しかし、デザイナーが何をするかについては、何か言わなければならないことがあります。開発者は、設計の領域でのみ多くのことを行うことができます（確かに他のものよりもいくらか多く）。特に、狭いニッチを超えて手を差し伸べる大規模な公共向けプロジェクトは、実際の設計専門家を雇用することで大きなメリットがあります。そして、私は単にCSSとHTMLカラーコードを振り回すことができる人々を意味しません。YEARSをタイポグラフィなどの研究に費やし、ジョセフ・アルバーの色に関する本を読んで理解した人々は、新聞用紙に崩れかけた木炭で美しいスケッチを作成できます。これらは貴重なスキルであり、それを認識し、これらのスキルを集中的に使用できるプロジェクトは、競争に対して決定的な優位性を持っています。

そうは言っても、デザイナーと開発者がスキルをオーバーラップできる領域がいくつかあります。特にUXとそのサブドメインであるUI。私はお勧め ...

• 相互作用の設計
• インターフェイスの設計
• 相互作用の設計

プロを雇います。

真剣に、開発者からのUIはひどい評判を持っています。これは、開発者が設計時に平均以下であるためではなく、開発者が支援を求める際に平均以下であるためです。

開発者は、やってくるあらゆるデジタルの課題に取り組む傾向があります。

（私は10年間プロの開発者であり、妻は20年間ユーザーインターフェイスデザイナーです）