[0022] WEBデザインとファイルサイズ

投稿:  著者:  読了時間:13分(本文:約6,200文字)



■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
【日刊・デジタルクリエイターズ】 No.0022 1998/05/07発行
  <http://www.towers-inc.com/mag/daily/>
  情報提供はこちらまで 
  登録・変更<http://www.towers-inc.com/mag/daily/regist.html>
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

●本日のコラム『WEBデザインとファイルサイズ』
 木曜日担当:森川 眞行

●緊急ニュース!!
 ・「Pro.Go.Whoa.」にハッキング!本日のアップルサイトに大注目!
 ・インテルとメタクリエイションがScalable 3-Dを実現可能とする
  新しいファイルフォーマット・「メタストリーム」を公開予定!
●本日のTIPS/3Dアプリケーション編



本日のコラム『WEBデザインとファイルサイズ』
 木曜日担当:森川 眞行「TOWERS」取締役/ デザイナー

前回のコラム「大切なのは想像力」の中で、Fireworksの機能としてJAVAス
クリプトを使ったGIFボタンについて説明した。翌日に読者の方から以下のよ
うなメールをいただいた。

>一言で言うと重くない? っていう感じなのですけど、紹介されていた
>http://www.towers-inc.com/mag/fireworksも見ましたけど、画像
>だけで100KB 越えてますよ。JavaScript 自体は軽いから良いですけど。
>まあ、これはサンプル的な要素があるから構わないですけど、こんなのをバ
>リバリに使われたら辛いです……。

いや~、こうしてコラム掲載の翌日、ちゃんとした意見を貰って嬉しく思って
います。そう、おっしゃる通りです。確かにファイルサイズがでかい。という
ことは表示に時間がかかる。まさにご指摘のように重たいページは誰も見てく
れない…。と言うワケで反省!

WEBデザインとファイルサイズは密接な関係にある。いくら凝った画像を制作
しても、表示に時間がかかるような大きなファイルサイズでは、見てもらう前
に接続を切られてしまう。ここがWEBデザイナーの悩みどころ。

デザイナーはファイルサイズを気にしながら、さまざまなデータダイエットに
トライする。JPEGの圧縮率は?GIFの色数は?カラーパレットは?ディザはど
うする?アニメのコマ数は?
まるでDTPの黎明期、PostScriptエラーを頻繁に起こしていたイメージセッ
タと格闘していた頃を思い出す(古い!)共通しているのは、悩み苦しみ、試
行錯誤を繰り返す程に、ノウハウは蓄積されていく。それだけが唯一の救い。

…とゆうワケで本日のFireworksのワンポイントアドバイス。
Fireworksを使い始めると、エフェクト効果や塗りの設定が豊富で、ついつい
色々な機能を使ってしまう。まるで使わないと損のように、文字にドロップ
シャドウをかけたり、凸凹フレームのボタンを作ってしまう。ドロップシャド
ウなどの「ぼかし」の表現、つまり連続階調を多用すると、見た目には大変美
しいが、それだけに多くの色数を使う。
デザイナーの目的はデザインすることが目的だ。決してFireworksなどのアプ
リケーションを使うことが目的じゃない。

お~、なんだか書いていて自分自身耳が痛いぞっ(笑)確かにFireworksは
WEBデザインをするには最適なソフトウエアだと思う。ボク自身、もう他のソ
フトウエアは触れなくなってしまった。新しいページを作成しようとするとき
とりあえずFireworksを起動すればなんとかなる。そこでちょこちょこ操作し
ていれば、とりあえずホームページらしきものは完成する。またコレが楽しい
んだ(笑)
しかし、作った仏に魂が入っていないのは作ったボク自身が一番よく知ってい
る。デザイナーにとってソフトウエアが進化し便利な環境を提供された時が、
一番危険な時期なのかも知れない。注意しよう!

今回もFireworksを使って作成したサンプルを紹介します。
http://www.towers-inc.com/mag/daily/index.html

メールでのご意見を反映して、今回はファイルサイズにこだわってみました。
このページのトップの画像はFireworksのスライス機能を使ったものですが、
全ての画像ファイルを合計しても34Kしかありません。小さいファイルサイズ
でも、動きがあり、インタラクティブなページが作れるよ…と言いたかったの
ですが、改めて見ると、ちょっとウルサイかな(笑)

でも気に入らなければドンドン更新すればいいし、更新に最適なソフトウエア
も手に入れたことだし…。

ソフトウエアの進化によって製作工程が短くなった。…クリエイターはその
余った時間をどうやって使うか?それがクリエイティブの質に大きく関係して
くることは言うまでもない。

最後にボク宛にメールをくれたNさん、どうもありがとうございました。
【デジクリ】では先週から、みなさんの意見を書き込めるBBSをスタートしま
した。これを機に、一方通行のメディアから双方向のメディアになれればいい
な…なんて思っています。

【プロフィール】
森川 眞行
1958年大阪府茨木市生まれ。 1981年大阪芸術大学美術学科彫塑専攻卒業。
以降、17年間グラフィックデザイナーとして活動。
1989年Macintoshに遭遇して、カッターナイフとシャープペンと写植見本帳
を窓から捨てる。1993年シリコンカフェの名称でフリーランスになる。同年
関西DTP協会を設立して初代会長に就任。1996年G-TOOLという素材フリーサ
イトを作り、爆発的アクセスに腰を抜かす。1997年、ボクのアイデアに出資
者があつまり、G-TOOLをコアにした新会社・タワーズ株式会社を設立。取締
役に就任。

****************************************************
■緊急ニュース!!

●「Pro.Go.Whoa.」にハッキング!本日のアップルサイトに大注目!
http://www.apple.com/

FinalCutを買収したアップルサイトが大異変!
ホームページをすぐにブラウズせよ!
サポート以外のコンテンツがすべて「Pro.Go.Whoa.」に
ハックされちゃったよ~!株価も上がりはじめてます。

そういえば、原田社長がアップルの株は買っといた方が
イイっていってましたよ。

なんなんだ!この「Pro.Go.Whoa.」は?

大胆予測!その1
Maintosh 「Pro」のお出まし(^_^) どうせG3でしょ?

大胆予測!その2
おでかけソフト「GO」のお出まし(^_^)
または、PenOSコンピューティング「ゴー」のゾンビ亡霊か?

大胆予測!その3
「Whoa」いななくマイクロソフトを沈める?
そんなぁ!出資者に向かって?
(Whoa =馬などを止める時のかけ声です)

大胆予測も本日の早朝にすべて明らかになります。
お楽しみに (神田)

-----------------------------------------------------------
●日本のサイトでは、「Power Macintosh G3 MT 300」が最新ニュースです
ね。ドイツサイトものんびりしたものだし。うーん、Don't Miss It. は、本国
に向けてのみのものなんでしょうか・・・。ウッドストックや月への着陸くら
いの大きなニュースのはずなのに?? ツメが甘いぞ、アップル!! (濱村)
___________________________________________________
●インテルとメタクリエイションがScalable 3-Dを実現可能とする
新しいファイルフォーマット・「メタストリーム」を公開予定!

Appleの重大発表(?)の前にこちらのサイトも要チェック!特に3Dクリエイ
ターの皆さんにはWEBでの表現が大きく変わりそうな気配です。
こちらの重大発表はレイドリームやペインターなどでクリエイター御用達のソ
フト会社メタクリエイション(Metacreations)とインテル(Intel)の5月5
日付けのニュースリリースより知ることができます。【日刊・デジタルクリエ
イターズ】では、とりあえず記事を要約してみました。
http://www.metacreations.com/press/mstr_announce.shtml

-----------------------------------------------------------
インテルとメタクリエイションはゲームやウェブに特化したScalable 3-D向
けの新しいファイルフォ-マットを発表した。現行ペンティアムIIプロセッサ
に最適化された3-Dファイルフォ-マット「メタストリーム」はパワフルなコ
ンピューターを使ってるかのような優れた経験をユーザーに与え続ける。

インテルとメタクリエイションは開発者向けに仕様を公開する予定だ。またイ
ンテルアークテクチャ用に設計されたメタストリーム3-Dは今後両者が共に開
発を続ける見込み。

新しいメタストリームの立体解析能力はCPUパワーに依るだろう、とインテル
社のスタン・モー氏は語った。「このファイルフォーマットの採用により、将
来ソフトウェア、ウェッブ、ゲーム、そしてツール開発者はより見栄えの善い
3-Dコンテンツを現行ペンティアム2プロセッサ搭載機及び次世代プラット
フォームで実現するだろう」

「我々はこの新しいファイルフォーマットがいくつかの機能的な障害を解決
し、従来の3-Dを真にインターネット上で成功を収めることを信じている。」
メタクリエイション社のボブ・ライス氏は語る。「同時により幅広いコン
ピューターユーザーに対しコンシューマ機であってもハイエンド3-Dグラ
フィックを経験させる」

メタクリエイション社はこの新しいファイルフォーマットに基づく3-Dコンテ
ンツを制作するソフトウェアを市場に出す一番最初の会社となる。同社の3-D
デザインソフト「レイ・ドリーム・スタジオ5」「レイドリーム3-D」はメタ
ストリームと互換、そして詳細が5月半ばに公開される同社の「インフィニ-
D4.5」にも将来ビルトインされるだろう。

●ウェッブ開発者/ユーザーの利点
新しいファイルフォーマットにより開発者はペンティアムプロセッサー搭載機
のようなPCで高品位なパフォーマンスを実現すると同時にユーザーに高いエ
フェクト効果を体験させることが可能となる。ユーザーの個々のシステムに応
じた描写により、プログレッシヴストリーミング(ストリーミング・オーディ
オやビデオと同様、ダウンロードしながらの3-Dコンテンツを楽しめる)を配
信する。

このインテルアーキテクチャー用に設計されたメタストリーム3-Dファイル
フォーマットは「解像度を変化させて見る」という別の利点ももたらす。ウェ
ブデザイナーにとってはエンドユーザーのマシンのスピードに関連づけてフ
レーム・レートなどの詳細設定といった可能性が出てきた。アプリケーション
に基づけば次のように定義される。

▲前面にあるオブジェクトがより高品位になる。
▲画面にオブジェクトが増えるにつれ、描画スピードを確保する為に解像度を
低く設定できる。
▲ソフトウェアがパワフルなシステムで動作するにつれ、オブジェクトの解像
度が上がる。

メタストリーム3-Dファイルフォーマットはゲームやウェブサイトに加え、電
子商取引・医学・科学の分野にも利益をもたらすだろう。オンラインショッピ
ングでの商品紹介はよりインタラクティヴになるだろう。

●MetaStream Viewerを入手するには?
MetaStream ViewerプラグインはMetaStream Web site
<http://www.metacreations.com/>から5月7日(木)、無料でダウン
ロード可能の予定。
最小限必要なシステムは「ペンティアムプロセッサに基づくシステム」、
「28.8モデム」、「ネットスケープ・コミュニケイター4.0ないしインター
ネット・エキスプローラー4.0いずれかのブラウザ」となる。

-----------------------------------------------------------
●ふう…。なんだか凄いことになりそうな気配。要するにWEBを介して3Dオブ
ジェクトをストリーミングで配信できるようになった…と。特殊な3Dアクセラ
レータ・カードやエンジンを必要とせずにペンティアムIIで動く…と
(Macintoshユーザーはちょっと残念?)なんだか、またクリエイターの仕事
が増えそうな予感(笑)とりあえず、5月7日、メタクリエイションのサイトか
らプラグインをダウンロードしよう!(森川 + 豊田:翻訳)

****************************************************
■本日のTIPS/3Dアプリケーション編
 【日刊・デジタルクリエイターズ】では毎日クリエイティブ関連のアプリケ
 ーションのTIPSを掲載していきます。
 TIPSの難易度は、5段階で★印を文末に付けています。
-----------------------------------------------------------
●StrataVision3D Ver.5.0編/「スキン」

複数の断面形状をなめらかにつなぐモデリングです。
ちょうちんの様なイメージです。

元の断面は、平面オブジェクトであれば他のツールで作った物や、他のソフト
から読み込んだデータでも構いません。(イラストレーター等から読み込んだ
データでも可能)断面を目的形状の輪切り状に配置し、ツールパレットの鎖状
のアイコン「リンクツール」で断面の順を指示するようにドラッグし、関連づ
けます。

(すべての断面を正確にリンクできれば、終端の断面の動きにすべての断面が
連動するはずです。確認してみてください)

すべての断面を複数選択し、[モデリング]→[スキン加工]→[スキン]を
選択します。

断面間の補間方法をポリゴン方式とスプライン方式から選択することができ、
また補間精度も設定することができます。

ダブルクリックで簡単な設定変更が可能ですが、本格的な変更は[モデリン
グ]→[スキン加工]→[スキン解除]で元の断面形状に戻してから行いま
す。
★★(W by 松岡アキラ)

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
【日刊・デジタルクリエイターズ】 No.0022 1998/05/07発行
発行社  タワーズ株式会社
     <http://www.towers-inc.com/>
     大阪市中央区高麗橋1-5-6 東洋ビル3F
     TEL:06-231-1011 FAX:06-231-0838

編集長  森川眞行 
     柴田忠男 
     神田敏晶 

情報提供はこちらまで 

★【日刊・デジタルクリエイターズ】は無料です。
 お友達にも是非お奨め下さい (^_^)

Copyright(C), 1998 TOWERS INC.
許可無く転載することを禁じます。
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■