2014年11月27日 星期四

Apple SIM

一個運作良好的資訊部門就是讓你完全忘了公司有資訊部門的存在,同樣的,一個真正好的用戶體驗是你感受不到它的存在,但它就是存在著並且在不知不覺中讓你覺得很好用。我想,這應該是產品設計簡約到極致的最高境界。
  OK,讓我們掏出口袋裏的iPhone來看看:簡潔幹練的外型,迥異於Android的多按鈕介面,最令人驚奇的是正面僅有的一個圓形按鈕,這樣一個簡約的設計曾讓多少熟稔於鍵盤以及制約於一個按鈕一個指令的IT宅男們困惑啊,單憑著拇指就能完成所有複雜的功能?也就是賈伯斯對簡約設計的追求,讓科技業停止了傳統功能性導向的思維方式,反向回復到最原始的思考,到底最終人性需要的是什麼?不需要的是什麼?
  最近,Apple又替我們決定了一項手機上不必要的東西:SIM卡!在上週(10/16)的發表會中,Apple發表了iPad Air 2 以及 iPad Mini 3等產品,雖然這次發表會不像上次的iPhone 6發表會那樣受到關注,但如果您有特別注意的話,有一項新功能安靜的隱身其中,它不但被科技專家們視為一項創新的服務,電信商們更視它為眼中釘、欲除之而後快,這個功能就是被稱為軟體SIM卡的「Apple SIM,透過虛擬的SIM卡,我們不用抽換SIM卡就能自由的切換不同的電信公司,使用它們的通話及上網服務,並且不再受制於固定一家電信商,更不需要為了要綁約幾年而煩惱。

關於iPhone的SIM卡

其實Apple早已對SIM卡虎視眈眈、欲除之而後快,這點我們從SIM卡在iPhone歷屆版本的發展史上便可看出端倪,SIM卡的尺寸愈來愈小,周圍的塑膠基板一步步往內縮:iPhone第一代以及3G/3GS使用Mini-SIM,尺寸為25mm x 15mm,接下來的iPhone 4和4S則改為較小的Micro-SIM,尺寸為15mm x 12mm,這個尺寸已經和你我的指甲差不多大小了,但Apple仍不滿意,於是又從iPhone 5開始採用更小尺寸的Nano-SIM直到目前的iPhone 6,這個Nano-SIM有多大呢?它只有12.3mm x 8.8mm,而且短期內Apple暫時無法再對它上下其手了,否則恐怕就要改寫SIM卡晶片的規格,因為所有的塑膠基板都已經摘除;這樣由大到小再來可能消失的過程,可能是SIM卡在Apple眼中最佳的結局。
    值得一提的是,從最早開始,iPhone SIM卡的安裝和移除方式就相當特別而且麻煩,Android手機可透過按壓方式或打開背板來更換SIM卡,但iPhone的使用者要換SIM前,得先找到一支細長的針(我相信大部份的人都是使用迴紋針,而且需要時絕對找不到)插入手機側邊一個不顯眼的孔,稍微用點力才能把SIM卡托槽給推出來,如果您沒有合適的針、或者分離式的托槽彈得太大力搞丟了,都是很麻煩的事,我便經常在需要更換SIM卡時找不到合適的針,托槽也老是不小心掉到地上,從這點上就可看出Apple可能是故意讓更換SIM卡變成一樁痛苦的差事,因為這實在太不像所謂的賈伯斯體驗了。

SIM卡是使用者體驗的跘腳石

  不瞭解的消費者總以為Sim卡是什麼複雜的機制,手機非它不可一定要插上才能運作,然而實際上,它就只是一張用戶身份識別卡,儲存了一些重要的文字訊息(如IMSI, ICCID, PIN, PUK)等等,方便我們的手機在連上特定電信商時作認證以及通話時加密使用,然而這些動作程序是可以透過遠端進行的,業者要求插入實體的SIM卡,為的就是想控制消費者並且綁住不放。
  我相信選擇手機的樂趣一定是更甚於選擇電信公司的,而且對於一般年輕人來說,手機已成了貼身祕書與體現身份的時尚象徵,因此挑手機必須跟挑男女朋友一樣的仔細馬虎不得,得先在店內實機把玩賞析一番、比較不同廠牌的型號與功能之後,再挑選自己善愛的顏色、外形,當然還要注意一下價格與惦惦自己荷包份量,最後才會有那麼一支心愛的雀屏中選,開始了1~2年機不離身的唧唧我我親密關係;然而選擇電信公司呢?那可就不像選購手機那麼有趣了,一般人管它是3G還是4G,他們只要能隨時隨地順利的call家人朋友通報訊息、整天Line來line去聊天不中斷、看YouTube影片流暢不停格、外出FB打卡不會跑出找不到網路訊息、最重要的是費用不高不會打爆帳單,誰還會有興趣比較中華、台哥大或是遠傳電信那些看起來都差不多的配套方案與複雜的租用條款呢?
Apple可能早就看到了我們在這方面的困擾,認為選擇電信業者對於消費者來說並不有趣也沒有必要,因此打算在不激怒電信商的前提下,不動聲色的開始推出「Apple SIM」,打算把這個對於消費者來說非必要的煩惱打包起來一起劃入它們的服務範圍,未來消費者買了新手機只要一開機就能馬上用,完成一體化完美的手機使用體驗。

溫水煮青蛙,Apple SIM的推廣

    因此,我猜最終恐怕給消費者的電信商選擇menu也會消失,因為假若手持設備能夠自動偵測並選擇最適的電信供應商,那麼這個動作實在沒有必要留給消費者自己做,除非他們認為自己來選擇特定電信商是有特別的目的或意義;因此若電信商選擇menu在手機上也消失,電信商將被剝奪直接面對消費者的最後一哩路,他們的下游客戶也從消費者變成Apple,於是以往是手機商要討好電信商以便搭配門號捆綁出售,變成了電信商要反過來討好手機商以避免撕破臉,因為他們可以在消費者端決定要優先用誰的電信網路來連線,因此將來Apple就可以擺脫電信商的控制甚至可以反向控制電信商。
我們回到功能面來看,對於消費者來說,Apple SIM主要在於解決了SIM卡切換與通訊品質良莠之間的各種細部問題,只不過在目前的環境下,大部分消費者仍是用綁約方式買手機,不會有事沒事就換門號,大部份來說,只有那些擁有多張SIM卡、或經常出國出差旅行的使用者有Apple SIM的迫切需要,但Apple在短期內不可能為了這些少數族群的需求而逕行取消SIM卡,這樣過於躁進的行動不符合Apple的習慣:萬事俱備才會開始施行;此外,為了避免過於刺激電信廠商,Apple目前只在沒有通話功能的iPad上稍試身手,電信供應商也僅支援美國AT&T(註1)、Sprint(註2)、T-Mobile 與英國EE電信等中小型業者,甚至於還有一些附加限制條件讓Apple SIM的好處在目前還沒有彰顯出來。

最後

在IT業界,Apple一直是「從0到1的典範,一連串從無到有的創意發明,對既有的規則造成破壞,使得那些守舊且維護遊戲規則不思改變的既得利益者的崩塌瓦解,例如iPad摧毀了音樂CD產業、iTunes讓DVD租賃業沒落、iPhone摧枯拉朽把傳統手機廠打得潰不成軍、iPad在瞬間就讓WinTel產業由繁盛轉為凋零,而目前正在勢頭上的Apple Pay剛推出不久就成為最受歡迎的移動支付方式,有機會讓整個第三方支付產業重新洗牌,而Apple SIM呢?或許將來也有可能成為顛覆目前電信商業模式的工具。
註1:Apple SIM在美國配合了三家大的電信商,分別是排名第二的AT&T、第三的T-Mobile和第四的Sprint,但是AT&T卻對Apple SIM做出了限制:AT&T用戶在新iPad中選定了自己的數據服務之後會鎖定整張Apple SIM,不允許用戶更換其他電信商服務,如果你選了AT&T想換其它電信公司,只能再重新買一張SIM卡。
註2: Sprint要求iPad的IMEI(International Mobile Equipment Identity 行動設備國際身份碼)必須先在Sprint網路註冊,才可以使用Sprint提供的LTE/3G服務。這意味著從其他電信商管道(非從Sprint)購買的iPad無法直接使用Sprint的服務。

2014年11月13日 星期四

移動裝置正在吞噬世界

  Andreessen Horowitz是美國一家知名的創投公司,這家公司的名稱分別來自於兩位創辦人Marc Andreessen和Ben Horowitz的姓名。
marc_ben左: Marc Andreessen、右: Ben Horowitz,老天,他們倆長得還挺像的,尤其是頭形。
對於這樣有點柪口的英文名字我們或許不太熟悉,但是若提到「Netscape網景」,我們這些身為五六年級的大叔們肯定有點印象,一個大大的N還有一個老舊的木製船舵是Netscape瀏覽器的標誌,當連上網站開始下載網頁內容時那個「N」就會開始旋轉發亮,它是二十世紀未期時連上網際網路探索訊息時的必要工具,也多虧了當時的Netscape,我們現在才能擁有免費好用的瀏覽器以及一個網際網路大爆發的時代。
這兩位創辦人當中的Marc Andreessen,他就是當今網頁瀏覽器的發明者、網景的創辦人,幾年前他與網景老同事Ben Horowitz一同創立這家創投公司Andreessen Horowitz,不過這並不是本文旳重點,我想提的是一篇最近在網路上頗為熱門的「Mobile Is Eating the World」slide,作者Benedict Evans,他也是Andreessen Horowitz的合夥人之一,這篇最早公佈在去年11月Andreessen Horowitz的a16z科技論壇,最近Benedict Evans在Tech Summit 2014發表了更新的版本。

在本篇簡報中有些話相當的簡短卻意涵深遠,例如開頭的這兩句話在網路上就興起一股轉載風潮:「Mobile is eating the world.」、「For the first time, tech is selling to everyone.」,還有這幾句「Mobile remakes the tech industry. 」、「When tech is fully adopted, it disappears. 」、「Tech outgrows the tech industry. 」也相當令人玩味。http://technmarketing.com/blog3/wp-content/uploads/2013/07/photo1.jpg
此外,還值得我們省思的是,那種公司才算是高科技公司呢?創造科技的公司、使用科技的公司、還是用科技創造的公司?
由於這些引人省思的短語和觀點,Benedict Evans的這篇slide最近興起一股轉載風潮(原始版本的網址我提供在文章後面),為了要趕上年輕人的流行跟上時代脈動,我們當然也不能錯過這篇slide,一起來看看吧!目前在網路上已經可以見到很多的翻譯版本,不過我總覺得沒有翻得很好,不是太直白就是沒有表達出作者的真正原意,因此我在每篇slide後方加上自己的敘述,大家參考看看,如果您覺得有誤請再告訴我。











https://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-1-638.jpg?cb=1414595238
    現在只要不是太窮困的人家,每戶家庭至少會擁有一台PC,至於智慧型手機呢?幾乎每個人至少都有一支,甚至是阮囊羞澀的學生也會有低價的品牌可選。
  這些號稱智慧型的手機數量加起來可是PC的好幾倍,所以Andreessen Horowitz用了「Mobile Is Eating the World」(行動運算正在吞噬世界)這樣聳動的標題來形容手持裝置深入你我生活的情況。

https://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-2-638.jpg?cb=1414595238
顯然PC已經深入家庭,但它還不屬於每個人皆擁有或一定要擁有的必需品。
但是可隨身攜帶的智慧型手機,它擁有跟PC不相上下的功能、配備著最新高科技硬體且可執行各種不同功能的APP程式,每個人都會想要一支,所以,這是人類史上的第一次,我們自願性且非常樂意地去購買並學習接受這高科技玩意。

https://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-3-638.jpg?cb=1414595238
大家都一窩蜂使用的結果,造成網際網路的人口增加如此迅速;你看,1995到2000年間,它的成長幅度像吹泡泡一樣快速,從不到5千萬成長到4億多。



https://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-4-638.jpg?cb=1414595238
而且還沒結束!再接下來4年的上網人口成長率更加驚人,而智慧型手機的成長率也在這四年隨著iPhone的發表一夕爆發,其中大部份的上網人口都是由智慧型手機的成長來帶動的。

https://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-5-638.jpg?cb=1414595238
那麼,未來呢?智慧型手機將會持續成長,我們猜測到了2020年時,所有的上網人口基本上會與使用手機的人口相當。


https://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-6-638.jpg?cb=1414595238
不使用網路的人數與沒有智慧型手機的人數,兩者的比率會持續的下降,隨著Apple與Android競爭加劇,戰場並且往中低階市場延伸,沒有智慧型手機的人數在2011開始大幅減少,最終貼近於未上網的人數,換句話,也就是「智慧型手機=網路」。
https://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-7-638.jpg?cb=1414595238
到了2020年,八成的成年人都擁有智慧型手機,而擁有PC的還不到四成。



https://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-8-638.jpg?cb=1414595238
最新的iPhone(應是指去年的iPhone 5S)CPU內含的電晶體數目,是1995年代Intel Pentium CPU的625倍。若依此計算,光是iPhone發表的那個週末,蘋果所賣出的電晶體數目是整個1995年度全部PC CPU電晶體的25倍。
因此,其實現在每個人隨身都攜帶著一台超級電腦。
https://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-9-638.jpg?cb=1414595238
真的是每個人都會有一台超級電腦!就算是在撒哈拉以南非洲地区,人均收入雖低,但低階的智慧型手機仍有其市場,每個人還是負擔得起。


https://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-10-638.jpg?cb=1414595238
在這樣每個人隨身都帶著電腦、人人都能存取網路的情況下,那麼首先,在這樣所謂「行動運算」浪潮的衝擊下,最先被改變的將是網際網路。


https://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-11-638.jpg?cb=1414595238
我們一天中有更多的時間被花到手機APP上,以往在PC上瀏覽器的重要性和相當被重視的網頁瀏覽次數的時代逐漸過去。


https://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-12-638.jpg?cb=1414595238
行動運算的浪潮仍未止歇,有更多更多的事物與功能持續的加入,你我隨時都可以把需要的功能放到手機上。


https://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-13-638.jpg?cb=1414595238
人們對於各類型的APP需求如此愈來愈多,行動運算的生態系統也隨著地區、用途、功能取向的不同而開始顯得複雜。



https://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-14-638.jpg?cb=1414595238
智慧型手機上搭載了各式的感應器,可感知外界的狀態並進行互動,因此比起PC更為精密複雜;這些各式各樣的感應器擁有特殊的功能和目的,並與背後廣大的APP們共榮共生,每當有一種新的感應器加入,就代表了一個新商機的出現。


https://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-15-638.jpg?cb=1414595238
因為智慧型手機的數量多出PC好幾倍,且人們對於手機的功能與要求更趨地域與個人化,因此,其衍生出的需求與商機與其數量相比,更是高達十倍以上。


https://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-16-638.jpg?cb=1414595238
2012年10月,Facebook宣布正式啟用行動App安裝廣告,在不到兩年的時間內,它讓Facebook的廣告獲利增加了一倍,並且總共帶來約65億美元的收入。


https://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-17-638.jpg?cb=1414595238
SMS Global和WhatsAPP每年處理驚人的簡訊量,例如Global SMS一年就處理了7.5萬億則簡訊,WhatsApp則是7.2萬億,但是實際上所投入的工程師人數,卻僅有30人左右。

http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-18-638.jpg?cb=1414595238
    這是因為行動運算普及會導致費用大幅降低,改變了初期創業資本的需求。
        2000年,每多100位員工可多服務100萬客戶,增加的成本是1000萬。
        今天,每多10位員工可多服務1000萬客戶,增加的成本是100萬。
        未來,每多1位員工可多服務100萬客戶,增加的成本是0。
http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-19-638.jpg?cb=1414595238
行動運算重新定義了科技產業。



http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-20-638.jpg?cb=1414595238
智慧型手機產業自2011年開始便如洪水爆發般,出貨量以雷霆萬鈞之勢壓得PC產業抬不起頭來。


http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-21-638.jpg?cb=1414595238
現在的消費者有一半的錢都花在行動裝置上,您可以看到所有消費性電子銷售營收當中,有一半左右是來自行動裝置相關的產品(smartphone & tablet)。


http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-22-638.jpg?cb=1414595238
1999年,人們用底片拍照並洗出了800億張相片。
今年(2014),總共有8000億張數位相片分享到社交網路上。
而配備相機的iPhone和Android手機銷售量,比起日本從以前到現在所有生產的相機總數還要多。
http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-23-638.jpg?cb=1414595238
由於手持裝置的擠壓,在這五年內,搭載微軟作業系統的PC裝置已經逐漸萎縮到25%。


http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-24-638.jpg?cb=1414595238
而蘋果和其它的智慧型手機廠,所產生的營收總額已經接近整體的PC產業。


http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-25-638.jpg?cb=1414595238
全球高科技重心正逐漸從西雅圖(Microsoft/Intel)和芬蘭(Nokia)移出,而在亞洲的苦主則是日本。


http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-26-638.jpg?cb=1414595238
這是因為行動運算對於供應鍊產生的槓桿效應:
    大量的小型、便宜、高效率且低耗能的手機晶片 → 新的產品:穿戴裝置、物網網、智慧電視、聯網汽車、無人機等等 →資料中心開始改變,從大而昂貴的運算主機以及Intel CPU,到ARM CPU和簡單的元件(多台PC取代大型主機)。
  ps:「Big Iron指的是巨大、昂貴、但處理速度速度非常快的大型主機,例如Cray的超級電腦或IBM的mainframe主機。
http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-27-638.jpg?cb=1414595238
更有趣的,行動運算也改變了其它的產業。



http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-28-638.jpg?cb=1414595238
    為什麼會改變了其它的產業?因為這類行動科技支配了我們大部份的時間
紫色和綠色區域分別代表我們一天中平均花在兩大類活動的時間比值,前者代表我們花在多媒體影音以及社交溝通上的時間,我們可以想像這其中有極大的比率是透過手持裝置進行的,而後者則是除了這兩大類之外的其它活動所佔的時間。
http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-29-638.jpg?cb=1414595238
這些耗去我們大半時間的高科技產品,有超過1/3時間是集中在少部份的知名公司,例如Google、Apple、Facebook和Amazon等。


http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-30-638.jpg?cb=1414595238
如果你問問現在11~15歲的小朋友最想要的是什麼?答案是手機。


http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-31-638.jpg?cb=1414595238
這些新世代的小毛頭們幾乎都使用手機的即時傳訊APP和社交網路來溝通,連email都懶得用了,而email仍然是成年人主要的溝通工具。

http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-32-638.jpg?cb=1414595238
此外,電視也不再是人們觀看影片和電視的主要媒介,在手持裝置和PC上的影音分享和串流媒體已經取代了電視的功能。


http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-33-638.jpg?cb=1414595238
為了因應手持裝置旳需求,液晶面板的出貨量在2014已經超過了40億平方英呎,相當於地球上每個人擁有一平方英呎。


http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-34-638.jpg?cb=1414595238
不過雖然行動運算科技支配著我們的生活,但其實這些科技的產業營收總額,還比不上傳統的汽車與服飾業。


http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-35-638.jpg?cb=1414595238
我們需體認到,科技的應用有三個面向:
  • 創造科技的公司
  • 購買並使用科技的公司
  • 使用科技創造的公司
http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-36-638.jpg?cb=1414595238
        想看看,有那些公司是購買並使用科技的?


http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-37-638.jpg?cb=1414595238
    亞馬遜:號稱是21世紀的西爾斯公司,它是科技公司嗎?還是一間用科技創造出來的傳統零售公司?
ps:西爾斯公司是世界零售企業的先驅,由理查西爾斯在1886年創建,出售的商品包括了鐘錶、生活用品以及鑽石甚至是房子都有,當時美國出售的所有商品幾乎都能在西爾斯的郵購目錄中看到。

http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-38-638.jpg?cb=1414595238
雖然Amazon在網路業界聲勢浩大,但若我們將眼光放到包含傳統的整體零售業,Amazon所佔的營收比例其實相當小,不到1.25%。


http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-39-638.jpg?cb=1414595238
    每一波新的科技浪潮都會帶來新的商機,例如知名的新聞聚合網站Buzzfeed興起便是依賴Internet和社交網路的盛行。


http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-40-638.jpg?cb=1414595238
    重點是,那些「高科技」能否融合在商業中?
例如,食品業的McDonalds以及零售業的Walmart,它們的商業流程中都需要卡車和州際高速公路運輸來傳遞貨物和商品,而旅遊業的AirBnB以及運輸業的Uber、Lyft也都需要,不過它們使用網站和手持裝置便可完成類似的服務。
當卡車或州際高速公路剛發明或完成的時候,能夠馬上並充份使用的企業如McDonalds和Walmart,在當時都被認為是所謂的「高科技」公司,而現在它們已被歸類為傳統行業。
http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-41-638.jpg?cb=1414595238
    因此,當科技深植入心之後,它就自然而然消失了。
例如,我們不再關心Railways,雖然它在20年代被視為高科技,但它已經是現在日常生活中的一部份。


http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-42-638.jpg?cb=1414595238
    「鋼鐵」也是。
http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-43-638.jpg?cb=1414595238
    「電腦化」呢?看來它也逐漸成為我們生活中的一部份了。
http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-44-638.jpg?cb=1414595238
「軟體」?看來也快要變成過去了。


http://image.slidesharecdn.com/201410wsjdbe-141028165857-conversion-gate01/95/mobile-is-eating-the-world-45-638.jpg?cb=1414595238
「Software is eating the world」
軟體將要吞噬世界?其實正因軟體即將過時,所以代表了軟體與你我的日常生活已經分不開了。
「Tech outgrows the tech industry」
同樣的,當科技就存在你我周遭時,它就已經超越了你我所謂的科技產業。
因此,知道為什麼我說「Mobile Is Eating the World」了嗎?

2014年11月12日 星期三

HTML5 Canvas的影像處理

  還記得在前幾篇知識文件中所介紹過的Canvas繪圖功能嗎?透過HTML5的Canvas繪圖功能,我們可以即時的產生圖形、並做出各種各種動態的圖形效果,而這些效果在以往都是需要透過第三方軟體協助才能夠作到。
  在這篇文章中,我們來試看看Canvas的另一個重要功能:影像處理,透過Canvas對於影像的支援能力,使得網頁的圖形處理不再需要依賴Server端來執行,我們在Client端利用javascript就能直接取用使用者的相片、Web Camera影像、網頁上的圖片等等,這不但減少了網路的傳輸與伺服器的負擔之外,網頁開發者也可以直接使用HTML加上javascript這樣的方式直接在用戶端就完成影像的處理,而不需要再另外依賴或學習撰寫伺服端的處理程式,最重要的一個好處是,我們不再需要利用第三方軟體,造成使用者在調用client端元件時會發生的種種繁雜認證與確認動作。

一)Canvas影像處理的基本步驟:

  在開始利用Canvas來處理影像之前,我們必須A) 先建立一個影像物件並開始B) 讀入影像的資料,當影像C) 讀入完畢後,便會觸發一個onload的事件,此時,我們便可在該事件的函式中,將讀入的影像資料繪製到Canvas物件中,開始進行相關的處理工作。
    這個基本步驟可寫成Javascript如下:





  接下來我們以凌陽創新網站上的圖片為例,使用Canvas提供的drawImage()方法針對該影像進行最基本的直接繪製、尺寸修改、影像截取等三種處理來作示範。

A)直接複製:














B)執行結果:

我們會發現網頁上有一張一模一樣的圖片(不是直接用連結的哦)。

C)尺寸修改:

要將圖片的尺寸縮小或放大,只要將ctx.drawImage(image, 0, 0); 這行再加入兩個參數,改為 ctx.drawImage(image, 0, 0, 寬度, 高度);就可以了,例如我們把圖片縮小為200x50如下:

D)截取部份影像:

    截取影像上的某個區域也是使用drawImage()這個方法,但是要額外給予影像的開始截取座標位置(sx, sy)以及截取的寬度(sw)和高度(sh),如下例:   
    ctx.drawImage(image, 0 ,0 ,350, 200, 0, 0, 350, 200);
我們截取了從(0,0)位置、寬長為350x200區塊的圖片(剛好為鍵盤的部份),並繪製在0,0的區域,繪製的圖形尺寸為350x200,執行結果如下:

二)Canvas像素處理:

  在Canvas所繪製的圖形或影像是作為一個整體的點陣圖(Bitmap)方式儲存的,我們我們可以造訪各個像素的資訊,換句話說,我們可以使用Javascript處理Canvas上的像素資訊,這是Canvas的一個很重要的特色。
  我們使用getImageData()以及putImageData()兩種方法針對drawImage()所繪製的影像來進行像素的處理,而這些像素資訊是用一維陣列的方式存放在CanvasPixelArray當中;在開始說明如何使用getImageData()及putImageData()方法之前,我們必須先瞭解實際像素和這些存放在CanvasPixelArray陣列中的像素資訊之間的關係。
  如左圖,影像上的每一個像素都會擁有四個數值,它們分別代表RGB三種顏色以及Alpha(透明度),這些數值的組合形成了最終每個像素的色彩及透明度;我們以下方圖形的橘色方框區塊為例,它的長寬分別是119px, 69px, 所以這個區塊總共有8211個像素,但是由於每個像素有四種數值,因此放到一維的CanvasPixelArray之後,總共會有32844個數值,所以,如果我們要找出某個像素的資訊,就要先確定該像素資訊是在陣列中的第幾筆到第幾筆。
    因此,當我們要得到一張圖片上(x,y)這個像素的影像資訊時,我們很容易就可找出這個公式:(注意,x,y都是從0,0開始)
Red =  (x + y * 影像寬度) * 4
Green =  (x + y * 影像寬度) * 4 + 1
Blue =  (x + y * 影像寬度) * 4 + 2
Alpha =  (x + y * 影像寬度) * 4 + 3
    知道影像的實際像素與存放資訊陣列之間的關係後,下面我們用一些實例來作一些練習。

A)變更R、G、B或Alpha值:

    請將下方程式碼放置於HTML的<body>標籤內,試著執行看看:














執行結果應該如下,您會看到圖形變充滿了藍色調:
這是因為我們把Red與Green兩個色彩的值變小,Blue的值奱大的結果,您可以試看看,隨意更改這些數值,看看會出現什麼結果!

B)將彩色圖片轉為黑白:

    如果我們將每一個像素的RGB三種數值皆設定為此其RGB值的平均,那麼,你會發現整張相片都變成黑白了,因為相同比重的三種RGB顏色混合後便會變成黑色,這是最快速的彩色轉黑白的方法,當然,要把黑白相片轉得更完美,應該還要考慮到加重光影的比例,但這部份與本文無關就先略過不談。
  我們修改上面範例中迴圈內的部份程式如下:





        執行結果,真的變成黑色的圖形了!

三)Canvas與外部設備的搭配:

看到這裏,你有沒有想到,既然Canvas可以抓取某個圖形來進行重繪及處理,那麼,web camera以及網頁上播放中的影片豈不是也可以如法炮製嗎?的確,透過HTML5的Canvas,我們可以對播放中的影片加入動態的效果或字幕,可以將web camera的即時畫面重繪到Canvas進行處理及判斷,作出類似人臉偵測、移動偵測等等功能,甚至於也可以進行現在流行的Gesture Recognition,換句話說,透過Canvas搭配HTML 5的影像支援,可以作出很多令人驚奇的新功能。