-サーバ連携方法、オープンソースの使い方など様々なCurlの実際のソースコードの記述方法が集約されています。2011その4:Curlの凄いところ!「表現力!アニメーションと2D、3D表現」こんばんは!マーケティングの三野です。かえでちゃん、みたいに面白いことを書きたいところですが(笑)今回も張り切ってCurlについてお話させていただきます!前回まではCurlの伸長圧縮技術「エラスティック」、「セキュリティモデル」について説明させてもらいましたが今回はCurlの凄いところの第三弾として表現力!ユーザーインタフェースのアニメーションと2D、3D表現についてお話させていただきます。1.Curlでアニメーションやフィールを表現するには?Curlでアニメーションを表現するにグラフィックスとタイマーを使って表現します。左から右へ移動するようなものを作る場合は移動開始地点の座標から移動終了地点までの座標を指定するようにします。サイズを変更するようなアニメーションも同じような考え方で実現できますね。サイズを表す高さと幅をタイマーを使って時間軸の変化とともに数値変更してあげればいいわけです。このタイマーを使ったアニメーションはたとえばオープンソースの「AdvancedUI」などに多く使われております。Rotatorなどがその応用です。画面移動(画面遷移などともいいますが)などにもこのアニメーションは有効です。EXT)」のTransitionframeではいろいろな画面切り替えを実現していますが、その中でアニメーションがやはり使用されています。http://curlap.com/products/library/ux/ext/2.ユーザーの操作にあわせてインタラクティブな表現をするには?先ほどのタイマーと組み合わせて、ユーザーの操作(ポインタ操作など)と組み合わせるとさらにインタラクティブになります。ユーザーが操作するキーボードやポインタの位置によって、画像やコンテンツのサイズや位置、色などを変更する方法です。FishEyeがその一例ですね。技術的な話になりますが、CurlにはWeb開発者にはなじみのない「イベント」というものがあり、種類も豊富にあります。・PointerPress・PointerEnter・PointerLeave・DragOverなどなどまだまだあります。ここではあまりコードの書き方などについてはお話しませんが、ポイントとしてはタイマーとイベントを使うということです。実装方法について興味があるかたはDeveloperCenterやヘルプを見てくださいね。3.さらにダイナミックに!Curlの3D表現CurlはFlashPlayerのように「アニメーションで3Dを表現する」のではなく、「本物の3Dアプリケーション」が実は作れてしまいます。ここでいう「アニメーションで3D表現」というのはいわば「パラパラ漫画で3Dの様に見せる(見せてるだけ)」ということです。Curlだと「本物の3D」で表現されるので、もちろんユーザーは3D空間のものをさわることもできますし、またアニメーションと組み合わせることも可能です。3Dを使用したエンタープライズシステムは実際のところあまり多くはありませんが、多い例はグラフなどでしょうか?たとえばCurlでは画面遷移などでも使えるものを先ほどご紹介したCurlEXTのTransitionframeで提供しています。デモアプリケーションとしては地球儀をアプリケーション上に見せて、世界の支社の営業データを表示させるなどのアイデアもあるかと思います。前回のエラスティックのところで紹介したアプリケーションなんかがその1例です。Gallary」が大きな事例ですね。SketchUpで作成された3DモデルをCurl上にロードし、その中をウォークスルーしたり、自分の好きな画像やCurlアプリケーション等を壁に貼り付けることができ、3D空間のギャラリーとして利用することができるようになってます。このアプリはCurlAppsGallaryからダウンロードして試すことができますので、是非ダウンロードして見てみてください。<Curlアプリケーションギャラリー>http://developers.curlap.com/gallery/apps/96あとはどのように表現するかは「あなた次第!」ではまた。