WCAN Autumn 2013 Titaniumのおはなし

そろそろ使ってみませんか？

JavaScriptだけでスマフォアプリを作る

Titanium MobileShingo Mori

ConnectionWorks Inc.

ようこそ！

森　真吾@sngmr

ConnectionWorks Inc.

エンジニアです

Windowsインフラ構築

大規模バッチ処理運用

障害管理（お客さんにあやまる課）

.NETによる開発

Webシステム開発

スマートフォンアプリ開発

…etc

こんなことやってきました

Ti Nagoya 主催

Titanium ユーザー会

FxUG名古屋主催（してた）

各技術コミュニティでの発表

技術本の執筆

講演・講師

St.Patricks Day Parade Nagoya 実行委員（してた）

...etc

こんなこともやってます

はじめましょう

今日の流れ1. スマートフォンを取り巻く世の中の流れ

2. What? -- なにがある？ --

3. How? -- どのようにやる？ --

4. Dive into Titanium!!!

5. More Deeper!!!

6. Live Coding!

スマートフォンを取り巻く世の中の流れ

スマートフォンの普及率

出典：Our Mobile Planet Japan by Google

出典：Our Mobile Planet Japan by Google

・・・・

今さら感漂うので割愛！！

スマートフォンへのリーチは必須！！

Web

HTML5

アプリ

モバイル向けWebは必要• 検索エンジン経由• コーポレートサイト• 広告など• その他一般的なWeb• HTML5 / CSS3• どんどん使いましょう

→ やることの基本はPC版のWebサイトとほぼ同じ

HTML5 Webアプリは？• アプリに似た動作• プラットフォーム依存無• PUSH通知が使えない• カメラなども使えない• まだ少し早い・・かな• パフォーマンス問題• 将来的には期待してる

→ 特にアプリ代替としてのHTML5アプリはまだ厳しい

モバイルアプリケーション！• ストアに並ぶ• カメラなども使える• PUSH通知ができる• UI/UXの表現に優れる• (まだ)自慢できる• ただしインストールのハードルは意外と高い

モバイルアプリはモバイルコンテンツ

の大本命!!

Connect!!

提供：株式会社デンソー

Wearable!!

From http://google.com/glass

http://google.com/glass

http://google.com/glass

Mobile Backend as a Service

Key Features of Titanium Cloud Services

こんなに魅力的なスマートフォンアプリ

開発・・・

Titanium Mobile

Objective-C Java

どっちも覚えなきゃいけないの？

JavaScriptwith

開発元

• アメリカ・シリコンバレーに本社• 歴史• 2006 創業• 2007 Series A $6.2M• 2009 Titanium リリース• 2010 Series B $9M• 2011 Series C $15M• 2012 Series C-1 $16M

使われてるの？

Zipcar

サイボウズLive

モトクロ男子

More...

http://www.sawadaru.com/blog/?p=562



どんな機能が使える？

機能は(だいたい)全部使えますNative User ExperienceNative performance + Native UI (tables, animations, gestures, etc).

Location-based ServicesAugmented reality, geo-location, compass, native maps

Social SharingAuthenticated access to Facebook, Twitter, Yahoo YQL. Native email/address book.

DataAccess online / device data, embedded SQL database, filesystem, web services

MultimediaCamera, video camera, streaming / device audio/video

AnalyticsIntegrated user, session, and custom analytics. Interactive web-based analysis tools. Geo-analytics.

Native UI も使えます

ライバル

PhoneGap• HTML5/CSS3で開発 → Webから入りやすい• カメラやPUSH通知なども利用ができる

Others...

弱点

Titanium Mobile の弱点• リアルタイム処理が要求されるもの• 代表的なのはゲーム• Platino Game Engine によって変わるか？• UI デザイナーがない• すべてコードで表現しなければならない• プラットフォーム固有の新機能への対応がどうしても（少し）遅れる

おいくら？

基本無料です

サーバーなんてできない...

Titanium Cloud

Key Features of Titanium Cloud Services

おいくら？

無料枠有り〼

こんなに素晴らしいTitanium Mobile

の世界...

Dive into

Titanium!!

技術レベル + +

Architecture

Titanium のアーキテクチャ

iOS

JavaScript Engine

Titanium APIs Ti Modules

JavaScript Code

Android OS

JavaScript Engine


Native iOS app Native Android app

Bridge API Bridge API

誤解

•JavaScriptが、NativeのObjective-C や Java に変換される

•HTMLとCSSで実装する

Write OnceRun Anywhere..

やめた方がいい

• プラットフォームにより、固有のお作法（ユーザーが自然と感じる振る舞い）がある

• 無理やり合わせることはできるが、ユーザーは混乱する

• UI部分はそれぞれのプラットフォームに合わせて作る

Plugged In

Titanium のアーキテクチャ

iOS

JavaScript Engine


JavaScript Code

Android OS

JavaScript Engine


Native iOS app Native Android app

Bridge API Bridge API

Titanium モジュール• Titanium Mobile が提供していない機能は使えないが・・・

• 足りない機能をNativeコードで記述し、「モジュール」という形で読み込むことができる

• Open Market Placeで購入可能

• GitHubなどに多数公開されている

開発方法

Install Native SDKs

Titanium Studio

- Eclipse Based IDE- Single Environment

Titanium CLI

with

- Command Line Interface (Node.js)...etc

More

Deeper!!

技術レベル + +

Alloy Concept

from @ryugoo_

Before Alloy...

その気になれば1ファイルにすべて完結できた

Alloy View

Alloy Controller

Alloy Model

Live Coding!!

https://github.com/sngmr/WcanAlloyDemo1



Question?

ありがとうございました

WCAN Autumn 2013 Titaniumのおはなし

Technology

Transcript of WCAN Autumn 2013 Titaniumのおはなし