Home > website

website Archive

IMAGE DIVE さんリニューアル

imagedive.jpg
「IMAGE DIVE」

さんのサイト、リニューアルされてたんですね。

全文を読む

30days Album

30days.jpg

paperboy&co. さんが4月10日にリリースした「30days Album」が素敵です。

複数アップロードや読み込みの速さ、キーボード操作や直感的な UI 等、機能面の素晴らしさはネタフルさんはじめ、いろんなサイトで言及されているので、違うことを書いてみます。

全文を読む

Design and the Elastic Mind

moma.jpg

MoMa の依頼で tha 社が製作した作品展示コンテンツ。もう皆さん見ましたよね。

全文を読む

Powers of Information

poworsofinformation.jpg

もとは美術館のキオスク端末用コンテンツらしいので、1920px×1080pxの画面解像度がないと全体が見れないのですが、とても素敵なサイト。

黒と赤の色使い、左に英語、文様には和を感じ、BGMが宇宙的、ボタン効果音が「ミョーン」「ヴァー」、これが絶妙な世界観になってます。デザインの力ってすごい。

素材の良さと情報設計(IA)とトゥイーンと音とがストレスなく気持ちよく構成されてます。いいなぁ。

自分のエンブレムが作れる「Scion Speak」

scionspeak.jpg

Scion Speak」は西洋風のエンブレムが作れるエンブレムジェネレーターサイトです。綾鷹の「家紋ジェネレーター」も思い出されますね。

全文を読む

100チアガール

100cheer.jpg

100チアガール|転職応援サイトイーキャリア

UNIQLOCK」「AXE WAKE-UP SERVICE INC.」に続き、「Flash が凄いから紹介するのか、女の子が可愛いから紹介してしまうのか、なんだかよくわからないけど紹介してしまうサイト」、サイト企画者の術中にはまってますね。

全文を読む

平均顔を作れる「Make An Average」

MakeAnAvarage.jpg

Make An Average」は2人以上の人の顔を合成して平均の顔を表示してくれます。学術的な研究のサンプル募集も兼ねて公開しているサイトっぽくて、メンバー登録すれば自分の顔写真のアップロードも可能。

全文を読む

Mr.doob はとても勉強になります

mrdoob.jpg

Flash/ActionScript 3.0 でいろんなサンプルを公開している実験サイト (experimental site) である「Mr.doob」。既に有名なサイトですが、中にはパッとアクセスしてトップのサンプルだけ見て閉じちゃった人もいるかもしれないので、ちょっと紹介しておきます。

全文を読む

FLIGHT404

FLIGHT404」は、processing をメインに使われている海外クリエイターさんのブログ。全記事スゴいんですけど、「Solar, with lyrics」に驚きました。一番下にビデオファイルがあるので、それを再生して見ましょう。(via: dainouti さんの del.icio.us)

追記:
「これリアルタイムには無理やろ〜」と記事もろくに読まずに思っていましたが、やっぱり事前解析してから再生させているんですってね。(via: IDV-DESIGN | .index - Flash で SOUND VISUALIZER:音解析して XML で取得できる the echo nest って API の紹介もされてます。)

全文を読む

BEYES Watch the world | RECOMMEND 60 BEYES EDIT STORE

watchtheworld.jpg

BEYES Watch the world」ということで、世界各国の時計を紹介しまくるサイト。

制作は、むらけん様と& Metamosphere の Yu-ki 様

全文を読む

MyMiniCity

myminicity.jpg

ネット上に自分の都市を作れて、人工増加や歳入を増やして楽しむ Flash サービス「MyMiniCity」。

あぁ、オンライン版のシムシティーね、と思いきや違った!口コミマーケティングを考える上で勉強になる工夫が。

僕も今から発展させてみます。

全文を読む

こえ部

koebu.jpg
「こえ部 声で遊ぶコミュニティ」

KAYAC さんが始めた「みんなの声を集めて聞ける」CGMサイト。
いや〜、会員登録システムとか、いろんな音声アップロード機能とか、ブラウジングしやすい UI とか、なんでも作れる開発力が凄いですね。

全文を読む

伝(つて)

tsute.jpg

中部学院短期大学の学生さんが中心となって岐阜県関市のフォトアーカイブをしていくプロジェクト、のサイト。「伝(つて)

タグ付けされた写真(情報)の見せ方が新鮮かつ合理的で興味深く拝見。

と思ったら、制作されたのはいつも僕がお世話になりっぱなしの メディアパルサーの茅原さんでした。

全文を読む

年賀状を届けにいくよツアー2007

naggg1.jpg

昨日クリスマスコンテンツを紹介したので、今日は正月コンテンツを(といっても2007年のだけど)紹介させていただきます。

blog.naggg.jp」というとても勉強になるブログも書かれている京都のクリエイターさんのコンテンツで、ユーザーが自分の住所を入力すれば、京都からチャリで年賀状を届けてくれるという「年賀状を届けにいくよツアー2007」。

高い技術力とおもてなしの精神で気持ちがほっこりする京都らしいサイトです。

全文を読む

クリスマスメッセージツリーを相手に送れるサービス

growaxmastree.jpg
「Grow a Xmas Tree」

キーボードで好きなメッセージを打ち込むとクリスマスツリーが形作られ、完成したら友達にメッセージカード(サイト)として送れるコンテンツ。(via: typecode blog 様)

全文を読む

Alternativa3D Flash engine

Alternativa.jpg
結構重いのでご注意

同社が制作している MMORPG のための FlashPlayer9 プラットフォームの3Dエンジン。

全文を読む

ユニクロ UT: UT GRAND PRIX

ユニクロ UT: UT GRAND PRIX

1000デザインのTシャツの中からユーザー投票で100作品を選出し、次のステージに繋げる趣旨のコンテンツ。
毎回毎回ユニクロのキャンペーンサイトは凄いですね。ユーザーの心を読んでいるかのようです。

全文を読む

エアテルミン

airtheremin.jpg

KAYACブッコミイレブンさん発の Web カメラを使って遊べるサイト。「エアテルミン」が公開。

AS3の機能を活用した素敵な使い方ですね。

全文を読む

hers design tour

hers.jpg

大阪、東京にある「ハーズ実験デザイン研究所」の Web サイト。お恥ずかしながら社名は初めて知ったのですが、掲載されている製品は AXIS 等のプロダクト系雑誌を開けば載っている類いのハイデザインなプロダクトばかり。自分は大学でプロダクト専攻だったりしたので、それだけで興味津々ですが、サイト自体も丁寧に作られていて、楽しい操作体験を楽しめました。

制作はいつもいろいろお世話になっている大阪の gd | genephics design,Inc. 様。尚、gdさんのサイトのロゴは、(って言っていいんでしたっけ?)

全文を読む

ANTEPRIMA

anteprima.jpg

ANTEPRIMA の秋冬シーズン用サイト。奇麗な写真やビデオを使ったラグジュアリーなサイトです。

最近は RIA(リッチインターネットアプリケーション:「リア」って呼んで OK らしい) の方向へも広がりつつある Flash ですが、このサイトのように、写真や映像で魅せるコンテンツはやっぱり Flash が効くなぁと思います(UNIQLO さんもそうですね)。クライアントも喜ぶし、制作者も技術的にも作りがいがあるし、サイト訪問者もリッチで素敵な体験ができるし、僕みたいなFlash好きも唸るし、みんなハッピー。「素材を最高の形で見せる」というのは凄く大事。最近スクリプトばっかり見てる気がするけど、こっちの勉強こそやっておかないとなぁ。

こういう方向性に凄く憧れます。AIR や Web サービスに興味を持ち始めている今でも group94 のお仕事とか大好きですし、その方向性は RIA がブレイクしても変わらずメジャーであり続けると思う。

こちらのサイトは全部英語(日本語版もありました)ですが、いつも ANTEPRIMA さんのサイトを手がけられている会社さんかな?ファッション写真の使い方が上手くて、ビデオ素材も活用して、裏では CMS を動かしていたりされている、羨ましいノウハウをお持ちまくりの制作会社さんかと思います。
→追記:kawamura さんに教えていただきました。やっぱり FICC 様でした。

全文を読む

Hungry Suitcase

hungrysuitcase.jpg

3DCG&FLVを多用したリッチなサイトでもあるけれど、僕の考える「Flashの使いどころ」の好例に思えたのでエントリしてみました。(via: FWA

全文を読む

WORLD UNIQLOCK

uniqlock.jpg

UNIQLOCK キャンペーンに「WORLD UNIQLOCK」コンテンツが追加されています

最近「Flashブログパーツ推進運動」をひとり勝手にやっています。
当然 UNIQLOCK ブログパーツ 公開時も紹介しようと思ったのですが、すでに周りの人が紹介しまくっていて、特に付加できる解説も書けそうになかったので、紹介は見送っていたのですが、さすが Webキャンペーンサイト大御所の UNIQLO さん。第三波が(いろいろされてるから正確に第何波なのかは不明)やってきまして、これがまたスゴイ。(via.. というか制作された apeirophobia様のブログ)

全文を読む

シンプソンズのキャラになれる

simpsons.jpg

Simpsons Movie のサイトの「CREATE YOUR SMIPSONS AVATAR」から、自分のアバターが作れます。作ったアバター画像は JPEG 形式でダウンロード可能。

全文を読む

Verizon Action Hero

actionhero.jpg

通信会社「Verizon」のキャンペーンサイト。映像を駆使したコンテンツを使って、ブロードバンド普及促進をアピールする狙いがあるのだと思うのですが、コンテンツが秀逸で驚きます。

自分の顔写真を、アップロードすると、その顔を3D化、自分の顔が主人公になって、大活躍するアクションムービーを生成して、友達に紹介できるという、コンセプト&技術力ともにグッとくるコンテンツです。

これはスゴイと思い、試してみました。

全文を読む

GRAND LIFE 平屋という選択。

grandlife.jpg

控えめなBGMとゆったりと心地よいイージングモーションと写真の表示のさせ方で、サイトの品の良さを感じさせてくれるサイトですね。

全文を読む

MAKIBISHI COMIC | マキビシコミック

makibishi.jpg

アート方向な Flash サイト。クリックできる部分を探して探検してください。惑星を回す感じとか、地下に潜っていく感じ、近景と遠景の表現も気持ちいいです。

開発者にもアーティストにも表現の場となり得る、「Flash」 というアプリケーションはやっぱり楽しいなぁとしみじみ。

FICC inc.

ficc.jpg

東京の制作会社(クリエイティブ・ソリューションプロバイダ)の FICC 様のサイトがリニューアル。Flash と CMS の連携をはじめ、Flash をやっている人、デザインが好きな人、IA に関心のある人みんなの興味をそそる素敵なサイトです。(via: A LOT 様

全文を読む

Get the Glass!

getTheGlass.jpg

すごすぎです。FWA の Site of the Month に輝く、完成度のもの凄く高いサイト。ハイクオリティな 3DCG のムービー&すごろくゲーム。サイコロをふるだけでも気持ちいいです。

こういうサイトが作れるなら、あばら骨の2,3本ぐらい折れてもいいやって思うぐらいリスペクトな凄いサイト。

全文を読む

Oneover.com

oneover.jpg

ロスのデザイナーさんのポートフォリオサイト。手がけられた案件と、自身の実験作品を展示されています。(via: FWA)

画面右上の「option」から、サムネイルのメニューインターフェースを動的に変更できます。背景の変更、ソート機能も付いています。おそらくXMLなりで今後のコンテンツの追加も簡単にできるようになっているのでしょうね。
データとデザインを分けておくことのメリットがよく分かるサイトですので、新人研修時の参考サイトにどうでしょうか?(かく言う私も新人です。)

伊武雅刀さんのオフィシャルサイト

ibu.jpg

制作は AC部様。別件ですがAC部の中の方のインタビュー記事もありました。映像出身の強みを全面に押し出されたようなサイト。気持ちがいいです。

全文を読む

地下鉄がおもしろくなる 東京メトロこども大学

metro.jpg

小学校高学年向けに、地下鉄や環境問題を解説してくれるバーチャル学校サイト。

このサイトのような学習サイトだけでなく、Web サイトを制作する際の、制作者側の心構えみたいなものを示してくれている好例だと思います。

全文を読む

DrawingArt // Listen The Silence

drawingart.jpg

スロベニアのWeb制作会社「DrawingArt」さんのサイト。(via: FWA

分かりやすいサイト構成や細かいギミック、ポートフォリオに個別URLを持たせているのも素敵ですが、何より BGM に心奪われます。

全文を読む

Flash製の3Dゲームエンジンのサンプルサイト

renderhjs.jpg

Flashで作られた3D空間上で、キャラクターを操作できるという、ゲームインターフェースの実験作品。上位アドレスを見る限り、ドイツ語圏のデザイン&アートの大学の研究作品なんでしょうか。Papervision3D等の有名3Dエンジンを使っている感じではないそうで、凄腕の学生さんが自作した3Dエンジンなのかもしれません。

クリックした場所にキャラクターが移動したり、配置されたオブジェクトに3Dズームインしたりします。まだβ版らしいので、後日さらにパワーアップしているかもしれません。

情報元は、Papervision3Dいろんなサイを作られている「UnitZeroOne」さんのブログです。

TBWA HAKUHODO

博報堂さんの関連会社「TBWA HAKUHODO」のサイトがとてもクリエイティブ。クオリティの高いコラージュアニメーションサイトです。プライバシーポリシーを読んだら、許可とらないとリンクもキャプチャも駄目っぽいので、興味のある方はお手数ですが各自ググって見てください。

全文を読む

DARAO

darao.jpg

YouTubeをだらだら見れるWebサービス「DARAO」がオープン。プリセットされたチャンネルだけでなく、「YouTubeまとめサイト」からビデオを取得できる機能もついています。ユーザーによるカスタマイズの余地を残してくれるサービス設計がぐっときますね。そんなダラオ君のために気配りされたサイト「DARAO」、制作はさくーしゃさん

時期を同じくして、はてなも「Rimo」を開始していますが、両サイトとも、YouTubeのAPIを利用することで、各自のメディア(放送局)を展開されています。
誰もが自分のメディアを持つことができる、そんな時代の到来を確信させてくれますね。

全文を読む

SIGMA SD14

sigma.jpg

デジタル一眼レフカメラの SIGMA SD14 の特設サイト。オープニングが好きです。オープニングのイントロFlashは駄目だっていう意見もあるけど、このサイトのようなクオリティなら全然OKですよね。

参考:a-blog with F さんのdel.icio.usより

全文を読む

Sire

sire.jpg

オランダにおける児童虐待への関心を高めることを目的に制作されたFlashサイト。Sireというオランダの非営利のNGO団体が、広告やWebのクリエイティブエージェンシーの協力を得て制作・運営しているそうです。

全文を読む

Nokia 6133 - Push To Start

nokia6133.jpg

Nokiaの携帯電話「Nokia 6133」のキャンペーンサイト。3つのミニゲームが楽しめます。

以降の記事中にサイトのネタバレがあるので、先にリンク先を体験してみてください。

全文を読む

Julian Red

julianred.jpg

ユーザーインターフェースのデザインが新鮮でした。実際は数個の映像のタイムラインを操作しているだけなのですが、サウンドシーケンサーを連想させるUIデザインなので、操作するという行為に目的を感じてしまう(ちょっとVJ気分になれる)。だからついつい操作してしまう。うまいなぁ。

コンテンツの容量が大きい時の対処法として、ローディングが完了した部分でユーザーを遊ばせておきつつ、裏で続きをローディングしていく手法も参考になります。

制作者の立場から - ブロックノイズの出方から見て、flv埋め込みのような気もするけど、FACEsさんの記事を拝見する限り、このサイトの画質&パフォーマンスの良さは異常。何か必殺技を使っているのだろうか。

ABSOLUT.COM

absolut.jpg

ウォッカのキャンペーンサイトで、クリエイターとコラボした企画をやっているようなのですが、メニューが Cover Flow してます。この表現をFlashで再現するのって、結構難しいんですよ。かなり僕の作りたい理想に近いのですが、鏡面部分どう処理しているのでしょう?

前回のエントリ「Sandyで台形変形してみたのですが」以来、放置気味になっていますが、僕の「Cover Flow再現プロジェクト」の進捗報告をさせていただきます。

全文を読む

.:: DUBOISmeetsFUGGER ::.

duboismeetsfugger.jpg

シンプルでコミカルなキャラクターを使ったベルギーの広告制作会社のサイト。場面転換のアニメーションが小気味良くて楽しいです。コンテンツ自体のボリュームが少ない場合に有効な手法ですね。
画面遷移はアニメーション(ユーザー待機)で、遷移後はサクサクブラウジング(ユーザーにストレスをかけない)という区別がしっかりできているので、気持ちよくサイトを巡れます。

こういう「手作業感のある作り込まれたサイト」を見る度に思うことがあります。

全文を読む

ニコニコ動画(仮)

ニコニコ動画(仮)」はYouTube動画の時間軸上の、好きなタイミングにレスを入れることができるWebサービスだそうです。

pickles weblog」さんより知り、重複で申し訳ないのですが、あまりに感動したのでエントリ。

全文を読む

group94とその周辺

group94.jpg

ベルギーの超有名なウェブ製作会社gruop94のトップページが(一時的に)リニューアルされています。

これからのWebサイトの流行・方向性を見せてくれるリーディングカンパニーだと思っているので、その動向には注目し続けているのですが、どうやらVideoCastがアツイのでしょうか。クールな加工をした全画面動画サイトになっています。

全文を読む

UNIQLO BLOG PARTS

UNIQLO BLOG PARTS

制作陣の知名度もあって、僕の中ではアパレル関連のサイトでトップクラスなUNIQLOが、ブログパーツを公開。制作はCUPPY(&KAYAC)さん。

全文を読む

monoface | shuffleface

monoface.jpg

新年のグリーティングサイトらしいのですが、スタッフの顔を使って福笑いができます。その写真の処理スキルがとてもハイレベル。没頭して遊んでしまいましたが、実際にスタッフ本人と知り合いだったら、もっと楽しめるはず。そういう意味で、グリーティング(知人への挨拶)コンテンツとしてグッドチョイスですね。あと、顔の彫りの深い外人さん達だからこそのコンテンツですね。

本サイトの方も、シンプルで直感的なインターフェースで、良い感じです。

What Noise???

whatnoise.jpg

直感的に操作できる学習系ゲームが3種類あります。

いいデザインのサイトだなぁとプレイしていたら、実は重要なメッセージが秘められていました。記事の続きを読む前に、まずは実際にプレイしてみてください。

全文を読む

UNIQLO MIX: MIXPLAY

uni_mixplay.jpg

「ユーザーの操作を記録しておいて、後から再生できる」ことにより、友達に教えたくなる効果を狙える点で、最近流行の筆順再生と同じ方向性ですね。こういったコンテンツの悩みどころは、ユーザー作った作品が偶然的にアート(クオリティの高い作品)になって喜んでもらえる工夫、それでいてサイト制作者側の誘導を感じさせずに、ユーザーが主体性を感じれる工夫、この辺のバランスが口コミ効果にも影響しそう。

via 「A LOT: UNIQLO MIX : MIXTAPE」様

.:PIXELME:.

pixelme.jpg

立方体をモチーフに、ユーザーを楽しませる工夫が満載の、見ごたえのあるサイト。ローディング画面からすでに楽しいです。

サイト全体が、ベタ塗りのグラフィックだけども、素材は3Dソフトで作った感じですね。立体感のある動きをするので意表をつかれます。僕が以前から憧れていた手法です。

立方体が10個並ぶメインメニューの上段中央の「maken!」コーナーでは、「お絵描きツールの理想型」と言ってもいいぐらいの機能が満載です。ペンツール、エアブラシ、オブジェクトの配置と拡大縮小、描画逆再生によるアンドゥ(全部がlineToなので可能。かわりに消しゴムはできない仕様かな)。できた絵は保存できて、メインメニューのmuseumコーナーにて描画順に再生されつつ閲覧できます。

各コンテンツへの画面遷移が、全て違っていて、アニメーションのつけ方も素晴らしいので、思わず全コンテンツを見てしまいます。

MOTORAZR

motorazr.jpg

12月発売予定のモトローラーの携帯電話「FOMA M702iS」のサイト。フルFlashのサイトなのですが、外部のブログ記事を取り込んでくる「MOTORAZR オープン・ボイス」コンテンツが素敵。

全文を読む

ROXIKさんのPICTAPS

ROXIKというサイトの城戸さんというクリエイターさんが制作された「PICTAPS」がもう世界的に見てもすごいです。BIT-101も絶賛MXNAでも紹介→世界レベルで絶賛!ということになりそうですね。
DIGITAL TOYS」という切り絵のような表現のサイトも制作されていて、こちらも凄いオリジナルな世界観のある作品。一体、どういうバックグラウンドで、何を勉強すれば、こんな凄いスキルとアイデアに辿り着けるのでしょうか。僕は凄いサイトを見たらモチベーションが上がるタイプなのですが、「PICTAPS」を拝見した後は、あまりのレベルの高さに凹みました。道のりは長いなぁと。

ここ数年、Blogの流行もあって、会社単位ではなく、案件や作品を手がけたクリエイターさん自身に注目するようになってきてる気がします。昔だったら「この会社で働きたい」と考えていたのが、今では「このクリエイターさんのいる会社で働きたい」という感じ。まぁ「このクリエイターさんがいる(いた)会社なら、僕もそのレベルまで鍛えてもらえそう」という自己中な動機もあるんですけど。

僕は業界のことはよくわかりませんが、制作会社ではなく、在籍されているクリエイターさんを指名するようになってきているんでしょうか。将来的にはクリエイター同士のネットワークやmixiのコミュニティ単位で受注するみたいな感じで。そうなると、たぶん作業効率もギャラもモチベーションも上がるのかもしれませんが、問題はそのコミュニティに入れないと食えないんですよね。怖っ!

FlashDen

flashden.jpg

制作者が作ったFlash素材・音素材・ビデオ素材・フォントを販売できるコミュニティサイト。ソースの登録・ダウンロードともに会員登録が必要ですが、各素材ともなかなかのクオリティ。加減速するスクロールバーやXMLメニュー、オーディオプレイヤーやフォトギャラリーなどのユーティリティーや、(かなり自己主張するであろうw)Flashボタン素材の作り込み具合もスゴイ。
それぞれの素材の価格は「1 Flash Den = 1ドル」換算なので、ほとんどの素材は何百円という安さ。売り上げの25パーセントが素材制作者に入り、売り上げによってパーセンテージが上がっていく仕組み。

僕の感想:
「ここのサンプル組み合わせるだけで要領良くそれなりのFlashサイトができるなぁ。自分で作れんこともないけど、何百円なら費用対効果を考えるとお得かも。でも他人のソースをカスタマイズしていくのは逆に面倒かも。その点、音とかビデオ素材は良いね。でも海外サイトやし、領収書とかどうなるの?」

また、サイト内には、一般公開されているチュートリアルコンテンツもあり、「LearnFlash.com」のビデオチュートリアルもなぜか見れてしまう。ラッキー。

Stomp Stamp

stompstamp.jpg

子供服・靴・バッグ・雑貨などを販売しているお店「Stomp Stamp」のサイトです。

制作された「.spfdesign」さんのBlog経由で知ったのですが、制作者ご本人がサラリとおっしゃっている、
「おこさんのいらっしゃる方は次々と出てくる絵をなにか当て相っこするといいです。」
という一文に感動しました。

全文を読む

FACEs

faces.jpg

バスキュールに在籍されているFACEs(チーム?)のメンバーさんによる、Flash関連ブログ「FACEs」が、11/1にリニューアルオープンされています。 FACEsさんといえば、XMLソケット関連のコンテンツで、相当昔からリスペクトし続けてきたのですが、従来のマルチユーザー関連のネタに加え、バスキュールでの案件のルーチンなど公開されていく予定だそうで、ますます興味深くなっていきそう。連番画像をアニメ配置してくれる便利なflashコマンド(jsfl)をはじめ、すでに素敵なネタがどんどんエントリされてます。

「Adobe Max 2006」に行かれた方のレポートの中の参考リンクとして、ラスベガスどころか大阪からも一歩も出ていないヒッキーな当ブログへのリンクがあり、「小さな奇跡」だと喜んでおります。

Flash 9 PSD Importer」とか「FlashとAfterEffectsとの連携」とか「Spryの呼び方」「Adobe Soundbooth」あたりのエントリを読んでいただいたのでしょうか。どうもありがとうございます。

M Studio

mstudio.jpg

ニューヨークのWeb制作会社のサイト。シンプルかつ迷わせないサイト設計とインターフェースの気持ちよさが僕のツボです。こういうサイトの素敵さって、同業であるFlashクリエイターには伝わると思うのだけど、一般の人はどう感じるのだろう。このキャプチャ画像を見ただけで、インターフェースがなんとなく分かる層もそれほどいない気がするし。そういうヘビーユーザーとライトユーザーとの「ツボ」の違いが最近気になってます。

NIKE iD

nikeid.jpg

パーツを選んでオリジナルのシューズを作れる「NIKE iD」ですが、「NIKE COSPLAY」コンテンツが素敵です。作りこんだジョークなら、ユーザーにも許してもらえる、それどころか好感度につながるという好例。

「ユーモア+技術力」僕も一応関西人なのでこういう精神は大切にしたいです。

Celebrity Cruises

cruisecentury.jpg

制作者の間では、(特にあまりメッセージ性のない)オープニングのFlashアニメーションはユーザーにストレスを与えるだけなので良くないと考えられています。

でも一方で、より長くて派手なオープニングを希望されるクライアントさんがいるのも現実です。特に小規模の案件では、素材もコピーも少ないし、冗長なオープニングのデメリットを説明しても、「でも社長がどうしてもと、、」と説き伏せられてしまうケースもあるのではないでしょうか。

そういった案件で、参考になるかと思いエントリ。

全文を読む

tha ltd.

tha.jpg

理由は分かりませんが、GoogleMap八分されておられるようで、上記サイトは見れなくなっているようです。どんなやんちゃな使い方をしたらそんな目にあうのだろう?

yugopさんの会社であるtha社がお引っ越しされたそうで、それに伴いトップページがリニューアルされていますね。

僕が土曜日、Google Maps APIと戯れている間に、世間では同じ素材でこんな凄いものを作っている人がいたんだなぁと萎縮します。地図の回転に応じて、リアルタイムにパースがかかるのに驚きました。
追記:というかGoogle Mapsの衛星写真って、標準では回転すらしないのですね。Earthと勘違いしてました。EarthのAPIはいじれないと思うので、サイトで使用されているのはMaps APIだと思うのですが、どっちにせよ驚きです。

先日エントリした、「AID-DCC」さんといい、アクセスマップに力を入れるのが流行なのでしょうか。
確かに、地図の見せ方ひとつでも、会社として「情報をいかに分かりやすく伝えるか」にこだわっているかを見る人に伝える事ができるし、Google Maps APIをFlashでここまで操れるという技術力の高さも伺える、コンテンツ構成についても、あれもこれもではなくて、伝えたい情報を絞る(with スゴイ技術力)ことによる効果、みたいなメッセージを(僕は勝手に)感じました。

まぁ、tha社さんほどの、世界レベルで有名な実績があれば、ポートフォリオを見せる必要も、会社概要ページを置いておく必要もないのでしょうね。
サイトの「CONTACT」ボタンで、メーラーが起動してしまい、「これで僕の名前だけの空メール送ったら、恥ずかしくて死ねる!」と、慎重にメーラーを閉じました。

via: 「PPLOG | tha ltd.が目と鼻の先に

AID-DCC Inc.

dcc2.jpg

Wiiのサイトを制作された大阪の制作会社さん。

2007年版 WEB制作会社総覧に掲載されているのを見ましたが、なんと【まる。てん.てん・】運営チームのメンバーの方が在籍されているようです。素敵!

リンク先のページも、使い勝手の良さ&さりげなくすげぇJavascriptで作られているのですが、引越しのお知らせサイトの方も、ユーモアのセンスと高い技術力(GoogleMapsの上に、全面Flashオーバーレイで連携させてる?)で作られていて、「東のバスキュール、西のAID-DCC」な印象を持ちました。
技術力の裏打ちがあってはじめて、効果的なサイト提案ができるのだと思います。

CBCNET™WORKサイトでリクルートもされています。すごい近所なので僕ももっと腕を鍛えて挑んでみたいものです。

追記:GoogleMapsの上にレイヤーで全画面透過Flashを重ねることができるのなら、swf上に地図を展開するよりも表示のパフォーマンスが良さそうだし、一度試してみたい。

10/28追記:2007年版 WEB制作会社総覧を本屋で見直したのですが、【まる。てん.てん・】が、こちらの制作とは掲載されていませんでした。僕の勘違いなようです。夢でも見ていたのでしょうか。

10/29追記:daifuku様よりいただいたコメントで、本文を更に修正。何度もすみません。

Wii.com JP

wii.jpg

Wiiのプロモーションサイト。プレイしてる人達のビデオ映像をふんだんに使っています。

シンプルなサイトで、「老若男女、国籍を問わず遊べる」というコンセプトを完璧に伝えてくれます。テキストでのキャッチコピーではなく、ビデオ映像を見れば伝わってきます。今ある技術をさりげなく使って、伝えたいテーマをきっちり伝えられている点で、これこそWebサイトの使い方だなぁと感動していました。提案のできる制作会社さんと理解のあるクライアントと、メッセージのある商品がそろえば、こんな素敵なサイトができるのだなぁと、うらやましく思いました。

もちろんWiiが欲しくなったわけですが、個人的には、「写真チャンネル」の動画の逆再生機能が面白そう。デジカメ動画を逆再生して遊ぶ時の一番手軽な方法なんじゃないかと思う。

Adobe Edge: 2006年9月

edge.jpg

Adobeのニュースレターと連動したコンテンツ。今月号の特集、Flash クリエイターに聞く「Flash にまつわる10 の質問」では、蒼々たる顔ぶれのFlashクリエイターの方々が、自分とFlashとの関係をコメントされています。

中でも、バスキュールの馬場鑑平さんの、

変数とは何か?というレベルから始める必要があったんです。上野亨さんの黄色い本を何度も読んで、ActionScriptの全体像を掴んでいきました。
って、スタート地点が自分と同じぐらいな感じでびっくりしました。その後、今の自分の惨状にだいぶ凹みました。

Uniqlo.com(US版)

uniqlo_us.jpg

tha社のyugopさん制作のユニクロのUS版サイト。その凄さは他のサイトやブログで採り上げられまくるだろうから、細かい所から注目してみます。

全文を読む

Audi R8

audia8.jpg

以前から何度か言及している、TVCM並みのハイクオリティな映像を再生するためのプレーヤーとしてのFlashの使い方。スムーズなローディングやチャプター再生などのテクニックは重宝されると思います。

そんな感じのビデオローダーフォーマットを公開してみたいけれど、もうちょっと下調べしないとなぁと、
Flash Video 配信方法の比較
を覗かせていただくと、どうやらこの手のサイトがやっているのは、「プログレッシブFLV」なので、Flash8さえあれば実現可能(FMS2とかはいらないということです)。

スペック紹介やショッピングサイト等は、FlashかAjaxか、それとも他の技術かで、どれが使いやすいのかと、いろいろ競合相手がいますが、今回のような、動きのある商品・サービスの映像を見せることがユーザーの反応(購買)に通じる性格のコンテンツはFlashがだいぶリードしてる気がしてます。

僕は、TVCMよりもWebにウェイトをおいた生活をしていますが、「外見(デザイン)重視」・「内面(スペック)重視」のどちらのコンテンツに対しても、TVCMよりWebの方が、ユーザー満足度と費用対効果が高いと思うのです。
雑誌やGoogleやブログなどのCGMから本家サイトにやってくる(この動線が以前より容易になったのも重要)方が自然だと思うし、TVCM制作費(放送枠とか代理店とかタレント起用の報酬とか)が、他人事ながらもったいなく思うのです。とくに「放送枠買っちゃったから、タレントに商品持たせて一芸」みたいなのが見てて残念な気分になります。あと、視聴者をWebサイトに導くためのTVCMも、ちょっともったいなくない?と思う今日この頃です。

Nike Site SWF Viewer

nikesiteviewer.jpg

どうやらNikeのこのサイトを作ったのは、前回、人が残像を残して走るソースを公開して下さった「The Flash Blog」の方らしく、今回はNikeサイトで使われた、AfterEffectで作った背景の方のビューアを公開されています。

このムービーの上に、人が走る残像アニメーションをかぶせて、ちゃんと動作しているのだから、FlashPlayerの描画も結構無茶しても大丈夫っぽい?

Code Search

Code Search - O'Reilly Labs

O'Reilly社が出版してきた全書籍に掲載されたソースコードを検索できるサービス。もちろんFlashだけでなく、PHP,Ruby,Perl等、全書籍のソースコードです。実際に本を持っている人も、そうでない人にも役に立つかと思います。

ただActionScriptに関して言えば、O'Reillyからは、Flash8以降の書籍はまだ出版されていないはずなので、現状では、最近のクラスやメソッド等は見つからないと思いますが、Flash 8 Cookbook 」とか、「Flash 8: Projects for Learning Animation and INteractivity 」とか、「Flash 8: The Missing Manual」が出版されてました。すいません。
今後も「ActionScript 3 Cookbook」を皮切りに、ActionScript3.0関連本が出てくる予定なので、末永く要チェックかと思います。

Nike.com

nikeshop.jpg

アメリカのNike shopサイトのフルFlash版。RIAのお手本という印象。昔Macromediaが作ったホテル予約をFlashで完結するサイトのサンプル。あれが実現ています。逆にあれを知っている人はそんなに驚かないけど。

おまけにこのサイトは、動的にURLを生成していって、各画面の状態を記憶しておけるので、今見ている商品をそのままブックマーク登録できます。こういう細かい芸当ができるスキルが欲しいなぁ。

スゴイ地図

sugoichizu.jpg

位置情報とか店の写真とかユーザーのコメントとか、膨大なデータをFlashでここまで上手に、しかもインターフェースと連携させて、整理し、コンテンツとして作れるのかと感激しました。こういうデータバインドしまくりのサイトって、分業できるの?それともデータ処理に関しては天才が一人で設計したの?一個人の僕には分からない世界です。

ユーザー導線も凄く考えられていて、目的の情報までの複数の方法が、すごく常識的な操作手順で提供されています。マニュアルを読まなくても、実際の操作で理解できるという感じです。

ITmedia Newsの記事を読むと、APIを呼び出し、SOAP通信とあります。SOAP通信が何なのかを全然理解していないですが、凄い事ができるんですね。(この本の20章にSOAPの記事がありますが、まだ未読。)

サイトに対しての印象ですが、
「スゴイ地図」はウェブのリッチ・インタラクション史における記念碑的事業だ @ ZEROBASE BLOG
でおっしゃられている、「ツールとしてのGoogle Maps」「メディアとしてのスゴイ地図」の位置づけ方がとてもしっくりきました。

僕は今、Google Mapsやはてなブックマーク、RSSリーダーといった、ツールとしてのWebへの依存が大きいので、急にメディアとしてのWebを見せられたことで、多少戸惑いみたいなものを感じるのかもしれません。「毎日使うサイトではない=Web的でない」という間違った固定概念を抱きがちです。自分はWebが大好きなので、Webに対してはかなり楽天的・肯定姿勢なのですが、さらにもう一段階、考えを改めないと頭の固い・話の通じない人になってしまう。やばいやばい。

Webの可能性・Flashの可能性の両方を見せてくれる、しかもそれが日本発のサイトというのが素敵です。

SHARP Kameyama Dream Factory

kameyama.jpg
いつも拝見させていただいておりますA LOTさんのエントリより。シャープ亀山工場のサイト。雰囲気からしておそらくRAKUGAKIの西田幸司さん制作。
この膨大な情報を上手に整理する作業と、象や鳥を動かす作業、そして世界観の設計とを、どこまで一人で担当されているんだろう?個人で活躍されているFlashクリエイターの方々は、一体どこまで一人でやっているのかが気になります。そんな多才な人達がうごめいているなら、僕ではカナワナイポ。
そして一体どのぐらいのギャラで受けてはるんだろう?これほどのサイトを少人数でやったら、1本で1年暮らせそうな気がするのだけど。制作者のネームバリューによる宣伝効果もあるし。

サイトを見てみると、奥行き移動させる時に、コラージュ画像、グレーの画像時、テキストも全てビットマップ画像として扱っている様子。拡大・縮小なのだからテキストぐらいはベクターでもいいのではと思ったりしたのだけど、制作段階でパフォーマンスの追求もされているだろうから、きっとこういう場合はビットマップのほうがいいんだろうなぁ。おぼえておこう。

stoic sense product // motion graphic studio

stoicsenceproduct.jpg
映像クリエイターの東弘明さんのポートフォリオサイト。
サムネイルが3シーンほどトランジションするので、「あ〜、全部映像の紹介やな。」と気付けます。
見たい作品をクリックすれば、ゆったりと、そのまま自動で再生され、クリック数も少なくできています。

こういうサイトが好きな人で、TweenクラスとTransitionを使った事がないという人がいたら、Transition and tween explorerのダウンロードをお奨めします。知ってるか知らないかで作業効率&作品のクオリティが相当変わるのではないかと思います。

Tweenクラスを使うメリットとして、
・設定が簡単
・動きのタイプを簡単に切り替えられるので、試行錯誤が簡単。
・秒単位で指定しておけば、フレームレートの変更にも対応しやすい。
・onMotionFinished等、次の展開の指定もしやすい。
・座標移動等でも、目的の座標でぴったり止まってくれる。
(「this._x+=(desX-this._x)*friction」では小数点を丸める必要があったし、onEnterFrameもdeleteする必要があったので、スクリプトが長くなってたんです、僕。)
などなど。

個人的なデメリットを書くと
・単純な矩形でも簡単にそれっぽくモーション付けができてしまうので、作り込みが甘くなる。
・特定の効果に惚れ込むと、作品全てのモーションが似通ってくる。(僕はElastic使い過ぎ)
・なのに反省もせず、世間的にシンプルな矩形のTweenが流行ってるからオッケーでしょ。と悪魔がささやく。
・結果、デザインとは何なのか見失う。
便利すぎるのが曲者です。

W43S | au | Sony Ericsson

w43s.jpg

近日発売のauのSonyEricsson製携帯電話 W43S のプロモーションFlashサイト。
僕の中の「和」のイメージと合致したのでエントリ。
デザイン要素的には「グラデーション文字」や「リフレクション」と、今流行のデザインなんだけど、明朝体とブラー、アルファ値変化を使うと、結構「幽玄の美」を表現できるんだなと。

結構な数ののパネルイルミネーションをflvを使って紹介してくれて、購買欲をそそられました。

uniqlo mix

uniqlo.jpg
A LOTさんのブログより。
トップページの横スクロールしている写真が、「Back At One.: OSX環境下でのFlashのホイールイベント」みたく、Macでもスクロール対応しています。(コンテンツの中には対応していない部分もある?)
そのトップの写真達は、1枚1枚が詳細ページへのリンク(DETAILボタン)を持っているので、
スタイル一覧写真から気に入ったスタイルを選択→そのスタイルの値段や詳細写真、ネットストアへのリンク
というもの凄くいいユーザー導線ができています。

他にも3D回転するメニューとか、縮小ナビゲーターで拡大写真を操作する見せ方、flvでのビデオ表示、スムーズなローディングなど、今時なスクリプティングを上手く統合して、全体のインターフェースに落とし込めている、フルFlashサイトを構築するのに必須なスキルの見本市みたいです。

GUCCI

  • 2006-08-23 (水)