<address id="ttjl9"></address>

      <noframes id="ttjl9"><address id="ttjl9"><nobr id="ttjl9"></nobr></address>
      <form id="ttjl9"></form>
        <em id="ttjl9"><span id="ttjl9"></span></em>
        <address id="ttjl9"></address>

          <noframes id="ttjl9"><form id="ttjl9"></form>

          首頁

          美工和設計師真正的差別究竟在哪?

          資深UI設計者

          “做圖”的人大致會有兩種稱呼,一種叫做美工,一種叫做設計師。

          用著差不多的軟件,在外人甚至很多設計從業者看來工作內容差別不大崗位,有人被稱作設計師,有人卻天天只能自嘲自己是個美工。

          那么,都是做圖的,美工和設計師的差別究竟在哪兒?


          外人看來,美工是“技術工種”,而設計師屬于“創作工種”

          在電商,紙媒或是印刷領域里,上下游的工作內容相對固化和流程化,對設計而言可發揮的空間本身就不大。時間久了,美工可以用模塊化的方式在固定的時間里產出固定的設計工作。在印刷企業中,很多設計工作者除了需要排版還需要負責打樣甚至印刷器械的操控。所以設計在整個產品生產過程中的比重不大,自然就從“創作”變成了“工作”?!肮ぁ币簿驮⒁獬墒止せ蚴莿趧庸ぷ鞯囊馑?。

          為什么很多人會吐槽,朋友找自己可以“隨便”做個LOGO呢?因為在他們眼中,你的工作不是創作產生的,而是像其他非靈感類工作一樣,“生產”出來的。既然生產出來的,最后出來的又不是“實物”就不存在什么成本,那當然應該是免費的。

          知識結構單一,讓美工只關注設計好不好看,而不是合不合理

          自嘲美工的設計從業者,大多關注的是好看與不好看。

          “這個好,因為這個好看?!?

          “那個不好,因為它很丑?!?

          “為什么領導選了那個不好看的,而沒選我這個好看的…”

          在其眼中,評判設計優劣很重要的一條標準就是好看與不好看。與別人提出自己設計方案的時候,也用好看與否的方式讓別人做出選擇。但審美本身就沒有一條共識性的標準,所以很容易被領導挑戰你的設計,很容易被客戶“指點”你的作品。

          設計師在設計過程中追求的不僅僅是好看這一層面。通過設計,對目標和結果有什么影響、合理性、易用性和可延續性都是在“好看”之外設計師該去思考和要去凝結在作品中的工作。

          哪怕日常設計一個最基本按鈕的位置、圓角的弧度、顏色,都會在設計確認之前反復的自我詢問,這樣做有什么理由?為何圓角的弧度是4而不是8?寬度和高度為何是目前這個尺寸?哪一個更符合大產品體系下的設計原則?

          即便沒有一個是與非的標準,“這樣是否合理”都應該是設計師掛在嘴邊最長自檢的問題。

          設計師定義規則,美工去執行規則

          設計的初衷是解決問題。都是設計從業者,一類人在定義規則,一類人在執行規則。廣告有調性的定義,產品有規范的定義,設計師會時刻的思考和優化什么樣的定義,能夠提升效率、能通統一識別性、能協同合作、能保證最小概率的出現錯誤。


          在這樣的規則下,另一類人在執行規則,即便是一些banner的設計,他們只做著規則之內的工作,至于為何這樣規范,沒有思考過,也不知道為何要這樣。還有人會說,我做的banner沒有規則都是自己說的算啊~但在建立這個banner的尺寸之初就是規則本身呀。

          設計師的靈感來源與積累和總結,美工的靈感來源于素材

          有些人喜歡積累素材,認為這樣做可以為設計提升效率。很多人依靠素材來尋找設計方向,素材品質的好壞決定了他最后出品的好壞。沒了網絡,沒了素材庫也就沒了思路和靈感,更沒有什么創作可言。

          設計師在接到需求之初考慮的不是在哪查找素材,而是在思考這個需求需要解決什么樣的問題,這個設計如何執行才能滿足這個需求。有些設計師喜歡整理,而且整理是設計師剝離表層干擾的一個基本能力,通過撥開表象,發現問題的本質,再去尋找解決之道。

          很多設計從業者,尤其是新手,做設計都是憑著感覺,憑感覺做設計最大的問題是沒有一個有效之道來保證每次設計的品質。運氣好了,或是找到一個好素材,那么能做出80、90分的設計,運氣不好,那就不知如何下手。

          留心觀察下身邊的“大神”,看看他們在接到設計之后的思考路徑是怎樣。是忙著翻素材、找參考還是靜下來畫畫草圖,做做需求整理,這可能是美工和設計師遇到問題之后最大的行動差異。

          軟件思維,還是設計思維

          同是看到一件驚艷的作品,美工考慮的是:

          “臥槽,這么牛逼,這是用什么軟件做出來的?”

          設計師考慮的是:

          “臥槽,這么牛逼的想法作者是怎樣想到的”

          思考的初衷不同,行動的路徑也就不同。美工會覺得軟件至上,努力學好軟件之后就會成為大神。而設計師會盡可能多的去了解優秀作品背后的故事,去了解一切設計和設計之外的臨界知識。積累好足夠的“思維素材”再去運用到設計工作中去。

          我經常聽到一些年輕的設計師問我,你會哪些軟件,這是個好奇且好學的問題。但軟件真不是高階或是低階的區分壁壘。如果真是這樣,那么大師們都應該是設計軟件的熟練駕馭著。而恰恰相反,軟件用的666的大多都是培訓機構的培訓老師,可能連設計師都算不上。摒棄軟件思維吧,產生真正距離的一定是腦,不是手。

          看到這里,有人會覺得這篇文章寫的有些許的“激烈”,有些不是美工的問題,可能是年輕的問題,是新人必須經歷的問題??缭搅四贻p和初級,有些人的思維和眼界進階了,但有些人還停留在上面說到的部分層面里,新手可能從美工進階到設計,但美工卻不一定都是新手。

          有句話說的不是很好么:

          “我有十年工作經驗”

          “不,你只是用一年的經驗工作了十年而已?!?



           藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請加微信ban_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~

          希望得到建議咨詢、商務合作,也請與我們聯系。 



          作者:大寶頻道    來源:站酷





          分享此文一切功德,皆悉回向給文章原作者及眾讀者. 免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。 



          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
          UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司

          點贊功能背后的洞察與價值

          ui設計分享達人

          關于「點贊功能」的一些思考,之前一直存放在我的Blog里,第一次發布站酷,感謝

          最近美劇《風騷律師》第六季正式回歸,本來想等著全部更新完之后在一口氣看個痛快。但是豆瓣里一萬多名用戶給出了9.9分的評價,就讓我有點坐不住了,勢必要看看「律師」是如何超越「毒師」的,也彌補一下近期的劇荒

          當我打開Netflix之后,引起我注意的是「超愛這部!」這個功能,第一眼看到的時候有些疑惑,這個功能的意義是什么?與點贊功能的區別是什么?我點了之后會怎么樣?我一直理解Netflix的點贊功能和Youtube、Twitter和抖音類似,點擊之后會推薦給我更符合口味的內容或者有收藏的作用。但是對于Double the Thumbs的疑問是,除了喜歡與不喜歡之外,還可以給用戶帶來什么體驗?它是Like功能的進化體么?已經擁有18年歷史的點贊功能還有可優化的空間么?借此話題,來和大家聊聊點贊功能背后的洞察與價值 


          幼年時期的點贊


          早期的點贊把原本靜止的內容變成了社交的媒介,用戶間通過贊來簡單直接的交流。我喜歡,我就點贊,蘊含贊同、支持和鼓勵,此時的點贊更單純與純粹

          2004年,社交新聞聚合器Digg的創始人Kevin Rose發明了Digg功能,用戶從內容列表中查找自己感興趣的內容并將其“Digg”出來——本意「挖掘」,你可以理解為「頂」——以表達自己對這篇報道的認可。當一篇文章得到足夠的Digg之后,就會被提升到首頁上,讓更多的人看到 


          就像是一個朋友給你講了一個故事,你十分激動。這個故事是你從來沒有聽過的,你記住了它并將這個故事分享給了其他的朋友 

          2007 年,社交聚合網站FriendFeed 將“Like” 按鈕作為一項新功能發布并推廣,兩年后,隨著 FriendFeed 被 Facebook 收購,這項功能也整合到了 Facebook 里。隨后,各大社交產品紛紛效仿,同期的 Tumblr、Vimeo以及后來的 Instagram 都增加了這一功能。在國內,微信4.0版本推出的朋友圈,后來抖音的小紅心、知乎的大拇指或者老鐵雙擊666,不管什么樣式的圖標和表達方式,點贊即可滿足用戶的基本需求,又可以為產品實現商業價值,已經成為了社交產品的標配并且一直延用至今 


          點贊背后的洞察


          去點贊 


          先問各位幾個問題,你一天會給幾條抖音、朋友圈或者知乎的回答點贊?你一天又會收到幾個點贊?那你會記得一天跟多少人打過招呼么? 

          可能你會認為我很無聊,誰會每天統計點贊和打招呼的次數呢。可正是因為這些你根本不在意的數字,無意的一個舉動影響著生活。在電梯里碰到同事你要點頭示意,領導發了一條朋友圈你要點贊附和,朋友積贊領優惠券你要支持。你需要禮貌的簡單問候,或是處于功利維護人際關系,點贊無非是門檻最低,負擔最小的表達方式,是敷衍的象征。相比于轉發顯得太重,評論則需要輸出觀點,模糊不清的態度絕對不會承擔責任,還可以維持住一定的距離感 


          在社交媒體里,我們點贊做的只是觀察他們,表示認同,而不是向他們展示我們關心的事情,更別說用它加深友誼 「 Karen North - 數字社交媒體教授」

          在傳統的社交中,我們有點頭之交的關系,然而互聯網的出現讓我們生活和工作中又出現了一種新型的關系“點贊之交”,它已經成為了網絡社交的通用禮儀,雖然它無關緊要,含義不足以加深感情,但是想躲也躲不掉 


          被點贊


          作為一名內容輸出者來說我的體會更深,我的視頻怎么沒人看,為什么點贊還不到一百個,每十分就會拿起手機看十幾次,內心的掙扎與惶恐開始糾纏著我,是不是話術太枯燥,是不是燈光太暗了等等的問題反復的問自己。就比如當你精心拍了一張照片,編輯好一段文案準備點擊發布按鈕的那一刻你在擔心什么?你耗費幾個小時發出自我感覺良好的的一條朋友圈之后,點贊數只有稀稀拉拉的一兩個。原本的炫耀因為點贊數太少變成了日記本

          相反,點贊數成倍增加的時候,大腦就會開始分泌大量的多巴胺腎上腺素飆升,同時,你可能將在更多的社交平臺重復這一受捧的過程,以及無數次打開這條動態,進入一種高度的自我欣賞狀態。一個必要功能的出現,也意味著它承載著人們必要的需求。點贊滿足的就是人們「被關注被看見被認同」的底層需求 


          點贊的商業價值


          重要的指標 


          當產品經理們發現了用戶的底層需求之后,如何讓用戶不產生疏離感,積極參與并且促進用戶留存?點贊功能給了他們一個非常輕量級的機會,任何用戶只要點個贊,就可以在整個社區的內容量級評定上貢獻自己的影響力。另一方面,內容的生產者能夠從點贊中獲得更正面的反饋,進而更愿意進行分享實現轉化,這是平臺更愿意看到的

          Facebook 2009年在全球推廣點贊功能之后,用戶發貼的數量和質量都隨之提升,約 30% 的用戶每天都會多次點贊。另外,廣告商們馬上解鎖了「營銷密碼」,Facebook將數據售賣給廣告商,打破了傳統媒體市場的盈利模式,把用戶的「喜愛度」拿捏的死死的。就連美國國務院在 2011 年 – 2013 年,只為在 Facebook 上獲得更多的贊,就已經花費了 63 萬美金

          但凡事都有利弊,畢竟人性極端化是難以避免的。不知道各位有沒有經歷過可以在淘寶上給微博買粉買贊買評論的階段,看似大把的流量在手其實都是流量造假,早期微博上的電影大V都是靠著一手盜版資源和買粉賺的盆滿缽滿,如果活躍度較高,很容易成為天選之子,平臺還會親自送你粉絲,這種效果顯然與社交網絡設計之初,希望通過虛擬社區增進情感聯絡的初心是相悖的,另外,造假產業環環相扣侵蝕了平臺的利益,這就不是平臺愿意看到的了,所以改善社區環境是必然

          各個平臺也做過努力,例如微信朋友圈在點贊功能發布不久,就對公眾號集贊送禮品等誘導分享行為嚴厲打擊。2019年左右Facebook、Instagram包括Twitter在內的 Demetrication(去數量化)顧名思義,就是將點贊數量隱藏,讓用戶看不到有多少人給帖子點贊,強制用戶把注意力放在內容上。類似于教育改革落實“雙減”政策將百分制改為ABCD的等級制,考試結果不排名、不公布,全面關注學生綜合素質的培養。但是,有條新聞,一名老師大白天的拉著窗簾偷偷摸摸搞培訓被社區抓現形的新聞想必大家都看過,貪榮慕利,眾星捧月的潘多拉魔盒已經打開了,與用戶的底層需求博弈注定不是短期就可以完成的

          轉眼已經三年過去了,海外的社交平臺顯然沒有做到 Demetrication,技術手段根本完不成的任務。國內的社交平臺則是把壓力放在了創作者身上,利用起了用戶底層需求,你想讓作品在流量池里獲得更多的點贊、評論和轉發就要不斷優化內容質量,尋找自身問題,或者花錢買數據,抖音的抖加和小紅書的薯條都是社區平臺迭代后的現狀。既能避免黑產保護平臺利益,又能給創作者來帶可觀的數據何樂而不為呢 


          更好的評分制 


          說回 Netflix 的 Double the Thumbs,官方給到的解釋“這是一種讓會員們了解自身喜好,更精準的看到想看的電影和電視的另一種方式”

          其實就是通過更細微的分類比如導演、演員類型或者制作團隊等等給奈飛的用戶推薦相關的內容,只能說這很奈飛。從1997年開始賣碟片直到2006年轉戰流媒體,Netflix 的用戶增長和商業成功的關鍵就是把猜你喜歡做到極致,這也是手握全球兩億付費用戶的原因

          不難看出Netflix更依賴用戶,用戶對于平臺的反饋很重要。2017年Netflix拋棄了類似豆瓣一樣的五星評分制,原因在于用戶的打分并未遵從內心,評分較高的電視劇/電影會越來越火,不火的內容永遠不會被用戶看到,亂打分的現象頻繁出現,Netflix不希望用戶變成批判家,受到其他人影響,你只需要看你喜歡的內容就好。就比如說,周末你想跟女朋友去甜甜蜜蜜度過一個周末,舞臺劇「莎士比亞」和電影「小時代」你會選哪個?我想大部分人都會選「小時代」,因為它話題性強,電影結束后可以在餐桌上和女朋友一起吐吐槽。但是,如果讓你在平臺上給兩部劇評分,一定是「莎士比亞」高于「小時代」,問題就在于Netflix在乎的并不是評分,而是用戶會看哪部劇 


          顯示性偏好(Revealed preference)和是期望性偏好(Aspirational preference),這在日常生活中也很常見,比如一個決定中午吃輕食的人實際點了炸雞,一個計劃下午去圖書館備考的人實際仍躺在宿舍里刷劇,一個決定更溫和些的人在面臨類似的矛盾時仍選擇發脾氣 - 經濟學家保羅·薩默爾森(P.Samuelson) 

          另外,Netflix與YouTube、抖音和B站又有所不同,Netflix全部都是PGC內容,都是自己花錢買的,流媒體版權的成本越來越高,被淹沒掉的內容幾乎失去了競爭力,對于平臺的沖擊巨大

          Netflix不得不做出改變,只有不斷優化推薦算法,向用戶推薦更精準的內容才是王道,顯然點贊/點踩對于用戶來說更方便且選擇單一,是獲取數據最高效最精準的方法,在一項 Beta 測試中,Netflix 向全球數十萬新用戶推出了點贊/點踩手勢,發現評級參與度上升了 200% 


          Netflix產品副總裁Todd Yellin指出這種無法完全準確洞察用戶喜好的評級系統對Netflix當下原創內容的儲備沒有益處 

          如果各位很喜歡看美劇應該知道Netflix有非常多的自制劇,自制劇要比買別人的版權便宜的多,如果版權到期或者競品的乘勝追擊,也不會讓自己處于被動局面。只有自制劇、自制內容才是平臺的護城河,比如「紙牌屋」和「魷魚游戲」等等,這些優質的內容之所以能制作成功出現在大眾視野,全部都來自點贊功能獲取的用戶數據

          如今,Netflix在點贊/點踩的旁邊增加了Double the Thumbs,改為了三星評分制度,從官方給到的解釋“用戶可以通過它告訴 Netflix,自己對某種特定內容情有獨鐘,包括主演、制作團隊、角色類型、小眾劇集類型等等,Netflix 的推薦也就能夠更具體入微”,反之,Netflix可以通過更細微的分類來洞察用戶喜好,一方收獲了利益,一方收獲了效率

          關于B端導航的選擇

          ui設計分享達人

          對B端產品架構而言,一個合理的導航設計對能夠解決,對團隊內部:堆砌功能開發混亂;對外部用戶:找不到功能的問題,所以本篇主要總結一下如何正確選取合適的導航。


          從產品結構明確導航分類
          B端后臺的導航大類從產品架構層面來講可以分為:全局導航(頂部、側邊、混合)、局部導航(菜單欄、面包屑、選項卡、步驟條、文字鏈接)、輔助導航、內嵌導航、友好導航和遠程導航。


          全局導航
          表現為產品的一級導航,需要具有良好的穩定性和拓展性。
          提示:清晰穩定的路徑比起少點擊一次更重要!





          局部導航
          局部導航包括:菜單欄、面包屑、選項卡、步驟條、文字鏈接。
          特點:1、在同一個架構中,可以到這個節點的上下一級的通路;
          2、有嚴格的父子級關系,局部導航與全局導航有層級關系,局部導航幫助用戶進入更 加特定的頁面。
          通俗而言局部導航依附于全局導航,常作為二級導航出現。




          輔助導航
          提供用戶在全局/局部導航不可到達的相關內容的快捷途徑。






          內嵌導航
          也叫上下文導航,常用做對頁面中的操作項進行解釋;常見的有幫助引導鏈接等






          友好導航
          為用戶提供便利的前進途徑,常見于新手引導和幫助助手的場景,在不需要時可進行隱藏。





          遠程導航
          指并不包含在產品結構中的功能入口;常見于網站地圖、OA產品的工作臺等。






          如何進行合適的導航選擇

          1. 保證產品結構的穩定性

          B端產品通常情況下都是復雜的,對用戶來說具備一定的使用門檻和學習成本。所以導航首先要保證產品架構的穩定性,同時也要保證交互操作路徑符合用戶操作習慣。
          重點:不可為了追求少一次點擊而隨便進行更改!





          2. 便于后續擴展

          在進行導航選擇時需要考慮到后續產品的發展情況,在保證產品結構穩定性的前提下,為后續的功能擴展打好基礎。






          3. 操作清晰、易懂

          在多層級的導航中要保證每一層級導航的視覺反饋清晰、明確。




          4. 靈活適應

          導航的功能選項可以根據使用場景需求來進行靈活添加,可以為了提升效率,在不同的導航選項下出現相同的功能入口。





          5. 保持一致的交互規范

          相同類型的導航控件,交互樣式要保持一致;例如:飛書在面包屑的文字交互樣式和文字鏈接的交互樣式就做出了明顯的區分。





          6. 可不遵循層級關系

          根據導航的定義而言,導航就是對信息進行分類,引導用戶完成操作。
          我們可以根據用戶反饋和數據埋點可以將常用的操作功能進行前置,打破層級約束,實現對用戶的操作提效。




          根據場景,靈活使用導航


          1. 頂部導航

          頂部導航常用于官網類結構相對簡單的產品
          優點:節省空間、視覺干擾小,有沉浸式使用體驗;
          缺點:結構簡單,拓展性低。





          2. 側邊導航

          側邊導航常用于操作比較復雜,專注操作的后臺類產品;例如:SaaS產品等
          優點:操作效率高、拓展性強、更容易進行功能收納;





          3. 混合導航

          混合導航常用于操作很復雜,一級二級功能條目多的后臺產品;例如:云產品(二級導航功能超多)
          優點:比較綜合





          總結:


          1. 一級導航需要具備足夠的穩定性和拓展性

          ①、清晰、穩定的路徑比少點擊一次更重要
          ②、導航的排序盡量不要改變用戶的操作習慣


          2. 二、三級導航進行合理的分組收納

          利用分組控制導航的顆粒度。在二級導航只有一個時,無需設計分組


          3. 判斷功能是否應該作為全局導航

          ①、選擇相對高頻的分類,作為全局導航
          ②、低頻的分類,作為局部導航

          作者:戴戴戴戴戴虎全

          轉載請注明:站酷

          藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請加藍小助,微信號:ben_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系01063334945。


          分享此文一切功德,皆悉回向給文章原作者及眾讀者.
          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。


          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司

          2022交互設計趨勢觀察|PC端 上

          ui設計分享達人

          隨著移動互聯網的發展,原本PC互聯網連接商業支付、購買商品、瀏覽信息流等的能力已經轉移到移動端,而PC互聯網更加專注于其他領域的優勢:

          • 1、更大的屏幕能夠包含更多的信息,并獲得更深度的沉浸感受,如觀影、瀏覽網頁等。
          • 2、通過鼠標、鍵盤、觸控板、手繪板的連接,提供了更多的交互方式,能夠執行更加繁雜的工作任務,如表格編輯、程序開發、視頻制作、文檔書寫、圖像制圖、3D制圖等。
          • 3、得益于顯卡、CPU、存儲、USB插槽、顯示器等的擴展性,在大型游戲、大型3D渲染、復雜制圖上相較于手機端依然有一定優勢。
          • 4、從場景(辦公場景、娛樂場景)來看,PC端移動性較差,但同時基于該特點,PC端能夠更加專注當前任務。模塊化、多人協同、多端協同的發展正不斷地提升用戶的使用體驗。

          下面是我觀察到的目前比較主流的交互設計點,與大家分享。分別是:

          • 一、無縫體驗
          • 二、交互更加高效
          • 三、更加智能化、降低門檻、降低門檻、降低門檻
          • 四、更加模塊化
          • 五、更加簡潔、甄別關鍵任務
          • 六、3D動效、大圖、帶來更深的沉浸感
          • 七、協同合作的興起

          一、無縫體驗

          典型的案例就是蘋果的Mac系統與Ios系統越發趨同,都采用了卡片化、模塊化,整個交互規范、視覺感受都一致以達到多端統一。同時信息可以自由流轉:比如在同一Apple賬號下,Mac與IOS中復制的信息可以進行同步粘貼。備忘錄、日歷、提醒事項、錄音中的信息進行流轉,在任何一臺Mac上登錄Apple賬號后都可以進行同步。

          在國內,B站的網頁端與App端的體驗也逐步趨同,框架設計上更加卡片化與扁平化。信息流轉上,手機上暫停的視頻到網頁端繼續播放,實現了無縫切換。

          淘寶首頁:從過去復雜的信息流導航變為現在更加簡潔的個性推薦卡片。整體體驗與淘寶手機端一致。


           二、交互更加高效

          總結:精簡無關信息,關注最重要的核心任務,減少用戶跳出,沉浸式心流設計。

          1、登錄方式更加高效

          許多網頁接入騰訊、阿里的生態,支持掃碼關注公眾號/手機驗證碼即可完成注冊。省去了用戶編輯個人信息、輸入郵箱、輸入密碼等復雜的交互流程。

          2、減少頁面跳轉

          心流式體驗設計是這幾年很熱門的詞,指的是通過優化用戶體驗讓用戶能夠沉浸式地高效完成目標任務。這需要做到產品的交互習慣滿足用戶使用習慣,并且交互流程滿足用戶預期。過于頻繁的彈窗打擾和頁面跳轉的等待時間都會影響用戶進入心流。

          比如,例如飛書審批,審批詳情不需要跳轉,點擊卡片即左側彈出詳情頁彈窗;讓用戶可以在同一個頁面即可瀏覽信息,不需要進行跳轉到新的頁面進行查看,方便用戶完成批量的審批任務。

          再比如:阿里云,開通服務的時候不需要跳轉,而是在側邊彈出訂單彈窗,方便用戶操作。

          3、交互組件的易用性迭代,不再局限于大彈窗

          上面說到,頻繁的彈窗提醒也會影響用戶進入心流,用戶在對表單、畫布中的內容進行刪除的時候,如果使用全屏二次提醒彈窗,會感到創作過程被打斷。

          釘釘宜搭:卡片畫布類產品,刪除操作時,不局限于大彈窗,而是用靠近按鈕的小彈窗,使鼠標的滑動路徑更短,操作更加簡便;并且在不過多打擾用戶的前提下,完成了目標操作。

          三、更加智能化,降低門檻、降低門檻、降低門檻

          復雜性守恒定律由Larry Tesler于1986年提出,也稱泰斯勒定律。指的是“任何系統都存在其固有的復雜性,且無法被減少,只能設法調整、平衡。我們要考慮的是,怎么樣更好地處理它,讓用戶簡單、高效地使用它”。

          很多的中后臺系統中很多表單會存在大量的配置項,這些配置項是否可以簡化,讓平臺變得更簡單智能?大部分時候答案都是否定的,過度追求簡化往往容易弄巧成拙。功能邏輯易于解釋與理解才是更好的方案,當你試圖簡化降低復雜度,可能在其他地方埋了雷。

          其中一個解決方案是將復雜度轉交給系統,蘋果公司的黑盒理論與此互通;就是用戶不需要了解系統或功能背后的實現邏輯,只需要關注呈現在用戶眼前的交互界面即可。如今數據智能化處理正不斷發展,我們也看到了智能化在PC端領域的應用。

          1、剪映

          剪映相比于老牌視頻編輯軟件更加簡單,提供各種在線特效模板,來降低任務復雜度。相比傳統的PR、AE軟件需要本地存儲預設文件,或者手動編輯簡單了很多。用戶不需要知道背后的實現的技術原理,也不需要掌握過多的特效制作、調色技巧即可完成視頻的剪輯、調色工作。

          2、釘釘宜搭畫布

          推薦組件功能:用戶在進行流程搭建時,不需要從左側組件區拖拽組件,而是點擊連接線中間來添加組件。如果可以其實還可以更進一步,就是根據后臺數據分析創建目標流程需要的組件,向用戶主動推薦相關組件,以此來降低用戶的創建門檻。

          四、更加模塊化

          隨著傳統業務向互聯網轉型越發普遍,線下業務流程轉到線上的需求場景越來越多,一個單一的系統不能完全滿足所有的業務場景需求,由此需要一個更加靈活模塊化的系統來針對不同的應用場景來應用不同的產品架構。而該系統中的功能框架、交互組件又可以重復利用,于是更加靈活、模塊化、可自定義配置的系統后臺越發受到歡迎。

          1、飛書、釘釘易搭

          飛書、釘釘易搭內的審批流程、會議系統、工單系統都可以通過模塊化的組件進行高效搭建,不需要代碼即可像搭積木一樣實現用戶的自定義需求。

          2、天貓優品

          阿里的天貓優品電器店線下門店設計平臺,整理了線下門店所需的16個模塊(前臺、小家電中島、洗衣機、櫥窗、空調、吧臺等),通過線上三維化場景直接進行可視化設計,所見即所得,并且能夠模擬現場燈光效果,根據門店現場規格,直接在三維空間里修改,快速導出效果圖;非常高效地完成了其他門店的需求化定制。

          五、更加簡潔,甄別關鍵任務,路徑縮得更短

          1、抖音、快手網頁端

          抖音網頁端的用戶體驗沿襲了手機App端的風格,用戶進入網頁的核心目的就是看短視頻打發時間,于是進入首頁即可看短視頻,不需要用戶手動選擇分類,并且手機端的用戶偏好通過用戶的賬號同步至網頁端,有了很順暢的用戶體驗。

          相比快手網頁版,快手延續了常規視頻網站的交互方式,將視頻內容分為短視頻、直播、同城、長視頻、小劇場等多個類別,由用戶自主去選擇觀看的內容,內容雖然更加多元,但確實路徑過長,不夠直接。

          2、淘寶、京東首頁

          再舉個例子,新版的淘寶網頁端不再像個門戶網站導航,而是通過數據分析用戶喜好來主動推薦代替用戶自己選擇。用戶來淘寶網頁端,其實并不是買東西,大眾用戶已經習慣了在手機上進行支付,到了網頁端反而會不適應。用戶來到淘寶網頁端的更多目的就是逛,看有沒有自己想要的東西,遇到喜歡的,就點進去看了。于是新版淘寶通過個性化推薦把過去復雜的活動運營頁板塊、特價板塊、品類板塊替換掉了,讓用戶在網頁端獲得更好的“逛街”體驗。

          而京東,在首頁做了復雜的流量分發設計,通過不同的頻道、不同的板塊將用戶引流至相關的專題頁面,再進行商品瀏覽。本質上來說,用戶來到淘寶、來到京東的目的都是因為閑,而淘寶的通過數據智能,大數據精準推薦用戶喜歡的商品,簡化了用戶的使用路徑,并且使整體頁面更加簡潔。

          六、微動效、大圖、3D元素帶來更加深的視覺刺激

          網頁的官網、首頁承擔著產品介紹、流量分發、增強品牌印象等的職責。我觀察到越來越多產品官網都開始采用3D元素、視頻背景、大圖元素、微動效來讓頁面呈現更加具有質感和動感。

          1、3D元素

          它是由Web3D技術的發展而興起,能夠給網頁Banner帶來更強的視覺吸引力,同時也強化了公司融合了AI技術的品牌印象。如法大大官網、騰訊云、阿里云的首頁Banner展示。法大大首頁Banner,鼠標滾輪向下滾動3D元素會相應產生變動,文案與元素一靜一動,對比明顯,也更易于用戶注意到文案信息。

          2、大圖、視頻

          大疆官網首屏采用了全畫幅大圖的形式展示熱門產品,下方的產品推薦頁自動播放宣傳視頻,提升了頁面的視覺沖擊力,展示了其科技屬性。

          七、協同合作興起

          疫情時期,線上辦公的需求和頻率激增,線上協作興起,許多辦公軟件都有了多人場景編輯功能。特別是對于復雜的項目,需要團隊成員共同完成,協同合作的功能越來越受歡迎。

          比如我們熟悉的figma,逐漸取代了傳統UI設計軟件ps、sketch等的頭部地位,其中的項目協同功能更是廣受歡迎。只需要發送項目鏈接邀請成員即可進行項目協作,還支持多人標注、語音溝通,大大提升了工作效率。

          許多辦公軟件也都上線了類似的功能,比如幕布可以通過設置權限、發送鏈接或二維碼來邀請協作者共同編輯文檔,為產品的使用場景提供了更多可能。

          總結

          曾鳴在《未來商業20講》里說:“未來的互聯網世界的兩大趨勢是數據智能、網絡效應”。 

          這在PC端也得到了印證。淘寶網首頁、抖音首頁、嗶哩嗶哩網頁端將PC端與APP端的數據進行互通,并對用戶行為偏好數據進行分析,為用戶提供更加精準的信息流的同時,還使得頁面的交互更加簡單,視覺效果更加簡潔,過去依賴用戶自主選擇進行流量分發的形式將會越來越弱勢。

          在工具類產品中,利用數據智能化可以將用戶操作上的復雜度轉移給系統,從而降低用戶使用門檻,提升用戶體驗。與此同時,工具類平臺也越發靈活化化,通過模塊化設計來自定義搭建不同用戶的使用需求的產品,還能節省資源建設成本。

          網絡效應的部分應用體現在用戶在使用工具類產品中,不再是孤單的個體,而是能通過線上協同,讓用戶與用戶之間能夠產生共同協作,共同交流,更加方便地完成任務。

          作者:為美好而設計

          轉載請注明:站酷

          藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請加藍小助,微信號:ben_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系01063334945。


          分享此文一切功德,皆悉回向給文章原作者及眾讀者.
          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。


          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司

          如何將信息高效傳達給中老年用戶?

          ui設計分享達人

          NO0 需求背景

          會員權益上線后,為了讓更多用戶享受到更優質的糖豆使用體驗,對于會員價格推出了一系列優惠活動。下面將簡單介紹一下,在視覺表現層面,我們是怎樣將活動的主要信息傳達給用戶。

          NO1 顯示區域

          首先,活動的主要信息的顯示區域,是根據最小機型的屏幕尺寸制定范圍,原因如下:

          糖豆大部分用戶的使用設備多為老舊的千元機,屏幕小、性能低是主要特點。為避免跨屏瀏覽,減少老年人的注意力分散,將主要信息一屏展示,信息精簡的同事,防止信息過載。

          同時一部分用戶習慣不往下滑動頁面,使得信息展示的不完全。在這種情況下,適當減少縮短頭部修飾及氛圍元素的顯示面積,讓活動的信息及功能在不做任何操作的情況下,能夠清晰展示。

          NO3 簡化彈窗展示信息

          一開始彈窗的制作想法,是將信息視覺化,將加贈的部分獨立展示出來,突出了此次活動的優惠價值。但這樣的表現形式使得各個元素分散,從上至下的閱讀軌跡在中間被斬斷成從左至右,閱讀成本劇增的同時,老年人也讀不太懂。

          最終的解決方案為一句話表示,通俗易懂,讓用戶一眼明白,在什么時間,什么內容,要做什么。

          NO4 直接再直接點

          糖豆App與大屏端的圖標視覺上差異不大,作為輔助圖形,意義感知不強,用戶無法從頭圖部分得知這是個關于什么主題的活動。且4.1折只是個概念,具體優惠金額多少沒有直接體現,無法吸引用戶的了解購買。

          什么是超級會員?用具體的電視與手機展示的同時,標題“手機電視都能看”進一步作出了解答,我們用最直白的方式解釋了什么是超級會員。

          NO5 價格

          用戶對價格非常敏感,尤其是中老年用戶,如何體現價格的優惠力度是我們需要解決的問題。

          中國人的閱讀習慣一般是從左到右從上至下,于是將價格內容放到左上并且放大,突出第一層級的信息;優惠金額放到價格下方,這是第二層級;右邊放上價格的組成及原始價格的輔助信息,整體簡潔硬朗,清晰明確。

          NO6 頁面布局

          隨著年齡的增長,伴隨生理變化看不到的大腦老化,中老年人的注意力和記憶力會呈大幅度的下降。我們既要保證新鮮感的同時,又要注意用戶的學習成本。

          在玩法相同的情況下,只更改了視覺元素,活動信息/功能的位置保持不變。

          作者:ANOTHERZOUZOU

          轉載請注明:站酷

          藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請加藍小助,微信號:ben_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系01063334945。


          分享此文一切功德,皆悉回向給文章原作者及眾讀者.
          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。


          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司


          視頻沉浸式體驗設計

          ui設計分享達人

          ///

          前言

          沉浸式體驗是讓人專注在當前的目標,全身心投入并感到愉悅和滿足,從而忽略時間的流逝。應用到界面上則是更強調聚焦內容,減少不必要的打擾。本次研究與實踐針對視頻場景中視頻所呈現的畫面,通過精細化的設計,在多樣化的手機屏幕中呈現時,能夠帶給用戶更為沉浸的視頻觀看體驗。


          ///

          百度APP是如何進行視頻沉浸式設計的?

          視頻播放器中視頻畫面當然是最主要的內容,以此作為突破點進行思考:

          · 最大化畫面視野:通過改變視頻畫面本身的大小,減少頁面“留白”,讓用戶更聚焦視頻畫面,觀看視頻時更專注。

          · 最佳視線觀看位置:將不同高度的視頻按照頁面結構去布局視頻畫面,通過畫面避讓狀態欄、頂底bar結構的方式,使畫面更加整潔,減少 
          元素混亂帶來的干擾,同時整體位置偏上展示,視線落點更加舒適。

          · 觀看體驗連續性:視頻瀏覽過程中,非必要不打斷視頻瀏覽,在進行如查看評論、臨時退出播放器等行為時,保證視頻播放的連貫性,方 
          便用戶多操作。



          一、最大化視頻畫面視野

          01.視頻畫面裁剪

          隨著時代的發展,為提升消費者對手機的操作體驗,智能手機逐漸多元化,手機屏幕尺寸迭代更快、更加豐富多樣。手機作為視頻很重要的生產端,手機屏幕尺寸的多樣化影響到產出視頻尺寸的多樣化,同時用戶可通過視頻編輯工具任意編輯視頻尺寸,最終生產的視頻尺寸比例自由度非常高。據不完全統計視頻平臺中視頻尺寸達22萬多種,用戶使用機型近300種,在視頻尺寸多樣性及視頻展現媒介多樣性的現狀下需要兼容性更強的裁剪及展現規則才能帶給用戶更好的觀看體驗。

          我們要做的就是將不可控的視頻資源和不可控的瀏覽視頻設備設計為可控的視覺展示效果,并最大化視頻畫面。減少環境干擾,給用戶帶來沉浸式感官體驗。

          視頻寬撐滿手機屏寬后,將視頻尺寸分為四類:


          1) 視頻高度>手機屏高

          視頻畫面寬度撐滿屏幕后,視頻整體居中于屏幕,居中裁剪視頻多余畫面。

          注:不允許畫面高度撐滿屏幕,寬度自適應導致畫面左右留黑效果。

          2) 視頻高度=手機屏高

          視頻居中于屏幕,剛好填滿屏幕,不需要裁剪處理。


          3) 1:1<視頻高度<手機屏高

          此類尺寸較復雜、難處理,于是將限制裁剪面積和展示位置相結合,保證裁剪面積和位置可控。結合視頻平臺資源尺寸和業務目標來確認理想展示效果,反推定義最大裁剪面積,根據顯示位置多次判斷視頻放大后是否符合既定裁剪面積,最終確定當前視頻的顯示方式。同時支持根據不同視頻業務進行個性化定制,并且將裁剪面積云控處理,根據業務內不同時期的訴求限制比例來靈活調整展示效果,雙端也可分端定義數值;橫向協同及迭代成本極低,便于快速上線驗證效果。


          4) 橫版視頻(高寬比≤1:1)

          橫版視頻在手機屏幕中面積占比較小,畫面可識別度和飽滿度稍有欠缺,輕微擴大畫面視野,畫面瀏覽更加清晰有沖擊力。以不影響內容理解為前提,根據自身平臺視頻尺寸占比及視頻內容特點規定固定比例或比例范圍適度放大。 


          錦上添花,引入文字內容識別

          為避免因裁剪規則而裁剪到視頻關鍵文字對視頻內容獲取有障礙的問題,發揮百度強大的AI技術優勢,引入文字識別技術及視覺展現規則,進一步提升視頻展現樣式的可控性,同時能夠通過盡量少損失畫面達到畫面放大的效果,平衡畫面沉浸感和完整性的關系。

          左右文字被裁剪情況:文字左右設置安全距離,保證安全距離在屏幕內。如果安全區超出屏幕,則按照上方描述的裁剪規則進行退檔顯示(滿屏至不裁剪之間的檔位),直至文字不被裁剪。極端情況退檔至最后一檔,視頻畫面不裁剪。


          橫版資源文字左右被裁剪情況:按照固定尺寸退檔


          上下文字被裁剪情況:文字上下設置安全距離,保證安全距離在屏幕內。如果安全區超出屏幕,則按照上方裁剪規則進行滿屏至不裁剪之間的檔位進行退檔顯示,此情況只會從全屏一檔顯示退至二檔顯示。

          裁剪面積、展示比例、文字安全距離等數據都通過云控的方式下發,靈活配置到不同業務中,保證裁剪規則一致的同時又能針對不同業務進行定制展現,也可快速調整并支持上線實驗,來驗證適合自己產品的展示效果。

          02.智能滿屏

          通過裁剪方式放大畫面視野之外,還通過讓用戶自主交互操作再次放大畫面視野,調整到自己喜歡的觀看視頻的方式。相較于上方默認裁剪放大,滿屏方式更加激進極致,畫面放大更多。開啟方式通過面板功能按鈕開啟智能滿屏外,增加便捷交互開啟手勢,用戶可雙指放大快速開啟。

          由于滿屏是用戶主動操作放大行為,可以接受文字內容被裁剪,但也需要有節制的放大,避免帶來畫面裁剪過多視覺體驗不佳的問題。為了保證95%以上資源撐滿全屏,達到放大畫面視野極致體驗。同時最大畫面裁剪面積不超過一定比例(根據自身業務視頻資源判斷),將視頻資源細分為3類進行不同效果處理:

          1.可繼續放大至滿屏的視頻,則進行滿屏展現。

          2.不可繼續放大的視頻,如果繼續放大會導致裁剪畫面過多影響觀看完整度與觀看體驗,則保持上方提到的裁剪規則,不做另外處理。

          3.橫版視頻統一放大至固定尺寸,可根據自身業務資源進行放大尺寸的定義。


          二、最佳視線觀看位置

          通過布局合理、舒適的畫面位置,也能提升瀏覽過程中用戶體驗的沉浸感。人的視覺中心一般會在物理中心的偏上方,于是在設計中我們將視頻畫面放在屏幕偏上的位置,用戶視線落點更加舒適,一般是用戶在瀏覽頁面時最先注意到的地方。同時視頻在頁面偏上的位置,能減少下方標題等信息過多對視頻畫面的遮擋。

          為了精細化處理不同比例的視頻資源,豎版視頻和橫版視頻根據頁面效果分別定義了最佳觀看展示位置。

          豎版視頻:高于1:1的視頻,按照頁面結構布局視頻畫面,避讓狀態欄、頂底bar操作,避免與頁面結構沖突帶來畫面凌亂不美觀的問題,同時能減少畫面參差帶來的干擾,增加沉浸瀏覽感受。


          橫版視頻:等于矮于1:1的視頻,畫面按照屏幕高度比例展示在偏上的區域,高度比例可云控便于靈活調整。


          三、觀看體驗連續性

          01.視窗擠壓

          為了滿足用戶在視頻場景多角度信息獲取,在不打斷用戶視頻瀏覽的基礎上建設視窗擠壓交互體驗,提升觀看視頻的相對沉浸感。在視頻場景觀看評論時會彈起半屏面板,遮擋住視頻內容,導致用戶無法在瀏覽評論的同時觀看視頻內容。對短視頻重度用戶來說,對同時看評論和看視頻習慣的用戶有挑戰。通過視窗上移動擠壓功能,在瀏覽面板內容時不對視頻內容打斷,弱化面板內容給用戶帶來的影響。

          視窗高度固定,畫面寬高比越小畫面內容越小,觀看體驗不友好,所以豎版視頻對壓縮后的顯示尺寸進行干預,定義最小視頻畫面展示比例,盡量擴大畫面視野,保證觀看視頻的舒適度。


          02.懸浮小窗

          在不打斷用戶視頻瀏覽的基礎上還建設了懸浮小窗交互體驗,旨在為用戶提供完善優質的視頻消費體驗。用戶進行其它操作時仍保留視頻后臺播放,同時也能在屏幕角落觀看到縮略圖大小的視頻播放窗口,可以從任何頁面中觀看視頻,我們同時也保留了部分視頻基礎操作。觀看體驗連續性讓用戶對視頻有絕對的主控感,提升用戶使用體驗的滿意度。


          ///

          寫在最后

          沉浸式體驗設計是幫助用戶減少畫面干擾,讓用戶專注于當前的視頻瀏覽,忽略時間的流逝進入心流狀態。我們通過放大畫面視野,增強畫面沖擊力的方式減少干擾,并解決在視頻畫面尺寸、手機屏幕分辨率極多的復雜情況下,保證畫面效果的穩定和可控,并且不會受阻于未來手機機型的擴充發展,普適性極強。同時通過視窗擠壓、懸浮小窗的交互體驗專注于當前的視頻瀏覽不被打斷,進一步提升視頻看播沉浸式體驗。后續我們將不斷探索視頻場景沉浸度提升方式,為用戶帶來更加舒適的觀看使用體驗。

          作者:百度MEUX

          轉載請注明:站酷

          藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請加藍小助,微信號:ben_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系01063334945。


          分享此文一切功德,皆悉回向給文章原作者及眾讀者.
          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。


          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司

          關于“薅羊毛”那些事兒——百度果園長線活動設計思考

          seo達人


          一、長線運營活動的價值

          百度APP作為移動生態的搜索信息服務產品,用戶會在什么場景想到百度APP并使用它呢?

          十幾年前,精力有限睡眠有限的打工人不惜犧牲睡眠時間,也要設置凌晨3點的鬧鐘;上網時間被嚴格控制的學生黨也要注冊五六個QQ小號,目的很明確:到點“收菜”,蹲點“偷菜”。十幾年后每天早上睜眼先去螞蟻森林收收自己的“能量”,再順路去螞蟻莊園喂喂小雞,安排很多手機號碼來種水果……各家產品通過帶有游戲氛圍的運營活動把產品的服務和功能以趣味化的方式傳遞給用戶,讓用戶“薅羊毛”拿福利的同時也給產品帶來增長價值。

          圖片

           

          二、百度果園設計打法

          本文以百度果園為例,從長線運營增長視角分3個方面分享運營活動玩法如何設計,如何幫助百度APP持續提升用戶活躍和用戶留存:

          1.建立心智:讓用戶相信百度果園的真實性,愿意參加活動,安全的“薅羊毛”;

          2.養成習慣:根據用戶不同的屬性,設計玩法讓用戶養成來百度果園澆水的習慣,實現百度APP的長期留存同時把“羊毛”薅到手;

          3.平衡:種植真實性+趣味化的方式傳遞給用戶,實現產品增長和用戶福利的雙重價值,“羊毛”薅不停。

          圖片

           

          1、心智建立:讓用戶相信百度果園的真實性,愿意參加活動,安全的“薅羊毛”;

          A 從新用戶視角打造真實性:新用戶上我們區分兩個用戶角度進行設計:

          • “薅羊毛”心理用戶:了解各類平臺的運營活動,酷愛“薅各個平臺的羊毛”,對福利性質的運營活動非常敏感;進入百度果園最先看到Loading頁面,從Loading頁面開始就在文案上告知用戶“免費水果包郵到家” 的福利性信息,圖片內容也是傾向于真實水果,利益點明確從而讓用戶繼續往下進行;利益文案和真實水果圖片繼續延續到“選種子”頁面上,明確的福利信息與行動點來打造百度果園的真實性。
          • “從眾心理”的用戶,這類用戶會被「TA人已經獲得免費福利」的信息所打動,所以我們在“選種子”頁面下方增加了動態彈幕,就像耳邊有個聲音在和你說:“隔壁已經領了3斤免費水果了,快來一起!”動態彈幕不僅是在信息上吸引用戶參與活動,也是側面描述了百度果園活動的真實性,與用戶建立信任。

          圖片

          B 精細設計果樹成長階段,與真實場景貼合:

          為了營造更加真實的種植體驗,我們在百度果園視覺呈現上也進行了升級,整體視覺效果與真實果樹成長的6個階段(種子→幼苗→大樹→開花→果實→成熟)更加匹配,建立更加真實的果樹成長過程,追求合理性和沉浸感,并且細化每一個不同水果對應的樹、花朵、果實形態,讓用戶在參與活動的過程中體驗果樹成長到成熟的真實感受,也是在視覺效果上形成百度果園的特色。

          圖片

          C 貫穿全流程的澆水動畫增加真實性:

          • 我們在澆水動畫上進行了體驗升級,澆水動畫分前中后3步設計來增加澆水的真實感受:
          • 嘗試通過動畫模擬生活中水壺澆水的行動動線,點擊澆水后水壺移動至樹的位置并傾斜至澆水方向,傾斜的同時水開始從水壺里露出水滴,整條澆水動作一氣呵成;
          • 在澆水過程中,水滴分層陸續從水壺中澆水至樹下土壤,下落時水滴逐漸變弱,就像真的滴落進土壤一樣;
          • 明確的澆水反饋,澆水動畫完成后,我們在樹木和土壤上同時增加了光感反饋動畫,就像是樹木真實的吸收到了水分一樣,生動輕松的反饋給用戶,讓每一次澆水都有視覺上的滿足。

          圖片

           

          2、習慣養成:根據用戶不同的屬性,設計不同玩法讓用戶養成來百度果園澆水的習慣,實現百度APP長期留存的同時讓用戶把“羊毛”薅到手。我們參考百度果園線上老用戶數據,把用戶分成3類,分別根據他們不同特點進行針對性的玩法設計:

          • 沉默用戶:這類用戶很少來果園玩,活躍的時間也較少,很難長期堅持澆水;對于這類用戶,我們嘗試設計快速領水果的玩法吸引他們,把領水果當成一個完整的大目標,直接明確出領水果的時間周期,同時也把難完成大目標切割成每天要做的簡單小目標,每天召回用戶完成當日任務,從而抓住用戶回流。
          • 忠實用戶:對于留存穩定的忠實用戶,我們給這類用戶增添游戲趣味,來百度果園做任務澆水時給到用戶游戲感受,我們設計了“瓜分”玩法,給到用戶一些驚喜感受。
          • 召回用戶:“來幫大姨澆個水”,是不是經常在微信群里看到這樣的消息,對于幫助好友達成目標,我們設計了“合種”玩法給到用戶,由一人玩百度果園到帶動身邊親朋好友一起玩,幫助用戶更快一步達成領水果的目標。

          圖片

          A  沉默用戶喚醒:

          「澆水挑戰領水果」玩法參考上癮模型進行設計,從push滲透入口到用戶,基于「稀缺」核心驅動力讓用戶產生興趣,引導用戶進入活動;當用戶進入果園后,通過大轉盤抽獎的方式繼續抓住用戶的注意力,持續利用「稀缺」「緊迫」心智讓用戶進入活動開始體驗玩法。開啟澆水挑戰后果園首頁上方增加明確的澆水進度提示,讓用戶了解整體玩法進度,從而建立收獲獎勵的信心。

          圖片

          B 忠實用戶-豐富游戲玩法:

          百度果園是一個長線養成類運營活動,為了讓老用戶持續保持新鮮感,我們在果園里增加具有趣味性的「瓜分水滴」玩法,是參與兩日就可獲得獎勵的輕量化的玩法。第一天用戶進入「瓜分水滴」活動,通過大額水滴獎池吸引用戶的注意力,提起用戶的參與興趣,在行動操作上弱化付出成本突出行為動作,引導用戶點擊;用戶報名后及時提醒用戶打開訂閱增加觸達場景;并在彈窗上對付出成本與收獲回報進行對比,吸引用戶第二日再次打開百度果園參與領獎;在領獎的同時直接引導報名下一期活動,持續拉動用戶回流。

          圖片

          C 召回用戶-好友之間的互動玩法:

          為百度果園賦予情感與故事性,好友社交上分兩步探索,第一步引導用戶去“偷”好友的水滴,在好友之間持續互動,水滴是貫穿百度果園整體玩法的重要代幣,好友的水滴被“偷”,就降低了好友“薅羊毛”的速度,但對用戶自己來說,“偷”水也需要“偷”的高效,我們在果園里增加了連續“偷”水動作,邊“偷”水邊把好友喊回來;為了豐富用戶的體驗感受,在好友果園跳轉之間增加了樹葉遮擋的動畫效果,動畫轉場同時也是替代小程序白屏轉場的好思路,營造了好朋友在果園之間串門的感受。

          圖片

          第二步好友互動持續升級,通過家庭合種的概念加強用戶之間的聯系,情感化的方式來提升用戶主動參與意愿,拉動身邊親朋好友一起加入“薅羊毛”的隊伍,一方面幫助用戶提升領水果的速度,另一方面也幫助百度果園在用戶上實現破圈。在玩法設計上我們區分3個視角進行設計:

          • 合種的發起者:突出快速收獲,激勵用戶分享拉好友來幫忙種植水果,通過儀式感轉場和主視覺的變化營造家庭故事氛圍;
          • 幫種者視角:通過彈窗上操作確認加入合種小隊,加入合種后在每次澆水時增加『謝謝你幫我澆水』的情感動畫反饋,烘托幫種氛圍;
          • 共同利益視角:階段式的獎勵激勵用戶召回和拉新的好友,把共同“薅羊毛”的氛圍拉滿。

          圖片

           

          3、平衡:種植真實性+趣味化的方式傳遞給用戶,實現產品增長和用戶福利的雙重價值,“羊毛”薅不停。

          百度果園在上線一段時間后,我們思考如何能進一步豐富果園玩法,要幫助業務穩定ROI,同時也要在用戶角度上玩的更加有趣。我們從體驗、用戶、增長3個角度進行分析,為百度果園增加“道具”玩法:

          • 從體驗角度上打造更加真實的種植體驗趣味性,讓用戶感知更豐富的活動玩法,并與用戶的核心訴求相匹配,通過澆水道具來幫助提升用戶的澆水效率、降低澆水難度;利用互動道具增加自身收益,再留出其它能夠持續擴展的方向讓百度果園的玩法更加豐富有趣;
          • 用戶角度上,幫助用戶更快實現自身領水果的目標;以及種樹人的路上永遠不能孤單的互動方式;
          • 業務增長角度上,后續可以持續擴展百度果園自身特色,持續把百度APP的服務、功能推薦給用戶,持續體驗產品,增加百度APP的粘性。

          結合百度果園自身可落實上,我們優先在可以提升用戶澆水效率,幫助用戶快速拿水果的道具進行試水,結合線下實際生活中的種植場景去思考,所以我們將道具名稱與玩法設定為「化肥」,在種植中增加化肥收益,提升果樹的種植進度,讓百度果園在玩法上更加生活化。

          圖片

          新玩法上線后,通過上線提示引導用戶去使用道具,用戶進入百度果園后先給到用戶一袋「化肥」來體驗玩法,讓用戶快速感受到道具帶來的實際價值,從而建立信任。用戶使用道具后,果園主頁直接破殼「化肥」道具的狀態,我們給到「化肥」道具3種狀態來描述使用情況;健康有活力的綠色狀態代表化肥的養分非常充足,果樹的成長速度加倍;橙黃色代表果樹的生長進度欠佳,需要用戶關注;紅色狀態代表果樹缺少養分,需要用戶去使用新的「化肥」,并在紅色狀態下我們直接破殼使用引導,直接提示用戶點擊。

          圖片

           

          三、后續發散

          隨著百度果園的進一步成長,能夠帶給用戶的不僅是“薅羊毛”類活動的概念,百度果園也會繼續向帶有社會價值與故事性活動內容延伸,更多的去賦予精神意義與社會意義;我們后續也會持續打磨、持續平衡產品收益與用戶情緒的價值,不僅僅是在“薅羊毛”,更會讓每一次的澆水、施肥和每收到的一箱水果都有自己的含義。

          圖片

           

          寫在最后

          增長是產品商業化持續的目標,有了百度果園的經驗和設計思路,也為我們后續探索新的長線活動玩法提供了基礎和經驗,我們的工作也將持續充滿著挑戰和更多樂趣。

           

          作者:百度APP用戶體驗

          轉載請注明:學UI網》關于“薅羊毛”那些事兒——百度果園長線活動設計思考


          藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請加藍小助,微信號:ben_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系01063334945。


          分享此文一切功德,皆悉回向給文章原作者及眾讀者.
          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。


          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司




          設計靈感不應該被一個網站而限制

          seo達人


          不能被一個網站而限制

          最近 Behance 封停了國內賬號,導致很多設計師無法訪問,因此也流傳了很多解決方案。今天黑馬哥就不和大家討論這個解決方案了,其實有很多同學就算在能訪問的時候也沒看幾次~O(∩_∩)O~。

          圖片

          這個事件告訴我們,設計師的習慣是多么的重要,我們的設計靈感不能因為一個網站平臺而局限。退出賬號依然可以訪問,只是很多同學糾結的是自己的收藏沒有了,如果平時養成本地化采集的習慣,你就不會出現這個問題。我們不要把希望寄托在云端,只是買一個硬盤就能解決的事情,也不要覺得不方便,其實很多作品我們也不會經常看,存儲只是為了不時之需。每年都對采集的作品進行一次整理,近兩年的放在電腦里面,時間過長的存儲在硬盤里面就可以了。主要還是要對作品進行分析,掌握作品的技法經驗和設計思維才是關鍵。

          除了存儲習慣以外,我們也不要只是固定訪問一個網站獲取靈感,優秀的設計類平臺是很多的,我們要發現更多新大陸。下面黑馬哥為大家精選幾個訪問頻次較高的國外平臺,國內的大家都比較熟悉這里就不列舉了。

           

          設計/插畫等靈感網站推薦

          以下推薦一些個人比較常用的幾個網站,排名不分先后,屬于隨機性排序。

          1、notefolio

          https://notefolio.net/

          notefolio 是韓國的一個設計交流網站,很多設計師都會在這里分享自己的設計作品和進行設計交流。和國內很多設計作品分享平臺類似,是一個綜合型設計師交流社區,有平面設計、UI/UX 設計、插畫、產品包裝設計、攝影、版式設計、數字藝術、美術、工藝等等。

          圖片

           

          2、Mobbin

          https://mobbin.com/

          這是一個匯集全球優秀 APP 截圖的網站,有超過 50000 個優秀 APP,節省了下載應用的時間,對于 UI 設計師來說非常實用。

          同樣的應用還提供了 iOS 和 Android 兩個不同版本的截圖,簡直非常的人性化。這是一個使用起來非常簡單的網站,海量的設計必將開啟你的靈感腦洞。

          圖片

           

          3、Pinterest

          https://www.pinterest.com/

          這絕對是一個靈感采集的絕佳網站,經過眾多用戶的長期積累,已經匯集了全球大量的優質圖片資源,其中設計作品也是非常豐富,且質量都普遍偏高。

          你可以通過關鍵詞搜索、畫板關注、以圖搜圖等操作獲得靈感,而且相似推薦還能延伸出更多類似構圖、配色、主題等圖片資源。點擊作品還能跳轉到原始出處,順藤摸瓜找到更多優質資源,真的是非常便利。

          圖片

           

          4、Designspiration

          https://www.designspiration.com/

          該網站除了通過關鍵詞搜索圖片內容以外,在搜索欄有?個調色板的圖標,點擊可以通過指定的顏色進行搜索相關配色的圖片或者設計。在選擇顏色的時候不是單一的色彩選擇,可以選擇幾個配?組合進行搜索,對于設計師來說?常實用。

          圖片

           

          5、Abduzeedo

          https://abduzeedo.com/

          Abduzeedo 是一個優秀的設計博客,提供給設計師創意和靈感的社區,這里有設計、攝影和 UX 等相關的文章提供給那些想尋找靈感的設計師。這是一個開放的設計社區,它是設計師日常的靈感來源。

          圖片

           

          6、UI Garage

          https://uigarage.net/

          UI Garage 提供了很多應用設計的截圖和模板,專業細分的類別和精挑細選的設計截圖,還有很多設計工具推薦,是一個非常實用的網站。在這里不僅可以獲得設計靈感,還能獲得優秀的設計工具或者插件來提高我們的工作效率。

          圖片

           

          7、Dribbble

          https://dribbble.com/

          Dribbble 相信很多喜歡 UI 設計打卡的同學比較熟悉,匯集了大量設計師的一些日常創意作品。該網站不同之處是發布作品需要邀請碼,就是需要有邀請碼的設計師邀請加入才能發布作品,獲得邀請碼也相當于設計能力獲得認可。

          整體作品的質量還是不錯的,如果當你設計時沒有想法,這是一個不錯的靈感采集地。

          圖片

           

          8、ndc

          https://www.ndc.co.jp/works/

          這個網站展示了很多非常不錯的設計作品,偏向于簡約風。相信這些項目設計的靈感,可以帶給我們更多的設計思考。

          圖片

           

          9、FolioArt

          https://folioart.co.uk/

          FolioArt 是一個插畫藝術作品展示網站,擁有高質量的插畫作品,形式也多種多樣。就像一個插畫家的資源庫,讓有商業需求的客戶通過這個平臺,和世界頂尖的插畫師進行合作。

          圖片

           

          10、unDraw

          https://undraw.co/illustrations

          這里提供的插畫作品數量眾多,各種小場景的插畫無論是獨立使用,還是組合使用,肯定可以滿足很多場景需求了。平臺內置的編輯器還可以對插畫進行調色,導出格式也是支持后期編輯,非常的實用和便利。

          圖片

           

          小結

          設計的靈感來源途徑是很多的,不局限于某一個單一路徑,以上的推薦僅為拋磚引玉,還有很多優秀的網站給我們帶來設計靈感和經驗學習。每個人的關注焦點和選擇角度不同,以上僅為個人推薦,不足之處歡迎大家留言補充。


          作者:黑馬青年

          轉載請注明:學UI網》設計靈感不應該被一個網站而限制

          藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請加藍小助,微信號:ben_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系01063334945。


          分享此文一切功德,皆悉回向給文章原作者及眾讀者.
          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。


          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司



          面對高速快跑的產品,如何優雅推進體驗優化

          seo達人


           

          圖片

          或許你在推進體驗優化時,也遇到過以下困惑:“對于設計師走查出的體驗問題,為什么PM總是間歇性視而不見?”“PM既然認可了體驗問題的重要性,但是他為什么總說放一放,過一段時間再整改呢?”

          “排除萬難,體驗問題終于提交了版本需求,為什么總是因優先級不高,無法獲得充足的開發資源,順利上線呢?”

          圖片

          我們在進行趕集直招體驗優化過程中,也時常遇到這些困惑,究其原因,主要是因為,我們作為設計師,每天所處的工作范圍和接觸到的信息有限,促使我們忽略了對產品階段的深入思考,誤以為PM對體驗優化和體驗問題的理解,和我們高度一致。因此在著手進行體驗優化前,我們要提升對產品階段的理解把握,知道所服務的產品處于哪個階段,產品發力方向是什么,進而準確找到體驗優化的推進策略。

          在不同產品階段(探索期、快速成長期、成熟期),體驗優化的推進策略也各不相同:

          處于探索期的產品,其發力方向為驗證業務模式。在這個從0-1的時期,其實不存在推進體驗優化的概念,設計師應盡可能進行完善的基礎體驗能力建設,如沿用成熟規范與組件搭建產品體驗,后續伴隨產品核心功能、流程驗證,同步迭代打磨;

          處于快速成長期的產品,其發力方向為快速拉新拓量,縱向做好垂類。這個時期的體驗優化推進策略是,基于產品功能迭代,進行“小步快推”;

          處于成熟期的產品,其發力方向為提升用戶活躍度,實現商業變現。這個時期更適合采取體驗優化專項,推進體驗優化。

          圖片

          可以看到,趕集直招目前處于“快速成長期”,因此我們選擇了“小步快推”的策略。

           

          圖片

          找準“小步快推”的推進策略后,具體的執行方法是什么呢?

          辛向陽先生在《從物理邏輯到行為邏輯》一文中,提出了交互行為5要素的概念,即用戶、場景、目的、媒介與行為,以幫助設計師對問題進行準確解析和挖掘。

          圖片

          其實推進體驗優化,本身也可以理解成是一次交互行為的設計,因此在進行趕集直招體驗優化初始,我們沿用了交互行為5要素的概念,對趕集直招進行了解析,并挖掘出具體可執行的方法

          用戶:幫助中國4億藍領找工作的趕集直招;

          場景:服務業逐漸復蘇,趕集直招在市場上已經被廣泛知曉和接受,市占率不斷上升;

          目的:把控ROI前提下,一方面持續拓展用戶量,另一方面開始向商業化傾斜資源,謀求商業營收;

          媒介:趕集直招APP,每3周迭代1版;

          行為:深耕細分市場,不斷驗證新的業務模式,優化舊的業務模式,高速快跑與競品拉開距離。

          圖片

          綜上,我們總結出了處于“快速成長期”的趕集直招,3個顯著特征,和對應的體驗優化執行方法:

          特征1:需求多而側重于垂類深耕→執行方法:提前規劃,全局視野;

          特征2:資源傾斜商業化→執行方法:評估需求,整合策略;

          特征3:版本迭代快→執行方法:流程調整,需求擴容。

           

          圖片

          提前規劃 全局視野

          前期使用體驗管理工具,收集了大量體驗問題,我們對其進行聚類整合,匯總成《趕集直招體驗優化問題池》,并與PM進行對齊,探討優化可能性。

          圖片

          該階段的keypoint是:對體驗問題項進行判斷,是進行逐個優化,還是合并成獨立需求,統一優化。

           

          評估需求 整合策略

          承接需求時,我們需要對需求類型進行評估,趕集直招的需求通??煞譃?類:

          第1類是重產品側解決的需求,通常這類需求范圍較明確,PM有較完整的解決方案;

          第2類是重設計側解決的需求,這類需求范圍較開放,給設計師發揮的空間較大,我們在趕集直招體驗優化推進中,主要錨定第2類需求。

          在和PM了解需求背景和業務目標后,則進入解決策略梳理階段,通常PM會提出關于如何達成目標的種種產品策略和部分設計策略,此時我們會站在用戶視角,從目標出發,果斷衡量出其策略的更多擴展性,多維度思考,整合PM策略,并提出設計側的更全面的解決策略。

          圖片

          該階段的keypoint是:需與PM對齊一個思路,即體驗的優化與打磨也是達成業務目標的重要策略之一。

           

          流程調整 需求擴容 

          在推進體驗優化的同時,我們對設計側與產品側的合作流程,也在不斷努力做出調整,以便為體驗優化爭取更多打磨的窗口期。

          調整前的合作流程,設計側作為產品側下游,在產品原型分發后才會接到設計需求,且排期極度緊張,這樣設計側的重點會被牽引到快速支持當前需求,不利于體驗優化推進,為此我們與PMO、產品側積極溝通調整合作流程,設計側在產品需求內審后就前置介入,與PM一同經歷方案構思、分發與評審流程,為體驗優化爭取到了足夠的窗期口。

          圖片

          此外,對于產品側中遠期重點需求,我們會提前與PM對齊OKR,跳出版本節奏的限制,聯合多角色建立主題專項,規劃整體項目計劃,在過程中,對涉及到的體驗問題項,作為項目計劃的一部分,進行集中解決,這樣在PM撰寫需求文檔時,就可以將體驗問題項最大限度收入到需求范圍內。

           

          圖片

          給大家展示兩個我們推進過程中的小案例:

          基于問題池中的首頁瓷片區體驗問題項,我們借著PM對瓷片區提出更換瓷片位內容的機會,將瓷片區的體驗問題項一并推進優化,對樣式和文案進行降噪處理,使其重要信息更清晰,數據也提升明顯。

          圖片

          推進年久失修的深層級頁面體驗優化是難事,但跟業務目標相關又對數據提升有幫助就會容易很多。PM給出的需求范圍和目標是“通過調整關鍵字段,提升簡歷預覽頁的感知度”,我們整合該頁面的問題池后,提出“感知度提升=關鍵字段調整+信息布局/按鈕/文案等體驗層面優化”,滿足需求的同時,也推進了體驗問題項的解決。

          圖片

          通過“找準推進策略-挖掘執行方法-推進3步走”3個層面的努力,在高強度的版本節奏下,我們用短短半年的時間,就實現了《趕集直招體驗優化問題池》中,大部分問題項的優化解決。從最終業務效果看,各項數據指標均符合或超過先前的預期,用戶滿意度也得到大幅增長,達成了本次體驗優化的預期目標。

          圖片

           

          圖片

          總結一下,當我們計劃對產品進行體驗優化時,不要急于啟動。

          首先,判斷產品當前所處的階段,找準推進策略;

          其次,通過交互行為5要素解析產品,挖掘體驗優化執行方法;

          最后,如果所服務的產品處于“高速快跑期”,可借鑒“推進3步走“的方法進行推進:

          1.提前規劃,建立全局視野,與PM對齊,判斷體驗問題項,是進行逐個優化,還是合并成獨立需求,統一優化;

          2.承接需求時,評估需求類型,對有設計發揮空間的需求,整合多維度策略,盡可能囊括體驗問題項優化;

          3.適時對合作流程做出調整,當前版本需求做到前置介入,中遠期需求做到提前規劃與需求擴容,最大限度完成體驗問題項優化。

          圖片

          最后,愿大家都能在體驗優化之路上優雅前行。

           


          作者:環鐵藝術家

          轉載請注明:學UI網》面對高速快跑的產品,如何優雅推進體驗優化

          藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請加藍小助,微信號:ben_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系01063334945。


          分享此文一切功德,皆悉回向給文章原作者及眾讀者.
          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。


          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司



          超全面的設計底層理論,優秀設計背后離不開這些(上)

          seo達人


          圖片

          當沒有認知緊張時,用戶心流才會發生。當一個設計有效時,你才能體驗到認知上的輕松。如果沒有,你的“心流狀態”就會中斷(稍后會詳細討論),讓我們陷入認知緊張,于是“設計失敗了”。

          當基本設計原則被忽略時,這種情況很容易發生,導致設計無法“整合”。這些基本原則包括:平衡性、一致性和視覺層次、負空間、接近性、對比、統一、一致性、配色方案和排版層次等方面。(彩云注:很多人看到這些以為自己都懂,但實際設計時犯錯最多的也是這些問題)

          從神經科學的角度來說,當一個設計起作用時,我們會“感受到它”。其影響立竿見影。它發生在潛意識里,在一瞬間完成,是人的本能反應。我們不需要把它放在顯微鏡下分析它。

          優秀設計以簡潔和優雅而引人注目。喬納森·伊夫(Jonathan Ive)和迪特爾·拉姆斯(Dieter Rams)都可以算作這種設計思想的擁躉。

          人們常說,優秀設計背后的工藝是無形的。然而,這不是隨機發生的。不管人們是否注意到,設計的背后是遵循著大量而嚴格的原理去執行的。偉大的設計師不會在畫板上隨意地將各種元素組合在一起,這是有方法的。

          圖片

          為什么有些設計具有美的感受,而有些卻沒有

          相反地,當一項設計被認為“有些地方不對勁”時,人們就會下意識地覺得這個設計是有問題的。這樣的結果會給品牌或產品帶來不好的影響。當一個高端或奢侈品品牌受到高度關注時,這種影響尤其有害。這就是為什么你永遠不會遇到設計不完美的香奈兒(Chanel)商店的原因。

          “你對一件事的第一印象會建立起你隨后的觀念,如果一家公司在你看來不專業,你可能會認為他們做的其他事情都不專業?!狣aniel Kahneman,普林斯頓大學心理學教授

          圖片

          這不是一個精心制作的設計,會導致認知緊張。你會在這個網站上預訂你的行程嗎?

          我們都同意上面是糟糕的設計,就像建在沙子上的房子,一個忽視基本設計原則的設計將會崩潰。潛意識里,它會立即被認為是破碎的,無論是視覺上、精神上和情感上。

          人類的大腦是懶惰的、有偏見的,喜歡走捷徑。Daniel Kahneman稱之為“低維思維”。當人們看到某種設計時,它的“美學完整性”、視覺感知和神經科學之間存在著相互關聯。

          當一個設計是合理的,換句話說,它是令人愉快的、有效的,我們會迅速、直觀的判斷它是合理的。我們的心率降低,多巴胺水平增加,會有一種幸福和平靜的感覺。這就像我們聽到舒緩的音樂,會沉浸在一種每時每刻的“心流狀態” 中?!霸谶@種狀態下,人們會專注于一項活動,其他一切似乎都不重要”——來自于一個心理學概念,由 Mihaly Csikszentmihalyi在他的暢銷書《心流:最佳體驗的心理學》中寫道。

          圖片

          你更愿意住進哪個房間?

           

          設計原則在審美完整性中的作用

          蘋果的人機界面指南(Apple’s Human Interface Guidelines)幾十年來一直在談論“美學完整性”。它也可以被稱為“設計完整性”或“審美凝聚力”。

          蘋果對美學完整性的定義是“當一個設計的外觀和行為與其功能完美匹配時”(彩云注:我的理解就是所見即所得,符合用戶的心理預期)。換句話說,設計的構成是產品的一個組成部分。我們將研究決定設計組合成敗的設計原則——更多的是關于 UI,而不是關于 UX。

          美學完整性不僅僅是關于設計有多好看。它指的是具有明顯連貫性的設計:有效的結構和布局,是什么讓它產生效果。換句話說,它的元素在視覺層次、對齊、間距、平衡、對稱、重復、比例、強調、接近、對比、統一、一致性、配色、排版、負空間等方面都有出色的運用,這里僅舉幾個例子。

          這與“黃金比例”無關,黃金分割不能解決問題。斐波那契數列螺旋沒那么玄乎,給設計師帶不來驚人的設計。

          設計師們在安吉麗娜·朱莉或蒙娜麗莎的臉上畫出金色螺旋形時驚呼道:”果然是”黃金比例“(彩云注:但事實上有點故弄玄虛了)。當然,自然界中確實有神圣幾何學(黃金比例,又稱斐波那契螺旋,是基于此),依賴“黃金螺旋”作為設計原則是一種謬論,它已被多次暴露在其赤裸裸的荒謬中。

          圖片

          這是我的洗衣機,上面疊加了斐波那契螺旋。

          “審美的完整性”不是沒道理的。這個概念是基于基本的設計原則,是有成就的設計師實踐他們的藝術作品的經驗總結。

          讓我們來看看一些設計原則,以及它們為什么會使得你的設計更能更加有效。通常情況下,真正優秀的設計會結合這些設計原則。

           

          我們將探討以下這些最底層的設計原理:

          • 視覺層次感
          • 間距、對齊和網格
          • 平衡
          • 對比
          • 對稱
          • 重復
          • 幾率原則和三分原則
          • 引導線
          • 比例
          • 強調
          • 整體性
          • 親密性
          • 一致性
          • 顏色
          • 排版
          • 負空間

           

          一、視覺層次感

          視覺感知的基本規則對任何視覺設計都是至關重要的,因為它們指導著如何盡可能快地傳達信息。視覺層次是設計中信息的結構和優先級。它決定了人們接受和處理信息的順序,因為它以一種視覺方式引導他們。

          視覺層次感重在打造視覺優先級。通過巧妙地使用顏色、形狀、大小、間距、比例和方向,創造性地使用決定層次的視覺元素來傳達構圖的意義、概念和情緒。

          核心關注點是什么,你希望用戶首先注意到或開始閱讀的設計中最重要的元素是什么?我們想讓它成為焦點,然后其他部分的設計從這里展開。

          圖片

          一個具有良好視覺層次的網站會引導用戶關注重要的部分

          視覺層次對于每一種視覺設計都是至關重要的,無論是需要引導訪客眼球的首頁還是移動端UI的導航入口。用戶對每個元素的理解取決于組合中的其他元素及其上下文。

          建立視覺層次的一些技術是:位置、大小和比例、顏色和對比、間距和親密性、負空間、紋理、引導線和高度。在一個元素周圍使用豐富的負空間可以使它看起來更有意義。使用引導線可以創造移動,就像一個人的眼睛在設計上移動一樣。排版的層次結構也扮演著重要的角色,通過不同的大小和權重,我們可以讓更重要的文本元素脫穎而出并建立秩序。

          加分技巧

          • 使用一個隱形三角形連接設計中的三個重點區域(構圖)。
          • 注意古騰堡圖模式(Gutenberg Diagram)、F 模式(F-Pattern)、Z 模式(Z-Pattern)和層蛋糕模式(Layer Cake Pattern)的視覺掃描,并順應趨勢而不是反對趨勢。(彩云注:這里的這些模式彩云就不過多介紹了,感興趣的可以自行了解下)

          圖片

          沒有視覺層次的網站沒有明顯的興趣點。

           

          二、留白、對齊和網格

          設計中的對齊和間距通過空間上的連接傳達出一種秩序和組織感,這兩個原則都在設計背后發揮重要價值。設計師早期學到的基本知識之一是在網格上編排設計,然后對齊和分隔這些元素。

          左對齊、居中對齊、右對齊都沒錯,但你必須對齊,否則當元素沒有對齊時,設計就會給人崩潰的感覺。它給人一種不安的感覺。

          圖片

          沒對齊的話,眼睛看著很難受

          網格有很多不同的類型:列網格、基線網格、模塊網格、層次網格、像素網格等。不同設計使用不同網格,但最基本的是設計元素的對齊和間距。

          圖片

          (Illustration courtesy UX Engineer)

          網格可以被打破。一個死板的構圖可能會在視覺上無趣,除非一個元素從網格中脫穎而出。錯位或“打破網格”是賦予元素更多視覺權重的一個機會。當在設計中設置視覺層次結構時,它可以用來強調某些東西。

          圖片

          有時打破網格可以創造強調和移動

           

          三、平衡

          設計上有兩種平衡:對稱和不對稱。所有的構成元素:排版、顏色、圖像、形狀、圖案、留白等,都具有一定的視覺重量。有些元素很重,很吸引眼球,而有些元素很輕,感覺不那么重要。

          這些元素的放置方式能夠在對稱設計中創造出一種平等的順序感,或者一種稍微偏離平衡能夠創造出一種不對稱的設計。無論對稱還是不對稱,我們的大腦都被某種平衡感所吸引,因為它創造了和諧、秩序和美學上令人愉悅的結果。

          圖片

          多重原則:平衡、對齊和對稱在網站上發揮作用

           

          四、對比

          “對比”指的是使設計中不同的元素更容易區別開。強烈的對比可以在設計中強調一個區域,而微弱的對比可以弱化它,創造一個視覺層次。對比在設計中也扮演著重要的角色。對比不足會使文字特別難以閱讀,尤其是對視力有障礙的人來說。

          圖片

          在左邊的設計中,一些文字和背景之間的對比不夠。

          Web內容可訪問性指南 (WCAG)呼吁“文本的視覺呈現應該有至少4.5:1的對比度”,除了大規模文本,它應該有至少3:1的對比度。因此,設計師需要確保內容保持舒適易讀。

          其他UI元素(如各種顯示器和設備上的卡片、按鈕、文字和圖標)之間的適當對比也是必須的。如果UI元素之間沒有明顯的區分度,設計就容易產生混亂。

           

          五、對稱

          在格式塔原理中,對稱和秩序的法則也被稱為pr?gnanz,德語單詞“好身材”的意思。這個原理說的是,大腦會以盡可能簡單的方式感知模糊的形狀,這都是為了節省大腦能量。

          我們傾向于尋找一切事物的對稱性。幾項研究發現,面部對稱能提高人們對人臉吸引力的評價(盡管完全對稱的臉其實并不一定那么有吸引力)。該理論認為,這種偏好與選擇DNA最好的伴侶的進化優勢有關。

          對稱在自然界中也無處不在。看看一只蝴蝶,一朵花,或者一只海星。

          圖片

          對稱

          同樣的原理也適用于數字領域,平衡對稱的設計更令人愉悅。

          圖片

          對稱性在應用中發揮作用。Uber Eats、Booking.com和Behance。

           

          六、重復

          重復是一致性的近親,是優秀可用性的標志。

          在設計中利用重復是件好事,因為我們的大腦總是在尋找模式、相似性和一致性。為什么?因為重復相同性質的元素需要更少的認知努力。

          我們更容易識別重復的模式,而不是每次看到新模式都要重新校準大腦。正如前面提到的,大腦作為一種生存機制是懶惰的,模式識別和認知捷徑意味著有意識地處理視覺信息所需的能量更少。

          例如,重復元素的形狀和大小、填充、留白、類型和顏色,也有助于更對稱、更好地平衡,做出美觀的設計。

          圖片

          The Athletic這個軟件就是用重復元素做設計的好例子。

          好了,為了照顧大家的閱讀體驗,再寫更多估計有很多人要開始沒耐心了。所以剩下的設計原則,我們下回再接著聊,敬請關注哈。

           

          原文:https://uxdesign.cc/design-principles-why-a-design-works-a572c5d2d92d

          作者:Miklos Philips

          譯者:彩云Sky

          本文翻譯已獲得作者的正式授權(授權截圖如下)

          圖片

           

          作者:彩云Sky

          轉載請注明:學UI網》超全面的設計底層理論,優秀設計背后離不開這些(上)

          藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請加藍小助,微信號:ben_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系01063334945。


          分享此文一切功德,皆悉回向給文章原作者及眾讀者.
          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。


          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司



          日歷

          鏈接

          個人資料

          藍藍設計的小編 http://www.syprn.cn

          存檔

          亚洲va欧美va天堂v国产综合