2011-09-19 7 views
6

Here's a link to their demo基本的に、これは多くのVisio機能を実装するオンラインツールです。LucidChartに似たインタフェースを構築するためには、何を学ぶ必要がありますか

プロジェクトは、私自身の学習を目的としておりますので、私はなど、

を、ユーザインタラクションの同様のタイプを必要とするアプリケーションを構築落下、移動、編集、オブジェクトのサイズ変更、グリッドとガイドとの対話です、私は私に焦点を当てるか、そのようなリッチなユーザーインターフェイスを構築するには、このような高品質のインターフェース

乾杯

答えて

2

を開発することができることを学ぶ必要があるもののいくつかは、大きな課題であるが何であるか疑問に思いました。

  • 道場
  • のjQuery UI
    • Sproutcore
    • カプチーノ
    • のExtJS:すでにのようなリッチなユーザーインターフェースのものを開発したフレームワークやライブラリがたくさんある理由です

      SproutcoreとCappuccinoはウェブ用のデスクトップスタイルのアプリケーションを開発するためのもので、 erインタフェースコンポーネント。アプリケーション状態とデータモデルのメンテナンスだけでなく、 ExtJSには、Dojoと同様に、多くの機能と非常に優れたUIツールキットがあります。

      Lucidchart私は、キャンバス描画APIも使用しているため、シェイプ操作や柔軟な接続のために調べる必要があります。 Mozilla Developer Centerには、キャンバスAPIに良いものがいくつかあります。

    1

    私はRaphael libraryを見て始めます。

    かなり簡単なアニメーションやドラッグ可能な/クリック可能なインターフェイスなど、ブラウザにグラフィック要素を描画するためのかなりシンプルなJavaScriptコードを書くことができます。

    すべての正直なところ、リンク先のサイトと同じように複雑なものをすばやく簡単に作成することはできませんが、ラファエロは基本を開始する最も簡単な方法です。

    さらに、RaphaelはIEの古いバージョンと互換性があるので、最新のブラウザのみをサポートできることを心配する必要はありません(もちろん、必要な他のものその他の新機能)。

    希望に役立ちます。

    6

    draw.ioは、非常によく似たツールですが、ソースはgithubです。