『実践テクニック HTML5スマートフォンWebアプリ制作』

Posted in HTML5 (RSS), モバイル (RSS), 書籍 (RSS)

HTML5 を用いたスマートフォンWebアプリの制作方法を、サンプルアプリのソースコードを示して具体的に解説しています。また、応用テクニックとして、「PhoneGap」 を利用したネイティブアプリ化についても紹介しています。

関連情報
・実践テクニックHTML5スマートフォンWebアプリ制作 12月21日発売！
・ゼロからはじめるスマートフォン専用サイト（iPhone＆Android）の作り方を学べるサイト集めました | HTML5でサイトをつくろう
・ASCII.jp：iOS 4.2の新機能で作るHTML5+JSアプリ｜古籏一浩のJavaScriptラボ
・ASCII.jp：PhoneGapでiPhoneのコンパスアプリを再現｜古籏一浩のJavaScriptラボ
・あらびき林檎。 - PhoneGap – HTML/CSS/JavaScriptで、iPhoneやAndroidアプリを作るフレームワーク
・PhoneGap API Documentation

・HTML5 vs ネイティブ。モバイルアプリはどちらで開発するべき？（前編） Google I/O 2011 － Publickey
・HTML5 vs ネイティブ。モバイルアプリはどちらで開発するべき？（後編） Google I/O 2011 － Publickey
・HTML5が新しいWebの世界を創る | ASSIOMA
・Open Mobile Summit 2011 San Francisco：HTML5か、ネイティブアプリか、それが問題だ - ITmedia プロフェッショナル モバイル
・HTML5とハイブリッドアプリの台頭 | Brightcove Blog

・Jungle Java - Dreamweaver CS5.5 でスマホアプリ開発
・Jungle Java - Adobe が PhoneGap を買収
・Jungle Java - PhoneGap XDK を少しだけ試してみた
・Jungle Java - Monaca を少しだけ試してみた
・Jungle Java - 『jQuery Mobile』
・Jungle Java - WebSocket 関連情報メモ

Posted on 2012年01月29日

 『jQuery Mobile』

Posted in Ajax (RSS), モバイル (RSS), 書籍 (RSS)

「jQuery Mobile」 のガイドブックが、オライリー・ジャパンより発売されました。

関連情報
・書評：「jQuery Mobile」オライリーから発刊。正式版1.0対応 － Publickey
・allWebクリエイター塾　 ブログ: jQuery Mobile 1.0正式版までの大きな変更点のピックアップ
・jQuery Mobileのデザインを簡単に作れる「ThemeRoller」徹底解説: 小粋空間
・jQuery Mobile 1.0 日本語リファレンス

・Jungle Java - モバイルブラウザ向けに最適化した UI を提供する jQuery Mobile
・Jungle Java - Webアプリをラップしてネイティブなモバイルアプリにする PhoneGap
・Jungle Java - Dreamweaver CS5.5 でスマホアプリ開発
・Jungle Java - Adobe が PhoneGap を買収
・Jungle Java - PhoneGap XDK を少しだけ試してみた
・Jungle Java - Monaca を少しだけ試してみた

（2012/01/02 追記）
・新春特別企画：2012年注目のモバイル向けJavaScriptフレームワーク・ライブラリあれこれ｜gihyo.jp

（2012/01/03 追記）
・はじめての jQuery Mobile 1.0 ～その1：コンテンツの記述～ - etc9
・はじめての jQuery Mobile 1.0 ～その2：ページ遷移～ - etc9

（2012/01/08 追記）
・はじめての jQuery Mobile 1.0 ～その3：リストビュー～ - etc9
・はじめての jQuery Mobile 1.0 ～その4：ツールバー～ - etc9

（2012/01/10 追記）
・jQuery Mobileでのアプリケーション開発にBackbone.jsを導入しよう | Lab by engineering@dwango.jp
・JavaScriptのMVCフレームワークと仲間たち ｜ Classmethod.dev()

（2012/01/12 追記）
・jQuery Mobile、バージョン1.1と1.2が相次いで登場予定。ロードマップが明らかに － Publickey

（2012/01/15 追記）
・iOS/Androidに特化したJavaScriptのMVCフレームワーク「The M Project」 | Web活メモ帳
・jQuery Mobileを使ったスマートフォン向けHTML5フレームワーク「The-M-Project」 - MOONGIFT

（2012/01/18 追記）
・iOSとAndroidに最適化したJavaScriptフレームワーク「jQ.Mobi」登場。jQuery Mobileより小さくて高速 － Publickey

（2012/01/21 追記）
・jQuery Mobile入門 － ＠IT

（2012/01/25 追記）
・Node.js+jQuery Mobile+MongoDBでCRUDアプリケーションを作る（その１） - ken’s room ～技術探求のメモ～
・jQuery MobileでCRUDアプリケーションのフロントを作って学んだ５つのこと（Node.js+jQuery Mobile+MongoDBでCRUDアプリケーションを作る（その２）） - ken’s room ～技術探求のメモ～ ・Node.js+jQuery Mobile+MongoDBでCRUDアプリケーションを作る（その３） - ken’s room ～技術探求のメモ～

Posted on 2011年12月24日

 Monaca を少しだけ試してみた

Posted in HTML5 (RSS), モバイル (RSS)

Webブラウザ上でスマートフォン（Android / iPhone）アプリを開発できるサービス 「Monaca」 を少しだけ試してみました。ビルドしなくても実機で動作確認を行うことのできる 「Monacaデバッガ」 の存在がユニークですね。

関連情報
・プロジェクトもビルドも全部全部クラウドで管理するiPhone＆Android SDK「Monaca」 ~ Puti Developers Blog
・Androidアプリをブラウザだけで作成可能、新しい開発ツールが続々 - Linuxレポート：ITpro
・Monacaドキュメント ― Monaca Documents
・The Monaca Blog | Things from Monaca development team

・Jungle Java - Dreamweaver CS5.5 でスマホアプリ開発
・Jungle Java - Adobe が PhoneGap を買収
・Jungle Java - PhoneGap XDK を少しだけ試してみた

（2012/01/28 追記）
・Monaca + enchant.js でお手軽スマフォゲームアプリ開発 : アシアルブログ
・Monacaで作ろう　 簡単スマフォアプリ！ : アシアルブログ

Posted on 2011年11月19日

 PhoneGap XDK を少しだけ試してみた

Posted in HTML5 (RSS), モバイル (RSS)

appMobi.com が無料で提供している 「PhoneGap XDK」 を少しだけ試してみました。「PhoneGap」 を用いたスマートフォンアプリの開発が可能なプラットフォームで、動作には 「Google Chrome」 及び 「Java SE 6」 が必要となります。

関連情報
・appMobi - HTML5 / JavaScript で効率的にスマートフォンアプリを開発するなら appMobi クラウドプラットフォーム
・米国appMobi社と国内で初めて代理店契約を締結、HTML5を利用しスマートフォンアプリケーション開発を大幅に効率化 at レキサス
・appMobi社がPhoneGapユーザー向けのクラウド開発プラットフォーム「PhoneGap XDK」をリリースしました at レキサス
・HTML5モバイルゲームツールのappMobiがCANVASの高速テクノロジを発表, ソーシャルホスティングTapJSも買収

・appMobi 始まり - himajin315の記録
・appMobi (Hello World) - himajin315の記録
・appMobi ローカルストレージ - himajin315の記録
・appMobi ローカルストレージ(アプリ) - himajin315の記録

・Jungle Java - Webアプリをラップしてネイティブなモバイルアプリにする PhoneGap
・Jungle Java - 『Androidアプリケーション開発ガイド』
・Jungle Java - Dreamweaver CS5.5 でスマホアプリ開発
・Jungle Java - Adobe が PhoneGap を買収

（11/29 追記）
・InfoQ: appMobi，ブラックフライデーにモバイルプラットフォームをオープンソース化
・世界初、スマートフォン向けネイティブアプリと同じ機能性をWebアプリやWebサイトに提供するiOS向けブラウザ「MobiUs」を米国appMobi社が提供開始 at レキサス

（12/23 追記）
・米国appMobi社がHTML5ゲームのフレームレートを10倍高速化するdirectCanvasテクノロジーのパフォーマンスデータおよびSDKを公開 at レキサス

（2012/01/28 追記）
・appMobi社製。チェック必須のスマートフォン向けjQuery「jQ.Mobi」 - MOONGIFT
・jQueryを凌ぐパフォーマンスを提供するJavaScriptフレームワーク「jqMobi」をappMobi社がオープンソースで提供 at レキサス

Posted on 2011年11月06日

 Android 4.0 関連情報メモ

Posted in モバイル (RSS)

いよいよ 「Android 4.0（コードネーム：Ice Cream Sandwich）」 が発表になりましたね。スマートフォン用の2.x系とタブレット用3.x系が統合されたバージョンとなります。

関連情報
・グーグル、Android 4.0の特徴をGALAXY Nexusで解説 - ケータイ Watch
・日本に特化した工夫も：“気持ちよく使える”Android 4.0で「最強のスマホ／タブレットを実現できる」 - ITmedia +D モバイル
・Googleの最新OS「Android 4.0」に搭載された新機能の全容まとめ - GIGAZINE
・Android 4.0（Ice Cream Sandwich）標準ブラウザのスクリーンショット - ガジェット通信
・【西川和久の不定期コラム】 Google「Android 4.0」 ～Android 4.0 SDKから垣間見る次世代デバイス

・Jungle Java - Google I/O 2011 で Android 3.1 が発表
・Jungle Java - Google が Motorola Mobility を買収
・Jungle Java - Amazon が Android ベースのタブレット Kindle Fire などを発表

（10/30 追記）
・Android 4.0 "Ice Cream Sandwich"ではASLRによりハッキングが困難に - AndroWire

（10/31 追記）
・Android 4.0は”スタイラス入力”に完全対応。ペンの圧力や傾きなども検知 | リンゲルブルーメン

（11/03 追記）
・開発者が知らないと損するAndroid 4.0の新機能44選 - ＠IT

（11/15 追記）
・Google、Android 4.0（Ice Cream Sandwich）のソースコードを公開

（11/19 追記）
・InfoQ: Googleは、Android 4.0をオープンソースにした
・Androidの最新版、Ice Cream SandwichはユーザーにGoogle+加入とクレジットカード情報の入力を勧める
・Google、Android.comを全面改訂。一般ユーザーをターゲットに

（11/20 追記）
・Android 4.0（Ice Cream Sandwich）用のFlash Playerはまだリリースされていない | juggly.cn

（12/07 追記）
・Android 4.0でアプリ開発を始めるための環境構築 - ＠IT

（12/16 追記）
・Flash Player for Androidのアップデート版「11.1.112.60」が公開、Android 4.0（Ice Cream Sandwich）を正式サポート adoobe-flash-ics – juggly.cn

（2012/01/01 追記）
・米国スマートフォン市場、Androidのシェアが46.9%に上昇（ComScore調査） | juggly.cn

（2012/01/04 追記）
・Android 4.0 は共通テーマ "Holo" 搭載、開発者は端末独自テーマと選択可能 -- Engadget Japanese

Posted on 2011年10月29日

 Adobe が PhoneGap を買収

Posted in HTML5 (RSS), モバイル (RSS)

Adobe が 「PhoneGap」 の開発元である Nitobi の買収を発表しました。HTML5、CSS、JavaScript といったWeb標準の技術を用いたモバイルアプリケーションの開発が、勢いを増してきそうな感じですね。

関連情報
・［速報］アドビ、PhoneGapを買収。モバイルのクロスプラットフォーム対応へリベンジ － Publickey
・Adobe、フォントサービスTypeKitを買収--PhoneGap開発企業の買収合意も発表 | マイコミジャーナル

・Jungle Java - モバイルブラウザ向けに最適化した UI を提供する jQuery Mobile
・Jungle Java - Webアプリをラップしてネイティブなモバイルアプリにする PhoneGap
・Jungle Java - 『Androidアプリケーション開発ガイド』
・Jungle Java - Dreamweaver CS5.5 でスマホアプリ開発

（10/29 追記）
・PhoneGapユーザーの皆様に朗報：米国appMobi社がPhoneGapのクラウド開発プラットフォームを発表
・Andrdoid版PhoneGapプラグインの紹介 – ｜ Classmethod.dev()
・PhoneGapがWindows Phoneに対応しました - 遅咲きのエンジニア

（11/19 追記）
・PhoneGapアプリでjQuery(1.5以上)のクロスサイトなajax通信を有効にするには｜開発部 in ICtriumphs

（11/26 追記）
・スマートフォン用HTML5フレームワークphonegapで使えるネイティブAPI | The Monaca Blog

（11/30 追記）
・InfoQ: PhoneGap の現状 - Apache と Adobe への移行，プラグインによるモジュール化，PhoneGap/Build サービス

（12/20 追記）
・PhoneGap 1.3 Released « PhoneGap

（12/22 追記）
・HTML5アプリをモバイルアプリに変換するPhoneGapが1.3にバージョンアップ。Windows Phone 7対応の強化など － Publickey
・InfoQ: PhoneGap が WP7 を完全サポート

Posted on 2011年10月04日

 Amazon が Android ベースのタブレット Kindle Fire などを発表

Posted in モバイル (RSS)

Amazon が 新 「Kindle」（4代目）、「Kindle Touch」 及び 「Kindle Fire」 を発表しました。「Kindle Fire」 は Android をベースにした、7インチフルカラーのタブレットで、199ドル。安いですね！でも、残念ながら、日本から購入できるのは 「Kindle」 のみのようです..。

関連情報
・Androidタブレットの新しいチャンピオン登場―199ドルでAmazonからKindle Fire発表
・Amazonのフルカラー電子書籍タブレット「Kindle Fire」がよくわかるムービーなどいろいろまとめ - GIGAZINE
・199ドルの衝撃！アマゾンのiPad対抗「Kindle Fire」は価格も機能もファイヤー！ : ギズモード・ジャパン
・アマゾン発表会まとめ：7型タブレット Kindle Fire、新 Kindle はタッチ99ドルと無印79ドル
  ・速報：アマゾンのタブレットは Kindle Fire、199ドル
  ・更新：アマゾン、79ドルの新 Kindle を発表。本日発売
  ・更新：タッチパネル採用のアマゾン Kindle Touch は 99ドル、3G付きで144ドル
・米AmazonのAndroid端末たったの199ドル　 eインク版は99ドル　他社タブレットに脅威【湯川】 : TechWave
・米アマゾンが多機能新端末　 199ドル、アップルに対抗　　：日本経済新聞

・Amazon Silk ― Kindle Fireに搭載された「クラウドアクセラレーション」機能付きモバイルブラウザ
・Kindle Fire搭載のブラウザ「Amazon Silk」は、クラウドとデバイスで分散処理を行う革新的なブラウザ － Publickey

・Jungle Java - Amazon Kindle の日本上陸は？
・Jungle Java - 『電子書籍の衝撃』
・Jungle Java - 『週刊ダイヤモンド 2010年 10/16号』

（10/01 追記）
・Amazonのジェフ・ベゾス・インタビュー：現代の消費者向けエレクトロニクス市場ではデバイスだけ作っても決して成功できない

（10/02 追記）
・InfoQ: Amazonの新しいブラウザSilkは、Splitアーキテクチャを使用している

（10/13 追記）
・iPadの時代は終わるのか...半額以下で買えちゃうアマゾンの新タブレット「Kindle Fire」の衝撃を斬ってみる！ : ギズモード・ジャパン

（10/16 追記）
・日本の電子書籍の来るべき未来、AmazonのKindle戦略を徹底解説 - GIGAZINE

（10/22 追記）
・Amazon Kindleの新ファイルフォーマットは意外にもHTML5とCSSを多用

（10/25 追記）
・アマゾンKindle にHTML5対応の新フォーマットKF8、絵本や複雑なレイアウトも導入 -- Engadget Japanese

（10/30 追記）
・kobo、Kindle Fire対抗の7インチタブレット「Kobo Vox eReader」を発表 - 電子書籍情報が満載! eBook USER

（11/02 追記）
・Kindle Fireが使うのはどのAndroid？ KF8とは？ ―コンテンツ移植とアプリ開発のロードマップを探る

（11/03 追記）
・アマゾン、有料会員向けに Kindle 書籍レンタルサービスを開始 -- Engadget Japanese

（11/09 追記）
・米B＆N、Androidベースの7インチタブレット「Nook Tablet」を発表
・楽天、カナダの電子書籍事業者 Kobo を買収 -- Engadget Japanese

（11/10 追記）
・動画も無料、本貸出も無料...アマゾンPrimeほど得なサービスない！ : ギズモード・ジャパン

（11/11 追記）
・楽天も電子書籍に本腰！　 カナダの電子書籍大手を買収＆電子書籍ストア「Raboo」がソニーReaderに対応 : ギズモード・ジャパン

（11/27 追記）
・Kindle Fireはどこが良くって飛ぶように売れているのか？

（12/17 追記）
・Amazon Kindle（Fireを含む）は絶好調―週100万台を突破

（12/21 追記）
・Kindle Fire、ディスプレイ性能テストでNookとiPad 2に敗れる

（2012/01/04 追記）
・Kindle年内日本開店を見送り、来春以降へ延期 « EBook2.0 Magazine

Posted on 2011年09月29日

 スマートフォン用CMS smart4me

Posted in モバイル (RSS)

『Web Designing 2011年 09月号』 に、スマートフォン用サイトを簡単に制作・公開できる 「smart4me」 というサービスが紹介されていました。ちょっと試してみようかな。10ページまでは無料で利用できるみたいです。

関連情報
・「smart4me」(ｽﾏｰﾄﾌｫｰﾐｰ)ならスマートフォン用Webサイトを10ページまで完全無料で作成！｜アマモ場
・わずか10分でスマートフォン用サイトが無料で作成できるウェブサービス「smart4me」を使ってみた*ホームページを作る人のネタ帳
・スマートフォン用CMS「smart4me」を試してみた | CMS | ウェビンブログ
・smart4me ビジネス版 | Web制作の株式会社クライマークス

・Jungle Java - CSS3 Media Queries を利用したWebサイトのスマフォ対応
・Jungle Java - 『iPhone+Android スマートフォンサイト制作入門』

Posted on 2011年09月22日

 『iPhone+Android スマートフォンサイト制作入門』

Posted in モバイル (RSS), 書籍 (RSS)

Webサイトもアプリも、モックアップやプロトタイプでいろいろ試行錯誤してみることが大切ですよね。

関連情報
・誰でもできるiPhoneアプリのプロトタイプのつくりかた【サンプルつき！】 | KAYAC DESIGNER'S BLOG
・ドラッグ＆ドロップでiPhoneアプリのモックが作れる『mokk.me』がすっごい便利かも | IDEA*IDEA
・iPhone向け最適化サイトのモックアップが簡単に作成できる『mokk.me』 | iPad | iPad iPhone Wire
・ブラウザ上でAndroidアプリのモックが作れる『Android GUI Mockup Tool』 | IDEA*IDEA
・Webサイトのワイヤーフレームを作る時に参考になる10のURL « nia.note
・Photoshop VIP ☞ iPhone 3G, 4, iPadアプリ制作にばっちりなＵＩデザインキット12個まとめ

・Jungle Java - モックアップ作成ソフト DENIM、他
・Jungle Java - Fireworks CS4 でプロトタイピング
・Jungle Java - Web版ドローツール Cacoo リリース
・Jungle Java - Balsamiq Mockups で Flex アプリのモックアップ

（09/22 追記）
・iPhoneのUIモックアップをiPhoneで作成する「interface」｜ブロックワークス
・iPhoneでモックアップ画面が作れるアプリ「Interface」 (キタミテレビ)
・App Cookerレビュー　ただのモック作成アプリじゃない!! | かえらぬカエル
・My Digital life : iPadでiOSアプリのデザインをしちゃおう！！　App Cooker
・Mockups Lite for Android - Android マーケット

（09/30 追記）
・スマートフォン時代のWebサイト制作 第1回　スマートフォン対応の重要性とその方法 | デベロッパーセンター
・スマートフォン時代のWebサイト制作 第2回　スマートフォン特有の表示環境を理解する | デベロッパーセンター
・スマートフォン時代のWebサイト制作 第3回　スマートフォン向けのコーディング | デベロッパーセンター

（11/11 追記）
・スマートフォン時代のWebサイト制作　 第4回　画像の扱いと最適化 | デベロッパーセンター

（11/12 追記）
・Windowsユーザ必見のiPhone向けサイトデザイン&シミュレータ「MobiOne Studio」 - MOONGIFT
・HTML5製のモバイルエミュレーター(Chrome エクステンション) » KLOG

Posted on 2011年09月21日

 CSS3 Media Queries を利用したWebサイトのスマフォ対応

Posted in モバイル (RSS)

CSS3 の Media Queries （メディアクエリ）を利用したWebサイトのスマフォ対応に関する情報をメモ。φ(..)

関連情報
・CSS3 Media Queries を使って、Webサイトをスマートフォンに対応させるときの注意書き
・[CSS]スマフォ対応サイトのためにMedia Queriesをしっかり身につけるチュートリアル | コリス
・CSS3のMedia QueriesをjQueryで代替する方法 - WWWPArtisan

・Jungle Java - 『スマートフォンのためのHTML5アプリケーション開発ガイド』
・Jungle Java - モバイルブラウザ向けに最適化した UI を提供する jQuery Mobile
・Jungle Java - Dreamweaver CS5.5 でスマホアプリ開発

（09/22 追記）
・Media Queryを触りながら試してみよう！ - jsdo.it - Share JavaScript, HTML5 and CSS
・Media Queryを使用したレスポンシブWebデザインの構築時にはResponsivepxっていうツールが超オススメです - かちびと.net
・Media Queries を使うときに参考にしたいサイト | Unformed Building

・iPhone, iPad, ブラウザなどクロスデバイス対応のCSSフレームワーク -Less Framework | コリス
・[CSS]HTML5対応、さまざまなデバイスのMedia Queriesを使ったリセット用スタイルシート -320 and up | コリス
・[CSS]最近のウェブ構築には欠かせない要件を備えたCSSのフレームワーク -The 1140px Grid | コリス

Posted on 2011年09月19日