2015-4-1 用心設(shè)計
藍(lán)藍(lán)設(shè)計( www.wnxcall.com )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供有效的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)
每一個扁平化界面設(shè)計，都是我們的心靈碰撞致力于最棒的 metro ui 設(shè)計
來源：站酷網(wǎng)
如果您想訂閱本博客內(nèi)容，每天自動發(fā)到您的郵箱中， 請點這里
氣，持續(xù)占據(jù)各大APP排行榜天氣類軟件第一位，在5年時間內(nèi)，擁有超過3.3億的注冊用戶。人氣APP是怎么設(shè)計出來的？設(shè)計師應(yīng)該怎么加強自己的能力？帶著這些問題，站酷網(wǎng)探訪了墨跡天氣設(shè)計團隊，希望他們的觀點對同為設(shè)計師的你有所幫助。
受訪人：相輝，墨跡天氣副總裁 運營VP。
先后任職雅虎，百度等公司，前百度移動云事業(yè)部資深用戶體驗設(shè)計師，前百度易平臺負(fù)責(zé)人，曾擁豐富的交互設(shè)計經(jīng)驗和團隊管理經(jīng)驗。
受訪人：Tony石浩言，墨跡天氣設(shè)計總監(jiān)。
13年入職墨跡，兩年時間從設(shè)計師成長為設(shè)計總監(jiān)，負(fù)責(zé)過墨跡天氣安卓／windows／國際版／pad等不同平臺的設(shè)計，目前正在帶領(lǐng)ios平臺的設(shè)計。
Tony石浩言和相輝
————————————————————————————————————————————————
墨跡天氣是怎么做設(shè)計的？
站酷：從推出到現(xiàn)在，墨跡天氣在UI設(shè)計風(fēng)格上都發(fā)生過哪些變化？哪些原因影響了這樣的改變？
Tony：主要有三次。第一次順應(yīng)潮流，老生常談，從擬物到扁平。第二次當(dāng)雅虎天氣的上滑式整體頁面體驗獲得了蘋果設(shè)計大獎后，我們也學(xué)習(xí)了這種交互形式，去掉底部的doc欄，啟用了上滑式的一體化設(shè)計。第三次就是近期的5.0改版，將上滑體驗和底doc欄做了結(jié)合，算是一種回歸。
設(shè)計師要有數(shù)據(jù)分析能力，我們所做的轉(zhuǎn)變大部分是基于數(shù)據(jù)分析得出。做設(shè)計之前，設(shè)計師必須知道為什么這樣去做，而不只是為了好看，UI是移動工程學(xué)，是需要創(chuàng)造出來解決問題。當(dāng)軟件功能越來越多，就需要用戶更快地獲得他們所需要的信息，減少學(xué)習(xí)成本。比如，在5.0改版設(shè)計前，我們觀察數(shù)據(jù)發(fā)現(xiàn)因為一開始時景入口在首頁沒有標(biāo)明，而是通過首頁左右滑動獲得，這樣直接導(dǎo)致部分用戶找不到時景功能，相關(guān)點擊量就會較低。
墨跡天氣設(shè)計團隊
站酷：墨跡天氣的設(shè)計工作流程是怎樣的？
Tony：設(shè)計師在整個產(chǎn)品流程中是從一而終，一直貫穿的。首先需要了解產(chǎn)品，和產(chǎn)品部門一起參加內(nèi)部會議了解 功能點，期間有任何異議都可以提出。拿到功能文檔后開始研究交互，提煉設(shè)計，配合開發(fā)實現(xiàn)，再到后來的配合運營做產(chǎn)品發(fā)版相關(guān)跟進。平時還需要和產(chǎn)品，開 發(fā)互相權(quán)衡并不斷打磨產(chǎn)品細(xì)節(jié)。
站酷：在這個流程中，設(shè)計團隊與其他部門是如何協(xié)作的？設(shè)計和開發(fā)，圖形和交互如何平衡呢？
Tony：其實就是不停地聊。總體來說，在創(chuàng)業(yè)公司團隊的氛圍還是不錯的，大家都希望做出更好的東西。需要溝通的時候，UI設(shè)計師甚至搬上電腦坐在開發(fā)旁就一起進行了。我們的管理比較扁平，需要每個人都有垂直對接的能力。
墨跡天氣24節(jié)氣設(shè)計
交互這塊以產(chǎn)品為主，我們的設(shè)計師也會在平時的設(shè)計工作中培養(yǎng)交互能力，會主動地提出問題，和解決方案。比較理想的一點是，只要是好的建議，無論是產(chǎn)品，設(shè)計，還是開發(fā)，大家都會互相采納。
站酷：注意到墨跡天氣在交互上的一些小動效，比如在“我的主頁”里，在向上和向下拖動頁面時，讓頭像和郵件在原有的基礎(chǔ)上發(fā)生了改變，這樣設(shè)計的原因是什么？對于動效在交互中的應(yīng)用你怎么看？
Tony：我們希望第一次點“我的頁面”，能給用戶帶來多一些的個性化色彩，所以突出頭像和個性背景，緊接著在產(chǎn)生二次操作上滑之后，用戶名和郵件入口滑向兩邊，重點在下面的list view信息，動效就是將二者結(jié)合的最佳方式之一。所以，動效的重點應(yīng)該是把不同的功能點完美銜接起來，而不是所謂的看上去炫，那只是動畫，不是動效。
墨跡天氣5.0的天氣信息設(shè)計
站酷：現(xiàn)在墨跡天氣功能越來越多，包括各種生活提示，如何處理大量的信息，讓用戶更快捷地找到自己想要的信息而又不讓頁面感覺擁擠，給設(shè)計師提出了很高的要求。你們是如何做的呢？
Tony：我們對現(xiàn)有功能的優(yōu)先級排列是基于測試數(shù)據(jù)的，需求低的功能點是能減就減的。
在我們的APP上，首屏上呈現(xiàn)的是高度歸納后的天氣信息；下滑后是二級信息多天預(yù)報；最底部的位置是指數(shù)方面的延伸，穿衣指數(shù)，生活指數(shù)等等。指數(shù) 位置做天氣延展性內(nèi)容服務(wù)，可拓展性也很高。比如進入穿衣指數(shù)，我們將有共鳴的情感化描述和提示放在顯眼的位置，背景也會根據(jù)天氣呈現(xiàn)不同顏色，帶給用戶 最直觀的天氣感受。穿衣指數(shù)頁面下方，就有穿衣指南，這里對部分用戶而言優(yōu)先級不是很高，信息呈現(xiàn)上就會放在比較深的位置。另外，有新推出的探索性功能也 會從比較深的位置開始，通過數(shù)據(jù)再去了解有多少用戶專門去通過多步操作尋找這個功能。而在我們需要刪減功能時也不會直接砍掉，會先藏在較深的位置，然后根 據(jù)反饋靈活調(diào)整。
————————————————————————————————————————————————
設(shè)計師如何適應(yīng)變化和趨勢？
站酷：你是什么時候加入墨跡的，加入后你的工作發(fā)生了什么轉(zhuǎn)變，對你個人而言最大的收獲是什么？
相輝：我是14年來的墨跡，覺得30多歲了，別在大公司混了，創(chuàng)業(yè)一下，感覺和大公司真的非常不一樣。以前的工 作重心是設(shè)計，現(xiàn)在的重點是運營。大多數(shù)設(shè)計師會認(rèn)為運營是非常拼創(chuàng)意和腦力的工作，其實半年多下來發(fā)現(xiàn)，運營更多靠心細(xì)靠規(guī)則。就像外人不了解設(shè)計一 樣，以為設(shè)計是美術(shù)，但是設(shè)計師知道設(shè)計需要很棒的方法，嚴(yán)謹(jǐn)?shù)墓こ虒崿F(xiàn)，流程來保證做出好設(shè)計。運營也是一樣，需要各種各樣的方法來了解每個細(xì)節(jié)來如何 保證產(chǎn)品的正常表達(dá)，包括運營階段性的目標(biāo)是什么，如何和產(chǎn)品契合，從而反向推動產(chǎn)品做運營需求的改進，這些都有點像設(shè)計。
個人最大的成長還是學(xué)習(xí)的能力。就像我永遠(yuǎn)跟別人說四個詞：多思，勤奮，韌性，專一。多思，多思考，在同樣的環(huán)境和要求下，怎么能跟別人做得不一 樣。勤奮不多說了，就是勤能補拙。韌性，就是你一定會失敗而且失敗很多次，因為你要不停涉足全新的領(lǐng)域，但你也會學(xué)到很多東西，這就是創(chuàng)業(yè)牛逼的地方。這 過程中一定是痛苦的，在這痛苦中你能不能堅持下來，能不能很有韌性地一次次站起來，把它變成常態(tài)，融入血液里這是非常難的。最后，專一，就是做事情要執(zhí) 著，你可做的事情非常多，創(chuàng)業(yè)公司更是這樣，可能十個事都能做，但是哪一個是投入產(chǎn)出比最高的，哪一個最能有投資回報？這需要你選擇。
墨跡天氣室內(nèi)陳設(shè)
站酷：概括一下，這是一個怎樣的團隊呢？
相輝：你晚上十一二點多來這里，基本上一半的人都還在，我們并沒有要求加班，但是大家愿意在這里，氛圍特別好。 因為我們覺得做天氣這件事很酷，特別有價值，可以獲得很多成就感，學(xué)到很多東西，這個過程非常激動人心，這是真正吸引人的地方。我們相信設(shè)計師需要更寬松 的創(chuàng)業(yè)環(huán)境。這里不怕你有想法而是怕你沒有想法，這里不只是做圖切圖，而是鼓勵設(shè)計師去做更多的嘗試，發(fā)揮個人價值。我們有太多的事情等著每個人去發(fā)掘。
站酷：在挑選成員時，你比較看重設(shè)計師哪些方面的能力？
相輝：潛力吧，看重一個人的發(fā)展能力，創(chuàng)業(yè)公司需要活力，需要這個人能適應(yīng)更多的崗位，不僅要做圖，還要做研究，做產(chǎn)品，做交互，當(dāng)然技法也很重要。墨跡加班很辛苦。但是為了夢想干活還是很爽的，所以越來越多人從大公司出來創(chuàng)業(yè)。
墨跡天氣室內(nèi)陳設(shè)
站酷：在看到一個新的手機APP或者同類的天氣app，你會首先關(guān)注哪些方面？
相輝：我會關(guān)注使用場景。新推出的app，一定滿足現(xiàn)有人對場景的訴求。為什么會有不同新app出來，就是人們 的使用場景在變，技術(shù)環(huán)境在變。變化產(chǎn)生新需求，催生軟件不斷革新。就像我們以前用QQ，后來用微信，就因為用戶使用場景，使用習(xí)慣變化，因為技術(shù)發(fā)生了 革新。天氣軟件也一樣，我們現(xiàn)在的天氣預(yù)報方法都是很古老的天氣預(yù)報方法，那么在未來有沒有可能出現(xiàn)新的預(yù)報方法，比如比如說到分鐘的短時預(yù)報，這種 功能一定會帶來設(shè)計的變化。所以作為天氣軟件，我們會關(guān)注這些變化，設(shè)計更好的體驗來滿足用戶需求，我相信在變化中帶來的機會是最多的，最可怕的是環(huán)境一 成不變。
站酷：所以，設(shè)計師要把眼光放得更遠(yuǎn)一些？
相輝：預(yù)判永遠(yuǎn)是最重要的，但是有時候預(yù)判不一定特別準(zhǔn)，我們也會犯很多錯誤，更好的方法是根據(jù)數(shù)據(jù)去來試。數(shù) 據(jù)是不會騙人的，只要有基本的解讀數(shù)據(jù)的能力，通過很多維度就可以把方向試出來。在試之前，方向的選擇是經(jīng)驗的積累，但有時經(jīng)驗并不能完全可靠，所以需要 方法來幫助你找到正確的方向。真正好的設(shè)計師都是通過非常多的探索達(dá)成一個結(jié)果，并不斷修正這個結(jié)果。
墨跡天氣的5.0改版設(shè)計
站酷：產(chǎn)品的迭代設(shè)計中，最有挑戰(zhàn)性的是哪個部分？
相輝：天氣軟件使用這么長時間，用戶需求會有越來越多的變化，如何在變化中如何把握細(xì)節(jié)，讓用戶更喜歡你的產(chǎn) 品，這是具有挑戰(zhàn)的，因為它很難大變。那么多電商網(wǎng)站，界面都不會有大的交互差異，只有細(xì)節(jié)是不一樣的。京東，淘寶都有自己的規(guī)則，用戶可能不會有明顯的 感覺，但是不同的商業(yè)模式一定帶來不同的交互。天氣軟件也是一樣。我們做了這么多年之后，積累了非常多用戶行為的數(shù)據(jù)，包括用戶愿意在首屏看到什么信息。 這些重要的交互信息，要通過圖形設(shè)計和流程把它們詮釋出來，這是我們真正的挑戰(zhàn)。迭代要做的是潤物細(xì)無聲的改版，而不是全方面的革命。雖然設(shè)計師都喜歡革命，但其實真正的好產(chǎn)品是慢慢改進出來的。
站酷：您比較關(guān)注的圖形交互形式有哪些？怎么看待交互設(shè)計趨勢？
相輝：解決問題的UI是最重要的，其次才是帶有個性的設(shè)計，但是個性是浮于表面的。十幾年前UI對于設(shè)計的要 求,可能就是把線框圖做好，記得在雅虎的時候，產(chǎn)品經(jīng)理丟給我的頁面是完全靜態(tài)的，鼠標(biāo)點鏈接就可以來回走，設(shè)計師就是給頁面套上一層皮，保證css樣式 正確，保證每個交互符合規(guī)范。后來就不一樣了，到了手機端，場景越來越豐富，就要考慮不同的分辨率，手指的大小，點按的風(fēng)格，豐富信息的交互在手機上架 構(gòu)。未來就更不一樣了，你需要考慮多終端的適配，考慮軟硬件的結(jié)合，考慮更豐富的場景。因為現(xiàn)在的互聯(lián)網(wǎng)是線上和線下結(jié)合，你不僅需要了解線上的部分，比 如說你做軟件界面，你還需要了解業(yè)務(wù)，你要了解線下服務(wù)的每個流程，用戶是在怎樣的場景下使用的。
我覺得現(xiàn)在的圖形交互設(shè)計師 才真正地開始像設(shè)計師。因為設(shè)計開始融入用戶生活，真正影響用戶，這樣就對設(shè)計師提出了更高的要求。不光是圖形方面交互方面的要求，而是對于生活，對于怎 么做項目，怎么做營銷，一個事是如何從1到100做成的，你需要對這些東西有理解，你才可能選擇最準(zhǔn)確的設(shè)計達(dá)到這個目標(biāo)。
站酷：智能設(shè)備越來越火，墨跡也在去年推出了空氣果，關(guān)于智能硬件的設(shè)計，有哪些問題值得關(guān)注？
相輝：還是更多地關(guān)注和研究場景。移動互聯(lián)網(wǎng)和硬件深刻地影響人們的生活，所以設(shè)計師要研究用戶在什么時候使用產(chǎn)品，需求到底是什么？
伴隨全新技術(shù)一定有全新的場景出來，一定要找到硬件適應(yīng)的場景。功能不是我們憑空想出來的。比如手機控制窗簾看上去很酷，但實際上很少用戶會高頻地去用。智能硬件不是說把硬件連上手機就智能了。在復(fù)雜的環(huán)境里面，一個產(chǎn)品的設(shè)計需要大量的研究和數(shù)據(jù)判斷，不斷試錯才能找到好的方向。但是硬件試錯不如軟件那么簡單，需要設(shè)計師尋找研究方法。真正好的產(chǎn)品是一步步迭代出來的。
站酷：2015年墨跡天氣會有哪些新的嘗試？
相輝：第一，國際化，因為國內(nèi)用戶量已經(jīng)很大，所以接下來會進行更多國際化的嘗試。
第二，把天氣軟件做厚。十幾年前我們看下天氣就夠了，后來我要看看實景，看看外面是什么樣的，再往后，我需要了解霧霾，了解完霧霾之后，我還想跟人 溝通下霧霾怎么防范的。我們現(xiàn)在有這么多指數(shù)，看完指數(shù)后怎么能獲得更多信息來幫助我們的生活，這是我們對天氣軟件不同訴求的期待。這些期待我們未來一定 能滿足地更好。通過我們的設(shè)計和場景連接關(guān)心天氣的人和人，人和服務(wù)，這是我們的目標(biāo)。
墨跡天氣安卓國際版
站酷：墨跡天氣在站酷已經(jīng)舉辦了兩屆插件設(shè)計大賽，作為評委，你看重參賽作品的那些特質(zhì)？
相輝：我會關(guān)注設(shè)計師對產(chǎn)品的理解，對總體設(shè)計的把控能力。那么多復(fù)雜的界面在一起，我要看他設(shè)計復(fù)雜的產(chǎn)品的歸納能力，看他是否能表現(xiàn)主題的韻味。比如，做宇宙主題，他是不是了解宇宙的一些元素，做了相關(guān)研究工作。比如，做中國風(fēng)的主題，設(shè)計師是不是正確理解中國文化的元素，理解中國符號背后的故事，作做出的設(shè)計一定是不同的。就像我們畫畫，理解肌肉和骨骼才能畫得像，幾個線條就能把人畫得很好，不理解的話，就很容易畫肉畫糊。所以，理性上，看設(shè)計師的歸納能力和整體架構(gòu)能力；感性上，看是否做了足夠多的文化研究和設(shè)計背景的調(diào)查。再有就是技法上是否能把這些完美表達(dá)出來。
站酷：墨跡天氣設(shè)計團隊對于站酷網(wǎng)是怎么看的？
相輝：站酷太棒了。尤其這兩年做得越來越好，做到設(shè)計師的聚合，在行業(yè)里的影響力越來越強，這是我們特別愿意看 到的。正因為有你們，包括早期的ChinaUI再到站酷，讓設(shè)計師有地方可以交流，取暖，有地方可以開開眼界，看看同行們用了哪些方法，在做什么事情。另 外，在你們那吼一嗓子也能招到很多人。
很感動你們在行業(yè)里的貢獻，提供交流的平臺，這個很重要。從以前天天被虐，到設(shè)計師地位越來越高，逐漸也成為一個公司必不可少的一部分，我能感覺到變化。
藍(lán)藍(lán)設(shè)計的小編 http://www.wnxcall.com