Suche senden
Hochladen
モバイルHTML5サイトでの写真アップロードの最適化と業務アプリへの適用
•
6 gefällt mir
•
4,356 views
Shinichi Tomita
Folgen
2013年3月15日 業務システムエンジニアのためのHTML5勉強会#01
Weniger lesen
Mehr lesen
Melden
Teilen
Melden
Teilen
1 von 14
Jetzt herunterladen
Downloaden Sie, um offline zu lesen
Empfohlen
HTML5でできるカメラアプリを実際に体験しよう
HTML5でできるカメラアプリを実際に体験しよう
Hideki Akiba
Windows ストアアプリから使かえるセンサーAPIとデバイスAPI
Windows ストアアプリから使かえるセンサーAPIとデバイスAPI
Osamu Monoe
HTML5 クロスプラットフォームアプリ開発の現実解
HTML5 クロスプラットフォームアプリ開発の現実解
Monaca
HTML5 によるロボット制御
HTML5 によるロボット制御
Honma Masashi
もっと良くなるHTMLアプリケーション設計と実装
もっと良くなるHTMLアプリケーション設計と実装
Mitsue-Links
Xamarin で今日から始めるクロスプラットフォーム開発
Xamarin で今日から始めるクロスプラットフォーム開発
友太 渡辺
HTML5ハイブリッドアプリ開発のベストプラクティス
HTML5ハイブリッドアプリ開発のベストプラクティス
アシアル株式会社
ハイブリッドアプリ開発最前線から見たHtml5の理想と現実
ハイブリッドアプリ開発最前線から見たHtml5の理想と現実
Monaca
Empfohlen
HTML5でできるカメラアプリを実際に体験しよう
HTML5でできるカメラアプリを実際に体験しよう
Hideki Akiba
Windows ストアアプリから使かえるセンサーAPIとデバイスAPI
Windows ストアアプリから使かえるセンサーAPIとデバイスAPI
Osamu Monoe
HTML5 クロスプラットフォームアプリ開発の現実解
HTML5 クロスプラットフォームアプリ開発の現実解
Monaca
HTML5 によるロボット制御
HTML5 によるロボット制御
Honma Masashi
もっと良くなるHTMLアプリケーション設計と実装
もっと良くなるHTMLアプリケーション設計と実装
Mitsue-Links
Xamarin で今日から始めるクロスプラットフォーム開発
Xamarin で今日から始めるクロスプラットフォーム開発
友太 渡辺
HTML5ハイブリッドアプリ開発のベストプラクティス
HTML5ハイブリッドアプリ開発のベストプラクティス
アシアル株式会社
ハイブリッドアプリ開発最前線から見たHtml5の理想と現実
ハイブリッドアプリ開発最前線から見たHtml5の理想と現実
Monaca
モダンWeb開発ワークショップ
モダンWeb開発ワークショップ
Staffnet_Inc
Android webブラウザのhtml5対応状況
Android webブラウザのhtml5対応状況
Masakazu Muraoka
モバイルWebアプリのこれまでとこれから
モバイルWebアプリのこれまでとこれから
dsuke Takaoka
Cordovaの最近ホットな話題と地雷をまとめて紹介
Cordovaの最近ホットな話題と地雷をまとめて紹介
アシアル株式会社
次世代Web業務アプリケーション
次世代Web業務アプリケーション
Fumio SAGAWA
Adobe Edge Inspectを利用してデバッグ
Adobe Edge Inspectを利用してデバッグ
Keisuke Todoroki
Xamarin + Visual Studio によるマルチプラットフォーム対応アプリ開発 - iOS, Android, Windows に対応しよう
Xamarin + Visual Studio によるマルチプラットフォーム対応アプリ開発 - iOS, Android, Windows に対応しよう
Akira Onishi
Phone gap
Phone gap
Tomoyuki Kashiro
Visual Studio + xamarin で始めるモバイル アプリ開発
Visual Studio + xamarin で始めるモバイル アプリ開発
インフラジスティックス・ジャパン株式会社
その Web サイト、その Web アプリを最新の IE11 に対応しよう
その Web サイト、その Web アプリを最新の IE11 に対応しよう
Osamu Monoe
C#でのクロスプラットフォーム モバイル開発環境 Xamarin のご紹介
C#でのクロスプラットフォーム モバイル開発環境 Xamarin のご紹介
Yoshito Tabuchi
エンタープライズ・モバイルアプリにおける ハイブリッドアプリ開発
エンタープライズ・モバイルアプリにおける ハイブリッドアプリ開発
日本Cordovaユーザー会
Movable Type から BOT を作ろう! ~ Data API と Microsoft BOT Framework ~
Movable Type から BOT を作ろう! ~ Data API と Microsoft BOT Framework ~
Osamu Monoe
Androidハイブリッドアプリを約2年間メンテンナンスしてきて分ったこと
Androidハイブリッドアプリを約2年間メンテンナンスしてきて分ったこと
Shuichi Takaya
Sneak Previews (ADC MEETUP ROUND 01)
Sneak Previews (ADC MEETUP ROUND 01)
Teiichi Ota
Monacaでつくるハイブリッドアプリ
Monacaでつくるハイブリッドアプリ
Monaca
C# を使い倒す!クロス プラットフォーム アプリ開発とクラウド連携の新潮流 - Xamarin セッション
C# を使い倒す!クロス プラットフォーム アプリ開発とクラウド連携の新潮流 - Xamarin セッション
Yoshito Tabuchi
~新しい着回しと出会おう~ 『XZ(クローゼット)』 を支える技術 -Cordova編-
~新しい着回しと出会おう~ 『XZ(クローゼット)』 を支える技術 -Cordova編-
Shinichiro Yoshida
CordovaでAngularJSアプリ開発
CordovaでAngularJSアプリ開発
アシアル株式会社
PhoneGapでWebアプリをスマホアプリ化
PhoneGapでWebアプリをスマホアプリ化
Takashi Okamoto
概説 Data API v3
概説 Data API v3
Yuji Takayama
進化するオープンソース・エンタープライズCMSがWeb戦略を変える
進化するオープンソース・エンタープライズCMSがWeb戦略を変える
Hishikawa Takuro
Weitere ähnliche Inhalte
Was ist angesagt?
モダンWeb開発ワークショップ
モダンWeb開発ワークショップ
Staffnet_Inc
Android webブラウザのhtml5対応状況
Android webブラウザのhtml5対応状況
Masakazu Muraoka
モバイルWebアプリのこれまでとこれから
モバイルWebアプリのこれまでとこれから
dsuke Takaoka
Cordovaの最近ホットな話題と地雷をまとめて紹介
Cordovaの最近ホットな話題と地雷をまとめて紹介
アシアル株式会社
次世代Web業務アプリケーション
次世代Web業務アプリケーション
Fumio SAGAWA
Adobe Edge Inspectを利用してデバッグ
Adobe Edge Inspectを利用してデバッグ
Keisuke Todoroki
Xamarin + Visual Studio によるマルチプラットフォーム対応アプリ開発 - iOS, Android, Windows に対応しよう
Xamarin + Visual Studio によるマルチプラットフォーム対応アプリ開発 - iOS, Android, Windows に対応しよう
Akira Onishi
Phone gap
Phone gap
Tomoyuki Kashiro
Visual Studio + xamarin で始めるモバイル アプリ開発
Visual Studio + xamarin で始めるモバイル アプリ開発
インフラジスティックス・ジャパン株式会社
その Web サイト、その Web アプリを最新の IE11 に対応しよう
その Web サイト、その Web アプリを最新の IE11 に対応しよう
Osamu Monoe
C#でのクロスプラットフォーム モバイル開発環境 Xamarin のご紹介
C#でのクロスプラットフォーム モバイル開発環境 Xamarin のご紹介
Yoshito Tabuchi
エンタープライズ・モバイルアプリにおける ハイブリッドアプリ開発
エンタープライズ・モバイルアプリにおける ハイブリッドアプリ開発
日本Cordovaユーザー会
Movable Type から BOT を作ろう! ~ Data API と Microsoft BOT Framework ~
Movable Type から BOT を作ろう! ~ Data API と Microsoft BOT Framework ~
Osamu Monoe
Androidハイブリッドアプリを約2年間メンテンナンスしてきて分ったこと
Androidハイブリッドアプリを約2年間メンテンナンスしてきて分ったこと
Shuichi Takaya
Sneak Previews (ADC MEETUP ROUND 01)
Sneak Previews (ADC MEETUP ROUND 01)
Teiichi Ota
Monacaでつくるハイブリッドアプリ
Monacaでつくるハイブリッドアプリ
Monaca
C# を使い倒す!クロス プラットフォーム アプリ開発とクラウド連携の新潮流 - Xamarin セッション
C# を使い倒す!クロス プラットフォーム アプリ開発とクラウド連携の新潮流 - Xamarin セッション
Yoshito Tabuchi
~新しい着回しと出会おう~ 『XZ(クローゼット)』 を支える技術 -Cordova編-
~新しい着回しと出会おう~ 『XZ(クローゼット)』 を支える技術 -Cordova編-
Shinichiro Yoshida
CordovaでAngularJSアプリ開発
CordovaでAngularJSアプリ開発
アシアル株式会社
PhoneGapでWebアプリをスマホアプリ化
PhoneGapでWebアプリをスマホアプリ化
Takashi Okamoto
Was ist angesagt?
(20)
モダンWeb開発ワークショップ
モダンWeb開発ワークショップ
Android webブラウザのhtml5対応状況
Android webブラウザのhtml5対応状況
モバイルWebアプリのこれまでとこれから
モバイルWebアプリのこれまでとこれから
Cordovaの最近ホットな話題と地雷をまとめて紹介
Cordovaの最近ホットな話題と地雷をまとめて紹介
次世代Web業務アプリケーション
次世代Web業務アプリケーション
Adobe Edge Inspectを利用してデバッグ
Adobe Edge Inspectを利用してデバッグ
Xamarin + Visual Studio によるマルチプラットフォーム対応アプリ開発 - iOS, Android, Windows に対応しよう
Xamarin + Visual Studio によるマルチプラットフォーム対応アプリ開発 - iOS, Android, Windows に対応しよう
Phone gap
Phone gap
Visual Studio + xamarin で始めるモバイル アプリ開発
Visual Studio + xamarin で始めるモバイル アプリ開発
その Web サイト、その Web アプリを最新の IE11 に対応しよう
その Web サイト、その Web アプリを最新の IE11 に対応しよう
C#でのクロスプラットフォーム モバイル開発環境 Xamarin のご紹介
C#でのクロスプラットフォーム モバイル開発環境 Xamarin のご紹介
エンタープライズ・モバイルアプリにおける ハイブリッドアプリ開発
エンタープライズ・モバイルアプリにおける ハイブリッドアプリ開発
Movable Type から BOT を作ろう! ~ Data API と Microsoft BOT Framework ~
Movable Type から BOT を作ろう! ~ Data API と Microsoft BOT Framework ~
Androidハイブリッドアプリを約2年間メンテンナンスしてきて分ったこと
Androidハイブリッドアプリを約2年間メンテンナンスしてきて分ったこと
Sneak Previews (ADC MEETUP ROUND 01)
Sneak Previews (ADC MEETUP ROUND 01)
Monacaでつくるハイブリッドアプリ
Monacaでつくるハイブリッドアプリ
C# を使い倒す!クロス プラットフォーム アプリ開発とクラウド連携の新潮流 - Xamarin セッション
C# を使い倒す!クロス プラットフォーム アプリ開発とクラウド連携の新潮流 - Xamarin セッション
~新しい着回しと出会おう~ 『XZ(クローゼット)』 を支える技術 -Cordova編-
~新しい着回しと出会おう~ 『XZ(クローゼット)』 を支える技術 -Cordova編-
CordovaでAngularJSアプリ開発
CordovaでAngularJSアプリ開発
PhoneGapでWebアプリをスマホアプリ化
PhoneGapでWebアプリをスマホアプリ化
Ähnlich wie モバイルHTML5サイトでの写真アップロードの最適化と業務アプリへの適用
概説 Data API v3
概説 Data API v3
Yuji Takayama
進化するオープンソース・エンタープライズCMSがWeb戦略を変える
進化するオープンソース・エンタープライズCMSがWeb戦略を変える
Hishikawa Takuro
これからのNOTESモバイルアプリはこう作れ
これからのNOTESモバイルアプリはこう作れ
Mitsuru Katoh
たった1時間でシステム構築!“激速”環境構築を実現する“パターン技術”の秘密とは
たった1時間でシステム構築!“激速”環境構築を実現する“パターン技術”の秘密とは
Rina Owaki
[CTO Night & Day 2019] ML services: MLOps #ctonight
[CTO Night & Day 2019] ML services: MLOps #ctonight
Amazon Web Services Japan
NET MAUI for .NET 7 for iOS, Android app development
NET MAUI for .NET 7 for iOS, Android app development
Shotaro Suzuki
[CTO Night & Day 2019] グローバルのサービス展開に向けたマルチリージョンアーキテクチャ- #ctonight
[CTO Night & Day 2019] グローバルのサービス展開に向けたマルチリージョンアーキテクチャ- #ctonight
Amazon Web Services Japan
Soycms css nite_lp6_fu_201312
Soycms css nite_lp6_fu_201312
Takashi Furusho
B07_業務の自動化を多角的に実現する Power Automate の世界 [Microsoft Japan Digital Days]
B07_業務の自動化を多角的に実現する Power Automate の世界 [Microsoft Japan Digital Days]
日本マイクロソフト株式会社
Sharoid Service Menu
Sharoid Service Menu
sharoid
スマートフォンアプリケーション開発の最新動向
スマートフォンアプリケーション開発の最新動向
Tsutomu Ogasawara
Mithril
Mithril
Yoshiki Shibukawa
第3回企業Webシステム開発セミナー「業務システムにHTML5を上手に取り入れるためには?」
第3回企業Webシステム開発セミナー「業務システムにHTML5を上手に取り入れるためには?」
Osamu Shimoda
Decode19 cd42 fixer_public_0601
Decode19 cd42 fixer_public_0601
Shotaro Suzuki
Decode19 cd42 fixer_public_0601
Decode19 cd42 fixer_public_0601
YorikoYokoyama
Accel series 2017_spring
Accel series 2017_spring
NTTDATA INTRAMART
MAF2013 Enterprise Windows 8 – Architecture for rapid development of WinRT apps
MAF2013 Enterprise Windows 8 – Architecture for rapid development of WinRT apps
Shotaro Suzuki
Intalio japan special cloud workshop
Intalio japan special cloud workshop
Daisuke Sugai
Angular でもっとAPIファースト・もっとモダンデザインなWebアプリケーションを作ろう!
Angular でもっとAPIファースト・もっとモダンデザインなWebアプリケーションを作ろう!
CData Software Japan
20111212勉強会資料
20111212勉強会資料
株式会社インサイト
Ähnlich wie モバイルHTML5サイトでの写真アップロードの最適化と業務アプリへの適用
(20)
概説 Data API v3
概説 Data API v3
進化するオープンソース・エンタープライズCMSがWeb戦略を変える
進化するオープンソース・エンタープライズCMSがWeb戦略を変える
これからのNOTESモバイルアプリはこう作れ
これからのNOTESモバイルアプリはこう作れ
たった1時間でシステム構築!“激速”環境構築を実現する“パターン技術”の秘密とは
たった1時間でシステム構築!“激速”環境構築を実現する“パターン技術”の秘密とは
[CTO Night & Day 2019] ML services: MLOps #ctonight
[CTO Night & Day 2019] ML services: MLOps #ctonight
NET MAUI for .NET 7 for iOS, Android app development
NET MAUI for .NET 7 for iOS, Android app development
[CTO Night & Day 2019] グローバルのサービス展開に向けたマルチリージョンアーキテクチャ- #ctonight
[CTO Night & Day 2019] グローバルのサービス展開に向けたマルチリージョンアーキテクチャ- #ctonight
Soycms css nite_lp6_fu_201312
Soycms css nite_lp6_fu_201312
B07_業務の自動化を多角的に実現する Power Automate の世界 [Microsoft Japan Digital Days]
B07_業務の自動化を多角的に実現する Power Automate の世界 [Microsoft Japan Digital Days]
Sharoid Service Menu
Sharoid Service Menu
スマートフォンアプリケーション開発の最新動向
スマートフォンアプリケーション開発の最新動向
Mithril
Mithril
第3回企業Webシステム開発セミナー「業務システムにHTML5を上手に取り入れるためには?」
第3回企業Webシステム開発セミナー「業務システムにHTML5を上手に取り入れるためには?」
Decode19 cd42 fixer_public_0601
Decode19 cd42 fixer_public_0601
Decode19 cd42 fixer_public_0601
Decode19 cd42 fixer_public_0601
Accel series 2017_spring
Accel series 2017_spring
MAF2013 Enterprise Windows 8 – Architecture for rapid development of WinRT apps
MAF2013 Enterprise Windows 8 – Architecture for rapid development of WinRT apps
Intalio japan special cloud workshop
Intalio japan special cloud workshop
Angular でもっとAPIファースト・もっとモダンデザインなWebアプリケーションを作ろう!
Angular でもっとAPIファースト・もっとモダンデザインなWebアプリケーションを作ろう!
20111212勉強会資料
20111212勉強会資料
Mehr von Shinichi Tomita
SalesforceでのモダンSPA開発(Mashmatrix ”Sheet"の場合)
SalesforceでのモダンSPA開発(Mashmatrix ”Sheet"の場合)
Shinichi Tomita
SalesforceからAWSへの接続 using OIDC/SAML
SalesforceからAWSへの接続 using OIDC/SAML
Shinichi Tomita
Developing SLDS Apps with React.js
Developing SLDS Apps with React.js
Shinichi Tomita
Spring'15 Update - Named Credential & Long Running Callout
Spring'15 Update - Named Credential & Long Running Callout
Shinichi Tomita
スマートデバイス×HTML5で 企業情報システムはどう変わる? ~最新動向から考えるエンタープライズWebの現在と未来~
スマートデバイス×HTML5で 企業情報システムはどう変わる? ~最新動向から考えるエンタープライズWebの現在と未来~
Shinichi Tomita
Summer'14 Update - What's new in Force.com Canvas -
Summer'14 Update - What's new in Force.com Canvas -
Shinichi Tomita
アイデンティティ2.0とOAuth/OpenID Connect
アイデンティティ2.0とOAuth/OpenID Connect
Shinichi Tomita
モバイルBaaSの概観と最新動向(2014版)
モバイルBaaSの概観と最新動向(2014版)
Shinichi Tomita
シングルサインオンの歴史とSAMLへの道のり
シングルサインオンの歴史とSAMLへの道のり
Shinichi Tomita
Salesforce1最速経路
Salesforce1最速経路
Shinichi Tomita
モバイルBaaSの概観と最新動向 (2013/6/7)
モバイルBaaSの概観と最新動向 (2013/6/7)
Shinichi Tomita
(M)BaaS and Enterprise Mobile Applications
(M)BaaS and Enterprise Mobile Applications
Shinichi Tomita
クラウド・スマートデバイス事例調査報告
クラウド・スマートデバイス事例調査報告
Shinichi Tomita
Cloud-to-Intranet messaging by Force.com Streaming API
Cloud-to-Intranet messaging by Force.com Streaming API
Shinichi Tomita
Sales Force Episode VI ~ Return of Ajax Toolkit ~
Sales Force Episode VI ~ Return of Ajax Toolkit ~
Shinichi Tomita
Intro to JFDG
Intro to JFDG
Shinichi Tomita
Herokuで動かす スクリーンショットサーバ
Herokuで動かす スクリーンショットサーバ
Shinichi Tomita
Force.com とか @ PaaS祭り
Force.com とか @ PaaS祭り
Shinichi Tomita
Streaming API で実現する クラウド ⇔ イントラ連携
Streaming API で実現する クラウド ⇔ イントラ連携
Shinichi Tomita
Phantomjs Screenshot Server on Heroku
Phantomjs Screenshot Server on Heroku
Shinichi Tomita
Mehr von Shinichi Tomita
(20)
SalesforceでのモダンSPA開発(Mashmatrix ”Sheet"の場合)
SalesforceでのモダンSPA開発(Mashmatrix ”Sheet"の場合)
SalesforceからAWSへの接続 using OIDC/SAML
SalesforceからAWSへの接続 using OIDC/SAML
Developing SLDS Apps with React.js
Developing SLDS Apps with React.js
Spring'15 Update - Named Credential & Long Running Callout
Spring'15 Update - Named Credential & Long Running Callout
スマートデバイス×HTML5で 企業情報システムはどう変わる? ~最新動向から考えるエンタープライズWebの現在と未来~
スマートデバイス×HTML5で 企業情報システムはどう変わる? ~最新動向から考えるエンタープライズWebの現在と未来~
Summer'14 Update - What's new in Force.com Canvas -
Summer'14 Update - What's new in Force.com Canvas -
アイデンティティ2.0とOAuth/OpenID Connect
アイデンティティ2.0とOAuth/OpenID Connect
モバイルBaaSの概観と最新動向(2014版)
モバイルBaaSの概観と最新動向(2014版)
シングルサインオンの歴史とSAMLへの道のり
シングルサインオンの歴史とSAMLへの道のり
Salesforce1最速経路
Salesforce1最速経路
モバイルBaaSの概観と最新動向 (2013/6/7)
モバイルBaaSの概観と最新動向 (2013/6/7)
(M)BaaS and Enterprise Mobile Applications
(M)BaaS and Enterprise Mobile Applications
クラウド・スマートデバイス事例調査報告
クラウド・スマートデバイス事例調査報告
Cloud-to-Intranet messaging by Force.com Streaming API
Cloud-to-Intranet messaging by Force.com Streaming API
Sales Force Episode VI ~ Return of Ajax Toolkit ~
Sales Force Episode VI ~ Return of Ajax Toolkit ~
Intro to JFDG
Intro to JFDG
Herokuで動かす スクリーンショットサーバ
Herokuで動かす スクリーンショットサーバ
Force.com とか @ PaaS祭り
Force.com とか @ PaaS祭り
Streaming API で実現する クラウド ⇔ イントラ連携
Streaming API で実現する クラウド ⇔ イントラ連携
Phantomjs Screenshot Server on Heroku
Phantomjs Screenshot Server on Heroku
モバイルHTML5サイトでの写真アップロードの最適化と業務アプリへの適用
1.
〜 業務システムエンジニアのためのHTML5勉強会#01 〜 モバイルHTML5サイトでの 写真アップロードの最適化と 業務アプリへの適用
株式会社マッシュマトリックス 冨田 慎一 stomita@mashmatrix.com Twitter : @stomita ©Copyright 2013 mashmatrix, Inc. All rights reserved.
2.
自己紹介 •
Shinichi Tomita (@stomita) • Founder & CEO at Mashmatrix, Inc. • Ex-salesforce.com • Ex-OracleJapan • Digital Identity Lover • JavaScript Developer • Others: Node.js, OAuth, Force.com, heroku, Ext JS
3.
マッシュマトリックスについて
スマフォ・タブレットから使える 写真アレンジWebサービス 「Pittile(ピッタイル)」 企業情報システムの マッシュアップダッシュボード 「Mashmatrix Dashboard」
4.
本日の内容 ★ モバイルカメラを利用するHTML5ベースの業務アプ
リについて ★ システムの実装イメージとその特徴、注意点など ★ 今後のモバイルHTML5での業務アプリ開発について の私見
5.
モバイルカメラを使った業務システム ★ 建築現場の施工記録 (現場写真を顧客と共有) ★
修理・保守業務 (写真の保全による問題点の共有) ★ 不動産物件管理(部屋・設備などの写真) ‣ 賃貸物件の管理事業者 ‣ 自社で扱う物件は自社内のデータベースに保存 ‣ 営業担当者が物件情報に添付する形でアップロードす る
6.
ネイティブアプリ開発との比較 ★ 利点 -
アプリの配布・アップデートが簡単 - 既存のWebアプリ資産を流用可能 - Webアプリ開発の技術を利用可能 ★ 問題点 - 快適なUIの実現にはチューニングが 必要な場合も - 限定的なデバイス機能へのアクセス
7.
ネイティブアプリ開発との比較 ★ 利点 -
アプリの配布・アップデートが簡単 - 既存のWebアプリ資産を流用可能 - Webアプリ開発の技術を利用可能 ★ 問題点 - 快適なUIの実現にはチューニングが 必要な場合も - 限定的なデバイス機能へのアクセス ➡ iOS6 から input[type=file] & File APIをサポート
8.
ネイティブアプリ開発との比較 ★ 利点 -
アプリの配布・アップデートが簡単 - 既存のWebアプリ資産を流用可能 - Webアプリ開発の技術を利用可能 ★ 問題点 - 快適なUIの実現にはチューニングが 必要な場合も - 限定的なデバイス機能へのアクセス ➡ iOS6 から input[type=file] & File APIをサポート ➡ HTML5でもカメラ画像を取り扱うアプリが作成できる!
9.
物件管理システムのイメージ
物件情報DB アップロードした 写真のURL 物件情報の検索・閲覧 物件情報 添付画像の閲覧 S3送信用の署名情報 賃貸契約情報の閲覧 物件情報の入力・更新 写真データの 賃貸契約情報の入力 アップロード PC Webブラウザ iPhone Safari
10.
本システムの特徴 ★ フォームでの画像メタデータ登録 ‣
ガラケー時代:メールで添付。メタデータの紐付けに苦労 ★ クライアント側での画像リサイズ、画像の成形 ‣ スマホの最新機種が備えるカメラは高解像度であるため、デフォルトのフ ァイルの大きさでは帯域負荷が高い。ほぼ必須要件 ‣ Canvasを利用しサイズを縮小、Data URIからBlobを作成しフォーム送信 ‣ 画像の向きの修正は exif.js (github.com/jseidelin/exif-js) を利用可能 ★ Amazon S3への写真ファイルの直接アップロード ‣ S3 はCORSをサポート済。Browser Post Formの利用 ‣ 中間サーバ要らず(帯域にやさしい)
11.
注意点 ★ iOS Safariの制限として、2Mピクセルを超えるJPEG画像は
サブサンプルの対象となり、情報が間引かれる ★ Canvasに対してdrawImageなどしてリサイズする場合、サ ブサンプルされる場合とされない画像で描画の結果が異なっ てしまう ★ 現象についてブログにまとめました ‣ 「iOS6でメガピクセル画像をCanvasに描画するとおかしくなってしまう件 と、その対処」 http://d.hatena.ne.jp/shinichitomita/ 20120927/1348726674 ★ 問題について対処したライブラリ ‣ http://github.com/stomita/ios-imagefile-megapixel
12.
まとめおよび今後の見通し ★ デバイス機能へのアクセスのサポートにより、実現できるユー
スケースが拡大している ‣ 再びHTML5で業務アプリの実現可能性を検討するべき時期 ‣ クラウド(特にBaaS)と絡めるとさらに美味しい ‣ オフライン対応によりさらにユースケースは拡大するか? ★ 今後、業務アプリ開発はモバイルHTML5の主戦場になる ‣ システムはほとんどの場合作って終わりではない。アプリ修正&配布の容 易なHTML5にメリット多し ‣ ブラウザベースのアプローチでも(コンシューマ向けアプリに比べ)比較 的受け入れられやすい。 ‣ 画面構築を簡単にするフレームワーク(Senchaなど)の発展が後押し
13.
最後に マッシュマトリックスでは HTML5ベースのアプリケーションの
アーキテクチャと実装について 一緒に考えてくれる仲間を探しています 興味ある方は 直接 冨田まで!
14.
Thanks.
Jetzt herunterladen