Upload
jeffray-huang
View
468
Download
2
Embed Size (px)
DESCRIPTION
Citation preview
黃忠成
(內部資訊教材)
Web的發展史
1. 以動態HTML, Flash, Silverlight為基礎
2. 網站為服務提供者,但也可以是Cloud的消費者
3. 使用者是瀏覽者,同時也成為提供者
1. 以動態HTML , Flash為基礎
2. 網站為服務提供者3. 使用者是瀏覽者,同時也成為提供者
1. 以靜態HTML為基礎2. 網站為唯一提供者3. 使用者為瀏覽者
Web 2.0的關鍵 以人為基礎,網站不再是唯一的資訊提供者
以分享為目的,網站必須轉型為[服務提供者]
從實際數字來看Web 2.0 Web 1.0 -使用者上下傳比為 1:100
Web 2.0 -使用者上下傳比為 60:40
分享,是Web 2.0的中心思想
社群,是Web 2.0發展的關鍵
Web 2.0的獲利模式 廣告
例如Google , YouTube 利用插入廣告的方式來獲利 透過介紹商家,讓商家提高能見度,也增加社群人數
Rating 例如Amazon書店利用評比機制來促進書籍銷量及能見度
Recommend Amazon書店利用Recommend機制,促進相關書籍能見度與銷量
Facebook 同樣是以廣告為獲利, 但除此之外, 也收取使用者玩小遊戲時付費購買虛擬物品的佣金
以人為基礎,以分享為推力,進而形成網站獲利.
Web 2.0的要點 使用者為主, 提供給使用者可以分享其生活經驗, 心得, 有趣事物的服務
透過廣告, 宣傳力, 影響力來獲取利益.
形成網站與使用者雙贏的局面.
Web 2.0的標的網站
Amazon
……..
Web 2.0的關鍵技術 Web Services (REST/SOAP/JSON)
AJAX
Flash
Silverlight
AIR
Web 2.0中的另一個關鍵點 要體驗Web 2.0,使用者得有電腦, 網路才可以
Netbook的出現, 證明了Web 2.0逐漸於人們的日常生活普及化
Netbook銷售的萎縮,證明了人們需要更輕的裝置來使用Web 2.0
智慧型手機(PDA)的銷量快速爬升,代表著使用者逐漸接受以手機來使用Web 2.0的習慣
據統計,目前全球約有40億人擁有手機,其中有4億人是使用可上網的手機.
Web 2.0的最終型態
在辦公室及住家使用Web
在辦公室及住家, 出差時使用Web,只要有個一尺見方空間即可
隨時隨地,不必坐下,行進間,停駐間皆可使用
Web
來自Mobile/Device的挑戰狀 Device的螢幕大小只有2 ~ 4吋,如何設計符合尺寸且可輕鬆操作的網站?
Device的GPRS/3G/3.5G上網費用昂貴,且頻寬有限,如何設計出她們可有效得到/分享資訊,省錢的網站內容?
Device的CPU/RAM配備不比桌上型/筆記型,如何避免設計出其無法快速解譯的網站?
So, Let’s go to Mobile Web 2.0
Mobile Web 2.0 Mobile Web 2.0基礎定義與Web 2.0相同,但內涵不同
Mobile Web 2.0分成兩個區塊,一是瀏覽器,二是原生應用程式
HTML/CSS/JavaScript
Native Application
Mobile Web 2.0
Mobile Web 2.0 –瀏覽器 Device多半使用Opera, IE WAP/WML規格 以瀏覽器為基準而設計的Mobile Web 2.0網站,必須辨識瀏覽器的版本來呈現不同於桌上型網站的內容
Mobile上的瀏覽器對於Flash,JavaScript的支援有限,要特別注意.
Mobile 2.0 網站標竿 Microsoft Marketing Place Android Marketing App Store Hami (中華電信) Match (台哥大)
ASP.NET Mobile Web Controls Visual Studio 2008 已不再支援Mobile Web Controls的設計時期
Visual Studio 2008 也不再提供Mobile Web Form Controls的
這代表什麼?
因為多數網站不會專為Mobile設計網頁.
Mobile上的瀏覽器已經能夠處理為桌上型設計的網頁
那我們還要繼續使用Mobile Web 嗎?
開發前的準備 安裝Virtual PC 2007
安裝此軟體的目的在於虛擬網路卡
設定模擬器的網路
測試是否可連上本機
ASP.NET in Mobile 如何識別來訪者的裝置?
ViewState的可怕之處
善用Session來減少流量
可以用AJAX嗎? 怎麼用?
使用ASP.NET AJAX Controls
WM 6 With Opera
WM 6.5 With IE&Opera
JQuery支援Mobile Web嗎?
製做適合Mobile的網頁 UI介面的設計
偵測瀏覽器的工作區大小
來點漂亮的UI
IPhone Style Mobile Web
Windows Mobile 6/6.1 的Pocket IE不支援
Transparent PNG
Windows Mobile 6.5的表現較好
製做內層UI介面 準備背景圖
動態生成選單圖
當功能無法於傳統網頁中完成時 iPhone如何在網頁中取得AGPS資料的??
Hami的KiDoWi
Mobile IE支援Active X,這意味著? 我們可以使用Native Code撰寫ActiveX元件來提供AGPS資料供網頁應用程式使用
前提是,我們必須要能事先安裝ActiveX於Mobile裝置上 Opera日後也計畫支援ActiveX,或者我們也可以撰寫plugin
ActiveXHTML/JavaScript Server
AGPS
ASP.NET in Mobile 的不足之處
過於繁複的操作介面
無法背景運作
無謂的網路流量浪費
瀏覽器支援不同
與Native Code的溝通困難
Go to Fast Mobile Web 2.0Mobile Web 2.0絕不會只以瀏覽器為主.
原生應用程式也是推動Mobile Web 2.0的主角之一
目前智慧型手機的四大平台
Windows Phone - .NET Compact Framework
Android – Java Platform
iPhone – iPhone SDK(Objective-C)
Symbian – C/C++
Native應用程式的可能性 可使用AGPS,提供使用者在地服務
可連結社群網站的API服務,讓使用者能與朋友分享
訊息
照片
遊戲成果
…..
友善的UI介面,簡易直覺的操作
一個簡單的.NET CF應用程式 建立Smart Device Application
Hello World!!
讓Native Code躍上Mobile Web 2.0的關鍵 Web Services
SOAP格式
使用ASP.NET 建構Web Services
使用.NET CF建構Web Services Consumer
串起用戶
User A User B
Web Services
分享照片訊息位置資訊
Next Web Services - RESTFul 什麼是REST
ASP.NET與REST
WCF REST Start Kit
.NET CF與REST
REST 的運作
REST Service
Consumer 1 Consumer 1
Why REST 如果有了Web Services,為何我們還需要REST?
Web Services只能使用XML,而REST支援JSON
JSON比XML更簡潔,更容易於JavaScript中解譯
REST API可輕易的被其它語言及平台所解譯及應用
Web Services由於過度發展,規格呈現複雜化,已經不再是Simple Object Access Protocol了
REST的最佳範本- Facebook 使用.NET Compact Framework取得連絡人資訊
使用REST API取得該連絡人於Facebook的訊息
結合成一個社群
Facebook/our application
黃xx
李 xx
陳xx
林xx
實作 Facebook Application
建立
設定
Facebook SDK for .NET CF
建立CF端
取得聯絡人
取得聯絡人訊息
我們做了什麼? 使用者可隨時使用Facebook得知連絡人的近況
使用者可分享自己的近況給連絡人
形成了Mobile Web 2.0的關鍵要件, 是提供者也是消費者.
更進一步,商業模式 使用者透過Marketing 購買軟體
Marketing透過REST API發佈使用者已購買該軟體的訊息
進而達到提升軟體可見度
使用者再透過Marketing評比該軟體
進而達到行銷好軟體的目的
社群是Mobile Web 2.0的要件
如何構築Mobile Web 2.0的提供者 Mobile Web 2.0有兩個角色: 提供者及消費者
提供者提供REST/SOAP API供原生應用程式呼叫,藉此分享訊息及更新狀態
消費者透過REST/SOAP API來取得訊息或更新訊息
橋接的關鍵點: REST/SOAP API
Consumer SOAP/REST Provider
回到商業模式,無入口網頁的獲利模式 REST Providers可以沒有入口網頁
透過橋接,可協助未有REST Provider的網站進入Mobile Web 2.0的世界.
藉由租金,上架費或是單純廣告來獲利
REST Providers
User
Kxtone
Bxd
PxHome
Anytime, Anywhere, 定位系統的加入 於旅行期間,你是否曾看到美麗景色而拍下照片? 你如何透過Mobile Web 2.0分享照片呢?
於逛街期間,你是否因為想找美食而茫然呢?
迷路了,你是否想找一個明燈呢?
於商業街中,你是否為了找某樣東西而走到精疲力盡?
想找人看電影,你是否會害怕找的人沒空,而不敢撥電話呢?
突然想看電影,你是否為了找時刻表及影評而不知所措呢?
定位系統將解決這些問題,這是Mobile Web 2.0的最終應用
Mobile上的定位技術 GPS
可於戶外定位,精準度非常高 缺點是無法於室內定位,這跼限了其只能應用在導航,僅能滿足少量的定位需求
市區因高樓林立,因此很難於街區內定位
CPS 使用基地台定位,精準度不高 優點是不受建築物影響 可滿足多數的定位需求
CPS+GPS 使用CPS做粗估定位,當同一基地台有人使用GPS時,結合其位置及Cell訊號強弱,進行更精確定位
這是Google使用的模式
CPS+GPS Mode
User A(Use CPS)
User A(Use GPS)
Server
使用User B的GPS訊號,加上User B的Cell訊號強弱,來運算出User
A的更精確位置
CPS+GPS應用的困難處 Windows Phone
RIL層並未強制實作提供Cell資訊的API,所以不見得所有Windows Phone手機都有此資訊
Android
內建
iPhone
內建
Symbian
視機型而定
使用.NET Compact Framework建構GPS應用程式 .NET CF對於GPS的支援
使用.NET Compact Framework取得GPS定位資訊
使用Fake GPS協助測試
結合Google Map 使用Web Browser來結合Google+GPS座標顯示位置.
使用.NET Compact Framework建構CPS應用程式 CPS的最大問題,如何取得基地台資訊?
使用RIL API取得基地台資訊
運用.NET CF + Google Map來完成CPS定位的應用程式
RGAPI
Google API
MCC,LAC與CID
關於訊號強度
RIL_GetTowerInfo的dwRxLevel數值
網頁與Native Code的差別 網頁
使用預載的ActiveX取得CPS+GPS資料
使用AJAX上傳至Server端
由Server端取得資訊
優點
可與瀏覽器整合
可提供給其它網站使用,並與其它網站整合
Native Code
優點
簡潔的UI介面
終極應用-Location Based Service 什麼是LBS?
LBS於真實世界的應用 (電影街)電影時刻表的發送與訂票
(美食街)特價美食資訊及預訂
(高速公路)行車資訊
…….
LBS的關鍵技術 CPS+GPS
REST API
Native Application
ActiveX/Plug-In and Browser
實作LBS Server 實作餐廳搜尋的LBS Server
Designing Web Services/REST APIs
實作LBS Native Client Application 實作LBS Client Application
Gather Location Information
Consuming Web Servcies APIs
實作LBS 網頁客戶端 實作ActiveX元件
於網頁中使用此元件
延展性的考量 Channel的設計
Plug-In 架構的設計
LBS Server
Movies
交通資訊
美食資訊
CHANNELS
Mobile Web 2.0的下一步 AR(Augmented Reality)
雲端與Mobile Web 2.0
為何使用雲端?
Windows Azure平台
SQL Azure平台
AR(Augmented Reality) 什麼是AR
簡稱為擴增實境 主軸在於於現成地圖上提供標示
AR能做什麼? 於導航時,顯示最近的加油站地點及距離 隨著行進,標示點會即時更新
AR的關鍵技術 導航及地圖 圖形辨識? 行進速度預估 圖層技術 群體標示的力量
AR目前的情況 Layer於Android及iPhone都推出了軟體
雲端與Mobile Web 2.0結合的第一步 Microsoft My Phone
使用Azure技術所架構的平台
使用雲端技術來儲存使用者資料.
如何使用Windows Azure
申請
設定
撰寫應用程式
Table Storage Services Windows Azure的資料儲存服務
Queue
Blob
Table Storage Services
使用Table Storage Services來儲存資料
SQL Azure 雲端上的關聯資料庫
使用SQL Azure
申請
設定
撰寫應用程式
Azure與Mobile Web 2.0的結合 使用Azure來Hosting REST APIS
使用.NET CF來取用