WebStorage for Win8
WebStorage for Win8

時至2013,已是個習慣觸控操作的時代,平板電腦、筆記型電腦、手機、提款機等,還有最適合觸碰式操作的Windows 8作業軟體。為了讓消費者也能用手指簡單操作,使用到ASUS WebStorage for Windows 8的App,我們在2012年的五月底,就受邀開發Windows Store App。由於華碩雲端很早就投入Windows 8 平台開發,我們遇到的問題相較於其他平台要多很多且需要開發人員的自行摸索。

在專案的開發期間,除了微軟所推出的全新Windows 8介面與我們一般所熟悉的介面大異其趣之外,從Windows 8 Consumer Preview 版本至 Windows 8 Release Preview的大轉變,都讓 App上線時間無限往後延宕,增加了Windows 8 平台開發的困難度。

專案管理與開發 – 腦力激盪與創意激發

開發 Windows Store app 就像在瀏覽器中開發一樣,思維與使用者操作模式都相去不遠。但是,如何從滑鼠的控制,轉換至觸碰或者滑鼠控制兩者併容呢 ?
要讓使用者使用觸碰時能在每個控制項上面順暢的操作,並且接上滑鼠時又能不脫離觸碰相同的操作模式,這對公司裡負責此項專案的工作人員都絞盡腦汁的描畫出一張又一張的草稿與介面無止境的修改,為了只是能融合每一位使用者的操作經驗。

由於專案人員必須在短短的4個月內摸索全然陌生的Windows 8 介面,因此被指派負責這次改善任務的產品經理 Vera 與資深軟體工程師 Alex,我們徹底運用專案管理精神。Vera負責從有限資訊中了解Windows 8 介面的設計方式與設計重點,從而制定出規格;Alex則從微軟官方了解Windows 8全然不同的程式語言,一次又一次地去嘗試錯誤並修正。在這段過程之中,我們努力的重點朝兩個方向前進,使用介面的改革與使用經驗的創新。

使用介面改革

大家都知道同一隻app,在不同裝置上就得設計符合該裝置的操作方式與設計風格,因此Vera和Alex在如何將既有的功能移植到全新的Windows Store app介面想破了頭,以下是本次任務開發人員的專訪:

首先,請問兩位在開發Windows Store app時,遇到的最大困難是甚麼?

Vera:當要著手設計Windows Store app產品規格時,最困擾我的問題就是Windows Store app到底是什麼?什麼樣的風格叫做Windows Store app風格?在設計第一眼要呈現給使用者的首頁時,我們不斷的在思索這個問題。是不是所有功能都以方塊形式呈現就是所謂的Metro風格(微軟最初訂的名稱)呢?因此初版首頁就此誕生,如下圖。

WebStorage for Win8
WebStorage for Win8

在經過一番摸索與檢討之後,捕捉到Windows Store app設計重點。在圖示設計上須去除不需要的裝飾(陰影、漸層、立體感及原角),讓重要資訊當主角。然而,在圖示設計極簡化之下,則須利用大膽的色調抓住使用者目光並凸顯出App的個性。有此認知之後則調出了第二版首頁設計,如下圖。

WebStorage for Win8
WebStorage for Win8

第二版誕生後,看著我們的第二版首頁邊問自己,為什麼幾乎所有設計原則我們都確實遵守了卻還是沒有感受覺到所謂的Windows 8風格呢?專案人員與美編進行了一次又一次的討論,最終,在看到Windows 8的桌面時,才突然有以下領悟,最新版的首頁設計,也就因此誕生。
1. 排版:不是全部用方塊排列方式呈現就是Windows 8風格,同群磚塊間要留標準10px的間距,不同群磚塊要留80px邊界。
2. 圖示:圖示不是能大就大,能幾D立體就多立體,反倒是應該縮小、置中、白色、壓平,讓重要的文字可以被凸顯出來。
3. 文字:要拋開以往文字置中且多與運用文字色彩較為美觀的觀念,在Windows 8上文字不管長短就是靠左對齊,顏色就是簡單的白色。

WebStorage for Win8
WebStorage for Win8

此時,Alex補充 : 由於 Windows store app 所能呈現給使用者的,不僅僅是 App 的操作,需要能與滑鼠並存,並且,微軟提供了四種頁面呈現方式 FullView、Widescreen, Minmum 和 Snap View ,每個頁面間的切換都必須符合PM所提出的排版,這著實需耗費大量的精力去把每個 pixel 調整到對的位置。

使用經驗創新

接著,Windows store app根據使用者的經驗,有甚麼樣的創新?
Vera:隨著使用的時間越來越久,漸漸地體驗到Windows 8全新介面所要帶給我們的是使用經驗不間斷的操作體驗,讓操作上更加快速且流暢,不像過去介面需要進到很多層才能找到某功能。此外,Windows 8的Widescreen 和 Snap View分割畫面功能,更是使操作突破以往模式,讓使用者的效率倍增。

由於自己對音樂的需求,發現若能讓使用者用分割畫面進行作業時,可以邊聽存放在ASUS WebStorage中的音樂,一定會使產品更加有吸引力。因此,立刻與Alex討論音樂連續撥放功能的可行性,雖然難易度頗高,但在經過一番激烈的討論後我們達成共識並馬上著手規劃此功能。從音樂撥放介面、歌曲資訊若過長的呈現方式到應開放的撥放功能,都在我們一次又一次的討論中調整並取捨。各位現在所享用的音樂連續撥放功能就是我們努力後的成果。

Alex:一聽到 Vera 提出想規劃音樂連續撥放的功能,就覺得這主意真是太棒了!在確認技術上的可行性與開發的複雜度後,便著手開始開發。

ASUS Coud 中的開發模式是採用 Scrum 開發,這樣的方式可以快速反應產品需求,符合每個使用者的強烈需求,在國外,這種開發方式已成為一種常態,讓產品可以更貼近每一位使用者,也再次強調了 ASUS Clloud 對產品的理念。

最後,特別詢問Vera與Alex,完成這次不可能的任務中,最重要的關鍵是?
兩位專案人員想了許久,最後引用華碩集團長官說的一段話當總結:『成功不是我一個人的能力所及,是整個團隊一起做到的。』

未來,ASUS WebStorage會持續調整並增加Windows 8上的功能,讓使用者可以使用到詳盡且高品質ASUS WebStorage,並規劃出更多符合Windows 8的應用與操作。我們持續蒐集世界各地ASUS WebStorage使用者的建議後,計畫在近期增加:允許資料的多檔案上傳與下載、資料的離線瀏覽和用戶最希望的:支援各社群軟體(例:LINE、WhatsApp)使用ASUS WebStorage內的照片進行分享的功能,請大家盡請期待。
各位如果對ASUS WebStorage 有任何功能建議或者想法,歡迎到論壇告訴我們且與我們一起討論。

6 comments

發表迴響

在下方填入你的資料或按右方圖示以社群網站登入:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / 變更 )

Twitter picture

You are commenting using your Twitter account. Log Out / 變更 )

Facebook照片

You are commenting using your Facebook account. Log Out / 變更 )

Google+ photo

You are commenting using your Google+ account. Log Out / 變更 )

連結到 %s