Yahoo行動首頁如何誕生？
設計總監揭密
設計總監揭密
甘偉中
2014年 02月 23日20:51
http://3-ps.googleusercontent.com/x/www.nownews.com/imgapi.nownews.com/x，qw=640，aq=80，av=1393220829600，asrc=http，P3A，P2F，P2Fs.nownews.com，P2F10，P2F76，P2F10769af00a634968409bd5c70a3ae988.jpg.pagespeed.ic.PgVZfcf51X.jpg
▲Yahoo亞太區設計部門資深總監梅若蘭，分享Yahoo奇摩行動首頁設計概念
台北報導
Yahoo奇摩行動首頁自去年12月11日改版以來，達到單月瀏覽量成長近2倍，單月不重複造訪人次超過800萬的成績。小小幾吋的螢幕內，整合進11種類別、超過100家內容來源。到底是怎麼利用這小小面積，又能維持良好的使用體驗？相信所有想投入行動產業的人都會感到好奇。
全新Yahoo奇摩行動首頁，由2012年在台成立的Yahoo亞太區設計中心所打造，該中心資深總監梅若蘭（Melora Zaner-Godsey），大方的分享了他們團隊的設計理念及執行方法。
一個好的團隊，務必有大家認同的理念在前方引導，才能化解彼此的衝突，增加溝通的效率，梅若蘭首先就揭露了他們團隊的REM理念。所謂REM是指：理性機能（Rational）、感性體驗（Emotional）、價值創造（Meaningful）這三個概念。
http://1-ps.googleusercontent.com/x/www.nownews.com/s.nownews.com/media_crop/16846/hash/13/e5/x13e5a6480536f2daaf0f4d6ab8206f98.jpg.pagespeed.ic.T9MnyYoY2N.jpg
▲Yahoo奇摩行動首頁在小小螢幕內，整合進11種類別、超過100家內容來源，可以直接將頁面左右滑動切換類別
從原文會比較容易體會，這意思是他們設計產品不只滿足功能面，還會考慮使用者用起來的感受、好不好用，以及對使用者的意義是什麼。
簡而言之，「使用者」就是他們的最高指導原則。在整個專案過程中，他們會不時的蒐集使用者意見，從使用者及使用者重視的事物中獲得啟發。
http://4-ps.googleusercontent.com/x/www.nownews.com/s.nownews.com/media_crop/16847/hash/45/c8/x45c8d23cb87e9de80a72aad114a3d460.jpg.pagespeed.ic._dV7zRnhSB.jpg
▲左上角的按鍵按下去會滑出瀏覽選單，和一般App的行為類似；右上角的箭頭按下去，會出現六種即時休閒資訊
梅若蘭的團隊成員也分享了製作過程中的經驗，他們為了設計行動首頁，會實際造訪使用者所處的環境，了解使用者所遇到的種種問題；在探索使用者行為的過程中，他們會不斷追根究底，「問一次為什麼是不夠的，通常問到第五次為什麼，才會看到使用者要的真正價值」。
專案團隊採用敏捷開發（Agile Development）的模式，所有成員不只設計部門，還包括產品經理、工程師、業務，所有相關人員在一起進行，遇到問題、衝突就馬上解決。
另外還採用Paper Prototyping的方法，在設計階段初期，用紙製作出模擬手機介面，用實體的紙製品和相關部門、使用者討論，獲得回饋之後進行修正，藉由不斷重複這個過程來完善。為什麼用紙？因為這樣才會快，才能拿到使用者眼前討論。
在製作過程中，若遇到意見不合的情況，會進行使用者研究來解決團隊疑惑，所有成員一起觀察使用者的反應，當大家都看到使用者的痛苦，才會有共識，就能有正確的對話。
經由重複進行的使用者研究，他們發掘出四個核心設計概念：直覺簡單（Organized）、無縫整合（Seamless）、瀏覽不間斷（Continuous）、效率三步（Fast:3 Steps），並依此將Yahoo奇摩旗下的服務、內容整合進來，最終完成一站式瀏覽的行動版首頁。
在專案上線後，還會繼續找使用者回來測試，他們稱之為「Yahoo User Night」。「Yahoo User Night」每季舉辦2、3次，專案相關人員都會參與，並且會和使用者做1對1訪談。蒐集到的資料，就會作為下一次改版的方向。
不少人好奇，現在不是App大受歡迎，為什麼Yahoo奇摩不選擇做App而是行動版網頁呢？梅若蘭表示，行動網頁有快速、簡單、跨平台的優點，App適合深度整合、有特別需求的情況，而且App有下載、安裝的過程，相較之下比較麻煩。行動版網頁比較符合Yahoo奇摩希望提供的體驗。
不過梅若蘭也忍不住透露，過不了多久，Yahoo奇摩就會推出專屬台灣地區的App，敬請大家期待；另外，目前行動版網頁尚未支援平板電腦，未來他們也會繼續將行動版網頁改成「自適應網頁設計（Responsive Web Design）」，到時候就會隨著使用者的螢幕大小，自動改變網頁版型。