Design Wedge バックナンバー：No.64

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━



◆     D e s i g n  W e d g e           internet/web design mail magazine 

＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿
2003/06/12｜no 64｜ http://www.karadesign.com/designwedge/ ｜post>>magmag

((！))

Macromedia Flash Conferenceが６月２０日に開催されます。僕はモバイ
ル関連のFlashのセッションに注目してます。１３日の夕方まで申し込み
を受けつけているそうなので、興味のある方参加してみてはいかがでし
ょうか。僕も潜りこもうと予定たててます。

 " Macromedia Flash Conference "
 ( http://www.macromedia.com/jp/macromedia/events/flashcon/ )

今号から登録された皆様、はじめまして。ご登録ありがとうございます。
Design Wedgeは、現在月２回発行のウェブデザインの専門誌です。
毎月１１日と２６日の発行を予定してます。

１１日発行予定号では、サイトデザインのレポートとモバイルデザイン
関連＋α、２６日発行予定号では、ニューストピックとウェブアプリケ
ーション関連のデザイン＋αという感じで、ウェブデザインの世界を様
々な角度から探究していっています。これからもDesign Wedgeをよろし
くお願いします。

５月より、まぐまぐからのバージョンにはヘッダーもしくはフッターに
お知らせがはいっています。当分はフッターだけのようです。

―――――――――――――――――――――――――――――――――――――

-PR-----------------------------------------------------------------------
◆Design Wedgeに広告を掲載してみませんか？┌──────────────┐
◆掲載場所はヘッダー部分のここです        │ [self AD - No.004]         │
◆広告スペースを全角３７文字×７行です    │ -------------------------- │
◆メールにてお気軽にお問い合わせ下さい    │  media feedback and design │
                                          │          KaRa designstudio │
                                          │ http://www.karadesign.com/ │
>> mailto:designwedge@karadesign.com      └──────────────┘
-PR-----------------------------------------------------------------------


    ≫ c o n t e n t s

   +01 特集１：ワールドサイトデザインレポート
   +02 特集２：ポータブルクリエイション
               「Flash Lite向けコンテンツ制作のポイントとその進む方向」
   ---
   +03 プレスブース
   +04 Design Wedgeよりお知らせ
   ---
   +05 リーダーズブース
   +06 編集後記

   今号のバックナンバーは、
   ( http://www.karadesign.com/designwedge/backnumbers/0064.shtml )
   にてご覧になれます。


 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

   +01 特集１：ワールドサイトデザインレポート
       ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣

 " http://www.vectorlounge.com/04_amsterdam/jam/wireframe.html "
 ( http://www.vectorlounge.com/04_amsterdam/jam/wireframe.html )

パペットのように人間に近い動きを生み出せるFlash作品です。是非見て
もらいたくて紹介します。上部の「＋」マークを動かすことで様々な格
好をします。またモードを変えて「DRUG」というボタンを左右に動かす
ことで、その姿勢のまま歩かせることや二人登場させることも出来ます。
特に二人で歩かせたときの、真面目さでクールさが漂うFlashデザインと、
登場人物のおかしな動きとのギャップは爆笑ものです。

ちなみに、製作したのは、Flashで独特のアニメーションを展開して多く
の追随者を生んだwireframeです。

 " W I R E F R A M E "
 ( http://www.wireframe.co.za/default1.htm )

 - - -

 " Cloats - Just Weah It, Ok "
 ( http://www.cloats.com/ )

早回しのような声が面白いサイトです。
セルフポートレートのような内容になってます。センスがいいです。写
真をFlashを使って見せるサイトはこれまでもいくつも紹介してきました
が、ここも非常に上手い気がします。写真が良くても見せ方が下手だと、
全部見ずに途中で止めて他のサイトへいってしまうものです。

 " Subdisc "
 ( http://www.subdisc.com/ )

 " superhero "
 ( http://www.superhero.se/index3.html )

の２人がデザインしてます。
ウェブデザインのトレンドについて、今はこんなのが流行っていますと
言い切ってしまうのはなかなか難しい部分があるのですが、やはり、今
年はうすいクリーム色が流行っている気がします。去年は思い返せば灰
色とビビッドな単色との組み合わせが流行っていたと思えます。

 - - -

 " Burch Blog "
 ( http://www.gregburch.com/blog/ )

一見普通のBlogサイトに見えますが、Flashを完全にインターフェイスと
して目立たない形で使っている好例といえるサイトです。

Flashの特性として、バージョンがMXになってより感じるのですが、フォ
ーム部分のデザインの柔軟さがあると思います。HTMLのフォームという
のは今に至っても実にやっかいなもので、CSSを使ったとしてもデザイン
としての融通があまり利かないだけでなく、ブラウザやOSによって圧倒
的に見栄えが変わってしまうやっかいな代物です。特に、同じ指定でも
ブラウザ・OSの違いでサイズが違ってしまうのはやっかいです。そのた
め、今ではフォーム部分はある程度余裕を持たせてデザインするという
ことにしてます。

また、Flashのフォームの柔軟さはデザインにとどまらず、ダイナミック
なコンテンツの変化を得意としている部分でも利用価値が高いものです。
このサイトでは、一見普通のフォームに見える部分もFlashを使ってトピ
ックをダイナミックに変化させることに成功しています。例えば、左右
の矢印ボタンを押すことでトピックとその内容が切り替わり、レイアウ
トもコンテンツの長さによって可変できるところなどは、Flashなしでブ
ラウザ・OSの違いにまで対応して実現するのはかなりやっかいです。

どうやら、そのデザインはここが行っているようですが、サイトを見て
いくと、発見がありました。

 " Josh Dura - Weblog, Flash, and Photography "
 ( http://www.joshdura.com/ )

ここのサイトにあるFlashベースのText Editor

 " Text Editor Component v2.0  "
 ( http://www.joshdura.com/archives/000163.php )

は、WIZWIG形式のHTML出力が可能なオンラインテキストエディタです。
ちゃんと日本語のフォントも使える上に書いたテキストは、リンク設定、
文字の装飾（太字や色など）、文の左右真中の揃えなどがGUIを使って出
来ます。その上、ファイルのセーブ、ロード、デリートが行え、HTMLで
の出力も出来ます。

CMSを使っていて思うのは入力部分がHTMLフォーム、という融通のあまり
きかないタイプがほとんどを占める現状を考えると、次世代のCMSはフォ
ームにリッチアプリケーションを使い、WIZWIG形式でコンテンツを入力
できるようになるのではないかという方向も考えられます。

それから、Text Editorはフリーソフトではないので利用には注意する必
要があります。もし、商用に使いたい場合はちゃんとコンタクトとった
上で商用利用するようお願いします。


 " movabletype.org "
 ( http://www.movabletype.org/ )

上で紹介したBlogもそうですが、movabletypeと言うBlogツールで作られ
たサイトを多く見るようになりました。

movabletypeは、非常に洗練されたデザインを持っているため、見やすい
です。また、特徴として、RDF Site Summaryと呼ばれるXML形式のファイ
ルを使ったサイト間の情報のコミュニケーションやTraceBackという他サ
イトの記事への関連情報としてを自サイトと繋げられる機能があります。

RDFファイルはいずれハニーモジュールでやろうと思ってます。情報を参
照する際にはリンクという参照か引用という方法はどこでも行われてい
ますが、RDFファイルから情報を取得するというスタイルはまだまだごく
一部しかない気がします。情報を自分のサイトに取り込める上に、ソー
ス元が分かるというのは、なかなか画期的ですよね。

RSS（RDF Site Summary）は日本でも大手に限らず様々なニュースサイト
でも使われていて、記事のインデックスなどを取得できるようになって
います。ただ、こういうXMLファイルなどを使うようになってくると結局
それを整形して利用するためのウェブアプリケーションが必要になって
くるわけで、こういう部分からもウェブサイトのウェブページからウェ
ブアプリへという変化の図式を感じ取れるのです。

さて、このmovabletypeですが、Six Apartという会社が開発元です。

 " Six Apart "
 ( http://www.sixapart.com/ )

movabletypeは、Blogとしての機能もさることながら、それを質のいいデ
ザインと融合させているところが他のBlogサービスと一線を画す結果に
なっています。このmovabletype、2003年のWebby Awardsで、
Best Practicesに選ばれています。

 " The Webby Awards "
 ( http://www.webbyawards.com/main/ )

うちのメインコーナーの一つであるハニーモジュールでは、ウェブデザ
イナーの側からアプローチしていけるようなアプリケーションを「探す」
という目的と「作る」という目的が当初からあったわけですが、最近傾
倒しているCMSをオープンソースで構築して公開してみようという計画が
進んでます。

いろいろ研究していくと自分でも作りたくなってしまうものです。オー
プンソースとしてプロジェクトを立てて、メーリングリストなども作っ
ていきます。はっきり言ってまだわからないことだらけですが、面白そ
うです。スタート時にはデベロッパーとして参加者とか募ったりしたい
なあと思います。

 - - -

 " Vodafone.com "
 ( http://www.vodafone.com/ )

いよいよ１０月からブランド名もJ-PHONEからボーダフォンに変わるその
Vodafoneのグローバルサイトです。Vodafoneのサイトはとにかくブラン
ドイメージについて徹底した造りになっていて見るべき箇所が多いです。

ブランドカラーである赤を多用しながらも、うるさくならないように、
標準のリンクには赤を使用せず、黒色のままリンク箇所には下線が引い
てあるのみになっています。普通だと、赤色を標準のリンクに持ってき
たり、他の色でリンクを目立たせたりしそうですが、そうしていないの
は意図的にそうしてないと推測します。Vodafoneのサイトの目的を考え
るとそれで正解なんだろうということに気づきます。

ブランドというと大企業の、というイメージがありますが、いくらでも
イメージを増幅していくことができるウェブという特殊な場では、むし
ろ、小規模なところが大きくアピールできるというところに夢があると
思います。そういう中で、まずは認知してもらうところから始めること
になるわけですから、自分なりのしっかりとしたブランド戦略を持たな
いのはむしろ損だと最近思うのですが。

 " Coca-Cola "
 ( http://www2.coca-cola.com/ )

同じく、赤色といえばコカコーラといえるほどのブランドカラーを持つ
コカコーラのサイトと比べてみると、方向性によるアプローチの違いで、
同じ赤でも印象がまったく違うのがわかります。デザイナーによる様々
な表現方法が見えるのもウェブのコーポレートサイト探索の楽しみのひ
とつです。

 - - -

 " tokidoki v2.0 "
 ( http://www.tokidoki.it/ )

ポップなイメージとは裏腹に、しっかりと作られたインターフェイスが
たまに垣間見れてうなってしまうサイトです。例えば、それは左部から
引き出てくるしっかりとしたメニューの構築のされかたや、回転寿司ゲ
ームのインターフェイスで感じることが出来ます。子供の頃からコンピ
ュータやテレビゲームに囲まれて育ってきた世代というのは、やはりイ
ンターフェイスを作るのがうまい気がします。



 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

   +02 特集２：ポータブルクリエイション
       ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣

--- Flash Lite向けコンテンツ制作のポイントとその進む方向 ---

前号の編集後記に書いた後もDoCoMoのi-mode用Flash概要ページを何度も
読みました。この概要ページ、多くの人が簡単に理解できるように、実
にわかりやすく書かれています。長くなっても別ページにしないほうが
いい好例だなあと思いました。

 " DoCoMo Net - 製品・サービス - i-mode - iモー... "
 ( http://www.nttdocomo.co.jp/p_s/imode/flash/index.html )

 " Macromedia - DevNet : Macromedia Flash Lite f... "
 ( http://www.macromedia.com/jp/devnet/mobile/i-mode/ )
　この２つのページは必ずチェックしておこう


-- すぐわかるFlash Liteのポイント

i-mode用Flash概要ページの中にあるこれはと思うチェックポイントや
それについて考えるべきことなどを挙げてみます。

 - 使えるFlashの機能はバージョン４相当

詳しい仕様はマクロメディアから配布されているガイドラインを見る必
要がありますが、基本的にはバージョン４相当のスクリプトが使えると
考えましょう。

考え方を変えれば、携帯向けのFlash Playerが出始めの最初の段階で既
にバージョン４相当の再生能力を持っているわけで、これからますます
進化していくであろう携帯電話のパフォーマンスを考えると、
今後のFlash Player に期待といったところです。

今はハイエンドに属するこれらの携帯電話の機能も時期が経てば、ロー
エンドモデルにもFlashが搭載されることは容易に予測がつきます。
PCのウェブデザインで振りかえってみると、最初の仕様が後々までス
タンダードとなって制作する際の基準になってきているので、今回の
Flash Player Liteの仕様はしっかりと学んでおいたほうがよい気がして
います。


 - インラインモードとインタラクティブモード

Flash Player Liteの端末へ表示のされ方ですが、インラインモードとイ
ンタラクティブモードの２種類があります。インラインモードとは、い
わゆるPCでウェブサイトを見たときに表示されるようなHTMLページの一
部に埋め込んであるような表示モードです。このモードで表示を行う場
合は、キーイベントやサウンドなどのいわゆるインタラクティブな機能
は使えません。

インタラクティブモードは、PCでいうところのフルスクリーン再生とい
う位置付けに近い形です。キーイベントやサウンドなどのインタラクテ
ィブな機能も使え、携帯独自のボタンや内蔵アプリとの連動も可能との
ことです。

また、待ち受け画面にFlashを取り込んだりもできるので、クリエイター
にとっては作品を広げる機会が増えます。例えば小さなインタラクショ
ンアートを配るのも面白いかもしれません。注意点としては、マイピク
チャや待ち受け画面で再生されるFlashはサウンドやキーイベントの再生
がされないという部分があります。

インタラクティブモードでの再生は、objectタグにdeclareと記述するこ
とで可能になります。

Flashを呼びだすことになるHTMLも、505系ではiモード対応HTMLがバージ
ョン５となったので、ここもチェックしときましょう。

 " iモード対応HTML "
 ( http://www.nttdocomo.co.jp/p_s/imode/tag/ )


 - 画像表示設定をオフにしてある場合

電話側の設定で画像表示設定をオフにしてある場合はUser-Agentが変わ
るので、これをCGIなどで判定するという手があります。オフの際にイン
タラクティブモードで再生される場合、端末の画面には未取得の画像が
あることを示すマークが表示されるのみとなるのだそうで、コンテンツ
配信者は注意が必要かもしれません。この部分も要チェックです。


 - 320×240のQVGAという共通の解像度でいいスタートのはずが？

i-mode用Flash概要ページには解像度の指定は載っていませんでしたが、
基本的に、次世代505iシリーズはQVGAの解像度という認識を持っていま
した。一様な仕様のおかげでずいぶん悩みが減るのではと思っていたの
ですが、一部の機種では微妙に異なる解像度になっています。

ピクセル１個１個の重みが高解像度のディスプレイ環境に比べて高い環
境ではFlashの縦横比は是非ともなんとかしたい項目です。特にベクター
系を多用したデザインでは変わらないかもしれないものの、ピクセルベ
ースのFlashムービーを作るときは注意しなければならないことが出てき
ました。

現在発売されている505iシリーズは、D505iとSO505iの２機種ですが、
SO505iは、320×240のQVGAではなく、320×256ピクセルとなっています。
ピクセル数が増えるだけでなく、縦横の比率すら変わってしまうのは少
し困るかも知れません。他の携帯同様320×240で統一してもらえたらな
あと思ってしまいますが、もう発売してしまったということは、制作の
際に気に留めておく事柄が一つ誕生してしまったということです。

 " SO505i：主な特長 "
 ( http://505i.nttdocomo.co.jp/product/so505i_forte.html )

 " 505i:製品ラインナップ "
 ( http://505i.nttdocomo.co.jp/product/index.html )



- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

   +03 プレスブース
       ￣￣￣￣￣￣

((！))
Design Wedgeでは、このたび、募集・告知コーナーを、企業の皆様から
のプレスリリースやイベント情報を掲載するプレスブースと、読者の方
の情報募集やプロジェクト発表、イベント、提案、発表のためのリーダ
ーズブースとして分離しました。月２回の発行となったことで、少し鮮
度の高い情報を届けられそうです。

このコーナーでは引き続き、イベント情報や求人募集スペースとして場
所を提供していきます。スペースは、３２文字×１０〜２０行くらいと
なります。掲載のご依頼お待ちしてます。
メールにてお問い合わせ下さい。

  ↓
 mailto:designwedge@karadesign.com



 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

   +04 Design Wedgeよりお知らせ
       ￣￣￣￣￣￣￣￣￣￣￣￣

((！)) 

Design Wedgeは月２回発行のご案内です。
現在１１日と２６日の発行を予定しております。１１日発行予定号では
サイトデザインのレポートとモバイルデザイン関連＋α、２６日発行予
定号ではニューストピックとウェブアプリケーション関連のデザイン＋
αという感じになります。

ウェブデザインの探求を目的に始まったDesign Wedgeですが、これから
もその方針は変わりません。今後は、アドバンスドな方向に向かいつつ
も、わかりやすく伝えるということに力を入れていきたいと思います。

＋α部分では、今まで散発的にやってきた、ウェブデザインの制作環境
関連、インターネット広告関連、オンラインゲーム関連のコーナー、な
どがはいったり、はいらなかったりする感じになります。また、以前す
こしだけあった情報掲載スペースは、企業向け、読者向けにそれぞれ利
用可能なスペースを設けましたので、ここがなんらかの接点になって様
々なコミュニケーションが生まれることを期待してます。

 - - -

リーダーズリンク、引き続き随時募集中です。現在も募集してますんで
是非申し込んでみてください。サイト名とＵＲＬ、サイトの紹介コメン
トのみ必須です。

 " Design Wedge | リーダーズリンク "
 ( http://www.karadesign.com/designwedge/readerslink.shtml )

 - - -

制作者同士のコミュニケーションがメインとなったメーリングリストを
引き続き行っております。参加者が気軽に投稿出来、安らげるようなメ
ーリングリストを目指していく予定です。ただし、こちらは、大きなコ
ミュニティ形成を主としてはいませんので、クローズドな形式を採用し
ています。

参加方法に関するお問い合わせは、登録したいメールアドレス、簡単な
自己紹介など添えまして、dwml@karadesign.comまで。

 → mailto:dwml@karadesign.com

 - - -

現在月二回・無料で発行中のDesign Wedgeをお知り合いやお友達にも薦
めください。リンクなども歓迎です。多くの人に是非読んでいただきた
いです。感想や情報提供投稿などもお待ちしてます。

 → mailto:designwedge@karadesign.com

 - - -

現在Design Wedgeではヘッダー部分に掲載する広告を募集しています。
全角３７文字×７行。詳細はメールにてお問い合わせ下さい。

 → mailto:designwedge@karadesign.com



 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

   +05 リーダーズブース
       ￣￣￣￣￣￣￣￣

((！))
以前ありました募集・告知コーナーを、プレスリリースやイベント情報
を掲載するプレスブースとしてスタートした一方で、Design Wedgeとい
うメディアをもっと有効に使ってみようと思い、リーダーズブースとい
うものを作ってみました。

考えているのは、読者の方の情報募集、プロジェクトやコラボレーショ
ンの発表・募集、イベント、提案、発表としての用途です。

掲載フォーマットは、３２文字×５行で、最初の一行目には題名が、下
２行にはURLと問い合わせのメールアドレスが入ります。また、顔文字や
装飾用の文字は禁止とします。ここのスペースから、だれかとだれかが
繋がって新しいことが起きる、そんな場所を作れればと思います。

詳しくはメールにてお問い合わせ下さい。

  ↓
 mailto:designwedge@karadesign.com



 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

   +06 編集後記
       ￣￣￣￣

最近「最終通告」などというサブジェクトのメールで覚えのない請求を
してくる一種の詐欺メールが出まわっているようです。もし、こういう
系統のものを受け取ってもお金など振りこまないよう注意しましょう。

こういったインターネットの特性を見事に悪用した業者が次から次へと
出てくるのは本当に不思議です。もしノンフィクションライターだった
らこういう業者を取材していいルポタージュが書けるだろうなあとか思
うのです。

次号の発行は６月２６日を予定しています。


＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿

D e s i g n  W e d g e

    ≫ M a g a z i n e  i n f o

   +01 発行：KaRa designstudio
       http://www.karadesign.com/
       mailto:info@karadesign.com
   +02 編集・発行人：原　一浩　[Kara_D]
       mailto:khsoul@alles.or.jp
   ---
   +03 現在の購読者数：8500人
   +04 Design Wedge公式ページ：
       http://www.karadesign.com/designwedge/
       登録・解除はもちろんのことバックナンバーも見ることが出来
       ます。
   ---
   +05 お便りはこちら：
       mailto:designwedge@karadesign.com
       感想・情報提供・お問い合わせなどはこちらまで。お便り待っ
       てます。
   ---
   +06 配信：まぐまぐ
             ( post  ->  magmag )    id:0000005412
             ( http://www.mag2.com/ )
             Pubzine
             ( post  ->  pubzine )   id:225
             ( http://www.pubzine.com/ )
   ---
   +07 コピーライト（著作権）：
       Copyright(c),1998-2003  KaRa designstudio
       許可無く転載することを禁じます。ただし、参照としてのバッ
       クナンバーへのリンクや引用などは可能です。

 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

   +99 スタジオ１×１行プチニュース

       " YaWPSのほうちょっと手間取っております "
       ( http://www.karadesign.com/cgi-bin/yawps/ )

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━