手工芸デザインからグラフィックデザイン、そしてウェブデザインまで、デザインの原則は同じままですが、私の経験から、デザインメディアの変化はメディア自体の多くの特別な機能をもたらすことがわかります。他の人の経験と私自身の経験に基づいた、ウェブサイトのビジュアルデザインの重要なポイントは次のとおりです。 1 —ロゴ:基本的なロゴ機能、ロゴデザインの基本に沿った(グラフィックデザインに共通)表示効果:鮮明さ、最小サイズ(ディスプレイ解像度による、オフライングラフィックデザインの印刷効果に相当) 2 —テキスト:コンテンツレベルによってフォント、サイズ、太さが決まり、ステータスによって色が決まります (デフォルトまたはウェブサイトに応じて統一) 3 —広告とコンテンツの画像:サイズとスタイルの配置、同一ページ内での調和、画像の最適化、位置のリズム、サイズの比較。 4 —アイコン:ブランド、正確で合理的な表現、デザイン手法 (ブランドに基づく)、一貫性、機能: 魅力的で目を引く、識別しやすく、理解しやすく、操作しやすく、覚えやすい。 5 —クリック可能(ボタン):違い(クリック不可)、人々の生活経験に基づく:太さ、クリック可能、質感(物理的な関連性)、色(ブランド、統一性、コントラスト)、均一なスタイルのサイズ(テキストの均一な内側の余白に基づく) 6 —背景画像:雰囲気作り、製品との一貫性、最適化(品質、サイズ、色情報、実装計画)、 7 —グラフィックとテキストのレイアウト:メイン画像とセカンダリテキスト、グラフィックとテキストのリズム、ギャップ、モジュール化。 8 —現在のステータス:拡大 (形状)、色の変更 (反転、コントラスト、明るさ、純度)、リンクインおよびリンクアウト後のコンテンツプロンプトの指定。 9 —インタラクティブなコントロール:合理的かつ正確なスタイル (システムと日常生活に対する人々のデフォルトの認識)、状態 (視覚表現スタイルとアクション プロセスの最適化)、創造性。 10 —読み込み:コンテンツの関連性(読み込み前後のコンテンツの関連性)、退屈な待ち時間の楽しさ、ボリュームとエリアの最適化、創造性。 11 —ユーザーフィードバック_成功、エラー、プロンプト、結果なし:コピーライティング (明確、合理的、人間的、創造的)、グラフィック (明確、目を引く、色の心理的認知精度)。 12 —アニメーション効果:合理的なプロセス(実際の環境をシミュレートする合理化)、継続性、リズム感、ユーザーの日常的な行動のパフォーマンス、効果音の調整、創造性。 13 —始まりと終わりのデザイン:始まり(ブランドの宣伝、独自の特徴、明確な内容、雰囲気の表現、創造性)。終わり:エコー、リズム(始まりとともに)、創造性。 14 —適応型画面設計(フルスクリーン設計):最大画面と最小画面の考慮(テキストと画像の位置、改行効果) 15 —固定サイズのグリッド設計:合理的なセル (黄金比を考慮)、セル領域のリズム、均一な余白 16 —デモ設計案:コンテンツについて最も考慮する点と最も考慮しない点。 17 — ページ:ブランド、主要要素の一貫性、再利用性、リズムと領域の感覚、視覚的な魅力、ブラウジングのガイド、点、線、面の関係、スケッチの原則 (スケッチの基本ルールを使用してページを作成する)。 18 — 読書:読書(視覚)における背景の快適さ、コンテンツと背景のコントラストの快適さ。 実際、インタラクション設計やコード設計など、他にも多くの設計ポイントがあります。これらをユーザーに提示できます。まとめると、これらはユーザー エクスペリエンス設計の大きなプロセスを構成します。作業中はすべてのポイントを見積もることができないことが多いため、いつでも確認できるように要約します。 |
<<: vsFTP 3.0.3 のコンパイルとインストールの詳細な分析
>>: MySQLデータベースの数千万件のデータクエリとストレージの詳細な説明
JavaScript では、警告ボックス、確認ボックス、プロンプト ボックスの 3 種類のメッセージ...
Nginx を Web サーバーとして使用する際に、次の問題が発生しました。 1. nginxの起動...
この記事では、積み上げ棒グラフを実装するためのVue+echartsの具体的なコードを参考までに紹介...
目次必要データを取得して送信するテンプレートフィルターフィルターの使用シナリオ要約する必要Vue を...
<br />ナビゲーションについて話すときは、ほとんどの場合、ナビゲーションがコンテンツ...
1. 文書化ルール1. 大文字と小文字が区別されます。 2. 属性値は引用符(一重引用符または二重引...
この記事では、例を使用して、MySQL のさまざまな一般的な結合テーブルクエリについて説明します。ご...
IEでのRGBAとフィルター値の変換RGBA 透明度値IE フィルター値0.1 19 0.2 33 ...
目次1. 需要2. 実装3. 結果1. 需要入力ボックスにデータを入力し、入力結果に基づいてデータベ...
目次差分アルゴリズムレイヤーごとの比較同じタイプのコンポーネントを比較する同じタイプの要素の比較子ノ...
el-dialogをコンポーネントとしてカプセル化するelement-ui を使用する場合、ポップア...
1. ランナーコンテナを作成する mk@mk-pc:~/Desktop$ docker run -d...
この記事では主に、 list-itemの下にある::master疑似要素、 list-style-i...
最初で最も重要なステップは、Windows 環境に Ngnix サービスをインストールする方法です。...
この記事では、オンラインチャットを実現するためのVue + sshフレームワークの具体的なコードを参...