Hatena::ブログ(Diary)

三等兵

2010-08-08

JavaScriptだけで桜な長編ウェブページアニメーションを作ってみました

http://www.sandai310.com/


あらすじ

どこかの三等兵が戦場で死に続ける物語。


「廻りまわりいつまでも、私はあなたを天国へいかせたいだけなのにいつまで地獄を選び続けるの?

「キミも天国にくるまでさ


どこか国のどこか戦場。人の心に愛があり、人の歴史に争いがあり、人の世に異常があり。いつまでもそれは繰り返す。廻りまわりいつまでも。


JavaScriptだけで作った桜咲くウェブページ長編(JSにしては)ファンタジーアニメーション・・・もどき。


快適にみるための要件

  • 元気なPC
  • さりげないネット環境(画像と音源を最初に読み込む。全部で16,7MBぐらい)
    • 画像重い
  • 推奨ブラウザ:Googole Chrome4.1+、Opera10.5+、Firefox3.6+
    • IE6は透過png関係などで無理。IE7、8はエンジンがあれだし暗黒仕様となっているので非推奨
    • IE9やsafariは未確認
  • Flashのバージョンは9+なら大丈夫だとは思うけどやっぱ最新で
    • 音源はさすがにFlash使う
    • ブラウザによっては一度表示されないと動作しないこともあるので、そういうときは下までスクロールして表示させてください。右下にあります
  • JSだからiPadでも見える?モバイル系はやっぱ無理かな
    • そうだiPadちょうだい><
  • ブラウザ落ちても大丈夫な状態で。私はまだこれでブラウザが落ちたことはないけど念のため

thanks

こちらのsakuraという音源をお借りしました。その他良質の音楽ばかり。CDかデータ配信で音楽の販売予定みたいなので買いましょう。さあ買いましょう。


黒い人はこちらをいただきました。ありがとうございます。


経緯

  • 2009/11月下旬。ムームードメインの安売りでドメイン買って、スクリプトでも置こうかなと思ってたら手違いで全部デリート。サルベージするほどたいしたものではないし放置
  • 12月。ドメインもったいないからサイト作るかとページデザインだけした
  • 12月。飽きためんどくさい
  • 2010/1月。めんどくさい
  • 2月。がんばれ日本!(冬季オリンピック)
  • 3月。めんどくさい
  • 4月。めんどくさい
  • 5月。めんどくさい(実は卓球の世界選手権とかあった)
  • 6月。がんばれ日本!(W杯)アーンド自分!
  • 7月。私はやればできる子ーーーー!!
  • 8月。甲子園!←いまここ
  • 11月。たぶんドメインを更新すべきかどうか迷う

怠惰に過ごしながらアニメーションやってみようかと3月ぐらいに思いついたので4月に完成すると思って桜をメインにしたら、かなりの自堕落で真夏になった。暦では秋になった。月日経つの早すぎ。

主に6,7月にがんばりました。ただ、アニメーションなのに絵なんてまともに描いたことない。予想をはるかに超えてほぼ図工のお時間。こんなはずではなかった。マッドにプログラミングするつもりだったのに。


目的とか

どうでもいいだろうけど一応GIFアニメないよってことでソースコード。

http://www.sandai310.com/sandai310.js

技術や知識がないとりあえず動け精神な初級者なので、高速化とかわからないし汚いです。そういう技術があったらもっと軽く滑らかに動作させることができたんでしょうけど。

それでもJSでやった目的としては自分が書いた純粋なJSで何かやりたいなと。JSだけとかいっても音源はFlashですが(仕方が無い)。自分が書いたとかいってfeedも横着してGoogleさん助太刀ですが(これは怠惰)。透過系もライブラリ使ってますが。(IE6だけ)

あとはイメージしたことを形にできるかどうか勉強に。またHTML5とかCSS3とか使わずクラシカル(そう古くもないけど)な技術で何か今のうちに残せたらなと。というか最先端技術なんて知らない。先端恐怖症なのでした。実は。


・・・ということでこのようにいろいろあるんですが、一番は思いついてしまったからやらないとなんかすっきりしなかった。でもJSでこんな長いものやるなんて罰ゲームだなと思った。マッドだった。もう二度とやらない。アニメーション怖い。

内容に関しては全体的に地味でいろいろ微妙なのですがもう疲れたよパトラッシュ。ストーリーは何度か見ればなんとなくわかるかもしれないし、わからないかもしれない。

自分では分かりにくいだろうなと思うんですが・・・。こういう具合であまりたいしたものではないけれども、気が向いたときにでもほのぼのと見ていただければうれしいです。

スパム対策のためのダミーです。もし見えても何も入力しないでください
ゲスト


画像認証

トラックバック - http://d.hatena.ne.jp/sandai/20100808/p1
Connection: close