<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設計者

          溝通是為了完成設定的目標,把信息、思想和感情,在個人和群體之間傳遞,并達成協議的過程。溝通目的一般分為:說明事物、表達感情、建立關系、達成目標。


          需求溝通是設計師和團隊圍繞需求目標,信息傳遞的過程,是設計師展開設計工作的起點,貫穿整個設計過程,溝通質量直接影響設計和項目質量。但因溝通復雜性、開放性,對很多新手設計師來說,在需求溝通過程中,可能會碰到一些共同的溝通問題,比如前期需求不明確導致設計頻繁修改、產品和體驗發生沖突時無法說服產品、溝通過程中陷入情緒爭吵、溝通中雞同鴨講等等。


          針對這些問題,本文嘗試梳理需求溝通過程中幾種典型場景和方法,以期幫助新手設計師快速識別需求溝通中的常見問題;提升溝通效率,快速達成共識;掌握溝通竅門,更精準高效的產出需求。


          本文主要分成2個部分,第1部分主要聚焦在需求溝通過程中的不同階段,面對的典型溝通問題和解決方案;第2部分主要介紹溝通中一些常見的技巧和方法。



          Chapter 1

          ——————————

          需求溝通的目標和方法


          1.1 設計師在不同需求階段的溝通目標

          通常設計師在處理需求的流程大致可以分成4個部分:了解需求->分析需求->探索方案->實現方案。在不同的階段,設計師要解決的核心問題不同:


          了解需求階段,設計師和產品針對需求目標進行討論,并和團隊就產品目標達成共識;


          分析需求階段,設計師和產品針對產品策略合理性進行討論,并提出體驗訴求;


          探索方案階段,設計師探索設計方案,并和產品就商業目標和體驗目標達成平衡;


          實現方案階段,設計師和產品協調優先級,調整方案,確保方案最大程度實現還原;




          1.2 如何更好的了解需求,明確目標,達成共識

          在了解需求階段,設計師需要了解需求來源、背景、要解決的問題和目標。總結來看需求可大致分為2類:一類是需求目標較明確,產品有明確要解決的問題,如提升產品體驗、滿足某個用戶明確需求、完成某個產品目標;一類是需求目標較模糊,比如挖掘用戶潛在需求,探索新的業務方向。



          對于目標較明確的需求,在了解需求背景、解決標準、需求邊界、限制條件和責任人等問題后,即可進入需求分析,策略討論階段。


          但對于方向探索類需求,如何協助產品探索目標,和團隊達成關于目標的共識,是這階段的溝通重點。以一個創業的項目為例,產品想做一個圖片社區,原因是目前國內沒有頭部圖片社區。還原項目初期的溝通過程如下:



          在產品的催促和時間壓力下,設計并沒有圍繞產品定位、用戶群、產品目標進行充分討論,也沒有和團隊成員達成共識。在這種情況下,選擇跟隨產品的節奏,陷入了被動執行。由于前期并沒有針對需求進行細致的推敲討論,方案的輸出過程變成了試錯的過程。產品方向修改頻繁,這種被動的溝通方式,導致整個團隊目標感不清晰、理解混亂。



          經過反思和問題總結,設計師發起了主動溝通,運用設計方法協助產品明確需求,提升方向說服力,探索如何就目標和團隊達成共識。首先,需要和產品明確用戶群,并尋找用研協助,或發起快速訪談了解用戶;其次,組織團隊相關成員發起關于產品目標的討論,圍繞產品決策人給出的產品初步方向,團隊成員每人寫下對產品的期待,提煉總結團隊成員的想法,提煉總結產品目標再次,根據用戶訪談材料,利用親和圖法,提取關鍵詞,從用戶訴求中洞察提煉用戶目標。最終,產品目標得以明確,團隊也取得了關于目標的共識,同時通過快速demo,來驗證優化,項目得以順利進行。




          1.3 如何更好的分析需求,確保產品策略合理性

          在了解需求背景、用戶群體,明確了需求目標后,進入需求分析階段,通常產品會給一個商業假設:假如做了xxxx,用戶就會xxxxx,產品可以達成xxxx目標。以一個需求為例子:產品想做一個任務體系,通過福利吸引用戶做任務,從而拉動產品活躍。


          如果設計師完全按產品給的商業假設輸出,方案產出過程貌似很順利,但可能隱藏了很多問題。以本需求為例,產品的商業假設邏輯是:用戶被福利吸引->用戶為拿到福利做任務->用戶獲得福利->產品完成目標訴求;


          但這個假設是正確的嗎?設計師的價值就在于,這個時候要能找出產品假設中的問題。通過對用戶的了解和洞察,還原用戶的實際使用過程可能會發生的問題。找到這些關鍵問題并通過和產品溝通協調解決掉這些問題,才能順利實現產品目標。


          通過對用戶實際參與過程的分析,用戶在看到任務獎勵后,實際需要權衡的內容很多,如福利吸引力夠不夠大、有沒有關系親密的好友可邀請、好友要完成的任務難度大不大?分析需求過程關鍵就是找到這些問題的對應策略,強化用戶參與的動力,降低參與難度。




          1.4方案探索階段,如何平衡商業和體驗訴求

          在方案輸出階段,設計師和產品最常發生的爭執是商業目標和體驗之間的沖突。產品為了達成商業目標,很多時候希望把達成商業目標的手段做的很強;



          當發生圍繞商業目標和體驗問題,誰都無法說服對方的情境時,設計師該如何溝通呢?


          首先,作為設計師要擺正溝通立場,理解商業化是任何產品的根本目標,體驗也是實現商業化手段之一,我們反對的不是商業化,而是簡單粗暴的商業化方式,商業化的前提是對目標用戶有足夠的了解和盈利模式的清晰判斷。


          其次,應能夠識別對于曝光越多越好,越直接越有效的這種思維方式,通常是一種鳥槍法的投機心理。在沒有更巧妙的解決方式時,最節省力氣的做法就是提升曝光等方式達成目標。


          當發生爭執時,如果僅僅站在設計立場上,用設計理論說服對方,通常效果有限。嘗試找到產品實現商業化目標背后的邏輯,不要用手段代替目的,探索更好的實現商業化方式的可能性,比如嘗試在合適的路徑上推薦,或探索用戶更容易接受的內容形式。




          1.5 方案實現階段,如何協調優先級,推動方案最大程度還原

          在方案實現階段,很多時候由于時間緊張,產品僅完成最核心功能,部分體驗相關功能一直無法得到優化。


          通常如果方案產品認可,但推進意愿不高時,可能的原因是:1.當前方案不是核心KPI,產品要優先保證對kpi影響最大部分完成;2.投入產出比不劃算,方案在產品看來投入的人力/時間/資源過大,并不值得;3.方案改動可能引發數據風險,產品并無法確保改動一定能帶來數據的成長;4.資源緊張,產品也很想實現方案,但項目時間/人力/資源真的很緊張。



          這種情況下,首先,要和產品夠分溝通他們的疑慮和擔心,到底是哪類問題;其次,從心態上也不用急于一時,做好長期推動的準備;還有,充分優化方案,消除產品疑慮,尋找合適時機進行推動。在項目逐漸迭代的過程中,對需要推動體驗優化點持續關注,盡可能放大方案價值,結合新的需求點,思考能否從價值拓展角度,如提升品牌價值、擴展性等角度提升方案說服力;同時,從縮小成本和打消產品疑慮角度,做足準備,推動方案。



          Chapter 2

          ——————————

          溝通技巧的問題

          溝通的過程是一個信息螺旋傳遞的過程,表達者的信息傳遞到接收者時,因為背景、環境、理解能力、傳遞完整度等差異,接收者僅能接收部分信息,而接收者在理解消化后,再將自己的信息傳遞出去,這個過程循環往復,會導致兩個最常見的溝通問題:目標偏離以及信息衰減。學習適當的溝通技巧,可以有效減緩目標偏離和信息衰減。


          2.1 如何防止溝通目標偏離

          要防止溝通目標偏離,首先要理解什么會導致目標偏離?1.目標不清晰,比如本來想找產品聊下某功能體驗不合理,但因為產品一直說項目時間緊,被傾訴了一通苦水后,忘記了本來要溝通的問題,轉移到了其他話題上,最后不了了之;2.缺乏同理心,比如當發生爭執時雙方不能互換角度,產品一直在說實現目標手段和現階段問題難點,設計在說體驗問題和設計規范,雙方互不妥協,陷入爭吵;3.陷入情緒,表達觀點時陷入情緒化的爭執。


          針對這三個會導致溝通目標偏離的問題,可使用以下技巧:


          ① 設定溝通目標并保持關注:在每次溝通前想清楚自己的目標和底線,嘗試用全局視角分析自己設定目標的合理性;在溝通過程中要經常反思當前溝通的問題是否已偏離了目標,對達成目標是否有幫助;發現目標偏離可嘗試改變節奏,思考接下來說什么有助于達成目標;


          ② 換位思考:能夠傾聽對方的問題和困難,嘗試尋找解決問題的辦法,而不是一直表達訴求,無助于問題的解決和推進;


          ③ 控制/傾聽情緒:美國心理學家埃利斯創建的ABC情緒理論,拆解了事件發生和情緒之間的關系,指出事件的發生并不是導致情緒的直接原因,我們持有的信念才是。因此在溝通中不要加入太多內心戲,過度解讀事件。比如產品讓設計反復改稿時,可能會解讀為產品在故意刁難,嘗試了解反復修改背后的原因,可能對解決問題更有幫助。



          2.2 如何減少溝通過程的信息損耗

          溝通過程中表達者的模糊表達和接收者的理解偏差,會導致溝通過程中的信息損耗。比如經常會聽見產品有以下類似的表達:“設計稿盡快輸出”、“頁面太結構化了,想要更社交化一點”、“能不能做得更有創意一點,更有趣點”當出現這些類似的溝通語句時,可以嘗試通過具體化方式,進行確認。



          對于可能會出現理解偏差的問題,重要的信息用自己的語言組織后再次確認“你的意思是xxxx嗎?”;重要的溝通后,可梳理溝通記錄,企業微信同步周知確認;方案的溝通過程可以快速畫草稿確認;盡可能的減少因為理解不一致導致的溝通問題。



          總結

          在需求溝通過程中,我們要對不同階段的溝通目標有清晰的認識,圍繞目標進行充分準備,運用設計方法了解用戶、了解產品核心訴求,做到知己知彼,才能進行有效的溝通。


          在溝通過程中保持對目標的關注,始終牢記溝通是為了解決問題服務的。適當學習溝通技巧較少溝通過程中的信息損耗。


          溝通是解決問題,共同協作的重要方式。如果你覺得自己不善于溝通,可能要反思下溝通前是否想清楚自己的溝通目標,對于解決問題的過程、方法是否熟悉,準備是否充分?當我們能做到知己知彼、胸有丘壑時,溝通可能就變得簡單起來。

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

          文章來源:站酷 作者:騰訊ISUX

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

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


          揭秘2021紅點設計大獎作品KNOWING——通過可視化提高對數據的理解

          資深UI設計者

          AIOps智能運維平臺KNOWING榮獲2021年度紅點大獎,從它的數據可視化之路可了解如何通過設計提高對數據的理解

          微眾銀行智能化運營團隊的軟件系統KNOWING榮獲2021年度紅點大獎,這是團隊在多方面獲得的獎項之一,也很好的體現了軟件系統和團隊的綜合能力。


          關于紅點獎

          紅點大獎是世界上最大的國際設計獎項,是世界知名設計競賽中最大最有影響的,至今已經舉辦了大約66年。該組織以“尋找好的設計和創造力”為指導原則,為設計師和公司提供了一個設計作品展示和評估的平臺。Red dot由“red dot product design ”產品設計獎,“red dot communication design ”傳達設計獎及“red dot design concept ”設計概念獎,三大獎組成red dot設計獎家族。近年紅點獲獎的數量隨著世界工業生產和設計能力的成熟而增加。盡管如此,紅點獎和IF獎是世界上僅有的,公認評判好設計的國際機構,而能得到至尊獎 Red Dot:Grand Prix的設計更是行業翹楚。今年,23名國際專家查看、討論和評估了來自世界49個國家的9178份傳達類參賽作品。

          有興趣的話,可以了解一下紅點是如何評審和頒獎的
          評審——  紅點是怎樣評選的 The best products in 2020 – The Red Dot Jury selects the award winners_嗶哩嗶哩_bilibili
          頒獎—— 2019紅點產品設計大獎 - 紅點盛會_嗶哩嗶哩_bilibili

          從設計獎的動態看趨勢

          德國紅點獎機構于2015年在中國設立“中國好設計”獎 (China Good Design)簡稱CGD,發起針對中國的全新國際化設計獎項。自加入世界貿易組織WTO,中國成為了世界工廠,為世界各國生產基礎工業產品。隨著中國工業生產能力逐步發展走向成熟,現代工業生產的中心由德國和美國轉向了中國。從德國紅點獎在中國成立分部的舉措,除了看到商業盈利的目的外,還可以看到一個風向標,這就是在信息時代下,更多適應時代的好設計會出現在中國,這也給全球相關專業人士帶來了機遇和挑戰。蔚來就請德國設計師設計汽車和Logo就是其中一個案例。


          得獎項目介紹

          項目名稱:KNOWING

          發布時間: 2019.04

          設計師:朱倩蓉

          程序員:張若君

          項目經理:莫林林

          團隊:微眾銀行智能化運營室

          地點:中國深圳

          獎項類別:2021紅點設計大獎-界面與用戶體驗設計

          什么是KNOWING

          KNOWING的意思是“having or reflecting knowledge, information, or intelligence”擁有知識、信息,甚至智能。不止于人的專家的知識,KNOWING期望通過挖掘數據和神經網絡等IT技術,給監控系統帶來更多機器智能,甚至能反哺給人類智能。


            


          KNOWING是一個為保證銀行IT系統正常運營的監控軟件系統。它給IT系統的運維人員提供如智能數據監控、檢測IT系統異常及定位和分析異常的服務。通過有效監控和管理,IT系統能實現超越電信系統的可用率。這意味著,IT系統的問題能夠被快速察覺和撲滅,不會影響銀行的業務,更不會從而導致商業損失,銀行用戶也因此可享受7*24流暢的線上服務。


          設計背景

          作為一個數據導向且面向專業人員的軟件系統,過往的IT監控系統會展示大量的數據表格,IT運維人員通過表格查詢找到所需要的數據,再通過個人經驗定位和分析IT系統異常的原因。但是紛繁的數據和龐雜的查找工作,以及對個人經驗的依賴需要耗費大量人力,而人的操作是會出現滯后、誤判、遺漏、效率低等問題的。KNOWING在原始系統的基礎上挖掘了更多的數據關聯關系,一方面想用有效的方式展示這些數據關系,另一方面想幫助IT運維人員更快速理解更精準判斷數據,從而提高工作效率。

          因此,KNOWING的設計就需要與其他的系統不同,盡管并不面向非IT人員,它還是需要用圖形化的界面展示密集的數據,通過可視化和交互來體現數據的關聯關系,促進對數據邏輯快速理解。


          總覽

          總覽頁面最上方的時間橫軸展示了在一定時間段內檢測出的重要IT異常,點擊某個異常紅點,下面的條狀顏色區塊是展示這異常分析的5個階段。接著是異常的影響、評級、分析結論、具體指標等模塊,模塊的順序按邏輯分布,從總到分,從粗到細。


          根因分析流程可視化

          異常分析的最后一個階段是根因分析(RCA),是異常一個從檢測到根因分析的雙向流程。通過數據可視化的設計,這個流程可以被非常形象表達和快速理解。左側是對數據流的3次分類處理,右側是通過AI,如指紋識別一般找到當次事件與歷史記錄的共同特征,從而推斷當次事件的類型,根據類型推導根因。雙向分析最終匯聚成中間的結論。


          交易樹

          KNOWING實時生成交易樹,它展示的是一單銀行交易所經過的所有IT節點。節點內外和枝干的設計細節表達了該節點的不同狀態。IT運維人員可以從交易樹中快速得到交易的概覽信息。

          交易樹的生成


          子系統知識圖譜

          IT系統內存在著大量的子系統,KNOWING描繪出了他們復雜的關聯關系,這就是子系統知識圖譜。圖中可以根據部門分簇查看子系統,也可查看全量或單個子系統。若搜索某個子系統,則以此子系統為中心查看所有關聯關系。這樣,運維人員可以從不同的角度了解子系統并形成全局概覽。

          3種視圖查看:按部門、全量、單個

          按部門分類查看

          查看全量

          查看單個


          從以上的例子可以看到,可視化不是單純的圖表方式展示數據,數據可視化是將密集的抽象數據壓縮并還原為形象方式展示。由于抽象的信息是人類演化的后期發展出來的,生物性決定了人腦天生擅長處理形象的物體。所以信息越形象,需要經過大腦處理的區域就越少,獲取的速度就越快。

          https://v.youku.com/v_show/id_XNTgyMDkwODIzMg==.html?firsttime=95


          對設計與科技的思考

          IT技術逐漸滲透各個領域,行業與行業、技術與技術間逐漸融合??萍迹绕涫荌T技術和設計未來會如何相互影響?經過多年對后臺產品的設計以及經年的學習和深入思考,本人確實看到了一些趨勢也沉淀了一些見解。以下是我給紅點獎寫的一些思考。

          科技如何改變設計

          科技是人類能力的外化,科技是新工具即新形式。設計的本質就是做內容和形式的適配,所以,新科技的到來意味著形式的改變,而形式的改變會影響內容,這就需要重新做內容和形式的適配工作,也意味著新設計需求涌現。

          設計的未來挑戰

          從設計的角度來講,過去被設計物的傳達是單向靜態的,因為工業時代的事物相對簡單。我們慢慢在步入智能時代,物體會從靜態的變為智能動態的。所以,靜態的單向的傳達會逐漸變為動態的雙向的交互。比如原來的靜態的畫面通過顯示設備傳達設計師的意圖,如今還需要考慮到智能系統和交互設備所擁有的能力,根據使用者的不同反應給出反饋。因此,新設計需要考慮的元素會更多更復雜。


          未來已來。

          設計師想要在新的時代迎接挑戰,甚至是拔得頭籌,一方面,可以參考工業革命時期科技對設計的影響來預判未來的變化;另一方面,在新工具產生的時候,設計師與其掙扎糾結而故步自封,不如快速接受新時代的變化,學習新知識和運用好新工具。

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

          文章來源:站酷 作者:Z085740511 

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

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


          移動端信息超載設計怎么做?

          資深UI設計者

          移動端由于屏幕尺寸較小,而產品經常需要展示過多的信息,因此對用戶瀏覽行為進行設計,即“頁面信息超載設計”。

               從兩個大環境下看待這個問題,一個是移動端產品,另一個是PC端產品,這里我們主要討論移動端產品。

          由于移動端頁面尺寸較小的特性,常常無法像PC端那樣在一個頁面中展現出多信息多任務,因此在面對多級的信息架構設計時,最常規且傳統的做法是將某一場景/任務下的信息,通過設計頁面的跳轉/或增加頁面的長度來實現。

          但是一個現實的問題在于,用戶愿不愿意滑動?根據埋點數據顯示,在首屏沒有做好內容曝光的前提下,多數移動端頁面超過首屏的內容點擊量會急劇下滑,說明用戶很少主動的查看一屏以外的內容。

          因此對于移動端產品來說,一些重要的內容必須保證用戶在一屏內可以看到,而用戶有必要進一步閱讀的內容也需要做好用戶瀏覽行為的引導。

          從適用場景角度,可將信息超載的設計類型分為「頁面展示信息超載」和「頁面版塊信息超載」,本文將分為上下兩節針對此將進行詳細的案例分析分享。

          頁面展示信息超載

          根據不同的用戶需求以及適用場景,當用戶僅限于當頁的瀏覽時,如何保證大量的信息能有節奏、有目的的傳達給用戶是我們需要考慮的。

          在此類型中主要實現手段有隱藏化設計、場景分頁、無限加載、向下展開按鈕。

          隱藏化設計

          在探索更多業務場景的同時,APP的迭代不僅僅是優化更需要考慮功能的疊加,強調不同的場景聚焦于不同的核心信息上成為了重中之重,為了向用戶營造一種架構全面而使用簡單的用戶體驗,隱藏化設計的概念可以幫助我們拓展更多交互的可能性。

          優勢:

          1. 滿足用戶不同場景不同需求

          2. 產品架構更清晰,用戶使用更簡便

          劣勢:
          沒有提示和線索的隱藏則需要做好新手引導,如早期微信小程序的下滑打開方式等。

          適用性:
          適用于一些多場景的產品,和用戶場景具有明顯行為特點的產品功能模塊中

          交互細節:
          結合上面的案例展示,主流app的隱藏化設計主要體現于卡片模態面板、屏幕擴展、浮窗。

          卡片模態面板

          自從19年ios13發布新設計特性,卡片模態面板就陸陸續續被運用到各大產品中。

          1. 使用熱區高頻于屏幕的中下方,且手勢方便快捷,適合單手操作,因此廣泛的用于一些出行類的app

          2. 具有可伸縮的特性,可適用于一個頁面的不同場景

          3. 處理當前模態面板的任務時,仍然可以看到面板后的界面環境,并不會讓用戶有太大的抵觸感。

          4. 但是使用時需要注意,模態的用途是切換任務狀態,不要僅因為喜歡它的樣式和動效而使用。

          5. 不適合用于展示沉浸閱讀內容,建議設計于復雜度不高的支線任務。

          屏幕擴展

          如案例展示的系統負一屏、蝦米音樂)

          當頁面的功能屬于重要但低頻時,可以考慮使用屏幕擴展進行設計。

          此類型常見的交互設計方式有兩種:一種是常見于各大手機系統主頁以及微信的“負一屏”設計;另一種是app首頁的“二樓”設計,如上面案例展示的“蝦米番你街”,還有淘寶之前推出的“淘寶二樓”。

          使用時需要最注意的是:

          此形態的設計和產品賣點已經運營思路是緊密相關的,需要綜合考慮

          浮窗

          這個控件的使用可能會和屏幕擴展的使用聯系較為緊密,從微信前期浮窗的使用情況來看,不排除是為了解決當使用小程序時無法接受到新消息,但又怕退出后無法找回而產生的焦慮感而誕生的功能。但同樣也是為了解決用戶不同場景的不同任務需求。

          但當浮窗中只有一個待看文章時,需要單擊浮窗后再點擊熱區才能打開內容,兩次點擊行為可以考慮是否有優化的空間。

          除了隱藏化設計,以下傳統頁面信息過載的處理方式也值得思考:

          場景分頁

          翻頁場景常伴隨著分頁器的使用,通過上下頁翻閱來進行信息瀏覽。

          優勢:

          1. 快速告知用戶信息量

          2. 可自主性選擇瀏覽內容

          3. 便于定位回找

          4. 瀏覽信息更有節奏感

          劣勢:
          需要點擊跳轉來獲取更多內容,如果設計不符合使用情景,會在一定程度上打斷用戶的思路,很有可能就會導致用戶的流失。

          適用性:
          移動端中可適用于一些對內容的掌控更強的場景,需要用戶更專注,如后臺表單等,

          但隨著移動互聯網的發展與移動設備的普及,早期的網頁端社區類產品和線下書籍的閱讀也開始嘗試轉戰移動端,可受限于功能形式和用戶習慣的使用差異,以至于需要在兩端之間做好平衡,去考慮用戶操作習慣以及兩端適配的問題。

          因此,較為早期的一類互聯網產品和由線下普及到線上的場景,會采用分頁的方式來綜合用戶在兩者之間的行為習慣,我們也可以看到像知乎這類普及于移動端的產品都并沒有選用分頁的方式進行內容的設計,而是直接設計貼合用戶移動端行為習慣的交互方式。

          交互細節:
          在移動端使用分頁器,一般常見為滑動條和動作面板這兩種控件進行設計。

          仔細去體驗了這兩款產品,發現它們的分頁并不是單純意義上的分頁,而是整合了無限加載與分頁選擇。

          類似于無限加載下滑,但是會自動定位到具體頁數上,比如我滑了 6 次,頁數就到了第 2 頁了。

          從這里看出,移動端出現內容加載的情況時,還是以無限加載為主要方式,即使有分頁,也是輔助作用。

          引發思考:

          滑動條的選頁方式也考慮在滑動滑塊的過程中頁面展示跟隨滑塊位置而變化,選定內容位置后點擊確認,否則可以點擊取消回到選擇前原來的位置。

          無限加載

          即無限滾動加載,通常以 Feed 流/瀑布流的形式出現于產品中,允許用戶通過滾動瀏覽大量內容而不刷到頁面最底層的技術。當你向下滾動頁面時,這種技術將會持續地刷新頁面。

          優點:
          沉浸式信息瀏覽,不會被打斷,增加用戶參與度,促進用戶停留更長時間。

          比起小熱區范圍的點擊行為,滑動對于用戶來說更為簡便更友好,尤其在移動端可以快速瀏覽到感興趣的內容

          缺點:

          1. 無法預知有多少信息,用戶容易產生迷失感,卻無法回定位內容

          2. 對頁面性能要求更高,用戶向下滾動頁面越多,頁面上承載的內容就越多,會導致頁面性能越來越慢

          3. 對設備資源要求更高,在含有大量內容的app中,資源有限的設備(如iPad)可能由于其已加載的內容信息過多而開始降速

          適用性:
          在移動端更方便使用,適用于快速瀏覽內容和發現內容的場景,如休閑娛樂為主的社交型產品/資訊性產品

          交互細節:
          對于這類交互形式,最高頻的用戶需求是回到頂部和資訊內容的刷新以快速尋找感興趣的內容。


          回到頂部

          這類需求常規解決問題的方式是點擊界面頂部回到頂部(ios用戶常用操作),除此之外最常規的操作是在頁面右下角的回到頂部懸浮按鈕。

          還有一種結合用戶心理認知的交互行為設計——底部欄首頁icon的利用,如上面案例的淘寶和同花順,點擊首頁icon可回到初始位置重新加載,淘寶/同花順過把這一隱藏操作顯性化,并且合理利用用戶回到頂部的需求,當用戶不斷下滑頁面時icon變成火箭/刷新的樣子,點擊后立即回到頂部并可進行所有資訊的重新瀏覽。


          尋找感興趣的內容

          無限加載最大的優勢就是能幫助用戶快速瀏覽以找到感興趣的內容,但當頁面本身預加載的內容就都不能吸引用戶興趣,就需要考慮如何通過設計幫助用戶找到真正感興趣的內容。

          如上面案例的同花順和知乎,當瀏覽同花順時,長時間沒有點擊進入任何一篇文章時,在瀏覽中部就會出現刷新提醒;當在知乎的搜索結果頁滑動大概3屏后,知乎會分析判斷用戶沒有找到他想要的信息,于是出現“向知友提問”的按鈕,引導用戶直接提問自己想要的(亮點之處在于對用戶行為進行潛意識分析,而不是全程展示這個提問按鈕,避免減少用戶實際瀏覽區域,造成干擾)。

          向下展開按鈕

          在pc端的網頁中,為了折中分頁和加載的利弊,常常會選用“查看更多”的按鈕,點擊后向下繼續進行加載,同時也能給用戶更多的停頓和節奏去主動的獲取更多的信息。

          而對于不停強調活躍度的移動端的產品來說,向下展開的“查看更多”按鈕,不僅僅只是折中的思考,還有運營層面的考慮。

          (向下展開更多的情況還分為兩種,一種是向下展開更多選擇,另一種是向下展開看到全部內容,以下講的更多是后者)

          優勢:
          產品運營層面

          1、增加點擊促進引流/轉化

          引導注冊、關注、付費等的轉化

          2、為精準推薦提供更多依據

          網站可以通過用戶點擊“閱讀更多”按鈕的行為,獲取有效點擊的用戶數,精準收集用戶閱讀喜好,開發完善用戶畫像,便于日后精準推送某個作者、某類作者、某類文章給點擊的用戶以及相似的用戶群體,優化智能推薦。

          3、判斷文章真實質量

          通過文章點擊的人數、點開率等對創作者進行管理,便于把控平臺內容質量,重點支持優質創作者,從而建立更好的內容生態。

          用戶層面

          1. 增加半遮面的神秘感

          2. 保證穩定快速的閱讀體驗,提升加載性能

          3. 降低閱讀成本

          劣勢:
          若不是為了提升轉化率或者增加曝光率,僅是展示型文章,就會犧牲掉部分的用戶體驗。

          適用性:
          適用于需要考核的內容創造者、需要收集更多用戶數據的產品

          總結

          移動端由于界面空間有限,具有「一個界面一個任務」的特點,因此當面臨產品增加功能時,不能一味在界面中進行功能的堆積排列,而應該更強調于頁面場景化的設計,同時頁面中的每一個細節設計都應該做到恰到好處,減少用戶思考是否需要使用的精力。

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

          文章來源:站酷 作者:六月星光

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

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


          用戶體驗設計-基本概念,與藝術的區別,工作中的職責,職位上的分類

          ui設計分享達人

          一、設計和藝術的區別

          藝術:

          藝術是感性、天馬行空、富有創造力的,表達創造者的個人意識

          設計:

          設計是理性、精密的,為了解決用戶的問題

                

          (你看得懂嗎?你有什么見解?為什么大家見解不一樣?這就是藝術的魅力)


          二、用戶體驗及用戶體驗設計

          什么是用戶體驗?——————使用一個產品時的主觀感受

          用戶體驗設計?———————為了提升用戶體驗而做的設計

           

          1.用戶體驗設計

          首先要解決用戶的某個實際問題--讓問題變得容易解決--最后給用戶留下深刻的印象。(視覺只是其中一部分,并不是設計的全部)


          Eg:充電插座的苦惱--錯開位置

          尿液四濺--廁所里放一只蒼蠅,用戶會去瞄準上廁所(設計美觀且有趣味性)

           

          2、用戶體驗設計的特征

          (1)嚴謹、理性、創意

          先關注要解決的問題----其次思考有趣的創意幫助用戶得到更好的體驗。

          (2)提供特定問題的解決方案

          設計目標是什么,為什么人解決問題,如何解決

           

          Eg:鋼鐵俠u盤死死按住關機鍵;樓梯是為殘疾人設計的嗎,我懵了?


          (3)不讓用戶思考

          用戶感到挫敗,會放棄。你的設計不要用戶一頭霧水。

          (我到底怎么走?)


          (4)趣味橫生

          尿液四濺貼提示語效果不好,放一只蒼蠅效果很好?

          因為:抓住了用戶的心理和行為習慣,同時充滿趣味,吸引用戶

           

          Eg:path推出的商店功能,在里面買自己喜歡的貼紙,搖晃手機貼紙也搖晃,感覺很好玩吧~帶來好的體驗感

           


          3.用戶體驗設計師遇到問題如何思考




          三、各種設計師的區分

          1.怎么和別人解釋用戶體驗設計師

          A:“你用一個網站的時候,有沒有出現:某個功能找不到了,點擊按鈕沒有反應,填寫的信息不知道哪里錯了總是不能提交成功?”

          B:我們的工作就是改善這種情況,讓你使用網站時有一個好的體驗,同時能讓用戶感到愉悅和不受打擾。

          工作中:除了考慮用戶還要讓公司有利可圖


          2.交互設計師

          通過分析用戶心理模型、設計任務流程、運用交互知識把業務邏輯(需求/功能)以用戶能理解的方式表達給用戶,最終實現產品戰略(公司需求和用戶需求的平衡點)的過程。

          即:從公司戰略角度考慮問題,在公司需求的基礎上讓用戶覺得好用、易用

           

          交互設計師的產出物:不是原型,你不是畫圖的工具,重要的是解決問題的能力

          工作內容:競品分析文檔、用戶反饋整理、流程圖、設計草圖、原型...

           

          3.視覺設計師

          原畫:設計者很強的手繪能力,作品充滿藝術表現力

          平面:傳達思想,較強的感染力

          推廣運營設計師:突出重點抓眼球

          UI:良好的審美、具備一定的交互知識

                                (原畫)                              (平面)                                              (推廣運營)

          4.用戶研究員

          通過各種分析和研究,深入了解用戶特征,用戶行為習慣,為產品運營推廣提供必要的方向

          工作內容:市場分析、競品分析、創建人物角色、問卷調查、焦點小組、用戶訪談、可用性測試

           


          四、用戶體驗設計師的作用和價值

          1、用戶價值商業價值

          用戶通過優秀的設計快速達到目標,企業也會財源滾滾

          eg:改變一個按鈕的顏色,點擊率提高35%;優化操作流程,轉化率提高50%...


          2、項目價值

          跟進各個環節,保證產出物質量

          推進統一及標準化,提升設計效率

          促使項目流程合理,有規劃

           


          五、交互設計師的作用和價值

          1.工作內容

          分析重塑需求;與用研配合,了解用戶特征與行為;設計結構、流程、界面、動態效果;跟進視覺、前端、開發;及時整理上線問題,準備下次迭代...


          2.品牌價值

          維護和突出品牌形象,統一的設計理念

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

          文章來源:站酷 作者:一團雯子

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

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


          譯文:開啟新時代的響應式網頁設計

          ui設計分享達人


          ///

          它是如何開始的-固定屏幕

          在千禧年來臨之前,我們首先開始在單一視圖屏幕中進行UI設計,這類屏幕在當時最流行的尺寸是640x480。大多數時候,我們甚至沒有考慮讓屏幕滾動,而是在特定區域或文本局部區塊中設置了內部滾動條。毋庸置疑,當時的大部分網頁也是用Flash或HTML創建的,并帶有用于布局的表格。那是在智能手機出現之前,隨著事物的發展,我們經歷了第一個向“響應式”設計的根本轉變。我們已經走了很長一段路,CSS已得到長足的發展,“響應式”網頁設計從2010年開始才真正獲得了專有工具。

          圖表來源: https://www.webdesignmuseum.org/web-design-history


          ///

          它現在怎么樣-響應式設計

          隨著CSS3的發布,我們獲得了對“媒體查詢”(Media Queries)的訪問權限(譯者注:隨著移動互聯網的興起,我們需要適配多種移動端設備,這就需要用到Media Queries,即“媒體查詢”),此后不久,Ethan Marcotte在2009年底創造了“響應式設計”一詞。十多年來,我們一直使用“響應式網頁設計” (RWD) 創建網頁布局,作為一種網頁設計方法,僅需基于一種屏幕尺寸進行設計,“響應式”使我們的設計能夠適配各種設備和屏幕尺寸。

          在早期,當移動電話還不兼容媒體查詢或JavaScript時,“移動優先”和”漸進式增強”的概念就成為了非常流行的方法,當時有很多CSS完全不受支持。

          用我們今天的話來說響應式設計,我們認為頁面的布局要適配整個瀏覽器、屏幕大小和那些需要投射到整個布局上的限制。當需要設計從桌面端調整為移動設備屏幕所需的尺寸時,我們使用“媒體查詢”來更改整個頁面布局。

           

          ///

          它的未來是什么-組件驅動

          很快,使用這種“響應式”設計方法可能會被認為與使用表格進行頁面布局一樣過時—就像我們在90年代所做的那樣。

          我們通過基于viewport(視口)的“媒體查詢”獲得了許多強大的工具,但我們也缺乏很多適配的可能性,因為“媒體查詢”是一個適用于整個頁面的通用解決方案,并且對每個用戶來說都一樣。我們缺乏響應“用戶需求”的能力,也缺乏將“響應式”樣式注入“組件”本身的能力。


          當我們談到組件時,這里指的是頁面上的“元素”,這些元素可以由其它“元素”的集合組成。例如卡片、橫劃卡或推薦模塊之類的UI內容,每個“塊”都由各種更小的“構建塊”組成。這些組件拼湊在一起構成我們的網頁。我們可以使用 global viewport information(全局視口信息)來設置這些組件,但它們仍然無法擁有自己的風格。當我們的設計系統是基于“組件”的而不是基于“頁面”的時,這使得它變得更加困難。

          好消息是這個生態系統正在發生變化,而且它正在迅速變化,這需要我們進行一些思維轉變:考慮如何設計和定義組件樣式以及它們如何適應周圍環境。

          CSS正在不斷發展,“響應式”網頁設計的新時代即將到來。從目前的情況來看,自從我們第一次引入 “響應式網頁設計” (RWD) 以來,僅僅10多年的時間,這個生態系統已經準備好迎接CSS發生一些相當大的改變。


          讓我們深入研究一下可以期待哪些類型的變化,這會如何改變我們的設計方法,以及我們如何考慮界面設計。

           

          ///

          用戶能夠設置基于個人偏好的“媒體查詢”

          簡單來說,我們可以期待新的基于偏好的“媒體查詢”來幫助我們更好地“響應”用戶。它們將使我們能夠根據用戶自己的特定偏好或需求來設定網頁樣式。這將使我們能夠根據用戶的體驗偏好來調整用戶體驗。

          這絕不是一個完整的列表,但能給你一些想法,這些基于偏好的“媒體查詢”可能包括:

          這些將幫助我們構建更具活力和個性化的網頁體驗,專門滿足我們用戶的專屬需求,尤其是那些希望網站易于訪問的用戶。更進一步說,這些基于偏好的“媒體查詢“尊重任何用戶已經在操作系統設置的偏好。舉個例子,當用戶的操作系統偏好設定為“減少動效”時,他們很可能不喜歡你頁面上的超級華麗的介紹、加載或飛入的動畫動效。我們應先尊重他們的偏好,并為其他人提供“動效增強”的體驗。

          另一個流行的媒體查詢是@prefers-color-scheme(配色偏好設定),它允許我們根據用戶的偏好和操作系統中的設置將我們的設計更改為“亮色模式”或“暗色模式”。這不依賴于用戶需要手動來更改“暗色模式”,它會自動發生。

          ///

          “容器查詢”為你的設計系統注入新的生命力

          CSS 中最令人興奮的新興領域之一是“容器查詢”(container queries),通常也稱為“元素查詢”。從基于“頁面”的“響應式”設計到基于“容器”的“響應式”設計的轉變對發展“設計系統”的作用價值不容低估,盡管今天使用它并不安全,但重要的是要了解其發展方向。

          簡而言之,“容器查詢”將允許我們基于“父級容器”而不是整個頁面來設置規則。這意味著任何組件都更加獨立,與現代設計系統保持一致,真正成為“即插即用”模塊,可以轉移到任何頁面或布局,而且無需根據新環境重新考慮所有內容。

          “容器查詢”為我們如何規劃、設計和構建特定組件提供了一種更加動態的方法,因為組件本身擁有它的響應信息。

          甚至Ethan Marcotte自己也表達了為什么“容器查詢”如此重要,我們應該研究一下。

           

          ///

          考慮各種形態因素

          由于各種“形態因素”(form factors)的變化和擴展,例如新的屏幕類型,可折疊屏,我們需要“媒體查詢”來考慮這些場景。在這里提到的所有內容中,請記住,這是最具實驗性的,并且只是一項正在進行的工作,仍在嘗試解決我們可能遇到的任何復雜問題,同時考慮未來“形體因素”可能會如何發展。

          在可折疊屏場景中,原型中有一些“媒體查詢”可以讓你定位屏幕跨度以及我們如何讓內容根據新環境進行適配。例如,你可以在一個屏幕上放置一個收起的側邊欄(或菜單),并允許內容在另一個屏幕上展開并隨頁面滾動。

           

          ///

          為什么我們需要它?

          我知道你在想什么,我們已經從事網頁設計并使用“響應式”來進行網頁設計10余年了。我們對其相當滿意,那么為什么要改變呢?如果我們真的以終局視角來看響應式設計,那么它就是關于個人用戶的用戶體驗設計。我們正朝著一個與每一位個體用戶高度相關的時代邁進。我們的網頁體驗應該去適應用戶的需求偏好。隨著設計系統的發展以及我們如何創建更便攜的網頁,諸如“容器查詢”之類的工具將變得非常有意義。

          配圖:CSS 將基于各個層級來確定用戶的最佳體驗

           

          考慮到這一點,這意味著我們現在可以使用基于頁面的媒體查(包括跨越屏幕的細微差別)來設計宏觀布局;使用容器查詢的組件設計微觀布局;使用基于用戶偏好的媒體查詢,根據用戶獨特的偏好和需求定制用戶體驗。

           

          對于新的響應式設計,有許多新概念正在被原型化和概念化-請看下面的延伸閱讀。所有這些協同工作的方式需要我們從根本上轉變我們對設計和用戶獨特體驗的看法。我們需要更加適應這樣一個事實:即我們的設計不是靜態的,不僅在布局上,還有在用戶可獲得的體驗中,我們需要學會在這種模糊性中做出計劃。網頁和設計的未來變得越來越復雜,我們需要適應和挑戰自己,理解“新響應式”體驗的意義。

           

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

          文章來源:站酷 作者:百度MEUX

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

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

          向世界知名的設計師致敬系列之二:喬納森·伊夫,?馬克·紐森

          藍藍設計的小編

          向世界知名的設計師致敬系列之二:喬納森·伊夫,馬克·紐森

          向世界知名的設計師致敬系列之一: 雷蒙德·羅維,約恩·伍重,菲利普·斯達克,榮久庵憲司,亞歷克斯

          藍藍設計的小編

          向世界知名的設計師致敬系列之一: 雷蒙德·羅維,約恩·伍重,菲利普·斯達克,榮久庵憲司,亞歷克斯, 亞歷克斯·塞繆爾森

          B端設計復盤系列——表單頁

          ui設計分享達人

          01表單概念

          表單頁作為基礎通用組件,也是B端產品中臺、后臺出現比較頻繁的頁面之一??此坪唵蔚捻撁嫖覀冊谠O計時卻有很多值得推敲的點,在細節處提升用戶易用度,我通過日常的學習和公司項目,在這里總結復盤了自己的經驗。

          表單的適用場景比較廣泛,常見的基礎表單比如登錄注冊頁面,這一類往往信息簡單,格式比較固定,除此之外就是分步表單、高級表單。常見的場景主要用于新建信息、申請、客戶信息、商品信息等等。這類表單可能存在復雜邏輯關系和功能,有時會給我們造成困擾。以下我將以這一類表單為主要案例,一一進行拆解。

          登錄注冊頁:表單內容簡單,操作簡單。

          分步表單:具有流程化特點,具有先后邏輯關系,內容較多的業務類型,比如轉賬,新建商品訂單等。分步填寫可以減緩用戶壓力,起到安撫用戶情緒的作用。

          高級表單:主要用于需要一次性輸入、提交 大批量數據的場景。也成為分組表單,和分布表單一樣都是為了減輕用戶填寫壓力。

          02設計原則

          首先我們需要明確表單頁的主要功能:表單頁承載了系統中絕大多數系統數據的錄入、增刪、修改、查看,是系統中人機交互最為頻繁和典型的數據媒介。表單頁通常需要用戶錄入大量的信息或數據,在設計時我們的核心目標應該是讓用戶明確當前表單頁面要完成什么任務,輕松理解項目含義及生效的結果,思考如何幫助用戶高效、準確、輕松的完成任務。

          表單設計基本原則:明確、高效、安全

          明確:用戶可以快速定位重要信息和目標選項,表單文案和組件可以準確傳達任務含義

          高效:易理解易操作的交互方式,盡量減少交互步驟,減少用戶任務路徑步長,配合合理的信息布局引導,準確的選擇合適的組件傳達信息,幫助用戶高效的完成任務。

          安全感:操作前有效的防錯機制,操作中有明確的狀態反饋與容錯,允許糾正錯誤。操作后及時的保存,取消機制。

          03表單構成

          一個完整的表單通常包括表單標題、表單標簽、表單域、提示信息、占位符、操作按鈕幾部分。

          標題:起到說明表單模塊的作用,是用戶快速明確任務和定位頁面位置的重要標識。

          表單標簽:內容項的名稱,說明對應填寫項含義及說明用戶該填入什么信息。

          表單域:表單的核心操作區域,用戶操作最頻繁,最集中的地方,這里的可選擇組件樣式也會根據內容需要而變化,類型最為豐富多樣。需要注意的是同一類型的組件需保持一致性原則。

          占位符:一般出現在用戶未填寫內容時,用于輔助提示用戶錄入線索。

          提示信息:輔助提示用戶的作用。分為普通提示和錯誤提示,也是很好的防錯糾錯機制體驗。

          操作按鈕:“結束”表單任務的觸發器,用于向服務器提交數據或者放棄操作。


          表單標簽

          表單標簽樣式常見的有4種,左對齊標簽、右對齊標簽、頂部標簽和行內標簽,不同的對齊方式各有優勢和缺點,適應在不同的場景。

          右對齊標簽(冒號對齊)

          優點:標簽指向明確,操作效率高,節約縱向空間

          缺點:可讀性低,不適用于狹長空間或需要適配多語言的頁面

          場景:普通表單填寫,多用于web端

          左對齊標簽

          優點:閱讀性高,節約縱向空間

          缺點:不適用于狹長空間或需要多語言適配的頁面,操作效率低

          場景:詳情陳列

          頂部標簽

          優點:視覺對齊舒適,節約橫向空間

          缺點:縱向空間利用不高

          場景:多用于移動端表單填寫,多語言適配頁面

          行內標簽

          優點:視覺對齊和空間最節約的方式

          缺點:當用戶輸入狀態時,標簽消失,增加用戶記憶負擔

          場景:多用于登錄注冊,修改密碼等內容極少,不需要記憶的頁面


          表單域

          表單域是一個表單頁面的主體部分,其內容豐富多樣,從而它可選擇形式也最多,不同的內容我們在設計的時候應該選擇最合適的組件,以及應該注意同類型內容選擇統一的組件進行設計。

          定義操作框大小

          在實際項目中我們往往會遇到內容長度不能統一的時候,那怎么這種情況該怎么處理呢?

          以往我的處理方式是強行拉長對齊,但我們可以發現強行對齊的時候,視覺沒有得到很大優化,反而在隱喻傳達給用戶錯誤的信息,當用戶在操作1功能的時候,可能會錯誤的認為這個選項可以選擇很多,因為我們給的選擇框很長,而實際上它只能選一個。這樣就會給用戶造成不必要的理解成本。

          比較好的方式處理方式是我們設計組件庫時就設定不同尺寸的操作框,來適應不同場景下不同內容需求。如果不能對齊,那就讓它參差不齊。

          提示信息

          提示信息在表單中起到提示、糾錯的作用。形式主要有以下幾種:行內占位符提示、操作框下方文字提示、tost提示、氣泡提示。

          行內占位符:這是一種基礎應用,它即可用于占位,也可用于任務說明提示,當我們說明文字很少的時候可選擇的一種方式。需要注意的是內容務必簡潔易懂,減少閱讀成本,不要說“正確的廢話”,語句應該是完整的陳述句。

          氣泡提示:當提示文字很多,主要用于對標簽的名字釋義時,氣泡彈窗是個不錯的選擇。它的優勢在于可以將更多內容折疊,不占用空間,缺點是不直觀,增加了用戶操作步驟。

          Tost提示:Tost提示一般是在出發操作按鈕后給出的提示,可以是操作結果提示,也可以是內容填寫提示。

          操作框下方文字提示:當提示內容很多時,還可以考慮操作框下方提示,多用于對輸入內容的輔助說明場景。應用場景包括以下幾種:

          組件組合后在表現層的設計

          提示信息在頁面中還是一個輔助性的角色,常規情況下的視覺層級應該是 表單內容>表單標簽>提示信息。當用戶有錯誤操作時“錯誤提示”優先級是最高的,我們一般用帶有警示性的顏色給以醒目顯示。

          為了使用戶更好的辨別任務項,需要注意組件與組件、組件與說明文字之間的間距差別。

          04交互方式

          表單中的交互方式根據其內容選擇對應最合適的形式,內容簡單而少的可以直接在原位編輯,操作快捷,關聯性最強,所見即所得,內容容量低于5個。其次內容較多的,或者針對全局操作的可以選擇氣泡卡片,比如全局設置等。第三種是彈窗或者抽屜,兩者形式是一致的,區別在于對內容的承載量上,彈窗容量較小,內容較多的情況下抽屜式彈窗(側拉彈窗)是更好的選擇。最后,內容承載最大的就是頁面跳轉,同時這種方式與原頁面的關聯性最弱。

          組件構成表單,實際項目中,我們的表單往往內容會多而復雜,設計時可以考慮在布局上優化去提升使用體驗。

          常用的方式有幾種:信息分組、錨點定位、標簽頁、分步驟。

          在格式塔鄰近性原則中提到,人們將彼此接近的事物、元素,傾向于認為它們是相關的。在設計中很早就運用到這種認識傾向。所以我們在信息分組時可以運用設計手法將相關信息從視覺上區分開,提升信息閱讀有效率。

          分組方式:

          1.簡單的內容使用標題分組或卡片分組就可以達到目的。

          2.而內容很多,組別之間沒有關聯性時用標簽分組

          3.頁面內容很長需要連續下滑操作時,錨點定位就可以提供便捷的操作體驗。

          4.在任務有先后邏輯關系時,分步驟是最好的選擇。

          標簽分組與錨點定位在表現形式上類似,區別點在于操作后的結果。標簽分組切換標簽后頁面數據會刷新,一般沒有自動保存功能,錨點定位則是每次點擊定位頁面不刷新數據,始終保持在同一數據頁面。


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

          文章來源:站酷 作者:將晚秋

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

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



          C端產品分析方法總結

          ui設計分享達人


          做一個完整C端項目前,從產品思維得理解、需求分析到場景分析,通過以上分析得出結論,進而制定我們的設計目標,把設計目標落地到解決實際的設計問題,內容較多,大家可以根據上述目錄來進行選擇性閱讀。


          1.1產品思維包括


          1.1.1 用戶思維:深入了解用戶的需求和場景


          了解用戶心理:“心理”主要是指用戶的情緒,只有了解用戶的心理狀態,才能知道他們在接觸到或者使用我們的產品時是正面的情緒還是負面的情緒。正面情緒需要我們引導去實現轉化,負面情緒需要我們安撫以避免跳出和口碑的損失。


          把控用戶行為:最終目的還是引導用戶行為,讓用戶按照我們的計劃進行產品的交互、操作,從而實現對用戶的有效管控和轉化。例如:上品店慶推出“購物省錢節”的概念,聯合商家推出各種優惠活動,就是抓住用戶在購物時想省錢的心理,通過降價、優惠券等方案讓用戶在選購商品、提交訂單和結算階段都保持高漲的情緒,從而推動用戶最終完成付款。


          解決用戶痛點: 在完成上面的分析后,我們最終需要把調研和分析結論落地為設計方案,前提是要關注用戶當前的情緒是負面的還是正面的,如果是負面的情緒,我們可以通過補償、安撫等方案對用戶進行留存。例如:在等待外賣送達時,配送信息頁一般都會有預估時間、位置等信息,讓用戶有一定預期。同時如果遲到時間過長,也會通過準時寶等規則給予用戶優惠券補償,這些都是負面情緒的安慰。



          1.1.2 項目思維:主動發現并解決用戶體驗過程中遇到的問題

          項目思維主要指,我們要具備極強的發現問題、輸出方案、推動落地的能力。這就是設計師的項目思維和推動力,可以保證自己的想法快速落地、推動設計優化并盡快上線。



          1.1.3 商業思維/業務思維:將設計目標與業務目標緊密結合

          商業思維是指,拉新:通過產品、運營和營銷策略讓用戶下載產品。留存:讓下載的用戶保持活躍度,留住用戶,便于轉化。轉化:讓用戶按照我們的業務規劃去注冊、分享、下單、付款等動作,一步步帶入我們的圈套,完成關鍵操作。變現:將用戶行為變現,內容產品的活躍度可以帶來廣告營收,電商產品的成交額就是業務收益。



          2.1產品思維的重要性


          2.1.1 Ui設計師和產品經理的區分界限


          相同點:在實際工作中,設計師和產品經理的目標在本質上是一致的,都是解決用戶的痛點、滿足用戶的需求,為用戶提供體驗更好的產品,并在此基礎之上完成用戶轉化,實現收益。作為一個設計師,我們對產品了解的深度不一定比得過產品經理,但是廣度上你應該要求自己和產品經理保持一致。只要掌握產品的架構、流程和業務的模式、原理即可。



          不同點:UI設計師更注重通過用戶體驗來留存用戶,產品經理更多地考慮轉化用戶和變現的途徑。



          沖突點:這時就會產生一些沖突和矛盾,有時為達到業績目標,產品經理或其他業務方可能會提出有損用戶體驗的方案或者策略。


          想要解決與產品沖突得問題,就要充分調動自己的產品思維,保持習慣性的產品思維,才能始終保持和業務一致的目標。和業務方站在一起,才能找到設計和業務的共同目標,并將業務目標轉化為可執行的設計目標,才能為設計帶來更高的價值。


          2.1.2 UI/UX設計師的真正價值是什么


          這里就繞不開這個話題----產品思維。別人眼里的UI設計師,很多人會認為設計師的工作就是設計流程頁面、視覺效果。這些工作看起來只是錦上添花,即使沒有專業的設計師來設計,可能只是流程、控件位置不太合理、樣式和顏色不太好看而已,并不會影響產品的開發和上線。其實,設計師的價值不僅是藝術價值,更重要的是為業務帶來價值。


          UI/UX設計師,關鍵在于對用戶場景、對產品細節的敏感度,這也是其他崗位不具備的技能。實際工作中這些細節問題,很容易區分出來專業性的差異,因為UIUX設計師是距離用戶最近的人。我們設計頁面,用戶在頁面上操作和獲取信息。我們設計流程,用戶通過流程完成各自的需求。我們設計的產品流程、頁面,是用戶直接接觸和使用的東西?;谶@個原因,設計師對用戶的需求、反饋是最了解和最敏感的,我們可以通過用戶的反饋、操作數據把控用戶的心理狀態和行為方向。無論是在方向上還是從細節出發,挖掘和洞察用戶需求,設計師有明顯的優勢。

          所以UI設計師真正的價值就是通過自己對細節和場景的思考,自我驅動,找到設計優化、產品迭代、業務提升的機會點。想要找到這些機會點,你需要培養自己的產品思維、項目思維和商業思維。


          2.1.3 如何培養自己的產品思維


          01、多與需求方、業務方(產品經理、運營、市場等崗位的同事)溝通,在參加需求評審的時候,深入了解業務和產品的特點、原理。


          02、了解產品流程:在接手某項業務或產品時,先利用思維導圖對產品的架構做一次梳理,通過功能結構圖你可以清晰地看到產品應該有的功能。在掌握架構的基礎上,對產品的核心流程再進行一次梳理,包括線上、線下所有的流程節點、體驗接觸點和不同用戶端的流程觸點。


          03、多做競品分析,從競品中尋找靈感和產品感。怎么做競品分析具體可查看我的其他文章,競品分析維度的確定。


          04、持續不斷地培養自己的思維能力,深入思考、多做歸納總結和分析。在做設計的時候我們也可以讓自己的思維慢下來,多去思考:思考一下為什么做這個需求?對用戶有什么價值?對產品有什么價值?對業務有什么價值?設計、產品、運營應該怎么做才能達成這個目標?我們的做法對業務、對產品有什么影響?設計方案能不能很好地平衡業務和體驗的關系?



          2.1為什么要進行需求分析

          01、用戶不知道自己真正想要什么。

          02、用戶難以說出自己的真實需求,用戶在闡釋自己的需求時,就會不自覺地粉飾和解釋自己赤裸裸的本質需求。例如:那些刷視頻就能領紅包得產品,但為什么它最近不火了,這類產品的人群,本質需求是:通過刷頁面領紅包,獲取更多的錢,這類人根本不關心內容是什么、內容質量怎么樣,這就造成了內容的觸達效果非常差。


          2.2 用戶需求分析步驟


          2.2.1 篩選出目標用戶


          01、了解我們產品的目標用戶群體和現有產品用戶群體,掌握用戶基本信息,分析用戶特征。(Who)用戶是哪些人:性別、年齡、地域分布、學歷收入等。(What) 用戶有什么共性。(Why)為什么選用我們的產品。(Where/When)在什么場景下使用我們的產品。


          02、通過了解用戶得到的所有信息,然后創建用戶畫像,得出結論。那么如何創建用戶畫像呢?


                 001、人物創建:創建一個虛擬的用戶群體中的一員,利用我們上面提到的用戶相關信息,可以給他/她一個插畫風格的照片幫助我們具體化這個用戶的人格和形象。然后列出他/她的基本信息,給他/她定一個社會角色,比如:小王,男,28歲,銷售經理,我們產品的熟練用戶,月收入2萬,學歷本科。

                  

                 002、分析動機:這個人物用我們的產品想干什么;這個人物對我們產品某個功能使用較多,需求較強的原因是什么,想達成什么樣的個人目標。


          2.2.2 提煉核心需求


          可以通過用戶畫像推測用戶的心理特征和行為偏好,積累了以上信息,你就比較容易進行需求的分析和挖掘了,提煉出解決用戶需求的核心的痛點。例如:解決了用戶在特定場景下的某一個核心痛點,滿足了用戶在當前場景下特定的訴求/需求。例如:共享單車產品就是解決了從車站、地鐵站到家、工作單位最后一段距離的出行痛點。例如:地圖軟件解決的是陌生地區找不到路和易違章的痛點。


          2.2.3 找到本質需求

          01、了解人性:做設計就是做人性,只有把握好人性的特點才能更好地滿足用戶心理,進一步引導用戶行為。馬斯洛需求層次理論,人的需求從低到高可分為 5 個層次:我們就可以試著洞察用戶在特定場景下的本質需求到底是什么了。生理需求(呼吸/食物/水):現代社會其實就是對生存條件的追求;安全需求(避免自己受到傷害);

          社交需求(愛與被愛/社會關系/地位)對情感的需要;尊重需求(被自己認可/被他人認可和尊重)對穩定社會地位的需要;自我實現需求(道德層面/內心層面的追求和滿足)。


          所以用戶的本質需求無外乎:生存、金錢、情感、名利、心理滿足這幾個方面。


          02、將用戶敘述的需求,轉化為本質需求:比如:有的用戶說,上品商場最近優惠券怎么少了?我都不想去上品買東西了。用戶表意是嫌優惠券少,如果我們草率得出:增加優惠券運營力度的結論太過于表面,其實用戶的本質是嫌商品太貴了,他們的本質需求是省錢,少花錢且買到想要的東西。而這類用戶是對價格極其敏感的用戶,增加優惠券只是其中一個策略,是無法滿足他們根本需求的。根據他們省錢的本質需求,我們可以給他們更多地推薦低端商家,哪怕沒有優惠券,還是能提升一波 GMV。


          進而轉化成設計目標為,要通過我們的設計能力,給用戶營造一個很省錢的氛圍,而不是一味地給用戶降價或是發優惠券。規劃更多的秒殺、每日特價、分享領券等活動專區,在設計頁面時增加優惠券、紅包等元素,突出省錢、低價等文案,可以有效地吸引此類用戶,引導他們下單付款。這就是本質需求的應用方法。


          2.2.3 拆解挖掘到的本質需求———KANO模型

          工具——KANO 模型問卷調研,主要依據是用戶調研,可以通過定性訪談的方式,對部分用戶進行了解,大概了解用戶對需求的態度;也可以通過定量問卷的方式,通過問卷獲取比較有參考價值的數據信息。不同類型的需求和用戶滿意度之間的關系,將影響用戶滿意度的因素分成五類:


          基本型需求:無此功能,用戶滿意度會顯著降低;有此功能,用戶滿意度不會顯著提升。

          期望型需求:無此功能,用戶滿意度會降低;有此功能,用戶滿意度會提升。

          興奮型需求:無此功能,用戶滿意度不會降低;有此功能,用戶滿意度會有顯著提升。

          無差異需求:有無此功能,用戶滿意度都不會有太大變化。

          反向型需求:無此功能,不會影響滿意度;但有此功能用戶滿意度會下降。


          經過需求分析我們會拿到大量用戶需求的相關信息,在取舍和決策時我們可以使用三個原則 + 一個工具:01、

          圍繞本質需求和痛點;關注與業務不相悖的需求;解決影響用戶峰值體驗的問題;在做分析時可以利用 KANO 模型,重點關注模型定位出的基本型、期望型需求,適當關注興奮型和反向型需求。



          至此,我們掌握了產品分析的第一步,也就是找到設計的方向和基本依據——用戶需求;下一模塊我們將進入需求分析的第二步——場景分析,來找到設計可以利用的機會點、切入點!


          3.1為什么要進行場景分析


          3.1.1 場景是產品設計的基礎

          01、任何產品的誕生都是基于用途,牙刷為了刷牙、菜刀為了切菜、汽車為了出行……生產這些產品是為了滿足用戶的需求,而生產產品時需要考慮的因素如外觀、材質、設計細節等則源于用戶場景。

          02、互聯網產品其實也是一樣的道理,產品基于用戶的一些需求或者痛點而誕生,基于用戶的使用場景做功能和細節體驗。


          3.1.2 場景分析的核心能力就是同理心

          站在用戶的立場思考細節:必須首先知道用戶需要什么、喜好什么、討厭什么、不能接受什么,才能進一步改善我們的產品。基于用戶的目的、行為偏好等研究用戶在場景里的行為、情緒,從而深入場景,做出正確的決策。


          避免主管的質疑和批判:有的用戶會有各種各樣“奇葩”的反饋,所以我們要多理解用戶的選擇和立場,避免主觀的質疑和批判。


          學會聆聽和關注反饋:在日常工作的溝通、對用戶的訪談中,我們可以試著多用心傾聽對方的表達。



          3.2 怎么做場景分析——三個工具一個方法


          3.2.1 用戶體驗地圖(流程分析)


          3.2.1.1概念

          01、還原用戶體驗產品的流程(分析的是場景中的線,包括流程線、行為線等。)02、列出用戶與產品、與線下場景有聯系的所有觸點。03、通過這些觸點掌握用戶的操作軌跡和行為特征。04、分析用戶的體驗感受。


          3.2.1.2 “五步法”梳理體驗地圖全流程

          01、明確分析對象:最重要的是確定一條明確的流程線,分析的產品某個功能或者某個服務/體驗流程,并非用戶。


          02、拆解體驗流程:把分析的流程進行拆分,拆成一個個體驗節點,實際場景設置節點。比如網約車的產品,要根據用戶在線下叫出租車的體驗場景來拆分,可以拆成走到路邊、招手攔車、上車、行程中、支付下車等幾個重要節點,然后根據這些節點來考慮和分析是否有優化或者需要顛覆的地方。


          03、創建用戶畫像:主要從用戶的基礎特征、用戶的心理和偏好等信息去做畫像,最后可以形成一個稍稍具體的角色。


          04、分析階段:制作表格,把每個節點的信息進行分析推測和記錄。例如下面表格:



          橫向:第二步拆解出來的所有的流程節點。


          縱向:用戶與產品的觸點:就是用戶如何操作我們產品,點了哪里、在哪里停留時間較長,這都是通過埋點數據可以看到的。


          用戶目標:從用戶的使用數據和用戶訪談中獲取相關的用戶信息,通過用戶的行為和他們表述的信息找到他們的立場、目的和利益點,從而分析他們想要什么。


          用戶行為:為了這個目標會怎么做。


          結果:看我們的產品頁面信息、流程及功能能不能滿足用戶上述的目的和行為即可。


          用戶情緒:用戶的目標和我們觸點是否契合,最終的結果是否能滿足用戶的需求和目的,沒有滿足的時候情緒低落到什么程度,滿足的時候情緒會高漲到什么情況,哪里是最低谷,哪里是最高峰。


          05、得出結論重點要看的是用戶情緒的起伏。找到最低點,看哪些節點影響了用戶的體驗,就是產品的痛點,也是我們的設計發力點和機會點。


          3.2.2 同理心模型(節點分析)


          3.2.2.1概念

          同理心模型適合分析我們產品體驗流程中的某個節點或細節功能,不適合進行流程化的分析。包含所看、所聽、所做、感受、所想。


          3.2.2.2同理心分析方法


          01、明確我們分析的對象是什么:比如:網約車用戶在打車等待接單的環節;比如電商產品確認訂單的環節;這些環節這些環節和節點都有共同的特點,就是集中在有限的一到三個頁面中,用戶的核心操作比較簡單。


          02、首先把圖表畫在白板上,用便利貼寫出所看、所聽、所做、感受、所想,五個維度的想法,


          03、然后進行集體討論,把這些便利貼提煉總結,歸納出重點信息,通過這種方式可以避免一個人悶頭思考的局限性,也可以保證思考的全面性。


          04、接下來對這個圖進行行為總結,找到用戶行為的原因,分析用戶的偏好和習慣。


          05、最后通過用戶情緒和感受,分析我們產品體驗的問題。



          3.2.3 情感化設計(節點分析)


          3.2.3.1情感化設計要素

          本能層

          親切:通過情感化設計,營造親切的氛圍,拉近與用戶的距離。比如:百度地圖可以在導航設置里將導航車標設置成自己的汽車品牌,當看到自己車的車標在地圖上移動,用戶就會感覺非常親切和熟悉。


          安全:讓用戶感到人身、隱私的安全。比如:嗶哩嗶哩在登錄界面輸入密碼時的二次元形象會有捂眼睛的動作。


          互動:我們的產品流程和功能的實現需要用戶的參與。比如:用戶刷新網頁時,由于網速較慢、需要較多的加載時間,在加載的過程中,有很多網站會提供一些互動小游戲。用戶參與進來了,整體等待的時間也就顯得沒那么漫長,這種互動既可以緩解用戶的焦慮情緒,又能有效防止用戶跳出。


          驚喜:人們對一件事物的判斷往往會基于最初的信息。所以如果我們在提供最初的信息時就給予用戶更好的結果,一定可以給用戶帶來驚喜?;ㄐ∝i在打車時先出現原價,然后彈出優惠券動效,價格數字也嘩啦嘩啦往下降,這個不斷下降的數字就利用了錨定效應,給予用戶一定的驚喜。


          行為層

          關懷:考慮用戶的使用場景,在場景下給予用戶細節上的功能推薦或操作建議。比如:美團外賣,在天氣惡劣時會提前提醒用戶:為避免延誤用餐時間,請提前下單。比如:滴滴出行,在用戶經常通勤的時間段也會自動提示:由常用起點至常用終點的路線派車大概需要XX分鐘,點擊即可叫車


          預期:難以避免需要等待、甚至反復操作的情況,此時為避免用戶跳出,你需要在細節上做好預期管理。比如:我們在用支付寶還信用卡時,支付完成后我們能看到已提交——待銀行處理等環節的流程提示。比如:我們在填寫一個需要補充大量信息才能注冊的網站賬號時,網站頂部一般會有注冊步驟的導航。當然以上只是最基礎的預期管理,如果你的文案能更俏皮一點,視覺效果上增加一些 IP 、甚至動畫就更好了。


          反饋:對用戶的操作及時給予回應,尤其是異常場景,需要使用用戶更容易接受的方式給予反饋。


          反思層

          情懷:能給用戶帶來情感上的力量。


          品牌:在產品的配色、排版、控件樣式上體現品牌的統一調性。在產品的體驗流程中貫穿品牌的價值。比如:在京東自營的店鋪購物、使用京東物流的產品會標明“京東物流”,在確認訂單頁也有“京準達”的功能選項,京東通過這種方式,將自營物流、快速到達的品牌特性一一表達。


          價值:實現更大的社會價值,從而提升企業形象。比如:商城的包裝箱、騰訊的 404 網頁上都能看到一些被拐兒童的尋人啟事,因為這些網頁和包裝材料的傳播力極大、傳播范圍極廣,可以帶來良好的社會公益效益。


          3.2.4 故事版

          故事版:體驗地圖和同理心模型,可以分別從流程到節點對場景進行分析,那么這些場景如何歸納和表達,以供大家決策和評審呢?需要站在用戶需求的角度講故事。故事板這種漫畫/故事的形式易于被受眾接受,在闡釋需求、說明方案時具有更強的親和力和說服力,


          描述過程:創建的虛擬人物;明確關鍵節點;找到虛擬人物在整個故事中所有行為和目的。



          產品思維、需求分析、場景分析這三部分是產品設計三個基本要素,做好這些分析能幫助我們了解產品、業務與用戶之間的聯系,從而做出體驗好、價值高的優秀產品。這些分析都是我們進入設計工作的前期信息和準備依據。接下來我們要做的就是明確設計目標。



          4.1為什么要明確設計目標

          01、一接到需求就馬上打開軟件開始往上鋪圖,遇到被卡住的情況,沒有辦法繼續做下去,總在糾結。

          02、有時候產品經理對某個需求也提不出很明確的方向,我們設計的時候能搞出幾個方向的方案,但是不知道如何決策。

          03、我們在著手設計的時候就沒有想好我們輸出這個設計圖的目的是什么,比如需要促進產品什么轉化、解決用戶什么痛點、解決體驗上哪些問題?

          04、我們做這些工作的目的是XXX,只有達到這個目標我們做了這么多工作才有意義、有價值。

          05、在日常工作中你也會發現,產品設計不等于純創意設計,產品設計的關鍵價值在于發現和解決問題,通過對體驗流程和頁面細節的處理/優化,得到我們期望的用戶反饋和業務數據。


          4.2 整個項目設計思考的流程

          01、設計目標的來源是用戶目標、業務目標和產品目標,依據這三個目標,我們將其轉化為設計目標;

          02、然后是將設計方案朝著既定目標實施,在方案的流程和細節里體現/實現我們的設計目標;

          03、上線后,及時收集和整理設計目標、產品目標相關的數據和用戶反饋,驗證我們的設計方案有無達到目標;

          04、然后規劃下一步的迭代方向。



          4.3 怎么設定設計目標“三步法”

          01、明確用戶目標和產品目標:設計目標的根本是產品目標,產品目標的根本來是業務目標和用戶目標,也就是業務的規劃和用戶的需求、痛點。因此在實際操作中,第一步我們要先明確我們的產品目標是什么,產品目標大多和用戶的轉化、功能的使用率有關,我們朝著這些方向分析一般不會有較大偏差。


          02、通過上面目標找到與之相關的關鍵用戶操作:比如點擊加購按鈕、比如完成付款驗證操作、比如填寫全部表單信息。


          03、將關鍵的用戶操作轉化成可以衡量的數據指標:將這些關鍵的用戶操作轉化為可以衡量的數據指標,比如加購 BTN 的點擊量、訂單提交后的付款成功率、比如表單信息的完整率。因此設計目標必須是可量化的,產品使用數據和業務數據,比如點擊量、退出率、取消率、跳出率等,才能在設計方案上線后正確評估我們的方案有沒有完成設計目標。



          5.1怎樣跨越設計難點

          01、先去定位設計難點,找到設計重點,再著手設計。完成主流程后再去解決小問題。

          02、接著列出流程或需求點,對設計方案有大致框架;

          03、然后針對流程中每個節點列舉可能會出現的問題把精力放在影響設計目標和用戶核心體驗的重點問題上。


          5.2怎樣解決設計難點

          精益創業模式里有一個 MVP 的概念,我們現在產品研發中的敏捷模式也是源于這個概念。簡單來講,就是用較小的成本先做出一個產品,然后快速上線,驗證業務模式、產品策略和用戶體驗等問題,然后小版本快速迭代,進行優化。



          參考資料:

          《用戶體驗干貨筆記》

          《用戶體驗要素》

          《騰訊產品法》

          《交互設計知識體系》




          C端設計前的準備工作,其中重點在于學會需求分析和場景分析。具體掌握需求分析的核心方法步驟,和場景分析中用到的三個工具用戶體驗地圖、同理心模型、情感化設計、和故事版。需求分析、場景分析是產品設計的基本要素,做好這些分析能幫助我們了解產品、業務與用戶之間的聯系,從而做出體驗好、價值高的優秀產品。這些分析都是我們進入設計工作的前期信息和準備依據。


          接下來我們要做的就是明確設計目標,設計目標的來源是用戶目標、業務目標和產品目標,依據這三個目標,我們將其轉化為設計目標,然后將設計方案朝著既定目標實施,在方案的流程和細節里體現/實現我們的設計目標,在產品上線后,及時收集和整理和設計目標、產品目標相關的數據和用戶反饋,驗證我們的設計方案有無達到目標,然后規劃下一步的迭代方向。

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

          文章來源:站酷 作者:morning_c

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

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


          剖析車載界面設計

          資深UI設計者

                 HMI是Human Machine Interface 的縮寫,“人機接口”,也叫人機界面。凡是參與人機信息交流的領域都存在著人機界面。本文將深度剖析車載界面的設計要點及注意規范。

                 智慧城市的建設趨勢越來越顯著,政府對于汽車智能化、信息化發展非常重視,汽車駕駛體驗感與個性化的設計也會成為我們對于汽車選購的參考和方向,自從人們對于用戶體驗的重視,人機交互設計工作內容也成為重要環節。

                 對于人機界面,首先我們要明確一些概念。


          1、人機界面與人們常說的“觸摸屏”有什么區別?

          從嚴格意義上來說,兩者是有本質上的區別的。因為“觸摸屏”僅是人機界面產品中可能用到的硬件部分,是一種替代鼠標及鍵盤部分功能,安裝在顯示屏前端的輸入設備;而人機界面產品則是一種包含硬件和軟件的人機交互設備。在工業中,人們常把具有觸摸輸入功能的人機界面產品稱為“觸摸屏”,但這是不科學的。


          2.人機界面產品中是否有操作系統?

          任何人機界面產品都有系統軟件部分,系統軟件運行在HMI的處理器中,支持多任務處理功能,處理器中需有小型的操作系統管理系統軟件的運行?;谄桨逵嬎銠C的高性能人機界面產品中,一般使用WinCE,Linux等通用的嵌入式操作系統。

                 我們做的交互場景是有車輛行駛的,所以首先是要考慮安全因素,美觀其次,因此在特殊環境下操作車載系統,我們無法用傳統移動端沉浸式的設計思維來設計車載的界面與功能,需要放下所謂的美學,緊扣實際場景下的交互方式與用戶需求來設計,因為在極短時間內導致我們必須對所有可能用到的功能入口一步即達,對信息的布局必須做到一眼即見。



                 汽車HMI有自己的設計原則和設計規范以及美學理念。

          汽車行業本身是一個有著強烈美學理念和設計規范的行業,其實準確的說應該是汽車HMI中控設計是基于自身傳統規范,結合互聯網移動端和Web端的基礎上,慢慢形成了一種新的設計規范。


                 在開始講解之前,我們首先要了解官方的一些設計規范。

          1. 阿里 Alios 開放平臺

          https://miniapp.alios.cn/index#/document

          2. 百度車載生態開放平臺

          https://chelianwang.baidu.com/homepage/openPlateform/design/sec-4-1.html

          3. 谷歌駕駛

          https://developers.google.com/cars/design/design-foundations

          4. 蘋果 Apple Car Play

          https://www.apple.com.cn/ios/carplay/

          5. 華為車機三方應用交互設計規范

          https://developer.huawei.com/consumer/cn/doc/50902

             

                 我們還要了解車內屏幕的類型,主駕駛前面的儀表盤、HUD和中控屏幕,副駕駛和后排的娛樂屏幕。

          1. 儀表盤

          汽車儀表盤是反映車輛各系統工作狀況的裝置。一般由時速表、轉速表、機油壓力表、水溫表、燃油表以及電子指示燈等組成。汽車儀表是駕駛員與汽車進行信息交流的重要接口。當今純液晶屏的儀表盤占市場主導地位,純機械、燈顯、段碼將退出歷史舞臺。

          2. HUD

          平視顯示器(Head Up Display),最早是航空器上的飛行輔助儀器,運用在戰斗機上,由于戰斗機上很多信息需要飛機駕駛員隨時查看,避免駕駛員低頭看儀表而分心,隨后又普及在民航客機上,由于HUD的方便性以及能夠提高飛行安全,這項技術后來也發展到汽車行業,汽車搭載的HUD抬頭數字顯示功能,是利用光學反射的原理,將重要的行駛信息胎壓、速度和轉速等信息投射到駕駛艙前段玻璃上面,在駕駛過程中不用分心看儀表盤,減輕眼睛的疲勞,給駕駛帶來便利和安全。


                 此前,HUD前裝市場基本被日本精機、德國大陸、日本電裝、偉世通等國外巨頭壟斷,且競爭格局高度集中,前五名企業市場份額超95%。近三年,隨著國內智能駕駛技術商業化落地加快,不少自主品牌供應商開始嶄露頭角,且爆發力十足。HUD的發展會越來越迅猛,原因主要有以下幾點。

          1、HUD作為ADAS人機交互的窗口,可以呈現駕駛輔助信息,提升駕駛的安全性和舒適性,使駕駛者擁有更佳的應用體驗;

          2、為提升市場競爭力,車企對自動駕駛和智能座艙重視度提升,尤其是自主品牌車企近年在國家智能網聯發展戰略的推動和扶持下,轉型動作快、力度大,產品創新和應用上也更加大膽和前衛。、

          3、HUD技術上取得突破,顯示效果大幅改善;

          4、隨著技術升級,HUD配套價格逐漸下降,性價比逐步提升;

          3. 娛樂屏幕

          后排娛樂屏更像是一個平板,主要功能點為視頻、音樂、游戲等等,幫助后排乘客打發時間,所以后排的娛樂系統就是為娛樂而生,無需考慮安全性。

          車載界面的設計原則

          1.迅捷性

          與人們常常所說的三秒設計原則類似。移動端系統為沉浸式操作,而車載系統不一樣,在駕駛過程中,用戶95%的精力在于聚焦駕駛上行為上,用戶只能抽取僅5%左右的精力與時間來操控車載。因此也就決定了車載系統的功能邏輯,信息布局都必須在極短的時間內以最好的方式呈現。

          而如果用戶沒有在這個時間以內完成操作任務,要么用戶選擇放棄,重新再來;要么用戶花費更多時間和精力,但這樣駕駛的危險系數會成倍增長。經筆者多次在不同路段試驗,統計下來平均每次操作,即視線與注意力專注在車載上的時間,無法超過三秒,事實上,當進入第三秒時,已不得不需要利用余光開始注意前方路況了。

          因此,在三秒以內,無論是用戶第一次操作失敗,重新注意路況后,再重復操作,還是用戶持續操作直到任務完成,都是非常危險的行為,在這里,由于用戶試錯的成本非常巨大,也因此交互的設計與信息布局的設計都需要做到最極致的狀態。


                 隨著大屏、多屏化的發展趨勢,觸摸和語音控制應時而生,為了增強操作合理性,以及減少或避免觸摸屏的誤觸功能。從信息輸入來看,以觸控、語音為主,手勢、視覺交互為輔;從反饋輸出來看,以視覺、語音、觸控交互為主,嗅覺交互為輔。

          人機交互定義需要區分車輛是行駛中還是靜止狀態,車輛在行駛中,對于需要駕駛員操作反饋的交互行為需要遵循3S原則(上面提到的三秒原則),降低安全隱患。甚至有一些交互動作在車輛行駛過程中需要禁用的。

          2. 聚合性

          得益于計算機算法的強大,汽車功能越來越完善,信息量也越來越大,為了讓用戶有更好的體驗,避免過多信息的干擾,必須做到界面顯示輕量化。

          這也是為什么飛機駕駛艙內、國際空間站內的各種操控開關拉桿都是星羅密布式的擺放,并非以如今的科技無法做到像科幻片里一樣簡潔干凈的操控臺,而是因為考慮到在實際應用場景下,專業素質的人員不需要也沒有時間去欣賞美觀的界面,學習我們所認為的交互方式。


          保障關鍵信息是醒目的,容易讓用戶視覺快速捕獲,在各種環境場景下具有良好的可見性和易讀性,無需駕駛員費力尋找和識別。

          3. 及時性

          這里所說的及時性指的是反饋信息的及時性,我們要考慮實現全方位的信息提示,著重考慮視覺層面和聽覺層面。

          在駕駛的過程當中,司機的雙手被占用,于是眼睛和耳朵感知要提高,與移動端的視覺顯示不同,HMI設計師需要注意除了基礎的視覺顯示規范外,還需格外注意與安全相關信息的展示、視覺警告、文字易讀性和顯示眩光等顯示問題。

          在車輛行駛過程中,對于司機來說,聽覺反饋也是很有必要考慮的場景,通過語音反饋司機需要獲取的信息,能讓司機盡量保持視覺焦點在路況上。多場景的融合考慮信息獲取的效率,能減少在開車過程中的安全隱患。

          我們不僅要考慮設計層面,還要考慮到交互層面。

          交互方式

          (1)觸控

          這里分兩種,一種是通過按鍵控制;一種是通過觸屏控制。

          都是通過不斷的觸控功能按鈕行程鍛煉肌肉記憶,現在的趨勢越來越趨向重觸屏,輕按鈕,這樣不僅系統迭代成本小,功能可以動態分布。

          但是對于一些精準調節的功能還是按鍵控制好一些。

          微軟 的Surface Dial可以給我們很好的啟發,智能旋鈕可以解決大部分屏幕調節的不精準的痛點,而效率又高。

          (2)語音

          在汽車人機交互中,語音交互被認為是車內場景下最自然的交互方式,而語音交互需要一個載體來傳達多樣化的情感。

          語音控制的前景主要在于兩個因素,一個是可以把除了界面以外的利用起來,一個可以與HMI自由交談,二是最小化HMI手動操作產生的干擾,增加安全性。

          (3)手勢

          手勢交互是對語音交互、觸控交互的很好補充,能夠讓車主通過簡單的手勢和語音就能完成車內的交互任務,也是能夠增加交互趣味性、表達情感、傳達情緒的另一個自然交互方式。

          常用的手勢:單指滑動(上下左右)、雙指滑動(左右)、五指抓取等。

          HMI的交互手勢不同于手機和IPAD,手機和IPAD握在手里,左右手都可以操作,多指組合的可能性也多,而HMI的手勢定義,更多的是需要滿足駕駛員的使用場景,屏幕是固定在車上的,要規避掉一些不方便的手勢。

          比如雙指往上滑動就很不方便,向上推不靈活,也有阻力。

                 所以要想系統整體跳出基礎可用性范圍,進階到好用的層次,系統對各種復雜交插的應用場景的處理需要更加智能(如導航中的來電,緊急路況的提示),對車內環境控制(如聲音、氣溫)需要更加敏感。車載系統的設計相比于移動端有著更明顯的約束,不論是從空間、時間、行為、心智,都有著明顯獨特的場景和特點,要做好車載系統設計,我們需要有豐富的同理心以及親身體驗并反復驗證設計。

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

          文章來源:站酷 作者:弧形線

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

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



          日歷

          鏈接

          個人資料

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

          存檔

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