久々にざくざく仕事を片づける。そしてひさびさに金曜の夜を家で過ごす。
今日から公開されたFORMA用FFの公式サイト。中吊り広告でみたあれだ。
携帯のバイブをシミュレートしたシェイクがナイスアイデア。JavaScriptでウインドウがふるえるサイトは昔も観たことがあったけど、こうデザインと連動した意味のあるブルブルはお目にかかったことがない。振動とシンクするグラフィックもなかなかよくできているし、プラットフォームに合わせて振幅を変えているなど芸が細かい。
見慣れた技術も切り口を変えると新鮮に見えるという例ですな。世の中見渡すとこういうことはけっこうある。
GAP FILMSのサイト。コミカルな宇宙人（？）をクリックするとこいつが飛び跳ねたりする。なくてもいい機能なんだけど、こういう遊びがあると飽きがこないというかポップなサイトのイメージがより印象づけられる。
ユーザービリティとかテンプレートとかシステマチックにサイトデザインするのもいいけど、こういうアプローチもいいものだ。
キャラクターの影の動きや拡大・縮小するパーツによって、奥行き感と立体感がある。モーショングラフィックとしても非常に完成度の高いサイトである。
どうも最近新情報の仕入れが少ないなと感じている。今夜はFlash 7からできるようになったhttpdによる疑似ストーリーミングがどれぐらいのものなのか試してみる。
結局FLVにエンコードするときのパラーメーターのさじ加減が難しい。この手のエンコードでは良くある話だけど。ブロードバンド用のムービーは、大きな画像だけでなく、小さいけど画質・音質がハイクオリティなもののほうが印象が良かったりする場合がある。
QuickTimeを使ってよいサイトであれば、AACで音質を良くすると印象が良くなりますね。
以上、本日のメモ書きでした。
なんかX Filesみたいなタイトルだけど、TOYOTAの新車予告のサイト。
自動車業界は詳しくないのでどうしてこんなに先手を打ってプロモーションを始めたのかは不明だが、あえて車の姿を完全に出さずにセールスポイントだけをアピールしているおかげで、逆にこの車の特徴がすぐに感覚的に理解できた。
動作推奨環境の表示もすごいな。
イントロからメインにかけて、ここまでフェードイン・フェードアウトのディテールに凝ったアニメーションはなかなかお目にかかれないなと。
ブロードバンド化とPCの高性能化でWebブラウザで動いてしまうアプリケーションという姿が将来現れるかも知れないとはよく言われている。Webでエミュレータ（っぽいゲーム）を紹介しているサイトにあるような物が今後も発展してくと思うと現実的な話である。
今でこそ単純なゲームだがもう少しすればもっと複雑なゲームマシンのWebエミュレータが出ることは容易に察しが付く。
もう一つ、リアル世界にある物をWebでエミュレートした物がある。ダウンロード形式のフリーペーパーだ。これはFlashで電子書籍を作っている。先月ライブドアがFlashで電子Bookを作るソフトを販売していたが、同じソフトを使って作ったのかも知れない。
PDAや店頭などで見る電子Bookとかなり趣が違うのがおもしろい。まずはページをめくっているという演出。これがおもしろくてぱらぱらページをめくってしまう。フリーペーパーや雑誌にはぴったりだ。また、Flashベースなのでインタラクティブ性のあるページもある。
これは電子bookのあるべき姿ではないだろうか。紙を電子インクにしただけの現在の電子Bookでは未来が無い。
久しぶりに書く。こういうことするとトップページがさびしくなるんだよね。直近２週間分の記事しかトップに載らなくなるから。こいつはどこの設定変えればいいんだろ。
こういうのみたいにCSSと文書構造をしめすタグをきちんと使っているサイトが最近気になる。背景イメージの微妙な色使いがここちよい。
CSSで段組を作るのはいろいろコツがいるが、やっぱり自分で作ってみるのが一番手っ取り早く覚えられるみたいだ。
どうもtableで段組を作ると、サーチエンジンに文書がひっかかりにくくなるようだ。テーブルはあくまでも「表」、つまりデータなので、サーチエンジンははじめの列しか読まないようなのである。表のはじめの列というのは各項目のタイトルだからであろう。
ウインタースポーツはこのメーカー抜きでは語れないSALOMONのデザインコンペサイト。今回はスノボーのデザインがテーマだったようだ。
このページを開けたら下で点滅している「Bording Pass」をクリックします。するとメインページが出てくる。
写真コラージュみたいなものが妙に動いて気になるんですね。仕掛け自体は簡単だけど、こういうゆるゆる感のあるインターフェースもいいかもと思いましたよ。
Render Bladeという和製Web 3Dプラグインがある。
LightWave 3Dのモーションがほぼそのまま再生できるらしい。
不思議な絵です。マウスをドラッグしてみましょう。
・・・しかしうまくつながってるな〜。
ColorMixというJavaアプリを使ってみた。こいつはWebセーフカラーを使ったタイルパターンで色を調合するソフト。タイルパターンを使うからWebセーフカラーだけでいろいろな混合色を出せるという仕掛け。実行環境にはJavaが必要なのでWindowsはJavaのインストールが必要です。
１０年ほど昔、パソコンは１６色ぐらいしか色が出なかったのでタイルパターンの利用はごく普通のテクニックでした。ちょっと昔のアドベンチャーゲームの絵を思い出したよ。
ところでColorMixで作った画像を改めて見ると、タイルパターンというのはそのテクスチャー感が独特の雰囲気を醸し出しているなと。べた塗りの代わりにあえてタイルパターンを使うとか上手に使うとデザインに使えますね。あと実用的なところでは海外の携帯コンテンツ制作に使えますかね。海外ではまだまだ２５６色カラーの端末が多く使われていますから。
ほぼキーボード操作だけで閲覧できてしまうサイト。カーソルキーで操作してみましょう。
折り紙の舟が出たりせずに線画にこだわった方がよかったかもしれませんが、遊び心のあるサイトですね。
このサイトわりと有名らしいので、知っている人も結構いるかもしれませんが、CSSでDTPのようなテキスト回り込み処理のサンプル。ブラウザによってはうまく動かないようだが、よくやるなぁ。くわしい解説はここ。
あと、こういうデコレーションもできるんですね。CSSはやはり工夫とアイデアがものをいいますね。
昨夜から今日の午前中にかけて、Flash MX 2004に怪現象が・・・ActionScriptの編集時に「スクリプトの固定」を使ってタブを切り替えながら編集したスクリプトが保存されないのです。
昨晩保存したつもりでいたファイルを今朝開いたらスクリプトが保存されていない？のである。作業やり直しです。ハイ。
どうやらこの現象は私のところだけでないようである。
結局ver 7.2アップデータを当てたら直った。Flashのスクリプト開発環境はいつも不満たらたら。EmacsにActionScript用ツールないかな？今度探してみよう。
Mixしてスクラッチ入れてチェケラッチョ（？）なFlash。
ここ数日Yahoo!オークションの商品説明のページを開くと、コンタクトレンズのバナー広告が右側に出る。いくつかパターンはあるのだが、注目したい広告がひとつある。
それは手書き文字によるキャッチコピーを載せたバナーである。キャッチコピー自体も「どういうこと？」と一瞬思わせる文章でよくできている。
ここ最近、手書き文字のチラシが新たな広告手法としてある分野で注目されてきている。手書き文字のバナーデザインは私が知る限りこれが日本初ではないのだが、フォントで整形されたPC画面に突然手書き文字が表れるとハッとさせられるという効果があるようだ。
Douglas Fisherのサイト。製作はgroup94。こういう静かでまったく音のないサイトはより作品の写真に意識を集中させられる。作品はどこから写真でどこからCGなのかあいまいな感じでCGのような力強い色彩と写真でないと表現できないディティールが独特の雰囲気をかもし出している。写真を画面いっぱいに表示しているときのGUIもすばらしい。マウス操作をしばらくやめると、GUIが消える。写真に意識が集中できるように細部まで考えれている。ポートフォリオはgroup94のFlash用オリジナルCMSが採用されているとのこと。
長岡造形大のギャラリーサイト。作品または人両方からピックアップできたり、偶然的にいろいろな作品に触れられるようになっている円形のサムネイル、ちょうど良い感じで鳴るSEとなかなかおもしろい。円形のGUIはマウスホイールでも操作できる。ホイールマウスのGUIってまだまだ可能性がありそうです。
フリーの写真を置いているサイト。フリーの割にはきれいに撮影されているものもあります。なかにはビール缶のラベルとかの写真がありますが、そういう商標権を侵害しそうな写真をのぞけばつかってみるのもありかと。
ペンを中心に不思議な動きをするＧＵＩのサイト。
2Dの筆跡と3D演算（擬似的な演算かもしれない）されたメニューが同じ画面に展開しています。
これ、現実にはあり得ない状態で、ある意味空間が破綻しているわけですが、それがどうして不思議な感覚を醸し出しています。
ユーザビリティがどうだこうだという意見をねじ伏せるぐらい強烈な個性を持ったＧＵＩですね。
Webデザインの型にはいろいろなものがあるし、そもそも自由度が高いのがWebデザインならではである。
広告媒体として、「一瞬でもよいから人の目にとまることを狙う」デザインや（もちろんこういう場合は、企画のインパクトも重要ではある）、学校のサイトのように長く使える飽きの来ないデザインのサイトというのもある。
今取り組んでいるのは、後者の長く使える飽きの来ないデザインのサイトである。
Nikeのサイト。
キーボードをたたくと動画にエフェクトがかかります。
何枚動画用意したのかなと思っていましたが、一部はリアルタイムエフェクトのようです。
エフェクトのエンジンは公開されていて、こちらのページのVisualize itからデモを見ることができます。
ビットマップ系のエフェクトを何に使うと効果的なのかあまり良い答えを見たことが無かった中で、これは非常に良くできています。
あんまり目あたらしいネタではないですが、ちょっと頼まれたのでMovableTypeをCMS代わりにつかったサイトをこしらえました。
（リンク）
特殊な機能やリンクはプラグインで完結させました。Workflowプラグインでパブリッシュ権限をもつユーザーを限定させる等。
左側のグローバルメニュー（新着記事）はAJAXで取り込んでいます。これでSSIに頼らなくても静的ページの一部に簡単に外部ファイルを取り込むことができます。もちろんprototype.js頼り・・・。
今回は、建築士が仕事の合間に士会から割り当てられたHP更新係をこなすという運用形態のため、できるだけシンプルな内容におさえました。したがって、新着記事の投稿機能ぐらいの装備で止めています。
ブログ「blog.ampspeed」のカテゴリ「Web design」に投稿されたすべてのエントリーのアーカイブのページです。過去のものから新しいものへ順番に並んでいます。
前のカテゴリはWeb programmingです。
次のカテゴリはWPFです。