UMapとGoogle Map API for Flashを使ってみようと思い、チョコチョコやってます。

FLASH Lab JUICE

ActionScript3.0ベースのFlashコンテンツ、マテリアル、ブログパーツ等を作ります。

『FLASH LAB JUICE』のFlashコンテンツのご紹介!

ブログに画像をアップロードするだけで、ブログがオンラインカタログに、変身!『blogショーケース』

google AJAX Feed APIを使った、Flash RSSリーダーのサンプル!『googleFeed@仮』

画像から、ブログに紐ついたデータを登録表示する、Flash ブックマーク!『p!Cloud』

『p!Cloud』(↑)で、登録したデータを、変更する、データ変更ツール!『p!Cloud@Config』

『p!Cloud@Config』(↑)で、作成したデータを、表示するサンプル!『blogNavi』

お勧め!!ココログ専用ブログパーツ『feedPic』

様々使える、データ作成ツール
『p!Cloud』(ピークラウド)は、画像に紐ついたタグ等のデータを作成するツールですが、ブックマーク等としても利用出来ます。
『p!Cloud』の使い方の一つは、ブログにアップロードした画像を、フレキシブルにタグ付けして、その画像の記事にナビゲートするコンテンツのデータ作成です。
表示ナビゲートするFlashコンテンツ(blogNavi)などをアップロードしてあれば、作成したXMLデータを上書きアップロードするだけで、最新の表示にする事が出来ます。
『p!Cloud』で登録したデータは、登録順になってるので、現在(08/05/12)での『blogNavi』のように、コンテンツにソート機能(並べ替え)が付いてない場合は、データを並べ替えたりする必要があります。
それが、『p!Cloud@Config』です。『p!Cloud』と合体させる事も可能ですが、取り合えずは、別々になってます。
『p!Cloud』でデータの登録・削除・編集、『p!Cloud@Config』では、タグデータの変更・データの並べ替え、とう言う形になってます。

テーマ : Flash - ジャンル : コンピュータ

簡易ビューアー通信機能設置テスト
複数の窓で開くと、最初にコネクションを確立したビューアーに接続されます。『blogNavi』を画像表示モードにして画像をクリックしてみて下さい。
強制的にフルスクリーンにしようと思ったけど、ちょっと出来なかったです。
なので、簡単だと思ってたのに・・・・忘れてた事が、ありました。ActionScript3.0のXMLで、要注意なアイツです。

テーマ : Flash - ジャンル : コンピュータ

画像を、既に『p!Cloud』に登録してる場合に有効です
チョコチョコ修正中の『p!Cloud』ですが、実は、画像検索のような機能も付いています。
たとえば、サンプルで、コチラの記事の画像に、サウンドというタグを付けたい場合は、『情報変更モード』にして、一覧から探しても良いのですが、次のようにも出来ます。
p!Cloudを開きます
p!Cloudを開きます
ブラウザで、ブログの記事を開いて、画像のURLをコピーしてます。
p!Cloudを開きます
コピーしたURLを、追加する画像のURLの欄にペーストし、画像を読み込み、その画像で良いか、確認します。そして、『この画像を追加』のボタンをクリックします。
p!Cloudを開きます
すると、既に登録してあるので、上の様な、アラートが出ます。『画像表示』のボタンをクリックすると、下の様に画面が白く変わり、その画像の情報変更画面が表示されます。
p!Cloudを開きます
コレで、後は、既存のタグから、『サウンド』とうタグを追加すれば、オッケーです。

テーマ : Flash - ジャンル : コンピュータ

二重使用禁止とは?
『p!Cloud』では、情報データを外部に送信して保存するのではなく、あなたのパソコンに直接保存してます。
この方法では、そのデータに複数のコンテンツでアクセスしてると、意図した通りにデータが保存されない可能性があります。
その為、『p!Cloud』関連のコンテンツでは、重複使用が出来ないようになってます。

テーマ : Flash - ジャンル : コンピュータ

動画ファイルの記事にナビゲート
『p!Cloud』に画像を追加するには、最初に『情報変更モード』にすると、便利です。『情報変更モード』にする事により、追加された画像をクリックするだけで情報変更の画面を表示する事が出来ます。
『p!Cloud』で作成したデータを利用した『BlogNavi』を以前、紹介しましたが、たとえば、『p!Cloud』で、動画の記事に動画のキャプチャ画像を貼り付けて、その画像を登録します。
登録する時に、『ムービー』というタグを付ければ、『ムービー』というタグで、動画の記事の一覧に、ナビゲートする事が出来ます。
レシピ集にリンク集、ウェブ図鑑だって作れちゃう!
例えば、ブログ友達のプロフィール画像を、『お友達のブログ』とかのタグ、ブログ友達のブログのURLで登録すれば、画像付きのリンク集が出来上がります。
他に、例えば『p!Cloud』で、料理レシピサイトの料理の画像と、そのレシピのページ、簡単な材料・説明(例えば、『材料:豚肉 材料:タケノコ 味:醤油味 星☆☆☆』)などとタグを付けてみて下さい。
結構使えるレシピ集が出来るはずです。他にも、簡単に撮った写真を、図鑑風にしたりも出来たり、使い方は、色々です。
ただし、コンテンツとして、ウェブで公開する時は、リンクの許可を受ける必要があります。ルールは、守って使ってね@まだ未配布だけど・・・。
既存のタグの追加の仕方
少し脱線したけど、情報の追加は、以下の方法で。タグは、一度追加したタグなら、『既存のタグを追加』をクリックすると既存のタグのリストが表示されます。
左のリストをクリックすると、右のリストに追加され、右のリストをクリックすると、削除されます。
最後に『上記のタグを追加』をクリックすると、タグが追加されます。あ、外部から呼び出しが禁止されてる画像は追加出来ません。
以下の流れで追加してね@Firfox 3Beta
p!Cloudを開きます
最初に情報変更モードにすると便利です。
p!Cloudを開きます
ブラウザで、ブログに記事を開いて、追加する画像のURLをコピー
p!Cloudを開きます
このブログでは、大きい画像は、使ってないので、追加画像とリンクにURLをペーストして、画像を読み込み確認。
p!Cloudを開きます
ブログのURLをコピーして、ブログのURLの欄にペースト。不安だったら、確認ボタンで、そのURLが開きます。
p!Cloudを開きます
p!Cloudを開きます
タグ設定をします。複数のタグを設定するには、スペースを空けて複数入力です。既存のタグの追加は、上の簡単な説明を参照。
p!Cloudを開きます
日付を設定します。初期設定は、現在の時間です。日付を正しく設定する事により、並べ変えたり、後で時間軸での表示が可能になります。
p!Cloudを開きます
『この画像を追加』ボタンをクリックすれば完了です。
p!Cloudを開きます
『情報変更モード』にしてあるので、変更したい場合は、登録された画像をクリックするだけです。変更画面が表示されます。

テーマ : Flash - ジャンル : コンピュータ

この記事は、旧BC JUICEからの移植です@08/05/04
昨日アップロードした、『ブログナビゲーター@p!Cloud』では、右上のタグ選択プルダウン(コンボボックス)でタグを選択して、右下の『Naviボタン』で、移動して画像を確認できます。
『Naviボタン』では、末尾までいったら先頭に、先頭に戻ったら末尾に移動する『ループ』を使用する事も出来るようにしてあるのですが、今回は、『ループ』は、オフにしてあります。
で、昨日アップロードした物では、ちょとした不具合がありました。「ページ数と滞在ページが同じ場合に〜ホニャララ」としてたけど、「ページ数が1の場合〜ホニャララ」でO.K.でした@メモ。
080503picNatu.gif
080503picNatu.gif
まず、進むボタン『 》』と戻るボタン『《 』をクリックすると、ページを進んだり戻ったりします。コレは、説明しなくても気が付きますよね。
080503picNatu.gif
で、ページ数表示のボタンをクリックしてアクティブにすると、キーボードの『→』『←』で、進んだり、戻ったり出来ます。@簡単な説明でした。

テーマ : Flash - ジャンル : コンピュータ

この記事は、旧BC JUICEからの移植です@08/05/03
080503picNatu.gif
さて、暫く前に作った『p!CloudのXMLジェネレーター』を使って、イメージからのブログナビゲーターを、作ってみました。
といっても、『p!CloudのXMLジェネレーター』の機能を削除しただけですが・・・・。ま、とりあえず、表示テストです。
でも作成されたXMLは、追加順に並んでたので、時間で並べ替えたいと思ったのですが、ActionScript3.0のXMLクラスには、多分、並べ替えるメソッドが無いような・・・。
で、自分で並べ替えるようなスクリプトを書いたけど、駄目でした。ある程度の数までは、大丈夫なんだけど、500以上と多いからなのか・・・・。sortの仕組みってどうなってるんだろ・・・・。
DataProviderにしてから、sortして、XMLに変換って対処したけど・・・・。あ、少し違う方法思いついた!文章にしてみるってのは、有効だな〜。
それは、さて置き、今回は、登録したタグを、ただコンボボックスで表示してますが、タグクラウドで表示したり、色々してみようかと思います。で、近々、配布とかしてみようと思ってます。
タグの付け方で、色々埋もれてた記事とかにも誘導できたり、ページビューは、多分飛躍的に伸びると思うのですが・・・どうでしょ。詳しくは、後程。

テーマ : Flash - ジャンル : コンピュータ

この記事は、旧BC JUICEからの移植です@08/04/19
さて、コレを何に使うかと言うと、コレで生成した、XMLを読み込んで、色々出来るFlashコンテンツに利用しようって魂胆なんです。
フィードを利用するメリット、デメリット
blogショーケースは、コンテンツ配信のフィードを利用して、コンテンツ部分を解析して、表示してます。
『ブログを更新するだけで、反映される!』というメリットがある反面、無駄なデータが多すぎると言うデメリットがあります。
それに、多くのブログで、フィードを直接読み込めない仕様が、主流となってるので、それなら、普通にXMLを読み込んだ方が、動作も安定すると・・・・・。
タグの管理って難しくないですか?
最近では、どんなブログサービスでも、タグ設定出来るようになったけど、タグクラウドは、下火じゃないのかな〜。
コレは、タグ管理が、難しいのと、ブログの管理画面で、サクサク、タグの変更が出来ないからだと思うのですが・・・・どうでしょ。
後は、記事の内容とタグを、絡ませるのは、かなり難しいけど、画像とタグなら、比較的、簡単なんじゃないのかな〜。
そんな感じで、とりあえず作ってみました。動作確認したら、表示するコンテンツを、作ってみようと思います。
メチャメチャ簡単な説明
最初は、空です。画像が登録されてないとエラーメッセージが出ます。一番最初は、必ずコレがでます。気にせず『O.K.』をクリックして下さい。
p!Cloudを開きます
次に『+』ボタンをクリックすると、画像の追加画面が、表示されます。画像のURLを入力、コピー&ペーストして、読み込む画像を確認して下さい。
後は、必要な項目を入力するだけです。ブログの記事のアドレスを入力すれば、ブログモードで、その記事を表示できます。リンクの項目では、大きい画像や、関連リンク先を入力すると良いでしょう。
で、タグは、スペース区切りで、自由に登録できます。(只今、動作確認中)日時は、追加画面を開いた日時になってます。任意の日時にする事によって、後で色々できます。タイムライン表示とか。
もちろん、タグ意外の要素、商品名、値段、説明など色々な要素を、入力するフィールドを作成し、ソレを表示するコンテンツを作る事が可能です。
ま、お暇な人は、遊んで下さい。あ、XMLの生成ボタンは、表示してないです。こんな事出来ますか?なんてご意見が、ありましたら、お気軽にご相談下さい。
ちょっと試してみました。
『blogショーケースのサンプルブログ』に、アップロードしたのを、登録してみました。・・・・ちょっとバグあるな〜。テキストインプットは、『ENTER』でも動作します。
やっぱり、手動入力は、しんどいです。もちろん、リストの読み込み、自動でサムネールを利用するとか、カスタマイズ出来ます。
p!Cloudを開きます
p!Cloudを開きます
こんな感じになります。タグを下のように、設定すれば、ちょっとした花図鑑って感じです。
p!Cloudを開きます
たとえば、ミスミソウをクリックすれば!下のように、ミスミソウだけ表示されます。タグって便利〜!
p!Cloudを開きます
表示Flashコンテンツに、ショッピング表示機能を付ければ、オンラインカタログとか簡単に出来ます!しかも、既存の紹介記事を利用する事も可能ですよね〜。

テーマ : Flash - ジャンル : コンピュータ