web-applications - WebアプリケーションとデスクトップアプリケーションのUI構築の違い

Question

WebアプリのUIは、デスクトップアプリのUIとは異なる方法で構築されます。次の分野で、2つのスタイルのアプリケーション間でUIを構築する際の実際の主な違いは何であるかを知りたいと思います。

1.使用する技術

2.使用する技術

3.使用するコントロール

4.画面変更動作

Answer 1

Webデザインで無視できない重要なことの1つは、戻るボタンです。何千人もの人々がそれを無効にするか、回避しようとしました。戻るボタンを回避しようとしないでください！代わりに、戻るボタンをデザインの一部にします。

Answer 2

多くの人が見落としている大きなデザインの違いは、窓自体の構造です。

• デスクトップアプリは、最小の高さと幅の解像度（多くの場合、800 * 600）で構築される傾向があり、スクロールバーは一般に非常に悪い方法であるため、関連するすべての情報をそれよりも小さいサイズに収めようと努めます。非表形式/リストデータ。より多くのスペースが必要な場合、情報は通常、新しいウィンドウまたはサブウィンドウのペイン/タブに分割されます。
• 一方、Webアプリは、ほとんどの人がWebブラウザーでスクロールすることに慣れているため、基本的に垂直方向の高さが無限になります。スクロールバーはもはや悪いことではありません。実際、メインのスクロールバーを使用できる場所でスクロールバーを使用することは、通常、悪い形式と見なされます（もちろん、いくつかの例外はあります）。情報は通常、1つの「ウィンドウ」に表示されます。これは、情報を分割すると、個別のページの読み込みと、同じデータ（スタイル、メニューなど）の再読み込みの両方が必要になるためです。はい、キャッシュはありますが、単一のデータを読み込まないほど高速ではありません。ページ）。より多くの負荷は常に遅くなり、不連続感を引き起こします。避けられない場合もありますが、アプリをブラウザウィンドウの表示サイズのみに制限することはほとんどありません。
• 人々がウェブブラウザを使用する目的の多くは読書です。ニュース、ブログ、YouTubeのコメントなど。ウェブアプリを作成するときは、この習慣を反映する必要があります。そうしないと、ウェブページとアプリを切り替えると、人々の頭脳が大きく異なるレイアウトになってしまうからです。いくつかの意志）。ビッグプレーヤーをコピーしているように見えるかもしれませんが、一貫性はすぐに思われるよりもはるかに重要です。
• 行が広くなるほど、読み続けるために次の行にジャンプするのが難しくなるため、テキストの列を極端に広くするべきではありません。本が持っているものに似たものに固執します。それらは何世紀にもわたって洗練されてきました。これは、多くのWebページが固定幅であり、行よりも列を優先する理由の一部です。
• 空白は重要です。情報を分離し、処理を容易にします。スペース、新しい行、または箇条書きなしでこの返信を読むことを想像してみてください。

私のペットピーブは、頻繁なアクションを実行するテキストリンクです。実際に別のページに「リンク」している場合を除いて、リンクのように見せないでください。それをコントロール、または画像、または何かにします。リンクはウェブサイトを移動するためのもので、ボタンは何かをします。ほとんどの人は、「フォームの送信」ボタンなどに慣れているため、何かをしたいときに青い下線付きのテキストを積極的に無視します。また、リンクは非常に小さく、繰り返しアクションを実行するためにクリックするのは比較的困難です。また、広範囲に使用すると、不完全なデザイン/コーディングが発生します。

私が見た多くのWebアプリは、一般的に失敗しましたが、ブラウザーウィンドウでデスクトップアプリを複製しようとします...これは、四角い穴に丸いペグをはめ込んでいます。それは可能ですが、それらは同じものではなく、ほとんどの状況下でそのように扱われるべきではありません。
部分的な例外は、Webアプリがデスクトップアプリ（つまり、Googleドキュメント）の機能を複製する場合です。その場合、レイアウトはほとんどの状況でアプリよりもWebページを反映する必要がありますが、コントロールはおそらくデスクトップアプリケーションを模倣して、ユーザーの移行を支援する必要があります。

ほとんどの人は、デスクトップ上のプログラムを使用して何かをします。ほとんどの人はブラウザを使って何かを見ています（読む、見るなど）。もちろん、クロスオーバーはありますが、ほとんどの人の日常の習慣について考え、他の人があなたがデザインしたものを使用することを忘れないでください。そこにいるのはあなた（そしてあなたのクローン）だけではありません。

そして、それは他の人を繰り返していますが、戻るボタンは重要です。あなたがそれを壊すと、ユーザーはあなたを壊したくなるでしょう。右クリックメニューや動作をオーバーライドすることも通常は悪い考えであり、ほとんどの場合ユーザーを苛立たせます（そして、ユーザーを非常に苛立たせるため、これを行うjavascriptを積極的に阻止する人もいます（私自身も含む））。

Answer 3

最大の違いはIMOです。これは、Webアプリでは、マウスの動作への影響が非常に限られており、確立されたデスクトップの動作に反するものです。例えば：

• デスクトップアプリでは、マウスの右ボタンをクリックすると、ほぼすべての場合、コンテキストメニューがポップアップ表示されます。Webアプリでも、これはブラウザのコンテキストメニューであり、変更することはできません（変更しないでください）。
• デスクトップアプリでは、シングルクリックで何かが選択され、ダブルクリックで何かが実行されます。Webアプリでは、シングルクリックはすでにリンクを「実行」しており、ダブルクリックは存在しません。

Answer 4

デスクトップ アプリは、「このイベントでこのコード ブロックを実行する」パターンを使用して作成される傾向があります。Web アプリは、「サーバーがページ全体をフォーマットし、ユーザーがフォームに入力してボタンを押し、サーバーがフォーム全体を処理し、サーバーが別のページ全体をフォーマットする」というよりブロック モードです。

ブラウザはバックグラウンドで一部のデータを要求し、ページの一部を更新できるため、AJAX は水をわずかに濁らせます。ただし、基本原則は残ります。

デスクトップ GUI を特定のマウスの動きやクリックなどに応答させる方が簡単です。一方、Web アプリの場合、サーバーとの通信は「get」および「post」リクエストのみであるため、ユーザー インターフェイスは非常に扱いにくいものになります。

Web ベースのアプリはより移植性が高く、クライアントで必要なソフトウェアは互換性のあるブラウザーだけです。これらのシステム管理の利点により、人々はわずかに劣る GUI を我慢します。

Answer 5

主な違いは、ビジュアルはデスクトップ上でビルドするのが非常に高速であり、別のブラウザーでテストする必要がないことです。ソフトウェアのビジュアル部分はコントローラー (モデルを含む) にバインドするだけなので、デスクトップをビルドする魅力を常に見つけました。行っています！

もう1つの違いは、読み込み速度です。表示用の Javascript や CSS を転送する必要はありません...デスクトップ上のソース コードで常に使用できるため、zip などを実行する必要はありません。

もう1つのことは、コンピューターのRAMを使用して難しいことを実行できることです。これにより、サービス側で複数のコンピューターを使用する必要性が減る傾向があります。これらのすべてのコンピューターを使用して大きなプロセスを「ファーム」できるためです（必要な場合）。

一方、展開はより困難ですが (ClickOnce と自動ツールが役立ちます)、Web ほど透過的ではありません。そのため、「ホット フィックス」を行うことができないため、リリースを計画的に行う必要があります。

Answer 6

• Webブラウザではクロスフレーム通信は難しい。たとえば、JavaScript を使用して 1 つの iframe を別の iframe に影響させることができます。主な理由は、読み込み時間が異なる可能性があるため、フレーム A はフレーム B が読み込まれるまでタイマー ループで待機する必要がある場合があるためです。

• Web UI では、メッセージングは​​要求/応答サイクルを考慮する必要があります。「データベースでレコードが変更された場合、ユーザー画面にメッセージをポップアップ表示する」のようなことを行うのは難しいです。また、ボタンを押すと 5 つの異なる iframe を更新する必要がある場合、サーバーに対して 5 つの個別の要求が発生する可能性があります。デスクトップ UI では、そのことを気にする必要はありません。

Answer 7

私が最も違うと思ったのは、データバインディングです。概念は同じですが、Web アプリでは、他のイベント クリックに基づいてデータを更新するために、上記のコントロールを再バインドするかどうかについて常に心配しています。デスクトップ アプリの良い点は、他のイベントをクリックしたり、他のタブに移動したりしても、コントロール内のデータが無効にならないため、それほど問題にならないことです。