シオノギ製薬 ポポンピュメリスペシャルサイト「メグ&ジョー」サイトを会社の仕事で制作しました。
8月もあっという間に終わり、明日から9月だというのに、5月に公開されたサイトに関するエントリー。今更感ありすぎですが、会社のサイトのWorksに載せてもらえたのと、個人的にとても楽しくてやりがいのあった仕事なのでやはりブログに載せておこうと。
私はFlashを担当しました。デザインはyuuri 。
タイムラインアニメーションが見所のサイトです。線がぷるぷるしているのもスクリプトですか?と良く聞かれましたがタイムラインです。線を少しずらした2コマの絵を入れ替えています。スクリーンセーバーはとても気に入っていておすすめ。今でもノートパソコンで使っています。
シオノギ製薬 ポポンピュメリスペシャルサイト「メグ&ジョー」
http://www.pumeri.jp/
wonderfl と、wonderflのjavascript、HTML5、css版であるjs do it 共同でJAM というイベントが現在開催中です。
それの第一回のお題がなんと「人の動作をモチーフに時計を作ってください」というもので、これはホネホネ・クロックを出さないわけにはいかないと思い、ホネホネ・クロックのJS版を作ってエントリーしていたのですが、昨日結果発表がありまして、嬉しいことにSilverをいただくことができました!
JAM Session1 Result Presentation
ありがとうございます!これで一桁秒のホネホネちゃんのがんばりも報われたと思います。(js do itのshareコードを貼ってみたけど、コードしか見えない↓)
ホネホネ・クロック JS - forked from: Human Clock - jsdo.it - share JavaScript, HTML5 and CSS
今回ホネホネ・クロックのJS版を作ろうとしてわかったのは、パラパラ漫画の手法のアニメーションをCanvasを使ってやるのは簡単ではないということ。結局gifアニメを使うお手軽な手法をとってしまったのですが、gifアニメだとfirefox以外のブラウザではフレームレートに制限があるようで、アニメーションがすごくゆっくりになってしまいました。
しかし例えゆっくりでもホネホネ・クロックJS版ならiPhoneやiPadでも見られるんですよね・・・。
また時間のあるときにCanvasを使ったホネホネ・クロックも完成させたいと思ってます。
yuuri.co.uk の人と『ENDLESS NIGHTMARE 』というプライベートサイトを作りました。ちょっと重いサイトなのですが、良かったら見に行ってみてください。
初めて人と一緒にプライベートワークをしましたが、最初にぼんやりとしかないイメージが何倍も良い形のデザインとなって返ってくるのはなかなかすごい体験でした。とても楽しく制作することができました。
ボタン音はMarkさん作。
その他、SEの一部はsoundbible.com のものを使用しています。
Credit
Design: yuuri (yuuri.co.uk )
Flash: chabudai
Special thanks:Mark
http://endlessnightmare.net/
先週の土曜、12月6日の大阪てら子で、BlenderとFLARToolKitを使ってクリスマスにちなんだものを作り、発表してきました。
6月の大阪てら子で発表したやつ の続編です。6月の発表では3Dソフトで作成したモデルデータをFLARToolKitで表示するだけだったのですが、今回はそのモデルデータを動かすところまで挑戦してみました。
まずは以下が最初に作ってみたもののデモ。
WebカメラとFLARToolKit用のマーカー(→こちらから )が必要です。
FLARToolKitで3Dモデル動かすデモ01
Webカメラ持ってねーよもしくはマーカー印刷すんのめんどいって方のためのデモ動画。
一応モデルデータや雪を動かしてますが、これはスクリプトで回転させたり移動させたりしているだけなので、技術的には前回の発表とほとんど変わりないです。
今回初挑戦したのはBlenderで作成したアニメーションをFLARToolKit上で動かすというもの。以下がそのデモです。
Read more »
大阪てら子17で発表した時計、ホネホネ・クロックです。honehoneちゃんというもじもじくんみたいなキャラクターが数字になっているという時計です。
1→2→3・・・9→0 という一方向のみのアニメーションしか作ってないので、59秒から00秒になるとき、24時から00時になるときなどが見所です。
小さくしたら、まあ、か・可愛いかな・・・と思いブログパーツにしました。
背景透明バージョン
白とか薄い背景におすすめ
背景白バージョン
黒とか濃い背景におすすめ
貼り付けるコードはこちら↓
JAVASCRIPT:
<script charset="Shift_JIS" src="http://chabudai.sakura.ne.jp/blogparts/honehoneclock/honehone_clock_tr.js" ></script>
背景透明バージョン
JAVASCRIPT:
<script charset="Shift_JIS" src="http://chabudai.sakura.ne.jp/blogparts/honehoneclock/honehone_clock_wh.js" ></script>
背景白バージョン
時間、分、秒をロールオーバーすると拡大するユニバーサル機能?付きです。