こちらが彼らのデモへのリンクです。基本的に、これは多くのVisio機能を実装するオンラインツールです。
私は、同様のタイプのユーザーインタラクション、ドロップ、移動、編集、オブジェクトのサイズ変更、グリッドやガイドとのインタラクションなどを必要とするアプリを構築しています。
このプロジェクトは私自身の学習目的であるため、このような高品質のインターフェースを開発できるようにするために、私が焦点を当てたり、学んだりする必要があることのいくつかを考えていました。
乾杯
こちらが彼らのデモへのリンクです。基本的に、これは多くのVisio機能を実装するオンラインツールです。
私は、同様のタイプのユーザーインタラクション、ドロップ、移動、編集、オブジェクトのサイズ変更、グリッドやガイドとのインタラクションなどを必要とするアプリを構築しています。
このプロジェクトは私自身の学習目的であるため、このような高品質のインターフェースを開発できるようにするために、私が焦点を当てたり、学んだりする必要があることのいくつかを考えていました。
乾杯
このようなリッチなユーザー インターフェイスを構築することは、大きな作業です。そのため、次のような豊富なユーザー インターフェイスを既に開発しているフレームワークやライブラリが多数存在します。
Sproutcore と Cappuccino は、Web 用のデスクトップ スタイル アプリケーションを開発するためのもので、非常に優れたユーザー インターフェイス コンポーネントが含まれています。アプリケーションの状態とデータモデルを維持するだけでなく。ExtJS には、Dojo と同様に、これらの多くの機能と非常に優れた UI ツールキットがあります。
Lucidchart は Canvas 描画 API も使用していることに気付いたので、形状の操作と柔軟な接続の作成について調べる必要があります。Mozilla Developer Center には、キャンバス API に関する優れた機能がいくつかあります。
まず、ラファエル ライブラリを調べます。
非常に単純な Javascript コードを記述して、ブラウザでグラフィック要素を描画できます。これには、非常に単純なアニメーションや、ドラッグ可能/クリック可能なインターフェイスが含まれます。
正直なところ、リンク先のサイトのように複雑なものをすばやく簡単に作成することはできませんが、Raphael は基本から始めるための最も簡単な方法です。
そして何よりも、Raphael は古いバージョンの IE と互換性があるため、最新のブラウザーのみをサポートできることを心配する必要はありません (もちろん、他の新機能を必要とする他のことをしたい場合もあります)。 .
それが役立つことを願っています。