『ADC MEETUP ROUND 01 モバイルを攻略せよ』に参加してきた
（↑上記は休憩中の一幕。)
Android、iOSを搭載したスマートフォンやタブレットの勢いが止まらない2011年。従来機種の携帯やPC向けのWebコンテンツ制作やアプリケーション開発だけにしがみついてもいられない状況となってきています。 今まで培ってきた知識とノウハウを武器に、様々なWeb系の技術コンテンツが集まる Adobe Developer Connection （以下 ADC）と連動した本イベントを通して、この新たな潮流の攻略方法を探してみませんか？今回のADC MEETUP ROUND01では、モバイル機能が大幅に強化されたCS5.5 Web Premiumの主要製品を活用した攻略方法の一端をご紹介していきます。
という訳で行って参りました。場所は西新宿・イベントホールの『ベルサール新宿』。新宿駅から場所も少々遠く、地理的な勘も全く知らない場所だったのと時間的・天候的な問題で新宿駅からタクシー使って開始時刻ちょい過ぎに到着。
着席時点では既にセッション1が始まってしまっていました。どのセッションも約30分、内容的にも駆け足な感じではありましたね。以下ざっくりとメモ・感想等。
SESSION1:Adobe CSS Web Premiumのご紹介
- アドビ システムズ 株式会社 / 西山 正一、岩本 崇、轟 啓介 各氏
- 商用モバイルアプリを外注した場合の目安として、様々な条件にもよるが：1000万円台〜4000万円台が相場。
- Flash Player,AIR共に対応しているのは1.3億/2億と世界規模で様々な箇所で利用されている。
- 開発効率
- レイヤーのコピーペーストが可能に
- コードスニペット強化
- （共有アセットのデモ）
- Adobe AIR Contest 2011開催！(締め切り：2011/07:/31)
- 情報収集：毎度おなじみ以下の関連サイトにて。
- Adobe - Adobe Developer Connection
- Adobe Developer Connection
終盤には、当イベントの第2回も早くも実施が決定しました！という知らせが。テーマはHTML5について、8月開催との事でした。HTML5関連のイベントは毎度毎度大人気なものが多いですので、次回も大盛況な予感。
SESSION2:スマートフォン向けWebサイトの制作
自己紹介および書籍のご紹介。
iPhone+Android スマートフォンサイト制作入門 (WEB PROFESSIONAL)
- 作者: たにぐちまこと
- 出版社/メーカー: アスキー・メディアワークス
- 発売日: 2011/02/19
- メディア: 大型本
- 購入: 5人 クリック: 425回
- この商品を含むブログ (14件) を見る
- 『スマフォ』と『スマホ』：検索結果では後者の方が圧倒的に多いので、後者の呼び名で行きます。
- サイトのタイプ
- マルチスクリーン：(例)BLOG 未来館のひと
- 1ソースで作ってくれ、という依頼も多い。
- 今後はマルチスクリーン？
- 制作の手間・費用
- PCでもWebkitが主流に
- コンテンツの有効活用
- マルチスクリーンを攻略せよ
- 諸々の手順、Androideでも上手く行く？…という訳にはいきません。
- メディアクエリーが上手く効かない状態。
- →再読込
- デバイスを横にしてみる、やっぱりおかしい
- メディアクエリーが上手く効かない状態。
SESSION3:ネイティブアプリに変わる、新しいアプリ開発スタイル
- メリット・デメリット
- 対応ブラウザ多数（11種類）
- jsを知らなくてもモバイルサイト構築可能
- data属性を使ってマークアップにセマンティクスを与える事が出来る
- 簡単ゆえに、カスタマイズが大変
- jQuery Mobileを使ったモバイルアプリの制作
- 業務・ユーティリティ系アプリには最適では。
- web上にコンテンツを配置すれば更新が手軽に
- ユーザには常に最新版を利用してもらう事が出来る
- マークアップドリブンなのでサイトとも親和性が高い
- ちょっとだけ夢を叶える：ネイティブアプリビルド- PhoneGap
- PhoneGap Fan - PhoneGapの日本語コミュニティ
- クロスプラットフォーム・モバイルあぷりの開発FW
- HTML+CSS+jsでネイティブアプリの開発が可能に
- カメラなど、webアプリからではアクセス出来ない機能にもアクセス可能
- Appstoreやマーケットプレイスでアプリを販売することが可能
- jQuery MobileとPhoneGapをお手軽に使う(デモ実演)
- HTML5+JS一択？
- Web/ネイティブアプリの違いを把握する
- jdso.itのメリット
- まとめ
- 未来のスマートフォンを意識して標準技術をつかおう
- 学習コスト・制作コストをおさえて制作スピードアップ
- jm+DWCS5.55の組み合わせで効率アップ
- メリット・デメリットを把握して適切な選択肢を選ぼう
SESSION4:マルチスクリーン対応コンテンツのデザイン＆最適化
- 株式会社クスール / 尾崎 俊介 氏
※ちょいと環境的に遠かった部分があるのでこのセッションの内容はメモ取ってませんでした^^; 実演も多めでしたし。
SESSION5:Flashによるマルチデバイスアプリ開発ワークフロー
書籍を幾つか出版されています。
Flashではじめる Androidアプリ開発入門 ［Flash Professional CS5.5対応］
- 作者: 池田泰延,古堅真彦
- 出版社/メーカー: 技術評論社
- 発売日: 2011/03/18
- メディア: 大型本
- クリック: 32回
- この商品を含むブログ (7件) を見る
- Flashを使うメリット
今日は1.について掘り下げる。
- CS5.5の新機能
- 告知：新しい書籍が発売されます！
ActionScript Beautifl Code〜Beautifl: Flash Gallery of wonderfl〜
- 作者: 池田泰延
- 出版社/メーカー: ワークスコーポレーション
- 発売日: 2011/06/08
- メディア: 単行本
- 購入: 2人 クリック: 408回
- この商品を含むブログ (3件) を見る
- 「ActionScript Beautifl Code」という本を執筆しました | ClockMaker Blog
- wonderfl本でPapervision3D解説を書きました | ClockMaker Blog
ブラウザで無料ではじめるActionScript 3.0 ―It's a wonderfl world―
- 作者: 面白法人カヤック,フォークビッツ
- 出版社/メーカー: ワークスコーポレーション
- 発売日: 2009/12/19
- メディア: 単行本
- 購入: 1人 クリック: 236回
- この商品を含むブログ (29件) を見る
SESSION6:Flash Platform開発者が知らないと損をするFlex Mobile
- 著書紹介。
Flex4プログラミングガイド―Webアプリ開発のための「ツール」&「開発フレームワーク」 (I・O BOOKS)
- 作者: 廣畑大雅
- 出版社/メーカー: 工学社
- 発売日: 2011/02
- メディア: 単行本
- 購入: 1人 クリック: 18回
- この商品を含むブログ (6件) を見る
- アプリケーションテンプレート
- 権限
- Air for Android設定[権限]タブ
- INTERNET
- ネットワーク要求を許可
- リモートデバッグを許可
- WRITE_EXTERNAL_STORAGE
- 外部メモリカードへの書き込みを許可
- READ_PHONE_STATE
- 電話中にオーディオのミュートを許可
- バックグラウンド状態にオーディオｗの再生を許可
- ACCESS_FINE_LOCATION
- getlocationクラスを介したgpsアクセスを許可
- DISABLE_KEYGUARD, WAKE_LOCK
- Systemidlemodeクラス設定を使用したデバイスのスリープ状態を防ぐことを許可
- CAMERA
- カメラへのアクセスを許可
- RECORD_AUDIO
- マイクへのアクセスを許可
- ACCESS_NETWORK_STATE, ACCESS_WIFI_STATE
- networkinfoクラスを介したネットワーク権限への許可
- flash.system.capabitilties
- screenDPIプロパティ（端末のDPIを取得）
- mx.core.RuntimeDpiProvider
- flexフレークワークは、下記解像度のいずれかに丸める160/240/320\
- TigerMinesweeper（デモ）
- プライスレス
- Demo実演…失敗続き、結局デバッグモードで実演。
- タブ付アプリケーションの遷移機能を使用
- ゲームのswfはlfash proで作成
- swfの埋め込みはmovieClipSwfLoaderで
- スコア管理はSharedObjectで
- 参照RDC記事：今日の復習はADC記事で！
- Flash Professional CS5でAIR for Androidをはじめよう | デベロッパーセンター
- Adobe - Adobe Developer Connection 記事各種。
- DPIについては別途解説記事がUPされる予定。
SESSION7:Flex4.5を使用したモバイルアプリケーションの開発
前セッションの@taigaさんの内容に若干突っ込み(間違い指摘)を入れつつ、セッション開始。
- モバイル機能
- CSS Media Queries
- 複数解像度対応
- スプラッシュスクリーン（起動画面）
- ＜画面遷移 フレームワーク＞
- 画面遷移フレームワークを用いたアプリケーション
- ビューベースアプリケーション
- 画面遷移を管理するアプリケーション s:viewNavigationApplication
- タブ付アプリケーション
- タブごとに画面遷移を管理するアプリケーション s:TabbedViewNavigationApplication
- ビューベースアプリケーション
- 画面遷移フレームワークを用いたアプリケーション
- ＜構成コンポーネント＞
- viewnavigator
- １つの画面を表示する
- 画面遷移を管理する機能
- view
- viewnavigator
-
- 画面遷移を管理するアプリに必要なフレームワーク
- 画面遷移
- 画面の遷移(進む)：pushView
- 画面を戻す：popview
- 画面切り替えのエフェクト
- 切り替える：replaceview / 例)ログイン→メイン→replace→メインが最初に。
- slide/flip/cross/zoom
- 画面遷移の履歴
- 画面間のデータの受け渡し
- 画面間のデータのうけわたし
- ひきわたし：pushView
- データのうけとり：view.data
- 画面遷移の戻り：navigator.poppedViewReturnedObject
- 画面間のデータのうけわたし
- 画面の生成と破棄
- destructionPolicyで振る舞いを切り替え可能
- 一覧：never ,詳細：破棄する、とか。
- 画面の永続化、復元
- persistNavigationStateで振る舞いを切り替え可能
- 画面遷移
- 画面遷移を管理するアプリに必要なフレームワーク
- ＜モバイルコンポーネント＞
- 既存コンポーネント
- タッチイベントに対応
- モバイル用に最適化されたスキンを適用
- ActionScriptでスキン作成
- fxgで描画
- 解像度対応
- フォントサイズの変更
- 既存コンポーネント
- ＜デスクトップ用コンポーネント＞
- image
- BitmapImageを使った描画に対応
- 読み込みミスの代替え画像を表示
- image
- ＜モバイル用データレンダラー＞
- labelItemRenderer
- ASベース
- IconItemRenderder
- BitmapImageを使った描画処理
- ContentCacheを使った読み込み負荷の低減
- labelItemRenderer
SESSION8:Sneak Peaks＆抽選会
- アドビ システムズ 株式会社 / 太田 禎一 氏
セッション最後はSneak Peaks & 抽選会。太田 禎一氏＆轟さんのの進行の元、幾つかのツールに関する概要・デモの紹介など。概ねHTML5に絡んでくるようなものばかりで、デモ実演では驚くべき画質・パワーで『こんなにも軽く・早く・多く動かせるのか！』と言った驚きの連続でした。デモによっては動かしている『ブツ』が多過ぎて若干気持ち悪くもなりましたが…(笑)
Sneak Peaksの後は大抽選会。会場に訪れていた方とTwitterで関連ハッシュタグ( #adcjp )でつぶやいていた方を対象に抽選を行いました。
抽選は各スマートフォン端末にインストールした『抽選アプリ』を使って実施。良い感じの盛り上がりを見せておりました。
尚、会場脇にはスマートフォン端末各種の簡易展示場が設置されており、各自自由に触って楽しむことが出来ました。
自分もXperia Acro端末をちょこっと触ってみたり。
そして会場来訪者全員には『CSS5.5 Web Premium 体験版DVD』と、
『ADC MEETUP Mobile Design Book』がもれなくプレゼントされました！
自分は今回Flex関連のセッションをメインに参加してみましたが、その他のプロダクトもどんどん便利になっていってるんですねぇ。後はモバイル・スマートフォンの流れも看過出来ない、大きな流れになりつつある(既になっている？)ところの勢いにも置いてかれないように情報のアンテナを張り巡らせて行かなければ、と更なるモチベーションを得る事が出来ました！
あとは、もうちょっと関連製品がお求め易い価格で取り揃えて頂けると嬉しいんだけどなぁ…(´・ω・｀ )(笑)
関連記事：
