見栄えの良いウェブサイトを設計する方法をどうやって学ぶことができますか? [閉まっている

softwareengineering.stackexchange https://softwareengineering.stackexchange.com/questions/558

  •  16-10-2019
  •  | 
  •  

質問

私は適度に有能なWeb開発者です。必要に応じて、行ってほしい場所に物を置いて、そこにjqueryのものを入れます。しかし、私が自分のウェブサイトを作っている場合(私は始めています)、それを設計する方法がわかりません。誰かが私の隣に座って画面にポイントを入れて、「この写真をそこに置いて、そこにテキスト」と言うなら、私はそれを非常に簡単に行うことができます。しかし、私の色とテキストの選択で自分のサイトを設計することは、幼児がそれを発明したように見えます。

私が見ることができるウェブサイトや本を知っている人はいますか、それとも誰もが非todlerのウェブデザインの基本に関するヒントを持っていますか?

役に立ちましたか?

解決

やることがいくつかあります。

チップ:

Photoshopの使用を学びます。 (特に、レイヤースタイルは優れています。CSS2で再実装するのが難しい効果になる可能性があることに注意してください)良いモックアップを作るのに大いに役立ちます。

専門的に設計されたサイトを見てください。あなたはあなたに見栄えが良い場所に行ったことがありますか?

気になるサイトを見つけて、それを改善できるものを検討してください。製品広告も見てください。食品包装。新聞広告。あなたはそれに名前を付けます。

また、それのハングを始めたら、練習し、練習し、練習します。グラフィックスは、特に考慮すべきコーディングを持っているプログラマーから、スキルとして開発するのに時間がかかります。 (グラデーションvs「ティレアビリティ」)

ツール:

(Photoshopは個人的なお気に入りです。 paint.net 優れたWindowsの代替品ですが、それほど強力ではありません。)

ネイサン・スミス 960グリッドシステム. 。主流のグラフィックプログラムの多くのテンプレートがあります。見てみな。

参考文献:

これらのサイトのいくつかを見てください:(もっと見たことがあります、私はそれらに出くわすときに追加しようとします)

他のヒント

実用的な側面

デザインには、学ぶことが重要ないくつかの実用的な段階的な側面が間違いなくあります。すべてが主観的ではありません。

•Webデザインのチュートリアル: http://webdesign.tutsplus.com/

•Photoshopチュートリアル: http://psd.tutsplus.com/

•たくさんのチュートリアル: リンダ

インスピレーション

• Webサイト: 比類のないスタイル

• Webサイト: Abduzeedo

• 本: オンライン成功のためのガイドライン

• Webサイト: スマッシングマガジン

デザインスキル

一般的なデザイン

• 本: グラフィックデザイン:新しい基本

• 本: グラフィックデザイン、参照

•PDF: ビッグ4:コントラスト、繰り返し、アライメント、近接性

タイポグラフィ

• 本: タイプで考える

• 本: タイポグラフィスタイルの要素

• 記事: http://en.wikipedia.org/wiki/typography

• 記事: http://www.informationarchitects.jp/en/the-web-is-all-about-typography-period/

レイアウト

• 本: レイアウトワークブック

• 本: カラーデザインワークブック

• 本: カラーハーモニーワークブック

デザインの哲学

「最も愚かな間違いは、デザインをプロセスの最後に、「初日」の問題であり、すべての一部であることを理解するのではなく、混乱を「整理」するためにあなたがすることを見ることです。」 -Tom Peters

 

「優れたデザインは、ユーザーを幸せに保ち、メーカーは黒人であり、審美は非難されていません。」 -Raymond Loewy

 

「本当にエレガントなデザインには、一流の機能がシンプルで整理された形に組み込まれています。」 - デイヴィッド・ルイス

「良いデザインは良いビジネスです。」 -Thomas J. Watson Jr.

その他の引用

これは少し話題から外れているかもしれませんが、ジェフ・アトウッドが本を強く勧めていることを覚えています 考えさせないでください. 。最高のユーザーエクスペリエンスのためにウェブサイトを設計する方法について説明します。

Ogilvy on Advertising:この本は、グラフィックデザインの基本と、あらゆる種類のフライヤー、広告などを作る際の多くの常識をカバーしています。

より一般的には、グラフィックデザイン、ファインアート、インテリア装飾、映画製作に関する本や雑誌を閲覧します。視覚的に魅力的なものを作り、情報やその他のコンテンツを魅力的にするための一般的なデザインの原則がたくさんあります。電磁気がエレクトロニクス、惑星科学、化学、核、および物理学および工学のその他の分野に共通するようなものです。

このスペースのもう一つの良い本はそうでしょう 毎日のもののデザイン。 それは、人々が自然に新しいものにどのようにアプローチするかを利用することで、簡単な使用に役立つデザインを好むなどの多くの実用的なアイデアをカバーしています。この本は特にUIやWebデザインに関するものではありませんが、それを少しカバーしています。

本の初期の例はドアです。彼は、片側にノブまたはハンドルを備えたドアと目に見えるヒンジがどのように直感的であるかについて話しています。隠されたヒンジ、ドア全体にバーを押したバー、または中央のノブを備えた派手なドアは難しく、操作ではないため、瞬間の実験が必要です。

私がデザインで非常に貴重であると思うツールの1つはです 配色デザイナー. 。私は通常、デザインの基礎となりたい色を選び、「アナロジー」スキームを使用して、マッチング色の素敵なセットを取得します。私にとって、色を正しくすることは最悪の部分です。その後、残りは素敵なレイアウトを取得し、色の限られたパレットを適用しています。

ライセンス: CC-BY-SA帰属
所属していません softwareengineering.stackexchange
scroll top