メイン

Web design アーカイブ

2004年09月24日

ブルブルッ

 久々にざくざく仕事を片づける。そしてひさびさに金曜の夜を家で過ごす。

今日から公開されたFORMA用FFの公式サイト。中吊り広告でみたあれだ。

 携帯のバイブをシミュレートしたシェイクがナイスアイデア。JavaScriptでウインドウがふるえるサイトは昔も観たことがあったけど、こうデザインと連動した意味のあるブルブルはお目にかかったことがない。振動とシンクするグラフィックもなかなかよくできているし、プラットフォームに合わせて振幅を変えているなど芸が細かい。

 見慣れた技術も切り口を変えると新鮮に見えるという例ですな。世の中見渡すとこういうことはけっこうある。

続きを読む "ブルブルッ" »

2004年09月26日

UFO

 GAP FILMSのサイト。コミカルな宇宙人(?)をクリックするとこいつが飛び跳ねたりする。なくてもいい機能なんだけど、こういう遊びがあると飽きがこないというかポップなサイトのイメージがより印象づけられる。
 ユーザービリティとかテンプレートとかシステマチックにサイトデザインするのもいいけど、こういうアプローチもいいものだ。
 キャラクターの影の動きや拡大・縮小するパーツによって、奥行き感と立体感がある。モーショングラフィックとしても非常に完成度の高いサイトである。

2004年10月12日

FLV

 どうも最近新情報の仕入れが少ないなと感じている。今夜はFlash 7からできるようになったhttpdによる疑似ストーリーミングがどれぐらいのものなのか試してみる。
 結局FLVにエンコードするときのパラーメーターのさじ加減が難しい。この手のエンコードでは良くある話だけど。ブロードバンド用のムービーは、大きな画像だけでなく、小さいけど画質・音質がハイクオリティなもののほうが印象が良かったりする場合がある。
 QuickTimeを使ってよいサイトであれば、AACで音質を良くすると印象が良くなりますね。
 以上、本日のメモ書きでした。

2004年10月27日

X-BODY

 なんかX Filesみたいなタイトルだけど、TOYOTAの新車予告のサイト
 自動車業界は詳しくないのでどうしてこんなに先手を打ってプロモーションを始めたのかは不明だが、あえて車の姿を完全に出さずにセールスポイントだけをアピールしているおかげで、逆にこの車の特徴がすぐに感覚的に理解できた。
 動作推奨環境の表示もすごいな。
 イントロからメインにかけて、ここまでフェードイン・フェードアウトのディテールに凝ったアニメーションはなかなかお目にかかれないなと。

続きを読む "X-BODY" »

2004年11月05日

Webでエミュレータ

 ブロードバンド化とPCの高性能化でWebブラウザで動いてしまうアプリケーションという姿が将来現れるかも知れないとはよく言われている。Webでエミュレータ(っぽいゲーム)を紹介しているサイトにあるような物が今後も発展してくと思うと現実的な話である。
 今でこそ単純なゲームだがもう少しすればもっと複雑なゲームマシンのWebエミュレータが出ることは容易に察しが付く。
 もう一つ、リアル世界にある物をWebでエミュレートした物がある。ダウンロード形式のフリーペーパーだ。これはFlashで電子書籍を作っている。先月ライブドアがFlashで電子Bookを作るソフトを販売していたが、同じソフトを使って作ったのかも知れない。
PDAや店頭などで見る電子Bookとかなり趣が違うのがおもしろい。まずはページをめくっているという演出。これがおもしろくてぱらぱらページをめくってしまう。フリーペーパーや雑誌にはぴったりだ。また、Flashベースなのでインタラクティブ性のあるページもある。
 これは電子bookのあるべき姿ではないだろうか。紙を電子インクにしただけの現在の電子Bookでは未来が無い。

続きを読む "Webでエミュレータ" »

2004年11月25日

やっぱりCSSですかね

 久しぶりに書く。こういうことするとトップページがさびしくなるんだよね。直近2週間分の記事しかトップに載らなくなるから。こいつはどこの設定変えればいいんだろ。
 こういうのみたいにCSSと文書構造をしめすタグをきちんと使っているサイトが最近気になる。背景イメージの微妙な色使いがここちよい。
 CSSで段組を作るのはいろいろコツがいるが、やっぱり自分で作ってみるのが一番手っ取り早く覚えられるみたいだ。
 どうもtableで段組を作ると、サーチエンジンに文書がひっかかりにくくなるようだ。テーブルはあくまでも「表」、つまりデータなので、サーチエンジンははじめの列しか読まないようなのである。表のはじめの列というのは各項目のタイトルだからであろう。

2004年12月01日

切り絵調

 ウインタースポーツはこのメーカー抜きでは語れないSALOMONのデザインコンペサイト。今回はスノボーのデザインがテーマだったようだ。
 このページを開けたら下で点滅している「Bording Pass」をクリックします。するとメインページが出てくる。
 写真コラージュみたいなものが妙に動いて気になるんですね。仕掛け自体は簡単だけど、こういうゆるゆる感のあるインターフェースもいいかもと思いましたよ。

2005年01月06日

Render Blade

Render Bladeという和製Web 3Dプラグインがある。
LightWave 3Dのモーションがほぼそのまま再生できるらしい。

2005年01月16日

無限ループ

不思議な絵です。マウスをドラッグしてみましょう。
・・・しかしうまくつながってるな〜。

2005年01月19日

なつかしのタイルパターン

 ColorMixというJavaアプリを使ってみた。こいつはWebセーフカラーを使ったタイルパターンで色を調合するソフト。タイルパターンを使うからWebセーフカラーだけでいろいろな混合色を出せるという仕掛け。実行環境にはJavaが必要なのでWindowsはJavaのインストールが必要です。
 10年ほど昔、パソコンは16色ぐらいしか色が出なかったのでタイルパターンの利用はごく普通のテクニックでした。ちょっと昔のアドベンチャーゲームの絵を思い出したよ。
 ところでColorMixで作った画像を改めて見ると、タイルパターンというのはそのテクスチャー感が独特の雰囲気を醸し出しているなと。べた塗りの代わりにあえてタイルパターンを使うとか上手に使うとデザインに使えますね。あと実用的なところでは海外の携帯コンテンツ制作に使えますかね。海外ではまだまだ256色カラーの端末が多く使われていますから。

2005年01月23日

マウスを使わないインターフェース

ほぼキーボード操作だけで閲覧できてしまうサイト。カーソルキーで操作してみましょう。
折り紙の舟が出たりせずに線画にこだわった方がよかったかもしれませんが、遊び心のあるサイトですね。

2005年01月24日

テキスト回り込み

  このサイトわりと有名らしいので、知っている人も結構いるかもしれませんが、CSSでDTPのようなテキスト回り込み処理のサンプル。ブラウザによってはうまく動かないようだが、よくやるなぁ。くわしい解説はここ
 あと、こういうデコレーションもできるんですね。CSSはやはり工夫とアイデアがものをいいますね。

2005年02月09日

Flashのバグに泣く

昨夜から今日の午前中にかけて、Flash MX 2004に怪現象が・・・ActionScriptの編集時に「スクリプトの固定」を使ってタブを切り替えながら編集したスクリプトが保存されないのです。
昨晩保存したつもりでいたファイルを今朝開いたらスクリプトが保存されていない?のである。作業やり直しです。ハイ。

どうやらこの現象は私のところだけでないようである。

結局ver 7.2アップデータを当てたら直った。Flashのスクリプト開発環境はいつも不満たらたら。EmacsにActionScript用ツールないかな?今度探してみよう。

2005年04月21日

チェケラッチョ!

Mixしてスクラッチ入れてチェケラッチョ(?)なFlash。

2005年04月28日

マンダラート

マンダラートをご存知だろうか?日本で生まれたアイデア発想法だ。Webディレクターとか企画でメシを食べてる人だったら知ってる人も多いと思う。初めてマンダラートと出会ったのは予備校の小論文の授業だったかなぁ。当時はあまりことの意味がわかっていなかったけれど。Palm用ソフトもあるようだがやっぱり紙で書くほうがいいみたい。
で、モリサワのサイトを見た瞬間「あ、マンダラートだ」って思ったわけ。ただ、マウスオーバーしたときのデザインが惜しい。普通のメニューになってしまう。マンダラート的なデザインと正方形にもっとこだわったほうがよかったのになと思う。

2005年05月10日

手書きバナー

ここ数日Yahoo!オークションの商品説明のページを開くと、コンタクトレンズのバナー広告が右側に出る。いくつかパターンはあるのだが、注目したい広告がひとつある。
それは手書き文字によるキャッチコピーを載せたバナーである。キャッチコピー自体も「どういうこと?」と一瞬思わせる文章でよくできている。
ここ最近、手書き文字のチラシが新たな広告手法としてある分野で注目されてきている。手書き文字のバナーデザインは私が知る限りこれが日本初ではないのだが、フォントで整形されたPC画面に突然手書き文字が表れるとハッとさせられるという効果があるようだ。

2005年05月12日

静かな写真ギャラリー

Douglas Fisherのサイト。製作はgroup94。こういう静かでまったく音のないサイトはより作品の写真に意識を集中させられる。作品はどこから写真でどこからCGなのかあいまいな感じでCGのような力強い色彩と写真でないと表現できないディティールが独特の雰囲気をかもし出している。写真を画面いっぱいに表示しているときのGUIもすばらしい。マウス操作をしばらくやめると、GUIが消える。写真に意識が集中できるように細部まで考えれている。ポートフォリオはgroup94のFlash用オリジナルCMSが採用されているとのこと。

2005年06月03日

ホイールマウスのGUI

長岡造形大のギャラリーサイト。作品または人両方からピックアップできたり、偶然的にいろいろな作品に触れられるようになっている円形のサムネイル、ちょうど良い感じで鳴るSEとなかなかおもしろい。円形のGUIはマウスホイールでも操作できる。ホイールマウスのGUIってまだまだ可能性がありそうです。

2005年06月06日

Free Photos Bank

フリーの写真を置いているサイト。フリーの割にはきれいに撮影されているものもあります。なかにはビール缶のラベルとかの写真がありますが、そういう商標権を侵害しそうな写真をのぞけばつかってみるのもありかと。

2005年10月12日

浮遊するインターフェース

ペンを中心に不思議な動きをするGUIのサイト。
2Dの筆跡と3D演算(擬似的な演算かもしれない)されたメニューが同じ画面に展開しています。
これ、現実にはあり得ない状態で、ある意味空間が破綻しているわけですが、それがどうして不思議な感覚を醸し出しています。
ユーザビリティがどうだこうだという意見をねじ伏せるぐらい強烈な個性を持ったGUIですね。

2006年08月12日

長く使えるデザイン

Webデザインの型にはいろいろなものがあるし、そもそも自由度が高いのがWebデザインならではである。
広告媒体として、「一瞬でもよいから人の目にとまることを狙う」デザインや(もちろんこういう場合は、企画のインパクトも重要ではある)、学校のサイトのように長く使える飽きの来ないデザインのサイトというのもある。

今取り組んでいるのは、後者の長く使える飽きの来ないデザインのサイトである。

続きを読む "長く使えるデザイン" »

2006年10月03日

Flashによる画像処理

Nikeのサイト。
キーボードをたたくと動画にエフェクトがかかります。

何枚動画用意したのかなと思っていましたが、一部はリアルタイムエフェクトのようです。
エフェクトのエンジンは公開されていて、こちらのページのVisualize itからデモを見ることができます。

ビットマップ系のエフェクトを何に使うと効果的なのかあまり良い答えを見たことが無かった中で、これは非常に良くできています。

2007年01月08日

MovableTypeでCMS

あんまり目あたらしいネタではないですが、ちょっと頼まれたのでMovableTypeをCMS代わりにつかったサイトをこしらえました。
(リンク)

特殊な機能やリンクはプラグインで完結させました。Workflowプラグインでパブリッシュ権限をもつユーザーを限定させる等。
左側のグローバルメニュー(新着記事)はAJAXで取り込んでいます。これでSSIに頼らなくても静的ページの一部に簡単に外部ファイルを取り込むことができます。もちろんprototype.js頼り・・・。

今回は、建築士が仕事の合間に士会から割り当てられたHP更新係をこなすという運用形態のため、できるだけシンプルな内容におさえました。したがって、新着記事の投稿機能ぐらいの装備で止めています。

About Web design

ブログ「blog.ampspeed」のカテゴリ「Web design」に投稿されたすべてのエントリーのアーカイブのページです。過去のものから新しいものへ順番に並んでいます。

前のカテゴリはWeb programmingです。

次のカテゴリはWPFです。

他にも多くのエントリーがあります。メインページアーカイブページも見てください。

Powered by
Movable Type 3.35