Atelierで“Flash”タグの付いているブログ記事

2014年10月20日

隠居のパソコン備忘録:mp3ファイルをWebページ内で再生する


 以前は、同じページ内で、Yahoo! のMedia Playerを使って、mp3ファイルをコントロールすることができた。
 ところが、最近になって、再生ボタンをクリックすると、QuickTime Player が別ページ(別ウインドウ)に立ち上がり再生が始まるようになった。(Windows Media Playerでも再生できるようにできるんだろうが、設定方法がわからない。)

 なんとか、同一ページ内で MP3ファイルを再生できるようにできないかとネットサーチをしてみると、いくつかの方法がみつかった。いずれもFlash Player を使う。
 その中で、Flash-mp3-player.net が提供している MP3 Player は、いくつかのパターンが用意されており、ページの body 部に下のような数行のコードを挿入することで、実現することができる。
 例えば、ツクツクボウシの鳴き声を録音した MP3 ファイルを配置すると次のようになり、再生ボタンをクリックすると、鳴き声が聞こえるようになる。再生中に表示されているポーズ・ボタンをクリックすると、再生が停止する。

  sample
  ツクツクボウシの鳴き声
sample の Flash MP3 player のコード

<object type="application/x-shockwave-flash" data="http://flash-mp3-player.net/medias/player_mp3_maxi.swf" width="25" height="20">
                    <param name="movie" value="http://flash-mp3-player.net/medias/player_mp3_maxi.swf" />
                    <param name="FlashVars" value="mp3=http%3A//n-shuhei.net/atelier/photo_insects/110923_tukutukuhousi.mp3&amp;showslider=0&amp;width=25" />
</object> ツクツクボウシの鳴き声
 再生をしたい MP3 ファイルは、青色文字で表示している。
 このコードは、Flash-mp3-player.net が提供している mini の MP3 Player の Generator で作成したコードを、一部修正したものである。今後は、少々面倒であるが、その都度記載することにしたいと思う。

 先日の和泉の国ジャズストリートで録音した飯田宗雪のライブ録音 MP3 ファイルを、同じように、ページ内で再生できるようにしてみた。

2009年11月 8日

隠居のパソコン:素晴らしい E-cards の紹介

 2006年7月にロサンゼルスに住んでいる先輩女史から送ってもらったアメリカ独立記念日のGreeting Cardがが素晴らしかったので、この E-cards を作成して有料で提供している jacquielawson と契約した。年間 $12 (2年間:$18 )で、作成されたそれぞれが素晴らしい E-cards が自由に使える。

クリックするとアニメーションが始まります 10月終わり近くになって、jacquielawson から、右のような新しい Hallowe'en(ハロウィン)の E-card をリリースしたとのメールが届いた。(メンバーになると新しい E-card が発表されるたびにメールをしてくれる)  E-cards はカードといっているが、 Flash で動くアニメーションである。余談ではあるが、このカラスはハシブトカラスだろう。
長い間 私の右サイトにボタンを置いている Season's Greeting を更新していなかったので、今回このハロウィンの E-card に置き換えた。最近作成された E-cards は、次の記述にあるように"back story"がついている。これもなかなか洒落ている。今回の "back story"は、scarecrow(かがし) について興味ある記述がつけられている。

Handy Tip!
Have you noticed how many of our recent cards include what we call a "back story" - a few extra pages of fascinating information about the subjects of the cards.
They're well worth exploring - recent cards have included hints on hunting for sunken(海底の) treasure, potted histories of the Blue Danube waltz and the Great Western Railway - and a story about hedgehogs!(ハリネズミ)

  提供されている E-cards は欧米圏の文化に基いており英語であり残念ながら年賀状はないが、誕生日・出産の祝い・結婚祝い・新築祝い・お見舞いなどもあるので年間1000円少しほど払って使ってみられたらいかがだろうか。(念のために言っておくが、私はこの jacquielawson のアフリエートをしているわけではない。) こういうものが容易く手にはいるようになったのも、インターネットの発展のおかげである。ネットの暗い部分ばかりに疑心暗鬼にならずに、sunny side を上手く活用すれば生活はもっと便利に潤いのあるものになるだろう。行動範囲の狭くなってきている私のような高齢者でも、パソコンの前に座ることによって若いときよりずっと世界が広がってきていると感じている。

2008年3月11日

MT用フォトサムネイラーのインストール

 このブログに 2005年3月から掲載してきた種々雑多な写真も結構な量になってきた。これらの写真をカテゴリー別にアルバムにしたいと、ブログのタイトルなどで使っている Sothink SWF Quicker という Flash 作成ソフトのテンプレート利用も考えてきたが、日本語対応ができないなど意図したとおりにできないので諦めていた。

 写真のアルバムは、DIY作品集で実現しているが、新しいエントリーをあげるたびに修正しなければならないなど結構面倒な作業である。サムネイルに載せる写真を選択できるのは、いい点であるが。

 Flash カレンダーや Flash 天気予報を利用させていただいている Kinarie&May さん にMT用フォトサムネイラーというエントリーの中の画像ファイルをサムネイルで表示する Flash プラグインがある。前から気になっていたが、トライする機会がないままになっていた。今回、試してみると思い通りのインストールができたので、注意点などを記録として残しておきたい。

 次のサムネイルは、私のブログでカテゴリーを Gardening として分類しているエントリーに掲載されている写真である。下の << Prev ボタンをクリックすると日付を遡って見ることができる。サムネイルをクリックすると該当するエントリーが表示される。サムネイルに戻る場合は、ブラウザーの戻るボタンを使う。

   


 インストールの手順は、Kinarie&May さんのMT用フォトサムネイラー1.20 に親切に書いてある。
 以下は、注意点。
  • サムネイルされる写真は、HTMLに、<"img","src" >で指定される .jpg 写真である。いずれも小文字でなければならない。Picasa2 でエクスポートした写真は、大文字の .JPG となりサムネイルされないので要注意である。
  • テンプレートの新規作成で作成した xml ファイルは、作成した blog のルートフォルダーに保存される。ダウンロードしたphoto_thumbnailer120.zip を解凍してできる photo_thumbnailer120.swf ファイルは、同じフォルダーに置けばよい。
  • カテゴリー別にサムネイルを作る場合は、 xml ファイルの中で、<MTEntries category="004Gardening" lastn="999"> のようにするが、category の名前は、ブログ管理画面のカテゴリー名と一致させる必要がある。なお、サブカテゴリーも指定できる。私の場合、ソートのためにつけていた頭3桁の数字を忘れていたので、当初上手くいかなかった。
  • いくつかのカテゴリーでサムネイル集を作成する場合は、出力名を変えた xml ファイルをいくつか作ればOKである。

 このプラグインを応用して、私のサイトで運営している友達のブログの写真集とかのようなカテゴリー別のサムネイル集を作成していきたいと考えている。
 Kinarie&May さん Thanks a lot !!

(追記:2008/3/12) 私のサイトで運営している Studio YAMAKO はプロ級の腕前の YAMAKO が撮った趣味の蝶の写真が中心である。この蝶の写真のサムネイルを MT用フォトサムネイラー1.20 で作成してみました。右サイドメニューの Studio YAMAKO をクリックしてみてください。素晴らしい写真集がご覧になれます。

(追記:2008/3/13)サムネイルされる写真の拡張子は小文字の jpg でなければならない。ブログに写真を掲載するには Picasa2 でデジカメ写真を整理しエクスポートするのが便利であるが、拡張子が大文字の JPG となる。そのため、MTで写真ファイルをアップする前に該当するフォルダーの写真ファイルを Renamin.exe で拡張子を小文字の jpg としなければならない。ただし、この逆手をとって、サムネイルに載せたい写真だけ、小文字の jpg とする手もあるが、サーバーとエントリーのファイル名を変えねばならない。 

2008年2月23日

隠居、メニューをFlashボタンに変えてみる

 エントリーした日が表示される Flash の横長カレンダーや表示する地方を指定できる Flash 天気予報は、Kinarie&May さんの作品を使わせてもらっている。

 このサイトのメニューボタンが、なかなか洒落ている。自分でカストマイズできるように、Flashメニュー素材も公開されている。変化するメニューボタンを作りたかったので導入させてもらおうと思ったが、今気に入っている動きのあるタイトルを変えなければならないので諦めた。

 もう一度、Flash8 を学習しなおすうちに、先日作った「音の鳴る動きのあるリンク・ボタン」を作ったときの方法を応用すれば、少し似通ったものができるのではないかと気がついた。どうにか形になったので、例によって自分の記録用にかきとめておきたい。
 
  1. Flash8 を立ち上げ、新規→フラッシュドキュメントを選択する。
  2. 「修正」→「ドキュメント」で、メニューボタンを設置する場所の大きさに合わせて、ステージの大きさ・背景色を決める。今回は、1000px X 40px の大きさで、カラーピッカーでスポイドしたブログ・タイトルの背景色(#784028)にした。
  3. 「挿入」→「新規シンボル」でボタンを選択して、title_homeとボタン名を付ける。(名前はなんでもよい。)
  4. ボタン作成画面の再生ヘッドがアップにある状態で、ツールパネルの矩形ツールでステージ内に長方形を描く。
  5. レイヤー1のアップフレームをクリックし、ステージ上の長方形をクリックすると、プロパティ・インスペクターがシェイプに変わって、長方形を編集することができる。今回は、130 x 25px の長方形を描いた。
  6. アップ時のボタンの色(塗りのカラー)は、プロパティ・インスペクターにあるバケツの横の四角をクリックすると出てくるスポイドで、画面上の好きな色をクリックすると変えることができる。また、出てくる色パネルから選択したり、6桁の色番号を指定したリストことができる。色番号を指定する場合には、WebColorCreator というカラーピッカーを利用すると便利である。
  7. ボタンの枠線は、境界線を明瞭にするために、細い実線とした。
  8. テキストは、ツールパネルから、テキスト[A]アイコンをクリックし、プロパティ・インスペクターで、フォント・大きさ・色などを指定し、ステージ上で入力し、ボタン上にドラッグする。今回は、フォントは Verdana 12pt Bold 白を選んだ。
  9. 次に、ボタンのオーバーフレームを右クリックして、「キーフレームを挿入」をえらぶと、アップ・フレームと同じボタンが表示される。
  10. アップ・フレームと変化をつけるため、塗り色は、プロパティ・インスペクターのバケツアイコンをクリックしてでるカラーピッカーで水色を選んだ。
  11. 次に、ダウン・フレームで「キーフレームを挿入」をえらぶとオーバーフレームのボタンがコピーされる。
  12. ヒット・フレームにも「キーフレームを挿入」をえらんでおく。このフレームは表示されないから、そのままでも問題はないようだ。
  13. 「タイムライン」横の「シーン1」をクリックし、ステージに先ほど作成したボタンをライブラリーからドラッグする。このとき、「表示」→「表示比率」→「ウインドウに合わせる」に設定しておくと全体像がつかめる。
  14. ステージにあるボタンをクリックするとプロパティ・インスペクターのプロパティがボタンに変化するのを確かめて、インスペクターの左下の位置決めを、今回の場合、w 130 H 25 X 0.0 Y 15 .0 とした。
  15. 次に、ボタンをクリックしたときに、リンク先につながるようにするには、簡単な Action Script を使う。「アクション」パネルを開き、「ムービークリップ制御」「ブラウザ/ネットワーク」から、下のようなスクリプトを作る。
    on (release) {
    getURL("http://n-shuhei.net/blog/);
    }
  16. ここまで作成した Flash ボタンの動きは、「ファイル」→「バブリッシュ・プレビュー」→「Flash」で確認するのがよいようだ。 [F12]キーを押してHTMLでの確認はうまくいかなかった。
    クリックすると大きくなりますこの時点での画面は、左の screenshot のようになる。




  17. ここまでうまくいけば、あとは同様の作業の繰り返しとなる。まず、右のライブラリーの title_home のボタンを右クリックして、「複製」を選択すると、ポップアップ画面がでるので、新たなボタン名を、例えば、title_radio のようにつける。
  18. このライブラリーのtitle_radio ボタンをダブルクリックすると、 title_home のボタンの複製ボタンがでてくるので、アップ・オーバー・ダウン フレームのそれぞれのテキスト部分を RadioSenboku のように変える。
  19. シーン1上に、このボタンをライブラリーからドラッグして、設置する。このときの位置表示は、w 130 H 25 X 130.0 Y 15 .0 とすればよい。
  20. ステージ上でこのボタンを選択して、アクションパネルから、新しいリンク先URLを含むスクリプトを入力する。これで、メニューボタンの2つめができる。
  21. ほかのボタンの設置は、17?20 の繰り返しである。
  22. このようにしてできたファイルを「書き出し」→「ムービーの書き出し」で swf ファイルで保存し、FTPソフトでサーバーにアップロードする。あとは、Web Title 部分に設置するだけである。
  23. なお、ボタンのオーバーフレームのときに音を出すようにするのは、「音の鳴る動きのあるリンク・ボタン」のエントリーでの 9.項を参照にして設定する。


 このエントリーは前に書いたエントリーが基礎になっている。記録することによって、知識はアンプリファイ(増幅)することを身にしみて感じている。

2008年2月 7日

隠居、音の鳴る動きのあるリンク・ボタンをつくる

 リンクボタンを Flash で作成する方法をすぐに忘れてしまい、新たに作るときは一からの学習となるので、今回右サイドメニューのリンクボタンをいじった経緯を備忘録として書いておきたい。
 Flash 作成は、日本語が扱えるので Macromedia FLASH8 を使用しているが、使い込めばいろいろと面白いことができそうだが、まずは基本的な学習からである。
 なお、Flash リンクボタンの作成については、過去に何度かエントリーしている。それらは、ほとんど tutorial のものまねである。過去のエントリーについては、TagCloud の "Flash" で検索して欲しい。

  1. Flash8 を立ち上げ、新規→フラッシュドキュメントを選択する。
  2. 「修正」→「ドキュメント」で、ボタンを設置する場所に合わせて、ステージの大きさ・背景色を決める。デフォールトに設定しておくと、同じようなボタンを作る作業を続ける場合は、便利である。
  3. 「挿入」→「新規シンボル」でボタンを選択して適当なボタン名を付ける。
  4. ボタン作成画面の再生ヘッドがアップにある状態で、ツールパネルの矩形ツールでステージ内に長方形を描く。
  5. レイヤー1のアップフレームをクリックし、ステージ上の長方形をクリックすると、プロパティ・インスペクターがシェイプに変わって、長方形を編集することができる。
  6. アップ時のボタンの色(塗りのカラー)は、プロパティ・インスペクターにあるバケツの横の四角をクリックすると出てくるスポイドで、画面上の好きな色をクリックすると変えることができる。また、出てくる色パネルから選択したり、6桁の色番号を指定したリストことができる。色番号を指定する場合には、WebColorCreator というカラーピッカーを利用すると便利である。
  7. テキストは、ツールパネルから、テキスト[A]アイコンをクリックし、プロパティ・インスペクターで、フォント・大きさ・色などを指定し、ステージ上で入力し、ボタン上にドラッグする。
  8. 次に、ボタンのオーバーフレームを右クリックして、「キーフレームを挿入」をえらぶと、アップ・フレームと同じボタンが表示される。
  9. アップ・フレームと変化をつける場合、たとえばボタンの色を同色で薄くする場合は、プロパティ・インスペクターのバケツアイコンをクリックしてでるカラーピッカーの「アルファ」を50%にでもすればよい。カーソルがボタンの上にくると音がでるようにするには、事前に、MP3ファイルをライブラリーに読み込んでおく。フレームをクリックしたときのプロパティ・インスペクターにあるサウンド・リストボタンをクリックすると読み込んでおいたMP3ファイルが表示されるので、これを選択する。効果:なし、同期:スタート、繰り返し:1でよい。(アップ・フレーム、ダウン・フレームでは、同期:ストップを選ぶ)
  10. 次に、ダウン・フレームで「キーフレームを挿入」をえらぶとオーバーフレームのボタンがコピーされる。
  11. ヒット・フレームにも「キーフレームを挿入」をえらんでおく。このフレームは表示されないから、そのままでも問題はないようだ。
  12. 次に、ボタンをクリックしたときに、リンク先につながるようにするには、簡単な Action Script を使う。「タイムライン」横の「シーン1」をクリックし、ステージに先ほど作成したボタンをライブラリーからドラッグする。
  13. ステージにあるボタンをクリックするとプロパティ・インスペクターのプロパティがボタンに変化するのを確かめて、「アクション」パネルを開き、「ムービークリップ制御」「ブラウザ/ネットワーク」から、下のようなスクリプトを作る。
    on (release) {
    getURL("http://n-shuhei.net/xxxxx/xxxx", "_blank");
    }
  14. 問い合わせなどのメール送信ボタンの場合には、次のようなスクリプトにする。
    on(release){
    mURL="mailto:xxxxxxxxxxx@n-shuhei.net";
    mURL+="?subject="+"問い合わせ:";
    mURL+="&body="+"よろしければ、お名前をお聞かせください。";
    getURL(mURL);
    }
  15. このようにして作成した Flash ボタンの動きは、[F12]キーを押してHTMLで確認する。「ファイル」→「バブリッシュ・プレビュー」→「HTML」でも確認できる。
  16. 動きが確認できれば、「ファイル」→「書き出し」→「ムービーの書き出し」で、.swf ファイルを保存し、FTPソフトでサーバーにアップする。
    なお、.fla ファイルも保存をしておいた方が、後の編集に有用である。


 あとで気づいたことであるが、2006年12月のエントリーが多いに参考になる。何回も同じことを繰り返すのは、アルツハイマーの典型的な症状である。
(追記:2007/2/11) メール送信ボタンの試験をしていて気づいたことがある。動きの確認で、うまくメールが立ち上がるときと立ち上がらないときがある。ActionScript に自信がないので、そのせいかと疑ったが違うらしい。いろいろとサーチしてみたが、よく分からなかった。
 うまくメーラーが立ち上がるときは、Outlook が立ち上がる。私は、普段メーラーは、Beckey! を使っているのに、「コントロールパネル」→「インターネット・オプション」→「プログラム」の電子メールが「Microsoft Outlook」となっているせいであった。これを「Beckey!」に変えると、問題なく動くようになった。
 基本的なところで抜かっている。歳のせいにしておきたい。

2007年4月23日

XHTMLstrict に Flash を表示する

隠居のFlash:<object> と<embed>で書いたように、どのブラウザでも動くように Flash をHTMLに埋め込むには、<object> と<embed>という同じようなタグを書かねばならない。最近はHTMLをもっと厳密(strict)に書いて、どのブラウザでも動くようにしようということで、W3C(The World Wide Web Consortium )は、XHTML strict を推奨している。この XHTML strict では、<embed>タグは使えない。現在MovableTypeで使っている「小粋空間」さんのテンプレートは、移行段階のXHTML Transitional なので現状で困っているわけではないが、Flashを XHTMLstrictで表示させる(embedタグを使わずに表示させる)コードが紹介されていたので、ブログのヘッダー部分の Flash を変更してみた。

続きを読む "XHTMLstrict に Flash を表示する"

2007年1月 5日

MTに自作Flashリンクボタンを置く

 右サイドのメニューに、総集編的なページや昔のHPなどにリンクするボタンを置いてきた。これらのボタンは、SothinkSWFQuickerのテンプレートを使って Flash で作ったものもあるが、それぞれ個別に作ってきたので統一がとれていなかった。テンプレートでは、自分の思うようにデザインができないことも不満であった。それに大枚をはたいて手に入れた Flash8 をなんとか使ってみたいという願望もあった。初心者向けの参考書これで完璧 Flash8では、もうひとつ自分の思うような例がなかった。Flash8 のヘルプに、ファーストステップガイドやチュートリアルもあるが、記憶力が悪くなっているので印刷物でないと使いづらい。それでまた、下の『Flash 8 レベルアップコース』という書籍を買った。何のことはない書籍代に結構使っている。
この『Flash 8 レベルアップコース』は丁寧に書いてあり、なかなか手助けになる。この中の作成例を参考になんとかたどり着いたのが、現在の Flash リンクボタンである。一応、Flash の基本であるボタンへのカーソル状況によって、動いたり音がでたり、半透明のカバーが覆けられる。もちろん、クリックによって目的とするURLが現れる。また、作例にはなかったが管理者(私)へメールするリンクボタン(mailto:)も同じ動きで設置できるようになった。歳をとっての学習は、エキスパートの真似をなんども繰り返してするしかないかと変に得心している。幸い時間はある。

Flash8 レベルアップコース
Flash8 レベルアップコース
posted withamazleton 07.01.05
ななきち
毎日コミュニケーションズ
売り上げランキング: 210708






2006年12月11日

隠居のFlash:&lt;object&gt; と&lt;embed&gt;

 先日来、右サイドメニューに Flash リンクボタンを置くことを試みている。Flash8 Basic で、日本語表示のFlash リンクボタン・ファイル(xxx.swf)をいくつか作って設置してみる作業である。この作業の中で、エキスパートの方なら常識と思うが、初心者には新たな発見があったので備忘録的に書き留めておくことにした。
 メインページおよびエントリー・カテゴリー・日付各アーカイブのテンプレートでは、リンク用のテンプレートを別に作って readfile している。このリンク用テンプレートでの flash file の設置するためのコードは、引用のように、Flash のエキスパートが提供してくれているものをコピペし、 flash file のありかなどを指示するなどの必要箇所を訂正して使っている。
<!--泉北近辺私的観光地図-->
<span align="left"> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="120" height="30"> <param name="movie" value="http://xxxxxxxxxx/xxxxx/map_03.swf" /> <param name="quality" value="high" />
<!-- LiteboxでFlash を隠す -->
<param name="wmode" value="transparent" />
<embed src="http://xxxxxxxxxx/xxxxx/map_03.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" wmode="transparent" width="120" height="30"></embed></object></span>

   この HTML には、<object>と<embed>という同じようなタグが使われている。この経緯については、高橋 登史朗さんのAllAboutの解説に詳しい。この解説でも分かるように、ブラウザーによって表示が変わる。私の場合、主として編集は Firefox2.0 を使い、サイトの確認は使用している人が多い IE7 で行う。この確認作業で、Firefox と IE では表示が異なることに気が付いた。<object>と<embed>タグ部分で同じような名前の swf ファイルを使っていて分かったのであるが、 IE7 では<object>タグでのファイルが使われ、Firefox2.0では<embed>タグでのファイルが使われる。Netscape でも<embed>タグでのファイルが使われるようである。
 どちらのタグ部分でも同じファイル名にするのは当たり前の話であるが。

2006年9月30日

MTサイドメニューに天気予報のFlashを

 私のブログサイトで使わせてもらっているFlashの横長カレンダーの作者である Kinarie&May さんのサイトを久しぶりに訪問した。サイドメニューに天気予報が格好良く配置されている。最新のFlash作品を探ると Flash天気予報1.10 という Flash が紹介されている。この頃は自分のブログサイトがポータル・サイト化しつつあるので天気予報を取り込むことに飛びついた。早速、PHPとSWFのファイルをダウンロードし、用意されているHTML用ソース作成ページでパラメータを指定した。地域として10の都市を指定できるので住んでいるところと出かけるときに気になる地方および主要都市を指定した。タイトルのバックグランドカラーも指定できるので使っているテンプレートに合わせた。また、できあがったソースのままではlitebox-1.0 を使っているとFlashの画像である天気予報が背景に隠れないので、「隣の花は紅い」のエントリーで記載した方法でソースにパラメータを加えると今度も上手く隠れた。なお、この方法については、「小粋空間」さんのLightbox JS でブログパーツ等の Flash を PNG 背景画像の下に隠すというエントリーに詳しく出ている。
 天気予報のデータは livedoor の Weather Hacks に依存しているとのことだ。 livedoor の継続性( going concern) が気になるところだが。

2006年5月 2日

MP3 Flash Player

 ウグイスの鳴き声エントリーで使っていた音声コントローラに代わるもっと小さいアイコンのクリックで音声の再生と停止ができないかを調査してきた。調査といってもWebが頼りである。ただ、このような音声系のカスタマイズは、英語の世界の方が数多くの例示があるので範囲を広げた。その結果見つけたMP3 Flash Playerがpickle playerであった。FlashというクリップををWebのページに掲載できることを知ったのはまだ6ヶ月も前のことであるので、Flashの技を競い合っておられる方々が公開されているFlashをなんとか使わせてもらってきた。そのため、Flashのカストマイズは公開されておられる方が許容されている範囲内でしかできなかった。今回のカスタマイズは福井県の学生さんのサイトで教えてもらった。今までのカストマイズとそんなに変わるわけではないが、ボタンに使った画像の色・形とかサイズについて自分で選択することができた。ただ、このカスタマイズはFlashPlayer8対応であり、私が使っているSothink SWF Quickerでは作成できなかった。試用版のMacromedia Flash8をDLして、これを使った。このソフトは欲しいのですが、まともに買えば9万円近くするので諦めている。 (追記)Basic版は25000円ですね。個人ではそれで十分なようだが、それにしても・・・。
 そのうちにきっとSouceTecがグレードアップしてくれると期待している。

続きを読む "MP3 Flash Player"

2006年4月20日

ムクドリ?のさえずり

鳥の鳴き声録音(実験2)

 今の季節、日の出頃にかなりうるさい鳥の声で目が覚める。昨日EDIROL R-1を使って録音を試みた。この鳴き声は多分ムクドリと思うのですが、詳しい方教えてください。どこかで犬もほえているようですが。 <雀のさえずり>で録音再生のこころみを掲載したがどうも気に入らないので、自分でFlashソフトを使って作ってみた。これだとFlashファイル(.swf file)を背景の好きなところにおける(ちょっと苦労したが)ので、ご覧のように写真と同じように録音した場所を指定できる。 また、Netscapeでご覧の方も音が聞こえるはずである。(Netscapeでは鳥のFlash画像の位置がずれる。positionタグはNN6でOKになっているのだが?Netscape7.1のせいかな。再生を停めるには他のエントリーに移るか、画面を閉じてください。swf fileをボタン化すると再生・停止ができるようになるが、まだ十分に学習ができていないので。
 いずれにしても録音技術やWeb(Blog)作成技術を高める必要は感じているが、遊びの幅が広がってきたので楽しくなっている。
今日は春何番かしらないが強風が吹き荒れている。鳥も啼くのをやめたようだ。

続きを読む "ムクドリ?のさえずり"

2006年4月10日

「みんなの写真くらぶ」移転

 hi-hoが提供してくれていた「みんなの写真くらぶ」が閉鎖になる。有料にして継続の話もあったが、結局4月末で閉鎖することになったらしい。このサービスは、ML仲間とオフラインで何かイベントをしたときのデジカメ写真を共有するのに便利していた。また、私はHPからリンクして使ったりもしていた。同様のサービスがNikon等にあるが、許される容量が20MBくらいしかなく、すぐに満タンになりそうである。有料で容量増ができるが結構高い。同じ容量を増やすなら、レンタルサーバーの方が何かにつけ便利なので、Weblogと同じサイトに置くことにした。今のところ、Flashのalbumにするのが比較的簡単そうなので、HPのGardeningページでリンクしているalbumの移転を始めた。取りあえず、春の庭花の写真の半分をSothink SWF Quickerで提供してくれているテンプレートを使ってFlash Albumにした。ただ、一旦albumを作成すると修正が難しいのが難点である。ActionScriptとXMLの基本ぐらいは学習したいと思うが、なかなか難しそうである。
 今月中に順次、移転を進めたいと考えている。 

続きを読む "「みんなの写真くらぶ」移転"

Atelier Shuhei Weblogで“Flash”タグの付いているブログ記事

2008年3月11日

MT用フォトサムネイラーのインストール

 このブログに 2005年3月から掲載してきた種々雑多な写真も結構な量になってきた。これらの写真をカテゴリー別にアルバムにしたいと、ブログのタイトルなどで使っている Sothink SWF Quicker という Flash 作成ソフトのテンプレート利用も考えてきたが、日本語対応ができないなど意図したとおりにできないので諦めていた。

 写真のアルバムは、DIY作品集で実現しているが、新しいエントリーをあげるたびに修正しなければならないなど結構面倒な作業である。サムネイルに載せる写真を選択できるのは、いい点であるが。

 Flash カレンダーや Flash 天気予報を利用させていただいている Kinarie&May さん にMT用フォトサムネイラーというエントリーの中の画像ファイルをサムネイルで表示する Flash プラグインがある。前から気になっていたが、トライする機会がないままになっていた。今回、試してみると思い通りのインストールができたので、注意点などを記録として残しておきたい。

 次のサムネイルは、私のブログでカテゴリーを Gardening として分類しているエントリーに掲載されている写真である。下の << Prev ボタンをクリックすると日付を遡って見ることができる。サムネイルをクリックすると該当するエントリーが表示される。サムネイルに戻る場合は、ブラウザーの戻るボタンを使う。

   


 インストールの手順は、Kinarie&May さんのMT用フォトサムネイラー1.20 に親切に書いてある。
 以下は、注意点。
  • サムネイルされる写真は、HTMLに、<"img","src" >で指定される .jpg 写真である。いずれも小文字でなければならない。Picasa2 でエクスポートした写真は、大文字の .JPG となりサムネイルされないので要注意である。
  • テンプレートの新規作成で作成した xml ファイルは、作成した blog のルートフォルダーに保存される。ダウンロードしたphoto_thumbnailer120.zip を解凍してできる photo_thumbnailer120.swf ファイルは、同じフォルダーに置けばよい。
  • カテゴリー別にサムネイルを作る場合は、 xml ファイルの中で、<MTEntries category="004Gardening" lastn="999"> のようにするが、category の名前は、ブログ管理画面のカテゴリー名と一致させる必要がある。なお、サブカテゴリーも指定できる。私の場合、ソートのためにつけていた頭3桁の数字を忘れていたので、当初上手くいかなかった。
  • いくつかのカテゴリーでサムネイル集を作成する場合は、出力名を変えた xml ファイルをいくつか作ればOKである。

 このプラグインを応用して、私のサイトで運営している友達のブログの写真集とかのようなカテゴリー別のサムネイル集を作成していきたいと考えている。
 Kinarie&May さん Thanks a lot !!

(追記:2008/3/12) 私のサイトで運営している Studio YAMAKO はプロ級の腕前の YAMAKO が撮った趣味の蝶の写真が中心である。この蝶の写真のサムネイルを MT用フォトサムネイラー1.20 で作成してみました。右サイドメニューの Studio YAMAKO をクリックしてみてください。素晴らしい写真集がご覧になれます。

(追記:2008/3/13)サムネイルされる写真の拡張子は小文字の jpg でなければならない。ブログに写真を掲載するには Picasa2 でデジカメ写真を整理しエクスポートするのが便利であるが、拡張子が大文字の JPG となる。そのため、MTで写真ファイルをアップする前に該当するフォルダーの写真ファイルを Renamin.exe で拡張子を小文字の jpg としなければならない。ただし、この逆手をとって、サムネイルに載せたい写真だけ、小文字の jpg とする手もあるが、サーバーとエントリーのファイル名を変えねばならない。 

2008年2月23日

隠居、メニューをFlashボタンに変えてみる

 エントリーした日が表示される Flash の横長カレンダーや表示する地方を指定できる Flash 天気予報は、Kinarie&May さんの作品を使わせてもらっている。

 このサイトのメニューボタンが、なかなか洒落ている。自分でカストマイズできるように、Flashメニュー素材も公開されている。変化するメニューボタンを作りたかったので導入させてもらおうと思ったが、今気に入っている動きのあるタイトルを変えなければならないので諦めた。

 もう一度、Flash8 を学習しなおすうちに、先日作った「音の鳴る動きのあるリンク・ボタン」を作ったときの方法を応用すれば、少し似通ったものができるのではないかと気がついた。どうにか形になったので、例によって自分の記録用にかきとめておきたい。
 
  1. Flash8 を立ち上げ、新規→フラッシュドキュメントを選択する。
  2. 「修正」→「ドキュメント」で、メニューボタンを設置する場所の大きさに合わせて、ステージの大きさ・背景色を決める。今回は、1000px X 40px の大きさで、カラーピッカーでスポイドしたブログ・タイトルの背景色(#784028)にした。
  3. 「挿入」→「新規シンボル」でボタンを選択して、title_homeとボタン名を付ける。(名前はなんでもよい。)
  4. ボタン作成画面の再生ヘッドがアップにある状態で、ツールパネルの矩形ツールでステージ内に長方形を描く。
  5. レイヤー1のアップフレームをクリックし、ステージ上の長方形をクリックすると、プロパティ・インスペクターがシェイプに変わって、長方形を編集することができる。今回は、130 x 25px の長方形を描いた。
  6. アップ時のボタンの色(塗りのカラー)は、プロパティ・インスペクターにあるバケツの横の四角をクリックすると出てくるスポイドで、画面上の好きな色をクリックすると変えることができる。また、出てくる色パネルから選択したり、6桁の色番号を指定したリストことができる。色番号を指定する場合には、WebColorCreator というカラーピッカーを利用すると便利である。
  7. ボタンの枠線は、境界線を明瞭にするために、細い実線とした。
  8. テキストは、ツールパネルから、テキスト[A]アイコンをクリックし、プロパティ・インスペクターで、フォント・大きさ・色などを指定し、ステージ上で入力し、ボタン上にドラッグする。今回は、フォントは Verdana 12pt Bold 白を選んだ。
  9. 次に、ボタンのオーバーフレームを右クリックして、「キーフレームを挿入」をえらぶと、アップ・フレームと同じボタンが表示される。
  10. アップ・フレームと変化をつけるため、塗り色は、プロパティ・インスペクターのバケツアイコンをクリックしてでるカラーピッカーで水色を選んだ。
  11. 次に、ダウン・フレームで「キーフレームを挿入」をえらぶとオーバーフレームのボタンがコピーされる。
  12. ヒット・フレームにも「キーフレームを挿入」をえらんでおく。このフレームは表示されないから、そのままでも問題はないようだ。
  13. 「タイムライン」横の「シーン1」をクリックし、ステージに先ほど作成したボタンをライブラリーからドラッグする。このとき、「表示」→「表示比率」→「ウインドウに合わせる」に設定しておくと全体像がつかめる。
  14. ステージにあるボタンをクリックするとプロパティ・インスペクターのプロパティがボタンに変化するのを確かめて、インスペクターの左下の位置決めを、今回の場合、w 130 H 25 X 0.0 Y 15 .0 とした。
  15. 次に、ボタンをクリックしたときに、リンク先につながるようにするには、簡単な Action Script を使う。「アクション」パネルを開き、「ムービークリップ制御」「ブラウザ/ネットワーク」から、下のようなスクリプトを作る。
    on (release) {
    getURL("http://n-shuhei.net/blog/);
    }
  16. ここまで作成した Flash ボタンの動きは、「ファイル」→「バブリッシュ・プレビュー」→「Flash」で確認するのがよいようだ。 [F12]キーを押してHTMLでの確認はうまくいかなかった。
    クリックすると大きくなりますこの時点での画面は、左の screenshot のようになる。




  17. ここまでうまくいけば、あとは同様の作業の繰り返しとなる。まず、右のライブラリーの title_home のボタンを右クリックして、「複製」を選択すると、ポップアップ画面がでるので、新たなボタン名を、例えば、title_radio のようにつける。
  18. このライブラリーのtitle_radio ボタンをダブルクリックすると、 title_home のボタンの複製ボタンがでてくるので、アップ・オーバー・ダウン フレームのそれぞれのテキスト部分を RadioSenboku のように変える。
  19. シーン1上に、このボタンをライブラリーからドラッグして、設置する。このときの位置表示は、w 130 H 25 X 130.0 Y 15 .0 とすればよい。
  20. ステージ上でこのボタンを選択して、アクションパネルから、新しいリンク先URLを含むスクリプトを入力する。これで、メニューボタンの2つめができる。
  21. ほかのボタンの設置は、17?20 の繰り返しである。
  22. このようにしてできたファイルを「書き出し」→「ムービーの書き出し」で swf ファイルで保存し、FTPソフトでサーバーにアップロードする。あとは、Web Title 部分に設置するだけである。
  23. なお、ボタンのオーバーフレームのときに音を出すようにするのは、「音の鳴る動きのあるリンク・ボタン」のエントリーでの 9.項を参照にして設定する。


 このエントリーは前に書いたエントリーが基礎になっている。記録することによって、知識はアンプリファイ(増幅)することを身にしみて感じている。

2008年2月 7日

隠居、音の鳴る動きのあるリンク・ボタンをつくる

 リンクボタンを Flash で作成する方法をすぐに忘れてしまい、新たに作るときは一からの学習となるので、今回右サイドメニューのリンクボタンをいじった経緯を備忘録として書いておきたい。
 Flash 作成は、日本語が扱えるので Macromedia FLASH8 を使用しているが、使い込めばいろいろと面白いことができそうだが、まずは基本的な学習からである。
 なお、Flash リンクボタンの作成については、過去に何度かエントリーしている。それらは、ほとんど tutorial のものまねである。過去のエントリーについては、TagCloud の "Flash" で検索して欲しい。

  1. Flash8 を立ち上げ、新規→フラッシュドキュメントを選択する。
  2. 「修正」→「ドキュメント」で、ボタンを設置する場所に合わせて、ステージの大きさ・背景色を決める。デフォールトに設定しておくと、同じようなボタンを作る作業を続ける場合は、便利である。
  3. 「挿入」→「新規シンボル」でボタンを選択して適当なボタン名を付ける。
  4. ボタン作成画面の再生ヘッドがアップにある状態で、ツールパネルの矩形ツールでステージ内に長方形を描く。
  5. レイヤー1のアップフレームをクリックし、ステージ上の長方形をクリックすると、プロパティ・インスペクターがシェイプに変わって、長方形を編集することができる。
  6. アップ時のボタンの色(塗りのカラー)は、プロパティ・インスペクターにあるバケツの横の四角をクリックすると出てくるスポイドで、画面上の好きな色をクリックすると変えることができる。また、出てくる色パネルから選択したり、6桁の色番号を指定したリストことができる。色番号を指定する場合には、WebColorCreator というカラーピッカーを利用すると便利である。
  7. テキストは、ツールパネルから、テキスト[A]アイコンをクリックし、プロパティ・インスペクターで、フォント・大きさ・色などを指定し、ステージ上で入力し、ボタン上にドラッグする。
  8. 次に、ボタンのオーバーフレームを右クリックして、「キーフレームを挿入」をえらぶと、アップ・フレームと同じボタンが表示される。
  9. アップ・フレームと変化をつける場合、たとえばボタンの色を同色で薄くする場合は、プロパティ・インスペクターのバケツアイコンをクリックしてでるカラーピッカーの「アルファ」を50%にでもすればよい。カーソルがボタンの上にくると音がでるようにするには、事前に、MP3ファイルをライブラリーに読み込んでおく。フレームをクリックしたときのプロパティ・インスペクターにあるサウンド・リストボタンをクリックすると読み込んでおいたMP3ファイルが表示されるので、これを選択する。効果:なし、同期:スタート、繰り返し:1でよい。(アップ・フレーム、ダウン・フレームでは、同期:ストップを選ぶ)
  10. 次に、ダウン・フレームで「キーフレームを挿入」をえらぶとオーバーフレームのボタンがコピーされる。
  11. ヒット・フレームにも「キーフレームを挿入」をえらんでおく。このフレームは表示されないから、そのままでも問題はないようだ。
  12. 次に、ボタンをクリックしたときに、リンク先につながるようにするには、簡単な Action Script を使う。「タイムライン」横の「シーン1」をクリックし、ステージに先ほど作成したボタンをライブラリーからドラッグする。
  13. ステージにあるボタンをクリックするとプロパティ・インスペクターのプロパティがボタンに変化するのを確かめて、「アクション」パネルを開き、「ムービークリップ制御」「ブラウザ/ネットワーク」から、下のようなスクリプトを作る。
    on (release) {
    getURL("http://n-shuhei.net/xxxxx/xxxx", "_blank");
    }
  14. 問い合わせなどのメール送信ボタンの場合には、次のようなスクリプトにする。
    on(release){
    mURL="mailto:xxxxxxxxxxx@n-shuhei.net";
    mURL+="?subject="+"問い合わせ:";
    mURL+="&body="+"よろしければ、お名前をお聞かせください。";
    getURL(mURL);
    }
  15. このようにして作成した Flash ボタンの動きは、[F12]キーを押してHTMLで確認する。「ファイル」→「バブリッシュ・プレビュー」→「HTML」でも確認できる。
  16. 動きが確認できれば、「ファイル」→「書き出し」→「ムービーの書き出し」で、.swf ファイルを保存し、FTPソフトでサーバーにアップする。
    なお、.fla ファイルも保存をしておいた方が、後の編集に有用である。


 あとで気づいたことであるが、2006年12月のエントリーが多いに参考になる。何回も同じことを繰り返すのは、アルツハイマーの典型的な症状である。
(追記:2007/2/11) メール送信ボタンの試験をしていて気づいたことがある。動きの確認で、うまくメールが立ち上がるときと立ち上がらないときがある。ActionScript に自信がないので、そのせいかと疑ったが違うらしい。いろいろとサーチしてみたが、よく分からなかった。
 うまくメーラーが立ち上がるときは、Outlook が立ち上がる。私は、普段メーラーは、Beckey! を使っているのに、「コントロールパネル」→「インターネット・オプション」→「プログラム」の電子メールが「Microsoft Outlook」となっているせいであった。これを「Beckey!」に変えると、問題なく動くようになった。
 基本的なところで抜かっている。歳のせいにしておきたい。

2007年6月16日

隠居のHP備忘録:音の出るリンクボタンの作成

 Atelier Shuhei Weblog の右サイドメニューでのサイト内リンクボタンの統一が取れていなかったので、作り直すことにした。物覚えが悪くなって Flashのリンクボタンを作るたびに参考書を片手に一からやり直すことになるので、今回は備忘録として書き留めておくことにした。Flash製作に長けた人なら幼稚な話であるが。
 下に、今回作成した 蝶の写真集 Studio YAMAKO へのリンクボタンを例示する。

続きを読む "隠居のHP備忘録:音の出るリンクボタンの作成"

2007年4月23日

XHTMLstrict に Flash を表示する

隠居のFlash:<object> と<embed>で書いたように、どのブラウザでも動くように Flash をHTMLに埋め込むには、<object> と<embed>という同じようなタグを書かねばならない。最近はHTMLをもっと厳密(strict)に書いて、どのブラウザでも動くようにしようということで、W3C(The World Wide Web Consortium )は、XHTML strict を推奨している。この XHTML strict では、<embed>タグは使えない。現在MovableTypeで使っている「小粋空間」さんのテンプレートは、移行段階のXHTML Transitional なので現状で困っているわけではないが、Flashを XHTMLstrictで表示させる(embedタグを使わずに表示させる)コードが紹介されていたので、ブログのヘッダー部分の Flash を変更してみた。

続きを読む " XHTMLstrict に Flash を表示する"

2007年1月 5日

MTに自作Flashリンクボタンを置く

 右サイドのメニューに、総集編的なページや昔のHPなどにリンクするボタンを置いてきた。これらのボタンは、SothinkSWFQuickerのテンプレートを使って Flash で作ったものもあるが、それぞれ個別に作ってきたので統一がとれていなかった。テンプレートでは、自分の思うようにデザインができないことも不満であった。それに大枚をはたいて手に入れた Flash8 をなんとか使ってみたいという願望もあった。初心者向けの参考書これで完璧 Flash8では、もうひとつ自分の思うような例がなかった。Flash8 のヘルプに、ファーストステップガイドやチュートリアルもあるが、記憶力が悪くなっているので印刷物でないと使いづらい。それでまた、下の『Flash 8 レベルアップコース』という書籍を買った。何のことはない書籍代に結構使っている。
この『Flash 8 レベルアップコース』は丁寧に書いてあり、なかなか手助けになる。この中の作成例を参考になんとかたどり着いたのが、現在の Flash リンクボタンである。一応、Flash の基本であるボタンへのカーソル状況によって、動いたり音がでたり、半透明のカバーが覆けられる。もちろん、クリックによって目的とするURLが現れる。また、作例にはなかったが管理者(私)へメールするリンクボタン(mailto:)も同じ動きで設置できるようになった。歳をとっての学習は、エキスパートの真似をなんども繰り返してするしかないかと変に得心している。幸い時間はある。

Flash8 レベルアップコース
Flash8 レベルアップコース
posted withamazleton 07.01.05
ななきち
毎日コミュニケーションズ
売り上げランキング: 210708






2006年12月16日

X'mas e-Card : A Excellent Flash Work

 昨年、ロサンゼルスに住んでいる先輩女史から送ってもらった Greeting Card が素晴らしかったので、その作者 Jacquie Lawson さんのサイトに年8$でメンバーになった。新しい作品ができるとメールで教えてくれるが、今年のChristmas e-cardの新作の知らせが届いた。今年も素晴らしい出来である。Flashを使いこなせば、こんなに凄いものができるんですね。
 このアニメーションは、深雪の山小屋で暖かいストーブの前に、いささかのアルコールが入って寝そべって雪景色を眺めているような感じでとくにお気に入りである。もちろん、実際は雑木や畑に雪が積もって汚いものが見えないだけであるが。雪のシーズン、hute にたどり着くまでは大変であるが、今シーズンは屋根も修復したし水の心配もないので、機会を作って行こうという思いが強くなってきている。

2006年12月15日

隠居のFlash参考書:『これで完璧 Flash8』

 初心者向けのFlash8参考書である。図が多く使われ、tutorial 的な例示のサンプルも指定サイトから DL できるので分かりやすい。ただ、一つずつの説明は丁寧だが、何のための機能なのかの説明がないので自分の目標とする項目を探すのが難しいのように思う。

これで完璧 Flash8
これで完璧 Flash8
posted with amazlet on 06.12.15
菊池 博美 E‐Creator.jp
ローカス
売り上げランキング: 250557

2006年12月15日

隠居、Flash8で Flash リンクボタンを作る

 ブログの右サイドメニューに Flash のリンクボタンを作るときには、Sothink SWF Quicker のテンプレートを使って作ってきた。Sothink SWF Quicker はFlash ムービーを作るためのソフトとしては比較的安いし、テンプレートや tutorial も充実しているので重宝している。欠点は、Flash version8 に徐々に対応してきているがまだ十分でないことと日本語のテキストが扱えないことである。そのために、Macromedia Flash Basic 8 を泣く泣く購入したが、主目的だった MP3 ファイルの再生ボタンはインターネットで見つけたフリーの Flash MP3 Player で十分だった。それで個人が少し遊ぶ程度には高い買い物だった Flash 作成ソフトはあまり使う機会がなくなっていた。最近 Google Maps API を使った「泉北近辺私的観光地図」というページを立ち上げたので、そのページへのリンクボタンを Flash で作成することにした。ボタンの表示を日本語にしたかったので、Sothink SWF Quicker のテンプレートでは作成できない。宝の持ち腐れだった Flash Basic 8 にトライすることにした。
 狙いはボタンの上にカーソルを当てると音が出て、クリックするとリンク先が表示されるようにすることである。これだけのことをするのに、アルツハイマー症的になっている頭では結構時間がかかった。Flash作成ソフトには沢山の機能がついており、エキスパートはこれらを使いこなしていろいろな素晴らしいアニメーションを創られているが、私のような初心者にはなかなか理解が進まない。学習には、以前に買っていた「これで完璧Flash8」という参考書も見たが、 英語版ではあるが teacherClic という Tutorial が有用であった。試行錯誤してようやくできたのが、右サイドに置いている「泉北近辺私的観光地図」へのFlashボタン  である。カーソルがボタンの上に来ると鶯の鳴き声が始まる。クリックすると Google Maps API で作った「泉北近辺私的観光地図」へリンクする、という簡単な作品である。
 気が向いたら、もう少しデザインなどを学習していいものにしたいと思っている。
(追記:2007/10/3)「泉北近辺私的観光地図」のリンクボタンは、その後何度か作りかえている。

2006年12月11日

隠居のFlash:&lt;object&gt; と&lt;embed&gt;

 先日来、右サイドメニューに Flash リンクボタンを置くことを試みている。Flash8 Basic で、日本語表示のFlash リンクボタン・ファイル(xxx.swf)をいくつか作って設置してみる作業である。この作業の中で、エキスパートの方なら常識と思うが、初心者には新たな発見があったので備忘録的に書き留めておくことにした。
 メインページおよびエントリー・カテゴリー・日付各アーカイブのテンプレートでは、リンク用のテンプレートを別に作って readfile している。このリンク用テンプレートでの flash file の設置するためのコードは、引用のように、Flash のエキスパートが提供してくれているものをコピペし、 flash file のありかなどを指示するなどの必要箇所を訂正して使っている。
<!--泉北近辺私的観光地図-->
<span align="left"> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="120" height="30"> <param name="movie" value="http://xxxxxxxxxx/xxxxx/map_03.swf" /> <param name="quality" value="high" />
<!-- LiteboxでFlash を隠す -->
<param name="wmode" value="transparent" />
<embed src="http://xxxxxxxxxx/xxxxx/map_03.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" wmode="transparent" width="120" height="30"></embed></object></span>

   この HTML には、<object>と<embed>という同じようなタグが使われている。この経緯については、高橋 登史朗さんのAllAboutの解説に詳しい。この解説でも分かるように、ブラウザーによって表示が変わる。私の場合、主として編集は Firefox2.0 を使い、サイトの確認は使用している人が多い IE7 で行う。この確認作業で、Firefox と IE では表示が異なることに気が付いた。<object>と<embed>タグ部分で同じような名前の swf ファイルを使っていて分かったのであるが、 IE7 では<object>タグでのファイルが使われ、Firefox2.0では<embed>タグでのファイルが使われる。Netscape でも<embed>タグでのファイルが使われるようである。
 どちらのタグ部分でも同じファイル名にするのは当たり前の話であるが。

2006年9月30日

MTサイドメニューに天気予報のFlashを

 私のブログサイトで使わせてもらっているFlashの横長カレンダーの作者である Kinarie&May さんのサイトを久しぶりに訪問した。サイドメニューに天気予報が格好良く配置されている。最新のFlash作品を探ると Flash天気予報1.10 という Flash が紹介されている。この頃は自分のブログサイトがポータル・サイト化しつつあるので天気予報を取り込むことに飛びついた。早速、PHPとSWFのファイルをダウンロードし、用意されているHTML用ソース作成ページでパラメータを指定した。地域として10の都市を指定できるので住んでいるところと出かけるときに気になる地方および主要都市を指定した。タイトルのバックグランドカラーも指定できるので使っているテンプレートに合わせた。また、できあがったソースのままではlitebox-1.0 を使っているとFlashの画像である天気予報が背景に隠れないので、「隣の花は紅い」のエントリーで記載した方法でソースにパラメータを加えると今度も上手く隠れた。なお、この方法については、「小粋空間」さんのLightbox JS でブログパーツ等の Flash を PNG 背景画像の下に隠すというエントリーに詳しく出ている。
 天気予報のデータは livedoor の Weather Hacks に依存しているとのことだ。 livedoor の継続性( going concern) が気になるところだが。

2006年8月 7日

隠居、新しいFlash MP3 Playerを導入

 今日は大阪は全国で最も気温が高い37℃が予測されている。昨日に続いて、クーラーをつけた部屋で室内DIYをすることにした。

 「音楽方丈記」というブログを開設されているTANさん という方が、デザインの優れた三つのブログで使えるFlash MP3 Playerを紹介されていることは以前のエントリーで投稿した。この中のPlay Tagger by del.icio.usというPlayerはブログ・テキストの横にボタンが設置されるのと、一行のJavaScriptをHTMLに置くだけなので音を出すシーンでは好んで使わせてもらっている。他の二つのデザインも捨てがたいので元ページに遡って利用について調査した。
 FLASH SINGLE MP3 PLAYER はすっきりしたデザインですぐにでも使えそうである。Download した zip ファイルを解凍すると singlemp3player.html が3つの種類の Player をブラウザに表示する。このHTMLのソースコードを開くとそれぞれの Player の object コードがあるので、これを Player を置きたいエントリーにコピペすればよい。MP3 file を置いているフォルダーなどのパラメーターを弄るだけでOKである。もちろん、singlemp3player.swf というフラッシュファイルをエントリーを投稿するフォルダーに置いておかなければならない。

 <隠居、ヒグラシの鳴き声に泣く>というエントリーの Flash MP3 Player を自作のものと置き換えた。また、HPの MUSIC サイトの左フレームにある Flash MP3 Player も置き換えた。

 紹介されているもう一つ alasacreations という Flash MP3 Player の元ページを訪ねるとなんとフランス語である。画像でなんとなく見当はつくが応用するには時間がかかると思い、次の機会にすることにした。 FLASH SINGLE MP3 PLAYER の作者もどうやら EU 圏の人らしい。 EU 圏の作者のデザインは地味な感じで私好みなんですが、アメリカの作者に多い派手なものと異なるのは背景の文化が違うからなんでしょうか。

続きを読む "隠居、新しいFlash MP3 Playerを導入"

2006年7月20日

隠居、新しいMP3 Playerに感激!

 隠居の身にとっては高い買い物の Macromedia Flash 8 Basic を導入したので、MP3 Flash Player をもう少し格好よいものに換えたくていろいろトライしてみた。が、Action Script の敷居が高く挫折しかけていた。Googleで Flash MP3再生 ボタン というようなキーワードでサーチしてみると TANさん という方の「音楽方丈記」というブログに、求めるブログで使えるFlash MP3 Playerが紹介されていた。紹介されている3つのPlayerはどれもすぐに使いたくなるものばかりだが、Play Tagger by del.icio.usは、ブログ・エントリーの文書の中に取り込めるのが気に入った。早速の前のエントリーに取り込んでみた。歳をとって何でもに感激症になっているが、これは感激である。JavaScript と アンカータグだけを書き込めばいいのが特に良い。JavaScript が置いてあるサイト del.icio.usが何者なるものかまだよく分かっていないが閉鎖されないのを祈るばかりである。
下にサンプルを示してみる。
Spaghetti RagというRagtime Piano
堺自然ふれあいの森の鶯の鳴き声

続きを読む "隠居、新しいMP3 Playerに感激!"

2006年5月 2日

MP3 Flash Player

 ウグイスの鳴き声エントリーで使っていた音声コントローラに代わるもっと小さいアイコンのクリックで音声の再生と停止ができないかを調査してきた。調査といってもWebが頼りである。ただ、このような音声系のカスタマイズは、英語の世界の方が数多くの例示があるので範囲を広げた。その結果見つけたMP3 Flash Playerがpickle playerであった。FlashというクリップををWebのページに掲載できることを知ったのはまだ6ヶ月も前のことであるので、Flashの技を競い合っておられる方々が公開されているFlashをなんとか使わせてもらってきた。そのため、Flashのカストマイズは公開されておられる方が許容されている範囲内でしかできなかった。今回のカスタマイズは福井県の学生さんのサイトで教えてもらった。今までのカストマイズとそんなに変わるわけではないが、ボタンに使った画像の色・形とかサイズについて自分で選択することができた。ただ、このカスタマイズはFlashPlayer8対応であり、私が使っているSothink SWF Quickerでは作成できなかった。試用版のMacromedia Flash8をDLして、これを使った。このソフトは欲しいのですが、まともに買えば9万円近くするので諦めている。 (追記)Basic版は25000円ですね。個人ではそれで十分なようだが、それにしても・・・。
 そのうちにきっとSouceTecがグレードアップしてくれると期待している。

続きを読む "MP3 Flash Player"

2006年4月20日

ムクドリ?のさえずり

鳥の鳴き声録音(実験2)

 今の季節、日の出頃にかなりうるさい鳥の声で目が覚める。昨日EDIROL R-1を使って録音を試みた。この鳴き声は多分ムクドリと思うのですが、詳しい方教えてください。どこかで犬もほえているようですが。 <雀のさえずり>で録音再生のこころみを掲載したがどうも気に入らないので、自分でFlashソフトを使って作ってみた。これだとFlashファイル(.swf file)を背景の好きなところにおける(ちょっと苦労したが)ので、ご覧のように写真と同じように録音した場所を指定できる。 また、Netscapeでご覧の方も音が聞こえるはずである。(Netscapeでは鳥のFlash画像の位置がずれる。positionタグはNN6でOKになっているのだが?Netscape7.1のせいかな。再生を停めるには他のエントリーに移るか、画面を閉じてください。swf fileをボタン化すると再生・停止ができるようになるが、まだ十分に学習ができていないので。
 いずれにしても録音技術やWeb(Blog)作成技術を高める必要は感じているが、遊びの幅が広がってきたので楽しくなっている。
今日は春何番かしらないが強風が吹き荒れている。鳥も啼くのをやめたようだ。

続きを読む "ムクドリ?のさえずり"

2006年4月10日

「みんなの写真くらぶ」移転

 hi-hoが提供してくれていた「みんなの写真くらぶ」が閉鎖になる。有料にして継続の話もあったが、結局4月末で閉鎖することになったらしい。このサービスは、ML仲間とオフラインで何かイベントをしたときのデジカメ写真を共有するのに便利していた。また、私はHPからリンクして使ったりもしていた。同様のサービスがNikon等にあるが、許される容量が20MBくらいしかなく、すぐに満タンになりそうである。有料で容量増ができるが結構高い。同じ容量を増やすなら、レンタルサーバーの方が何かにつけ便利なので、Weblogと同じサイトに置くことにした。今のところ、Flashのalbumにするのが比較的簡単そうなので、HPのGardeningページでリンクしているalbumの移転を始めた。取りあえず、春の庭花の写真の半分をSothink SWF Quickerで提供してくれているテンプレートを使ってFlash Albumにした。ただ、一旦albumを作成すると修正が難しいのが難点である。ActionScriptとXMLの基本ぐらいは学習したいと思うが、なかなか難しそうである。
 今月中に順次、移転を進めたいと考えている。 

続きを読む "「みんなの写真くらぶ」移転"

2006年3月10日

隣の花は紅い

クリックすると画面が大きくなります。 ほとんど留守にされてるお隣の梅の木に昨秋、毛虫が沢山付き、糞が我が家のガレージに落ちてくるので、植木の刈り込みをされたときに、お願いして短く切ってもらった。そのせいか、今年の花は、綺麗な紅い花がついた。「梅切らぬ阿呆に、桜切る馬鹿」とかなんとかありましたね。

 ところで、このエントリでは「小粋空間」で紹介されているLightboxというカスタマイズの実験をしている。これはサムネイル画像をクリックすると元の画面が背景にフェードアウトし、クリックした画像が元の大きさで画面真ん中に表示されるというお洒落なカスタマイズである。しかし、タイトル・バナーや右サイドバーのFlashは、背景ではなく表面に出てくる。色々と隠す方法を探しても見つからないが、同じ現象についてのコメントがあったので、私だけの現象ではないようだ。もう少し、調査してみようと思っている。

 なお、Lightbox原作者へのリンクが、急に切れてしまった。リンクが復活すれば3月11日朝復活しました。何か手当が見つかるかもしれない。

 今日は朝から雨模様。また、PCの前で、1日過ごしそうである。

続きを読む "隣の花は紅い"

2006年3月 8日

MTタイトルをFlashに

 昨日、Weblogの各テンプレートのタイトル部分を背景色を変えたりしたが、思い切ってFlashBannerに変更した。Flashの作成は、Sothink SWF Quickerの作成テンプレートを利用した。Banner用のいくつかのテンプレートが用意されおり、テキストや背景が変更できるので独自性の高いものが作成できる。背景には、HPに使っているイぺ材の色合いと木目を配した。これで、タイトルの背景はHPと同じになった。「小粋空間」のテンプレートを導入した頃に比べると色々なカストマイズで独自色が強くなってきた。

 外は良い天気でポカポカとなってきたのに、PCの前で座っている時間が多いので、家内から窘められている。

2006年3月 4日

Flash型カウンター

  Flash形式のカウンターを探していたら、適当なもの(speedさんの作品)が見つかったので、HPのカウンターに設置した。lolipopは、cgiを設定させてくれるので、自由度が高い。
 1昨日から、熱はあまりでないが、のどがイガイガするような風邪を引いてしまった。良い天気だし、梅の見頃だと思うのですが、PCの前で静養(?)している。

2006年3月 2日

MTにFlash 実験_2

HPに掲載していたFlashボタンをMTに持ち込んで見ました。いけるようですね。




2006年3月 2日

MTにFlashを動かす実験_1

HPに掲載していたFlash MovieをMTに持ち込んでみました。HPでのHTMLコードをコピペして、サイトパスを変更しました。



2006年3月 2日

知覧武家屋敷跡

 知覧武家屋敷跡で撮った花などの写真をFlash Albumにしました。

2006年2月25日

月移動横長カレンダー

 Kinarie&MayさんのFlash利用横長カレンダーの設置は、メインページとカテゴリー・ページではうまく設置できたが、個別および日別・月別の設置が、仕様どおりにできていなかった。数日悩んで(浅学故の悩みだが)結局うまくいかず諦めかけていた。この横長カレンダーは、多くの人が設置されており、そのお礼や質問のコメントが、Kinarieさんのブログに多く寄せられている。これらを丹念に見ていくと、私と同じ現象について質問されている方がおられることが分かった。この質問への回答が作者からされており、この回答に沿って手直しをしてみると上手くいった、
 アーカイブ・ファイルの年月日を表すディレクトリーの前に、archives/ というディレクトリーが必要なことが分かった。MTの以前のバージョンからMTを設置している人は、どうやら標準のようであるが、MT3.2ではそのような設定にはなっていないので、上手くいかなかったらしい。
 でも、この世界では無償でこのような作品をつくり、寄せられる質問に丁寧に答えられている人が沢山おられるのにはほんとに驚いた。そして、それを通じてコミニュケーションができているようである。
 そういう作品を創り上げるのは、やっぱり「フロー」の世界なんですかね。

2006年2月23日

月移動できるカレンダー

 Movable Typeの各テンプレートへの横長カレンダーの設置に続いて、これを月移動できるカレンダーに変更した。これは、30代専業主婦のkazukoさんという人の作品である。子供を育てながら、このようなページを作ることを楽しんでおられるようである。このカストマイズにはFLASHが使われている。表示されている字が、老齢者には少し小さいので、時間を見つけてこのFLASHを改造して、もう一回り大きな字にできないかやってみたいと考えている。