如何在產品迭代中尋求美學,體驗創(chuàng)新?
如何在產品迭代中尋求突破?是該保持穩(wěn)扎穩(wěn)打,還是挑戰(zhàn)風險?變與不變如何取舍?怎樣才能掃除阻礙創(chuàng)新的三毒?
產品從無到有難,從初級階段到中級階段更難,那么從中級到高級提升更是難上加難,今天我們就聊一下產品迭代中怎么樣尋求突破,以蘇寧即時通訊應用——豆芽移動端作為案例,闡述一下本次改版心得。
企業(yè)即時通訊,是以企業(yè)內部辦公為主,建立員工交流平臺,減少運營成本,促進企業(yè)辦公效率, 整合相關應用。相對于個人即時通訊工具而言,更加強調安全性、實用性、穩(wěn)定性和擴展性。其特點就是移動辦公和企業(yè)社交。從產品的角度來講,把兩者有序無縫的融合在一起是一個更大的挑戰(zhàn)。
改變心態(tài),打散重組
產品上的視覺改版,首先少不了競品分析,如何去選擇競品,是有原則的,有考究的。正如易經里所講的“取法乎上,僅得其中;取法乎中,僅得其下”,詮釋的很到位了。要分析就要分析行業(yè)內第一、第二的產品,盡量不要拿排名3以下的,參考價值較低,學到最好,充其量也是第四,無法樹立行業(yè)標桿,何談引領、超越?所以我們僅分析釘釘、微信兩款應用。
▲競品分析圖
以消息列表舉例分析,釘釘界面布局平衡,色彩明快,飽和度高,列表文字層次感強。經過深入研究,發(fā)現列表文字傾向色同樣是藍色,通過Alpha的不同實現統(tǒng)一。細節(jié)處理上更是巧妙得當,如右側的置頂小三角。微信對比度強烈,屬于高長調,方形頭像,整齊劃一。豆芽色調屬于中性,配色上明度差別較小,飽和度較低,其中列表文字傾向色為紅色、黃色,色相混亂不一致。Icon纖細,缺少體積感,信息列表缺少層次感,置頂過于突兀,細節(jié)上還有很多地方值得我們去思考。
會當凌絕頂,一覽眾山小。站在至高點,放眼回顧豆芽的歷史版本,發(fā)現一層一層不斷的增加新的功能,功能之強大,大而全,全而雜,假如制作一幅類似城市的鳥瞰圖會是什么樣子呢?更像生活區(qū)、商業(yè)區(qū)和工業(yè)區(qū)混在了一起,相信每個人都不想看到居住的小區(qū)里出現化工廠,冒著濃濃的黑煙。所以我們下一步的目標,就是找到產品的主線、核心競爭模塊,圍繞這個進行設計部署。
這就引出了極簡美學,給設計做減法,給心靈做加法。藝術領域有這么一個故事,一個普通的茶壺,怎么樣變的更加精美別致?藝術家是這么處理的,先打破,往地上一摔,幾乎全是碎片,而他有取舍的把碎片重新粘合在一起,結果成了一件價值不菲的工藝品。另外斷臂維納斯也充分印證了這一點。在大數據大時代下,產品設計同樣適合這個法則——打散重組。
破而后立,突破原形束縛,才有更多可能性,更多火花碰撞出來。
豆芽圖標就此法則進行了新的嘗試,因為對于移動端界面,圖標尤為重要,大部分為功能型圖標,至于選擇線性圖標,還是面性圖標、線面結合圖標、扁平圖標,似乎都缺少一點生機。用戶對于老版本產生了視覺疲勞,同時又需要保留部分視覺記憶,從而增強圖標識別度,所以這里對圖標做了抽象化的缺口處理,即斷點非閉合式圖標,用最少的墨色表達最豐富的內容,給用戶一個充分的想象空間,自動彌補缺失圖形。
▲豆芽底部圖標
權衡利弊,圍繞核心
在這個階段,我們會受到業(yè)務、產品、前端、開發(fā)等因素的困擾,有一點始終不能忘記,就是用戶需求,董事長新春團拜會強調,蘇寧要以用戶需求為核心,產品和服務為手段。所以我們要走到前線,進行有效的用戶訪談,了解用戶真實需求。
這里就不做詳細的說明,因為涉及的內容較多,以后會單獨闡述。提醒一下,不要把一些用戶數據、用戶感受直接作為產品方案,還是需要結合我們專業(yè)的知識經驗提煉出合理的解決方案。
豆芽移動端5.0,內容分為四大模塊:消息、通訊錄、工作臺、我。核心當然還是消息列表、聊天界面、工作臺為主,視覺設計改版有如下幾個方面。
▲消息列表、聊天界面、工作臺
空間
選擇iPhone6、7、8的尺寸還是iPhoneX的尺寸提視覺方案?我的選擇是iPhoneX,當然不是追時髦,也不是空穴來風,畫布的尺寸決定了產品的謀篇布局,像書法作品一樣,款式主要有中堂、條幅、對聯、扇面等等,不同形式下寫多少字,怎么落款、鈐印,書法家是心中有數的。
根據手機屏幕尺寸不斷變大的趨勢來看,內部空間果斷的留白,消息列表行距寬度增加,留白可以使頁面的層次感得到極大的增強,核心元素更聚焦,有韻味,呼吸感更順暢,留白的表現形式要根據品牌屬性來抉擇。
色彩
產品從開始的定位和風格,一般很少去修改品牌色,也是運營產品的大忌。而豆芽原本的草綠色略顯稚嫩,所以從初級方案的純凈藍色到現在的年輕化偏墨綠色,經歷了無數版本的磨合,不同的配色方案,考慮到不同年齡段,不同層次的用戶,不同喜好的用戶,以及戰(zhàn)略層的考量。
墨綠是非常高雅的顏色,雅的明朗、雅得有生命力。但是經過反復的嘗試,求證,跟色卡的比對,跟產品的融合,并不是很符合豆芽即時通訊的調性。把墨綠的飽和度逐漸降低,80%、60%、40%、20%,不能再低了,40%已經開始粉了,發(fā)現60%的墨綠明度上更合適,不過飽和度降低之后,光澤度也隨之降低了,此時,要增添紅色成分,繼續(xù)調和,最終確定了我們的豆芽主色調,即孔雀綠,也許更貼切。
▲色卡
字體
統(tǒng)一采用各端系統(tǒng)默認字體,不過大小間距,更是松弛有度,疏密要得當,最主要的是信息傳達要精準、清晰,層次感強。
圖片
工作臺的廣告位圖片傾向于16:9的比例,或者橫向更長一些,因為手機端空間有限,而且從美學角度上更美觀舒適,視野更開闊。消息列表頭像仍然保持原來的圓形,略有放大;工作臺應用程序圖標采用圓角方形,規(guī)范整體。方圓結合,不至于視覺上單調。頭像盡量還原真實感受,但是提案時,頭像品質還需把控,不能因小失大。
▲門戶、國際版
放空自己,源頭活水
這里就提到一個心理學概念空杯心態(tài),產品迭代前要放好心態(tài),清空你的杯子,方能再行注滿。不是完全否定之前的產品,而是要掃除能夠阻礙你獲得創(chuàng)意的三毒,三毒就是經驗、習性、動機。
尊重經驗,讓經驗展示自己,讓我們更了解它,面對新的經驗不要急于分類貼上好的或者壞的標簽。經驗就像“烙印”,烙印長存,到后來就是自己的習性。改變習性,需要很大的勇氣和一個平靜的心。創(chuàng)意的根,就在于動機,要不停的問為什么?問的徹底,智慧才能不斷生起。
三毒來自《賴聲川的創(chuàng)意學》,值得大家去讀一下,會打通你的任督二脈,創(chuàng)意思如泉涌。創(chuàng)意大師賴聲川認為:“創(chuàng)意是可以‘練’的!”他相信,創(chuàng)意固然神秘,卻是有法可學、可管理的。提出了實用的“創(chuàng)意金字塔”。
當然把產品放空后,很自然的會想到去拉近和用戶之間的距離,處理好互動的關系,加入一些情感元素,增加產品的親和力,那么豆芽方案中也有體現,不僅在聊天對話框中顯示聊天時間,還會顯示聊天地點、天氣,甚至心情,比較適合蘇寧國際同仁之間的溝通。
比如豆芽工作臺提出的秒辦功能,秒會議室、秒申請、秒審批、微同視等,雖然這次沒能通過評審,但是我相信在記錄用戶習慣之后,未來是可以實現的,高效辦公需要跟智能接軌。
總結
只有不斷的汲取知識,才能源頭活水,輸出清澈的可行的創(chuàng)意。創(chuàng)新是一場思想和過程的博弈,僅靠金錢是無法獲得成功的。保證項目成功的最終決定因素是“人”,是卓越的設計頭腦。推薦一本世界頂級創(chuàng)意咨詢公司青蛙公司創(chuàng)始人哈特穆特·艾斯林格《一線之間》,也許會有不一樣的奇思妙想。
最后就蘇寧易購,我們來大膽暢想一下,未來是不是可以利用AR技術,融入景觀設計的元素,讓用戶購物同時獲得全新的現實體驗。改變人們的一種生活方式,提升生活品質。
作者:宋冬明,蘇寧員工平臺研發(fā)中心 視覺設計師
本文由@宋冬明 原創(chuàng)發(fā)布于人人都是產品經理,未經許可,禁止轉載
題圖來自@Unsplash, 基于CC0協(xié)議
謝謝小哥的爽文,受教了,尤其是最后面推薦的書籍,走心了
蘇寧UED官方公眾號:蘇寧易購用戶體驗(snygued)
蘇寧UED官方公眾號更名為:蘇寧設計