web-dev-qa-db-ja.com

WebデザインとGUIデザインでデザインプロセスが大きく異なるのはなぜですか?

私はいくつかのニッチでアプリケーションを開発する機会がありました:
サーバーバックエンド、デスクトップクライアント、そして最近では小規模なWebサイト。

ウェブサイトのデザインに夢中になったら、私は自分自身とあなたに尋ねています
UIデザインプロセスがどうしてそんなに違うのですか?違いと、それらがなぜ発生したのかを指摘できますか?

かつて、HTMLはテキストをマークアップするためのものであり、デスクトップGUIは実際の仕事を行うためのフロントエンドでしたが、今日、GUI開発プロセスがまだそれほど異なっているのはなぜですか?

まずは次のとおりです。

デスクトップ:明示的なレイアウトの使用。 (例:WPFのStackPanel、SwingのBorderLayout)
Web:レイアウトはCSSプロパティのセットです(例:高さ/幅、マージン/パディング、フロート、表示..)要素のような各コンテナに与えられます。

デスクトップ:GUIコンポーネントの分離からOOクラス、簡単に再利用できます。
Web:コンポーネントはhtmlレベルでは再利用されません、動的なサーバー側のhtml生成で再利用される可能性があります。再利用できるのはCSSスタイルのみです。

もう少し名前を付けていただけますか?なぜ?なぜそれらは似ていないのですか?

補足:GWTの使用経験はありますが、ブラウザーで実行されるクライアントアプリケーションを作成しますが、デスクトップUIの設計方法とツールを使用してWebページ(ブログページなど)を作成できないのはなぜですか?

6
Paul

現在統一されているさまざまな歴史的背景

その理由は歴史的背景にあると言わざるを得ません。 Webページは、最初はフォーム付きの単純なテキストドキュメントでした。その後、スクリプト(JavaScript)と、セマンティクス(HTML)とデザイン(CSS)の分離により、ますます多くの機能が追加されました。

GUIアプリケーションは、情報のあるページとは対照的に、常に「機能」を最優先するアプリケーションでした。その後、GUIプログラムは、使いやすさを向上させるために色とより多くのデザイン要素を取得し、現在はWebアプリケーションを使用しています。

WebデザインとGUIアプリケーションには異なる長所があり、現在はWebアプリケーションに統合されています。

ウェブデザイン:

  1. 情報のあるページ(プログラム機能の欠如)
  2. スクリプトの追加とセマンティック要素(HTML)とデザイン(CSS)の分離
  3. Webアプリケーション(より多くのフォーム要素、キャンバス要素、およびWebソケットを備えたHTML5)(情報を含むページと並べて)

GUIデザイン:

  1. 黒と白のアプリケーション
  2. 色やその他のデザイン要素が追加されました
  3. ネットワーク化された世界でより簡単に展開(インストールなし)できるWebアプリケーション(HTML5)。

今日のユーザーインターフェイスフレームワーク

現在、WPF、Android、JavaFXでは、XMLドキュメントを含むHTMLファイルと同様にレイアウトが行われます。 CSSまたは同様のテーマファイルをスタイリングに使用できます。 Click-OnceおよびJava Webstartをデプロイに使用できます。

同時に、Webアプリケーションは 控えめなJavaScript を使用して、HTMLドキュメントをプログラミングコードからクリーンに保ちます。また、GUIの世界でしか利用できなかったその他の機能が、HTML5を使用してWebに導入されています。

そのため、設計プロセスはかつては非常に異なっていましたが、現在はますます類似しています。 Microsoftは、ASP.NETを使用して、GUIアプリケーションがこれまで行われてきたのと同じ方法でWebサイトを作成しようとしました。そして、WPFとSilverlightを使用して、WebアプリケーションとGUIアプリケーションを同じ方法で実行し、設計プロセスで両方に同じプログラム(Expression Blend)を使用することを再試行しました。 -)。

Adobe Air、AdobeFlexも同じ設計プロセスを試みました。そして今、スマートフォン用のいくつかのフレームワークは、Webアプリケーションが実行されるのと同じ方法でスマートフォンアプリを実行しようとします。TitaniumとPhoneGapを参照してください。

結局、Webアプリケーションが勝つと思う理由は、ほとんどすべての興味深いアプリケーションがネットワークアプリケーション(クライアントサーバー)とモバイルコードは、ネットワークアプリケーションを実行および展開する最も簡単な方法であり、同時にクロスプラットフォーム

6
Jonas

HTMLは、ドキュメントを表示する方法として始まりました。初期のウェブは、大量の参照(ハイパーリンク)を備えた大きなファイリングキャビネットに他なりませんでした。徐々に構造化されたデータと双方向性が追加されましたが、コア哲学はドキュメントの哲学のままです。フォルダー内のドキュメントまたはドキュメントのリストを取得し、POST変更し、不要な場合は削除し、新しいドキュメントをフォルダーに配置します。これがRESTful APIとは:ドキュメントISアプリ。モデルは、データをドキュメントにカプセル化するモデルの1つです。

対照的に、デスクトッププラットフォームには、アプリケーション中心の哲学があります。中心となるのはドキュメントではなく、動作です。アプリはドキュメントを取得して処理し、プッシュバックします。アプリはドキュメントではありません。焦点は、ドキュメントを操作する動作にあります。 OSベンダーは、標準化されたウィジェットからアプリを構築することを推奨するAPIを提供しました。モデルはアプリとウィジェットに関するものであるため、哲学は行動のカプセル化の1つになりました。

この時点での哲学の違いは、慣性によって定着した歴史の産物です。どちらの哲学も一般的に正しいわけではなく、真実はどこかにあります。 Webにはまだデスクトップアプリから学ぶことがたくさんあると思います。逆もまた同様です。 Webアプリの双方向性は依然としてお粗末ですが、デスクトップアプリではドキュメントを最初に考えることはできません。

2
Joeri Sebrechts