/* naname */



 

rotate(Math.PI / 4);なグリッドデザイン



イントロやスクロールした時にピースが組まれていくモーションが小気味良い。
たまには傾いてたっていいよね。
中ページのシンプルなレイアウトもかっこいい。

 

寄り引きの演出



最近ラジオでよく流れている、圧倒的で感動的な~のフレーズが印象的なRADWIMPSの「会心の一撃」のミュージックビデオがよかった。
ストーリー性や多彩なキャラクター、アニメ的な演出もすごく面白いんだけど、僕が気になったのは投球シーンなどに見られる引きや寄りの演出。
ピッチャーの投球に合わせてカメラもグっと引くんだけど、さらに背景のレンズによる歪みがキャンセルされたり、背景の画角も微妙に動いていたりして、動きが立体的に感じられる。
最近ウェブでは視差効果(パララックス)が流行っているので、さらに奥行き方向への演出としてこういった見せ方を取り入れてみたら面白いと思うんだよね。

しかし問題は、すでにFlashがお亡くなりな状況にも関わらず未だにIE6を捨てられないクライアントが多数いるというチグハグなウェブデザインの現状に於いて、いかにして画像の歪みアニメーションを実現すれば良いのか、ということなのだ・・・。

 

な、夏目有神帳・・・?



声優と内容があんななもんだから、開始数分は妖怪を倒せるようになった夏目の話なのでは、と思ったけどぜんぜんそんなことはなかった。

サイトのデザインがなかなかかっこいい。
マウス位置によって背景が視差効果入ってたり、右側の「彼岸をのぞく」をクリックすると蠖シ蟯ク繧偵�縺槭¥な事になったり、仕掛けも凝ってる。
アニメのオフィシャルサイトってテンプレなデザインや作りなことが多いんだけど、こうやって作りこんでるとアニメの出来にも期待しちゃうね。

ちなみに一話の出来はなかなかよかった。
正直期待してなかったんだけど、キャラはよく動き、話のテンポもよくて面白かった。
しかし今期ボンズは2本もやっててスペースダンディの方もクオリティ高いけど、最後までこのクオリティを保てるのだろうか。

 

wordpressめもめも : functions.php



//管理画面で更新情報を表示しない

add_filter( 'pre_site_transient_update_core', '__return_zero' );
remove_action( 'wp_version_check', 'wp_version_check' );
remove_action( 'admin_init', '_maybe_update_core' );

//画像アップロード時指定したサイズの画像を生成する

add_image_size( $string, $width, $height, $boolean);
// $string -> 呼び出し時のキーワード
//    wp_get_attachment_image_src($attachment_id, $string);なときに使うぜ
// $boolean -> 
//   ture : 画像をトリミングしてでも指定したwidth/heightにするぜ
//   false: そこまではしないで拡縮だけだぜ

get_post_meta(the_ID(), $key);

$keyで指定した名前のカスタムフィールドの値を取得する、だけじゃなく
a:3:{i:0;s:12:"Dodonpachi";i:1;s:11:"Ketsui";i:2;s:6:"Espgaluda";}
のフォーマットのものも配列化して返ってくる。

 

Flashでフォントブラウザをつくったよ



フォントブラウザなんかすでに世の中にいっぱいあるんだけど、任意のフォントをブラウザ上で見比べられるようなのがあればいいのになーと思ってつくったよ。

ぷ D3 FONT BROWSER β

  1. ヘッダに文字を入力
  2. 表示したい書体を選択
  3. いらない書体は選択済みの書体名かプレビューをクリックで削除

こんな感じで操作できます。

つけたい機能とか色々あるんで適当にぼちぼち追加していく予定。

続きを読む

 

Flash上で右クリックする用のUser scriptをつくったよ



なんかflash – enable mouse-gestureが動かなくなってたので作ってみたよ。
とりあえずFirefoxだけね。Chromeは…なんで動かないのかな、そのうち対応しよう。

http://usosake.net/userscript/d3-appendiv.user.js

Flashが貼ってあるページで左上にDIVのレイヤーが表示されるのでそこで右クリックしてね。
ジャマな時はクリックすると消えるよ。
このDIVを起点にすればマウスジェスチャーも使えるよ。
全面にDIVのレイヤーがオーバーレイするのがイヤだったのでこんな仕様になりました。

最低限の機能しか実装してないので、ちゃんと動かない場合もあるかもです。
自分で使ってて不便だったら適当に修正・更新すると思います。

またwmodeの追加とかしてないので、wmodeが設定されてないFlashでは機能しないかも。

一応補足ですが、GreaseMonkey入れてください。

———–
20110205:つくったよ。
———–

続きを読む

 

docomo wifi



NTT ドコモのpocket wifiのプロモーションくちこみサイトです。
twitterとかのpostを拾ってきてるみたい。
ただ単に書き込みを表示するだけじゃなくて、こうやって動かすだけでワクワクする感じがしてきていいね。
特定のキーワードだけ文字色が変わる演出もビジュアル的にメリハリが出ていいなあ。
あとこれだけのテキストを同時に動かしても重く無いのもなかなか。

 

タイポグラフィとポートフォリオ



インパクトあるなあー、と思って。
操作は基本ドラッグで。

 

ボールプール的な動き



マウスを避ける動きもHTML5とJavascriptでのこういう動きも別に今更珍しくもないんだけど、弾むように大げさに動くし、なんかカラフルなので、ボールプールを思わせる賑やかさや無邪気さが演出されてて、マウスを動かしてて楽しかった。