2008年9月7日日曜日

WebコンFESTA2008に参加してきました

WebコンFESTA2008に参加してきたのでレポートしますよー

基本デザイナ向けセッションなんだけど、プログラマにとって重要(とまいむぞうが判断した)なものをピックアップしますよー

Adobeクリエイティブツール最前線! ~アメリカ直送の最新動向ご紹介~

プログラマ寄りのトピック(まいむぞうの判断による)

  • FlashPlayer10RCが夏リリース予定(正式版は2009中にリリース予定)
  • Open Screen Project 携帯用FlashPlayerが無料化される。これによって普及が進み、同じバージョンで横に揃うかも、とのこと。(Adobe的には無料化してでも欲しいところなんだろうね)
  • SWF search optimization for Google & Yahoo Flashを使ったコンテンツの場合でも効率的にインデックスされるように、GoogleやYahooと協業し、Flashの内部構造を示しているみたい

Flash Player 10

  • リアルタイム静止画・動画フィルタが使えるようになる。フィルタはプラグインとして動き、Labから公開される。Adobe Pixel Benderを使ってプラグインを自作することも可能。
  • 標準で3D空間系の関数がサポートされる。デモで見た感じではパフォーマンスも良好。(でもちゃんとオブジェクト作って動かした訳じゃないし、他のサードパーティライブラリとの比較は不明)
  • テキストエンジンの強化。縦書き対応。テキスト流し込みできちんと(横書きと同じように)レイアウトされる。
  • 動画レンダリングエンジンの強化。可変長ビットレートやオープンソースのSpeexコーデックに対応。

DreamWeaver CS4についても話がありましたが、次のセッションにまとめます。

超スピードで進行したので、捉え間違っていたらごめんよう。

質疑応答

Q:KulerやPhotoshop ExplessやShereのインターフェイスは顧客からの評判がよいが、これは何で作られている?

→A:Flexで作られている。

Q:これらのソースは一部でも公開されている?

→A:現状では公開されていない。

公開してくれるとうれしいなーと伝えておきました。

あと、懇親会でMac用のPlayerが未だにBuggyだよーって突っ込み入れておきました。

Webサイト制作の「今」とともに進化するDreamweaver CS4

DreamWeaver CS4

  • リアルタイムHTMLレンダリングエンジンにSafariと同じWebKitを採用。(うん。これ良いね)
  • Webを使ったライブビュー機能では、オンマウスでのCSS切り替えや画像差し替えなどがリアルタイムに確認可能。JavaScriptなどによって書き換わったDOM要素をFireBugのように確認可能。(オンマウス時に画像を切り替えたならimgタグのsrc属性がリアルタイムで書き換わるなど)
  • 特定エレメント(たとえば<h2>タイトル文字</h2>とか)に影響しているCSSの一覧を、コードヒントのような形で表示可能。ただし、FireBugのように最終的になにが有効になっているのか(継承とオーバライト)を考慮したものではなさそう
  • jQueryやPrototype.jsなどの外部JavaScriptライブラリも検知し、エディタ内でコードヒンティング可能
  • subversion(やっと)サポート。ただしignoreなどの属性系機能はサポートされてないみたい。(デモ画面から)

このドリはちょっと便利そうな気はした。でも、テンプレートいじるならドリ使うけど、JavaScriptとかなら他の環境(aptenaとか)使うかもなぁ。

質疑応答

Q:HTMLレンダリングエンジンはWebKitを使っているとのことだが、JavaScriptの実行エンジンは?

→A:JavaScriptの実行エンジンもWebKitと同じ。ただしDreamWeaverチームの方でWebKitをチューニングしているので、Safariとまったく同じ表示ではない。

Q:特定のタグにかかっているCSSをコードヒントを使って表示する機能は、FireBugのように複数のクラスのどの要素が実際に使われているか(継承される過程でどのプロパティがオーバライトされているか)は判断してくれるのか?

→A:コードヒントでは、適用されているクラスなどを列挙するだけ。継承とオーバライトについては実は前のバージョンで実装されていたみたい。CSSのパネル(デフォルトだと右上)内にてFireBugと同じように表示できる。また、優先ポイント付け(クラスだと何点でIDだと何点みたいな)ものもオンマウスで簡単に確認できる。

他何個か質問があったけど忘れちったぃ。

文字コード判定や、erbやsmartyなど、一部サーバサイドスクリプトが組み込まれているHTMLテンプレートをきちんと表示できて、壊さないようにしてくれるような機能が欲しいよね。(時間が無くて言えなかったけど)

懇親会では、(erbとかsmartyとかdjangoなどの)テンプレートファイルをいじりやすくしておいて、サーバにアップする機能と、ドリ内部でIEコンポーネントを起動(コード/デザインの切り替え機能に、ブラウザ経由で表示するモードを追加する)して、サーバからの出力をブラウザを通してスムーズに動作確認できるとプログラマに受けるかも、って話が出てました。

Fireworks as phoenix(おめでとう、Fireworks 10周年!)

ごめん。おいら興味ないので、興味ある人はAdobeのサイトで調べて。(おいらグラフィックツールを使うことはないので)

でもプレゼンターの鷹野さんはすごくプレゼンがとても上手でした。慣れてる感じ。

Fireworksは、フォトショ・イラレなどの画像ツールと、ドリやFlashやFlexなどの開発ツールの間に位置し、マテリアルの加工や配置・プロトタイピング・ボタンなどのちょっとしたマテリアルを作る、みたいな場面で使われていくのではないか、とのこと。(でもビミョー)

質疑応答

Q:HTMLコーディング専門会社から見ると、Fireworksを使いこなせば業務がすごく楽になりそうなので、Fireworksをぜひとも普及させましょう!!

→A:承知しました!!

Adobe AIRで作るRIAのご紹介

AIRの概念とかデモを見せてもらいましたが、あまり目立った情報はありませんでした。(自分の知識ベースでは)

セッション内で紹介されたAIRアプリは、後で資料もらえると嬉しいかも。

AIRの使いどころ(説明を聞いていてまいむぞうが思ったもの)

  • 背景を透明に出来るので、3Dヒューマンインターフェイスを提供できる基盤技術としては有効かも(ただし3Dプログラミングに精通しないと作るのは難しいよねー)
  • SQLiteを使ったクライアントキャッシュを効かせたアプリ(サジェスト系? もしくは、確定できずとも予約受付だけでも意味があるような予約システムとか。ネットワークレスで動くので)
  • ウィジット
  • ブラウザの独自拡張(HTMLをきちんと再現できるところまではコンポーネント化されているので、作りたい独自機能だけのプログラミングで済む。まぁVisualStudioでもあるけどね。レンダリングエンジンの好みの問題)

Adobeとしては、音声や動画を簡単に使うためのサーバサイドミドルウェアがあるので、こっち方面では結構良いんじゃないの?的なスタンスの模様。(懇親会では「あの値段じゃあやっぱり使いづらいなぁ。オープンソース版出ないの?」的な突っ込み入れておきました。まぁRed5とかもあるので、いいっちゃあいいんですが)

あとは3D系エンジンが色々出てるので、VIsualStudioより(サーバパーティ製ライブラリを使わないならば)結構良い物が作れる気がする。特に3Dでマルチタッチインターフェイス(対応できるか知らんけど)とか絡めると、結構面白そう。

時間が無くてあまり質問できなかったのが残念。

(もしAdobeさんがこのエントリを見たなら、「ぶっちゃけ、AIRってどうよ?」というエントリに返信くれると嬉しいです)

ワークショップ

AIRで作ったら面白そうなアプリについて3人一組でグループ使って考えました。

発表されたアイデア

  • サッカー選手のデータベース
  • ドラマなどで出てきた服やインテリアを自分のアバターに着せることが出来るAIRアプリ
  • AIRでの勤怠管理
  • ヤフオク専用AIRアプリ。終了時間通知機能や商品管理機能がついてる

簡単にブラウザ拡張ができそうなので(しかもこの方法ならレンダリングエンジンを限定できるので)、特定用途向け専用ブラウザというアイデアは結構良い気がします。

HTMLの中にどの程度アクセスできるのか(HTTPリクエストをフックできればOK)理解していないので、ダメな理由はありそうですが…

Hokkaido Fresh Flash

Flashでのプログラミングについて

  • ASライブラリは便利。使うべき

おすすめライブラリ

AS2なら

  • Tweener(AS2ではあまり使われてないかも)
  • FuseKit(有名)
  • CASA Framework(有名)

ただし、AS3だとTweenerの利用頻度が高いので、これから使うならTweenerがオススメ

AS3なら

  • アニメーション → Tweener / Go
  • 3D → Papervision3D / Away3D / FlVe3D
  • 物理演算 → Box2DFlashAS4 / APE
  • マップ → GoogleMAP API for Flash(基本Flexだけど非公式版ならcs3でも使える)
  • タスクシステム → Thread
  • フレームワーク → Progression Framework
  • スライド → Slides(プレゼンに便利かも)

Spark projectのページは熟読すると良いよ

実際にセッション内に携帯用抽選アプリを用意しており、賞品付きで抽選アプリケーション(スクリーンにリアルタイムで募集状況がアニメーションしており、当選者は携帯を持って賞品と引き替える)を実演していたので、感覚的におーって感じでした。

次世代型広告コミュニケーション

個人的に一番期待していたセッションです。

いんてぐれーて(rは内容変更のため聞けませんでした。

  • 流行は必ずWebが絡んでくる。発端もしくは結果として。
  • 広告業界の視点で見たWebマーケティングはWebCampaign って本が事例とかに詳しい
  • 広告業界では「広告は消費者へのラブレター」と昔から言われている
  • このセッションでは、このラブレターの作り方から、渡した後でのフォローまでをまとめて、コミュニケーションデザインと定義している
  • 購買行動はAIDMAからAISASへ変化してきている(詳しくはこのへん参照)
  • 広告は消費者とブランドのbuddy化
  • Encounter(出会い)→Interactive(遊び)→Repeat(もう一度)という流れでコミュニケーションデザインするような流れが生まれてきた
  • 新しい広告の形。デジタルサイネージ(ネットから広告を随時更新する大形カンバン)
  • デジタルサイネージ+顔認証。デジタルサイネージにカメラが付いていて、顔認証にて通行人の性別を判断し、内容を変更するような事例あり
  • デジタルサイネージ+携帯。携帯の画面上にコントロール用のインターフェイスがあって、カンバン上の水槽が動く。魚釣りゲームで、釣れると携帯が震える。(サイトの右上のサムネイルをクリックすると、イケスのようにデジタルサイネージが置いてあり、実際に釣っているイメージ画像があるので、それ参照。これオモロー!!)
  • Interactive Everywhere!
  • googleのエンジニアもyahooのエンジニアも、PC上のインターネットユーザ数は頭打ちで、次の爆発はモバイル周辺で起きると思っており、今からこれに備えて色々動いている模様。
  • androidについてgoogleに聞いても根っこ押さえればおれら儲かるからいいんだみたいなノリで進んでるんだって


"Webキャンペーンのしかけ方。 広告のプロたちがつくる“つぎのネット広告”" (渡辺 英輝, 阿部 晶人, 螺澤 裕次郎, 伊藤 直樹)

Planning Method(プランニングする上での留意点)

  • Insight
  • Cultural Trend / Fuel
  • Hurdle
  • Emotion
  • Childhood memories

上記文字だけだったので、話を踏まえて自分なりに整理(で、おいらは横文字苦手)

  • 深層心理を理解する
  • 傾向や動機を理解する
  • 上記を見据えての問題点を把握する
  • 感情に訴える
  • 幼い頃の記憶とダブらせる

心に残った話

  • 子供の頃の思い出を引っ張り出して、再体験するのがいいんじゃない?
  • マトリックスみたいなカメラを360度並べてアニメーションを作るのは、実はデジカメにデータをWiFiで飛ばすスマートメディアのようなもの+シャッターだけ切るように作れば、後は人力の根性でなんとかなるかも。
  • Web広告予算は20%ぐらい?(総予算の20%?ちょっとわかんない)
  • ナイキの社風が「尖っているものを大切に」的な感じなので、ナイキのようなチャレンジングを全ての企業に提案できるわけではない。
  • 飛び抜けた企画を持って行っても、クライアント企業(広告主企業)の協力がなければ実現できない。自分の企画は50%ぐらい? あとはクライアントの社風やクライアント側担当者の熱意が必要。

でも、自己紹介とか自分のプロダクトの事例紹介永杉。上記内容は40分中後半10分で語られた。(途中まで「がっかりだった」的な記事を書きかけていて、後半オモローだったので書き直した。全体としては満足してます)

でも、インサイトをこういう風に見つけて、こういう理由でこういいキャンペーンを張って、このぐらいのスケジュールのこのぐらいの予算で動いたら、このぐらい効果があったよー、みたいな具体的な話が聞きたかったなぁ。紹介された本 にのってんのかな?

全体的に

特徴的だったのは、プレゼンターのほとんどがMacでKeyNoteを使っていた点です。やっぱりインパクトあるからかな。

結構人来てたねー。100人ぐらい集まったみたい。懇親会50人、二次会25人、三次会12人?(これ法則?)

CSS Nite仕切ってる鷹野さんはとってもオモローな人でした。プレゼン上手すぎ。早速モンタメソッド使ってましたね。

Adobeのねーちゃんは結構オモローな人だった。いじられキャラ。

基本大満足。

北海道でFlexユーザグループ?

あ、そうそう。北海道でFlex/AIR関係のコミュニティ作ったら参加したい人なんて居ますか?

人数集まるならコミュニティ作れってお達しが出てるんですが。adobeさん後援かも。(てか、実現すると↓みたいにユーザフィードバックを集めて送れるってのが大きいかも)

興味ある人居たらmaimuzo@gmail.comまでどぞー

Adobeのねーちゃんへ

文句たれたれリスト復習編

  • Mockupsのオンライン版。シングルバイトは入力できるけど、カナは入力できない。ただし、コピペはできる。
  • おいらが常用しているAIRアプリはこのデスクトップ版。Balsamiq Mockupsを使ってみた 参照。こっちは普通にマルチバイト通る。
  • MacのFlashPlayerがBuggyという証言その1。これが悲しいんだ、たぶんmacだけ - mes que un club
  • UstreamのIRCチャットボックスにも入力できなかった覚えが。(これはFlashだったかどうか微妙だけど。ちなみにMacOSX10.5+FireFox使ってます)
  • Mockupsはイイけど、でもこれがAIRである必然性はない気がする。これもおいら何回もバグレポート送ったよ。やっぱりこのクラスだと作りにくいんだと思う。(まだまだbuggyだし)
  • 上記と同じ人。同意。AIRって何に使うの?って話 - mes que un club
  • AIRに関する考察。AIRってどうよ? 参照
  • SQLiteは非同期で使うと非常に使いづらい。同期で使うようにはできないのかな? (サポートしてないのかも知れないけど)トランザクションとかどうやって使うの? それともトランザクションを使うようなクリティカルなモノは対象外ってこと?
  • Flexをベタで書くスタイル(旧来通りのHTMLにonclick="hoge();"とかしといてJavaScriptの関数を呼ぶのに相当)では、ある程度の規模になると保守しづらい。AS3/Flex2 を使い始めて約半年 - 8時40分が超えられない - subtechあたりに深く同意。
  • でもケアンゴームは大げさに感じる。要は中規模で使えるFlexベタとケアンゴームの中間がないように感じる。Flexのフレームワークまとめ あたりではさらっと調べたんだけど、ピンと来るモノは無かった。adobeさん的にどれか一つを推せば、力が集中される気もする。(これは善し悪しか)
  • Flexでの利用を前提としたASのコードジェネレータ欲しいなぁ。Railsのscaffoldみたいな感じのやつ。RailsとかならXMLはちょー簡単に返せるし、定型なのでscaffold作りやすいと思うんだけど。AMI(だっけ?)も簡単に使えるし。
  • いちプログラマの視点で見るとAIRってウィジット以上複雑なシステム(クリティカルなモノとか)には使いづらいと理解している(だったらVisualStudioで作ればいいじゃんと思っちゃう。銀色なものもあるし)
  • 他のアイデアはAIRってどうよ?のまとめとか、このエントリのAIRセッションあたり参照。でもイマイチ「コレ!!」ってのは思いつかない。
  • で、これについてAdobeさんのスタンスは、こんなん(AIR)作ったからどこで使うかはユーザサイドで考えてねみたいに感じた
  • これって堂々巡りで、結局使い分けとして考えていくと、ウィジット系以外に使い道がないとして止まってしまう気がする。ほらこの用途で使えば他と比較してこんなに便利だよー的なエリアって想定できないのかな? このへんはやっぱりMSは理詰めで上手いなぁと思う。(ちなみにおいらMSは嫌い。だけど現状業務アプリならMSを推す)

2 件のコメント:

まいむぞう さんのコメント...

このエントリをアップした数時間後にはFlexUGを!!みたいなメールが1通来てました。
一応報告までー

まいむぞう さんのコメント...

Mac+FireFox3.0.1以下の状況で、FlashにIME経由で文字を入力できないバグがあって、それがFireFox3.0.2で修正されたみたい。
本文中の不具合はこれだったのかもね。(未検証)
http://mozilla.jp/firefox/3.0.2/releasenotes/