行動裝置看漲!跨屏介面設計的現況與未來
行動裝置看漲!跨屏介面設計的現況與未來

所謂工欲善其事,必先利其器。這個月中Business insider在IGNITION大會中提出的「數位未來趨勢報告(The Future Of Digital)」最近已經引起了廣泛引用,而Phimedia社群小組認為其中最重要的就是「企業必須要將使用行動裝置(Mobile)的用戶納入考量」,原因就在於目前已經有6成的上網設備都是行動裝置!

因此為行動裝置用戶創造出友善的跨屏介面已經成了企業的重要課題,這次要跟大家聊聊跨屏介面設計的現況與未來。

1102450_693329077350468_1833639606_o

圖1.松菸誠品的新媒體網站呈現不同的跨屏視覺

  • 跨屏設計的現況

    隨著智慧型手機的普及,企業紛紛開始思考跨屏策略,有的企業只以網站(Web)的方向作思考,常問「我們該選擇另外打造一個行動版網站,還是僅在原本的網站中加入響應式網頁設計?」。

    有的企業則以提供App下載為跨屏的策略,所以許多人也開始問「在提升使用者體驗時,該從App還是網站下手?」。

不過這些問題都是為了提升使用者體驗,應該以企業的策略來決定,目前跨屏設計方向可分為:Native App、Web App、Hybrid App,而企業可思考何者較適合自己。

App

圖2.這張圖會不會不小心讓大家想起來學交集、聯集時的痛苦回憶

  • ### Native App

Native App大家最為熟悉,例如App Store中的商業週刊、蘋果日報、CNN新聞…等等的應用程式,功能最強大,使用體驗、流暢度也最為良好,即使在待機中,Native App也可以推播最新消息到手機的主畫面中吸引用戶開啟使用,當然有需要的話也可以使用任何手機內建的功能,如手電筒、照相機、衛星定位之類的功能。

2013-11-25_14-13-11

圖3.Native App能夠提供最順暢的使用體驗

一個展現Native App優點的絕佳範例就是Facebook,使用App Store中下載的Facebook跟手機中用瀏覽器開啟的 Facebook,相信大家一定能夠感受到兩者之間的差異。

  • ### Web App

Web App其實一樣是個網站(Web),但因為加入Html5語法,提供近似Native App的流暢性故得其名。最大的好處是只要用瀏覽器就能開啟,所以不用抉擇要在iOS還是Android上開發。可惜像推播、照相之類的手機功能等等,本質為網站的Web App仍無法自由使用。

手機版的Gmail就是個Web App的好例子,在操作的流暢性上會讓人驚訝它竟然是一個網頁,如果你沒有Gmail帳號可以測試的話也別太難過,Google首頁也是,不過Google首頁較簡潔,給大家的體會也許就沒那麼深。

2013-11-25_14-14-19

圖4.由於Web App沒辦法推撥告知有新信,只好開啟網站來檢查

  • ### Hybrid App

最後是Hybrid App,這算是一種因Web App功能不夠成熟而出現的混合方法。

同樣要由App Store中下載,所以保留了Native App的特點,能夠流暢使用及喚醒手機的內建功能,但是內容其實只是將用Html5寫的網頁嵌入App,因此也像Web App般容易維護,又能降低開發Native App的成本,但整體來說流暢性與成本皆介於Native App、Web App之間。

如Walgreens這款網拍App,粉絲們可以發現其內容跟行動版網頁內容一模一樣,好處當然就是對於企業來說只需用Html5寫一個語法,就可同時維護網頁及App程式,壞處就是採用網頁嵌入的部分可能因此喪失了一些Native App可有的變化性。

WALGREEN

圖5.雖然是個App,但其實內容跟行動版網頁一模一樣

  • ### 哪個比較好呢?

如同前面所說的,應該要考慮的是哪個比較適合企業自身需求、網站類型,用戶背景。不過資深研究員Raluca Budiu為我們整理了幾個方向做比較,其中四點較特別的如下:

● 能見度

有兩個原因使Web App 絕對是讓傳遞的內容(Content)較能被看見的方法,第一,Native App大部份的安裝量都來自20%的App軟體,其它的甚至連在目錄中被看見的機會都沒有;第二,當人們有資訊需求時,他們會習慣去Google或Yahoo等搜尋引擎尋找網頁,而非到App Store中。

● 安裝

Web App不需安裝、不占空間,只需將連結加到桌面即可快速開啟,不過儘管如此,在目前,人們習慣的方式是到App Store中安裝App,將書籤連結到桌面的方式對人們來說仍然很陌生。

● 內容限制、核准與收費

App Store裡有許多的內容限制跟漫長審核,甚至會收取費用,相比之下,Web App完全不會有這些困擾。這對被削了一層皮的企業而言,絕對是個福音,Playboy雜誌也的確因此打造了一個自己的Web App。

● 開發成本

別懷疑,打造一個Web App或Hybrid App絕對會讓你的開發成本較低,除了本身Html5易學且能跨平台開發以外,日後的維護難度也較Native App低。

除此之外,再次提醒企業必須思考自身的類型,比方說若你是個律師仰賴與客戶間當面對談,那麼花大錢打造一個昂貴的Native App也許不該是你的第一考量。

WHICH1

圖6.究竟哪個方法比較好呀?

● 跨屏設計的未來趨勢

有些人認為Native App將在未來消失,Web App不需學習多種語法、不用下載、擁有較高的曝光度,絕對會在未來引起革新。

不過也有人認為比較兩者就像是電視跟報紙一樣,並不會互相取代。*
*

但其實這之間還有一個因素要考量,那就是Apple、Google的策略問題。

如果它們將Safari、Chrome等瀏覽器功能做改造,使Web App可以連結手機中推播、照相之類的功能,將會使Web App更為全能,但是相對而言會減損App Store的收益,而且,若任何網站都可以完全使用手機內建功能,也有可能會造成安全上的疑慮。

不過儘管如此,目前我們已經看到瀏覽器開發商們做出了讓步,使得我們能看到許多方便的Web App。

 

最後來分享兩個有趣的案例。

● Financial Times的Web App

提到Web App最歷久彌新的例子,是2011年Financial Times為了規避App Store的收費而推出的Web App,可惜目前行動裝置上似乎只有iOS的Safari瀏覽器能夠流暢操作,沒有iPad或iPhone可以用電腦版的Chrome開啟來過過乾癮,想像一下你的鼠標就等於你的手指,你絕對不會相信這是一個手機版網頁能做到的事。

● 百度將推出的Hybrid App

百度將在下個月全面開放「輕應用」服務,其實這是Hybrid App的一種新嘗試,在App Store中下載百度瀏覽器後,除了可以搜尋一般資訊外,也可蒐尋到與百度合作的輕應用,直接在百度瀏覽器中以不需下載的方式開啟。

輕應用圖

圖7.無須下載,搜尋到輕應用即可直接開啟,喜歡的話也可訂閱收集

跨屏設計的未來將怎麼走,有許多人都引頸期盼、或者發表評論預測未來,Todd Nienkerk用使用者的角度提供了很有趣的看法,用戶根本不在乎使用的是Web App還是 Native App,用戶只在乎能夠讓他們越方便越好。

apps-are-icons-header

圖8.只要你能夠方便開啟,用戶就買單

出自Phimedia通泰媒體

往下滑看下一篇文章
突破傳統信用卡模式!國泰世華如何重塑刷卡體驗,養出百萬CUBE切換忠實粉?
突破傳統信用卡模式!國泰世華如何重塑刷卡體驗,養出百萬CUBE切換忠實粉?

根據聯合徵信中心統計,國人平均每人持有約4張信用卡,雖反映出信用卡普及,卻也暴露市場飽和的現實。當回饋比例、聯名優惠成為銀行發卡標配,差異化日漸縮小,消費者對單一卡片的忠誠度也難逃下滑。

面對同質化競爭困境,國泰世華銀行四年前即推出CUBE信用卡,首創「數位自選」權益機制,讓使用者能依需求自由切換權益回饋,成功累積百萬卡友。然而,當使用者習慣隨手調整回饋後,國泰世華又該如何進一步突破,讓廣大「CUBE切換忠實粉」更黏?

數位平台成熟度,撐起「權益自選」創新機制

「以前一張信用卡就是固定型態的權益,或綁定單一聯名夥伴。而權益自選的設計,讓信用卡不再那麼制式、更加靈活!」

國泰世華銀行數位長陳冠學指出,CUBE 卡最大的突破,是將信用卡從「靜態工具」轉化為「動態平台」。搭配CUBE App卡友可依需求隨時切換:餐廳用餐或假日逛百貨公司選「樂饗購」、出國旅遊則切換至「趣旅行」享旅遊或交通優惠;一張卡橫跨多種生活場景,甚至能依個人偏好即時調整,客戶更能於商家請款後透過CUBE App查詢點數回饋明細,對精打細算的卡友格外具有吸引力。

然而,要實現如此彈性靈活上下架權益與優惠,背後的挑戰遠比表面複雜。陳冠學直言:「若沒有成熟的數位平台作為基礎,根本不可能實現。」傳統信用卡只需處理單卡簽帳與消費紀錄,但 CUBE 必須同時滿足龐大客群的多元需求,從數據分析到營運模式都得全面升級。唯有在技術架構上徹底重建,才能實現這種前所未有的產品邏輯。

因此,CUBE 信用卡並不只是單一產品的創新,也可以說是推動國泰世華數位平台進化的重要里程碑。

國泰世華銀行數位長陳冠學
國泰世華銀行數位長陳冠學指出,唯有成熟的數位平台,才能撐起CUBE信用卡「權益自選」的創新機制。
圖/ 數位時代

因為靈活,得以開啟平台化服務的想像

打開 CUBE App、彈性切換CUBE信用卡權益方案,甚至查看領取不同商家的回饋加碼優惠券,這種互動式體驗已成為百萬卡友的日常。但國泰世華並未止步於此,而是思考如何進一步延伸金融場景。

「許多權益的設計並不只是為了增加交易,而是基於人性化洞察,去滿足客戶更深層的需求。」陳冠學舉例,如CUBE信用卡「童樂匯」權益,針對親子族群推出涵蓋餐廳、嬰幼童品牌、五感體驗課程等六大通路的專屬權益,最高可享 10% 小樹點回饋,甚至指定私校學費也提供領券最高 3% 回饋。雖然少子化趨勢讓親子族群相對小眾,但陳冠學則有不同觀點:「服務客戶的下一代,也是長遠經營的投資。」

除了分眾經營,對於聯名卡的發行,陳冠學則認為:「過去,聯名卡是會員身份的象徵,但在數位時代,攜帶多張會員卡的需求已經弱化。我們透過不同合作模式,仍能達到同樣的客群經營效果。」

於是,國泰世華與多元場景通路如 Uber、Klook、大樹藥局、臺虎展開不同形式的深度合作。對合作通路而言具備「品牌強強聯手」的導客效應,對國泰世華來說,則更能觸及多元分眾市場,跳脫單一品牌聯名的侷限,信用卡也因此從支付工具延伸出更多服務優勢。

當信用卡升級為集結服務的平台,國泰世華不僅打造互利共生的生態圈,對外創造多贏合作,對客戶也深化品牌連結,逐步鞏固難以取代的黏著度。

新聞照.jpg
CUBE信用卡結合App數位自選權益,讓用戶依需求即時調整回饋,展現靈活又直覺的數位金融體驗。
圖/ 國泰世華

從一張卡到點數生態圈,國泰世華打造CUBE尊榮會員感

「跳脫信用卡本位主義,不再侷限於刷卡回饋,而是從整體金融與生活情境出發,將服務轉化為跨情境串聯的完整旅程。」陳冠學強調,CUBE 品牌的使命,就是做到跨情境、跨服務、跨子公司的一站式體驗。

而國泰優惠 CUBE Rewards App 的出現即是里程碑。從原先 MyRewards 升級為 CUBE Rewards App,不只功能升級,也是品牌再造,把 CUBE 信用卡與國泰集團「小樹點」完整串連,將會員經營、點數生態圈與 CUBE 品牌價值一站打通。

「我們讓 CUBE 不只是信用卡,更像是俱樂部般的尊榮體驗。」憑藉國泰龐大的小樹點基礎與優質卡友群,CUBE 對合作品牌展現強大吸引力,得以不斷拓展餐飲、旅遊到藝文等場景,更突破點數僅能折抵帳單的模式,讓卡友能用點數兌換熱門演唱會、運動賽事門票,甚至搶先預訂話題熱門餐廳等限量體驗。

「我們希望讓客戶覺得:哇,你又找到我的需求了!」陳冠學說。把細微偏好化為具體體驗,正是 CUBE 平台能不斷創造驚喜的關鍵。四年來,CUBE 以「1+N」權益架構結合雙 App,已累積超過 600 萬卡,為國內發卡量最大的單一信用卡;累計2025 年前 7 月,簽帳金額達 4,889 億元,年增 11%,寫下亮眼成績。

但對國泰世華而言,數字只是過程,真正的目標應如陳冠學所言:「信用卡不該再有框架,CUBE 要做的,就是以洞察與創造,帶給客戶超乎想像的個人化體驗。」

登入數位時代會員

開啟專屬自己的主題內容,

每日推播重點文章

閱讀會員專屬文章

請先登入數位時代會員

看更多獨享內容

請先登入數位時代會員

開啟收藏文章功能,

請先登入數位時代會員

開啟訂閱文章分類功能,

請先登入數位時代會員

我還不是會員, 註冊去!
追蹤我們
蘋果能再次偉大?
© 2025 Business Next Media Corp. All Rights Reserved. 本網站內容未經允許,不得轉載。
106 台北市大安區光復南路102號9樓