<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>

          首頁

          案例錦囊|如何巧用「文案設計」優化用戶體驗?

          seo達人


          1. 場景化用詞

          針對特定的場景,使用文案進行情感的烘托、渲染或是放大,通??梢詭硪庀氩坏降男Ч?

           

          案例 1

          QQ 音樂會員到期的續費提醒文案,是由各類歌名組成的一句話,每天的到期提醒都不同。這種形式增加了用戶的停留時長,也更富有情感共鳴。

          圖片

           

          案例 2

          釘釘的桌面版,在用戶退出后重新登錄時,在產品的右半側會分不同時段展現不同的歡迎用語,下圖是早上和中午的歡迎頁。

          圖片

           

          案例 3

          知識星球在用戶發表評論時,會用不同的語句,對評論這個場景做用戶行為引導。

          圖片

           

          案例 4

          很多產品對于某些功能的空狀態設計,都融入了個性化的語言描述,至少會讓頁面更有情趣:

          圖片

           

          2. 更精準的描述信息

          有些文案對于信息起到精準的描述和呈現,雖不是必須要呈現的內容,卻可以將文案作為加分項,而創造更優的體驗。

           

          案例 1

          支付寶頁面的“理財熱點”和“抗擊疫情”的數據,都顯示了實時更新的時間數據,讓信息給用戶的感覺變得更加可信和準確。

          圖片

           

          案例 2

          京東的一些商品在提交訂單頁面,會顯示商品進入了某個排行榜,比如  “恭喜你,挑選的商品好評度高達 97%”,或者 “XXX熱賣榜第 2 名” 等,給予用戶的選購能力和產品質量的肯定,促使用戶開心買單。

          圖片

           

          案例 3

          美團外賣在開通會員的卡片上很醒目的標示出卡通會員后,可以為用戶節省的預估成本,以及限時的驚喜紅包提示,降低會員成本在用戶心里的預估價。

          圖片

           

          案例 4

          飛書的聊天窗口中,每條消息的時間默認不顯示,但在單擊每條消息時,就會在下方顯示該條消息的時間,精確到秒級。

          圖片

           

          3. 字體和排版設計

          對于文案本身的字體選擇和排版設計,如果可以和文案的內容或功能有效的結合,也可以對用戶體驗起到提升作用。

           

          案例 1

          得到 App 的閱讀設置頁面,字體有 4 種選擇,字體樣式就用在字體名稱上進行展示,讓用戶對于字體的樣式一目了然,很有體感。

          圖片

          類似的方案在很多軟件中都有體現,比如 Sketch 的字體選擇功能:

          圖片

           

          案例 2

          8 月 13 日有英仙座流星雨,B 站的央視新聞當天的直播彈幕,就變成了流星雨的形狀,很有新意。

          圖片

           

          案例 3

          同花順 App 中把用戶對于股票的評論以彈幕的形式進行呈現,既讓評論變得直觀,又可以提升用戶對于個股的重視程度。

          圖片

           

          原文鏈接:長弓小子(公眾號)

          作者:元堯

          轉載請注明:學UI網》案例錦囊|如何巧用「文案設計」優化用戶體驗?

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

          截屏2021-05-13 上午11.41.03.png

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

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


          中國企業服務市場發展分析2021|數字化驅動的新型企業服務市場

          資深UI設計者

          隨著市場環境的發展、技術的迭代,數字化浪潮逐漸席卷了各行各業,為我們的生活帶來了巨大變化。與此同時,企業服務也亟待轉型。本篇文章里,作者就數字化驅動下的新型企業服務市場做了觀察,一起來看一下。

          易觀分析:在數字化浪潮洶涌而來的今天,技術正在發揮前所未有的作用,從各個方面影響、改造宏觀經濟。

          而在這樣的背景下,傳統的企業服務模式已經不再適用,新型企業服務開始被市場所關注,其脫胎于企業服務市場,但得益于技術賦能和創新服務模式,其降本、提效、賦能的效果較為顯著。

          因此易觀以新型企業服務為研究方向,向市場全面解析其市場范疇、發展特點,并借助典型案例的解讀,幫助讀者更好了解新型企業服務的發展情況,為行業發展、企業決策提供智力支撐。

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

          中國企業服務市場發展分析2021下篇|數字化驅動的新型企業服務市場

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

          文章來源:人人都是產品經理   作者:易觀分析

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

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

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


          如何“設計”出好的調研問卷?

          資深UI設計者

          前言

          本次與大家分享的是關于產品調研問卷的話題。用戶調研中有兩個非常重要的能力,就是預判能力和邏輯能力,一個是對未知的東西提前做判定做假設,一個是對思維邏輯的考驗。

           

          本著將自身學習、實戰、運用、總結的想法,寫出了這篇文章。文章整體為9866個字,閱讀時間可能較長,但文中也融合了我關于其他知識的匯總和串聯,所以,還是希望閱讀的您能看完,并交流。感謝認可!



          目錄

          為什么要做調研問卷

          調研問卷應該具備什么特征?

          寫問卷前需要準備什么?

          做問卷需要的輔助工具

          總結



          為什么要做調研問卷?

          不知道大家有沒有感觸,現如今中小型企業已經越來越注重用戶調研了,就連街邊的地攤燒烤店和飯店,都開始搞一些簡單的用戶滿意度調查了。比如在你擼著串喝著扎啤時,突然走來一個服務員,手里拿著本子和筆,你以為他是要問你加點什么菜,但實際上他卻是要說:“大哥,實在不好意思哈,打擾你一下,你覺得我們家的菜哪里不滿意呢,可以提一些意見,如果有價值的話我們還送您一聽可樂!”

           

          這種方式雖然看起來“簡單+粗暴+直白”,但確實真的能幫助個體戶解決一些實際的用戶體驗問題。這,就是互聯網人每天嘴上掛著的產品要做用戶調研,產品要以用戶體驗為中心。只不過這種手法沒有運用太多的調研模型和縝密規劃而已,他們大多都是記下來,然后拿給老板,老板看完后,通過主觀意識進行定奪哪個有用,哪個能改,哪個不損耗成本的條件下能提升客戶滿意度,就通知讓整改了。(自述:從某種角度來看,我倒覺得這種粗暴的手法反而是最直接,成本最低的用戶調研方式,因為它基本符合埃里克·萊斯在《精益創業》中提到的創業定論,也可以看作是產品開發和投入市場的三個可行步驟:低成本建立產品并投入市場、獲取真實產品數據和用戶體驗結論、優化調整產品路線和體驗并建立產品壁壘)

           

          所以,一個好的調研問卷應該同時具備兩個特性:

          第一:就是驗證產品問題,為了驗證我們對產品體驗的理解是否符合用戶心智,而不是一貫的說:我覺得用戶是這樣的,我認為他們應該都是這么做的,等等系列的主觀產品意識。

          第二:是批量收集用戶數據進行統計,以便宏觀比例查看,這同樣可以驗證我們對目標群體的定位是否準確,或是偏離,比如“用戶的基礎屬性、購買能力、行為特征、興趣愛好、社交網絡等”。

           

          所以我們可以理解,直到產品立項和規劃市場宏圖截止,調研問卷才是真正走向產品設計的第一步,它包含并解決了:我們對產品和市場規劃的驗證、對產品和用戶問題的解惑、對用戶畫像的輪廓描繪、對接下來用戶訪談的精準定位。同時,也是對產品優化的方向指明,通過問卷,可以了解產品功能的可用性、易用性和不足之處,包括了解企業對產品進行廣告投放的渠道獲客比例,從而調整投入資金。

           

          以上就是我們為什么要做調研問卷的解答,同時也明白企業投入一周、一月或更長時間的成本做調研問卷的根本作用。



          調研問卷應該具備什么特性?

          講解了調研問卷的目的后,接下來要講的是編寫問卷所必須具備的兩個特性,它們分別是:邏輯性和預判性。說到這可能會有同學比較疑惑,一張具有十幾道題的問卷,基本都是問問題,會有什么復雜邏輯呢,需要預判什么。是的,對于不了解產品和業務本身的同學,或者沒有深入學習和實戰過的同學,這個確實沒有什么的必要,當然也就編輯不出有深度的高質量問卷。

           

          其實,一個合格的調研人,在寫調研問卷時,調研人應該是可以預判出自身產品用戶的所有問題和答案的,并且問卷的問題要針對性高、目的性強、問題邏輯縝密且由淺入深,這還不夠,調研人還應該了解市場和該行業數據、統計報告等相關知識點,同時對用戶的不同職業進行了解和拆分(這里面包含行業屬性、營業收入、職業員工人數等一系列問題)。在了解以上這些信息后,還要結合當前產品需要改良優化的明確目的進行匹配,只有這樣才能寫出一份真實解決問題的用戶調研問卷。

           

          接下來我分別將剛講到問卷里的幾個必備能力簡單描述一下。


          1、問卷的預判能力

          首先講解一下什么是預判能力,預判是提前預設預想到問題的可能性與預見性,是對某一事件還沒產出結果前的提前設想,能力是具備某項技能。所以我們可以這樣理解,預判能力,就是具備某一事件在得到結論前的假設的能力,通過設想和假定,完成該事件的提前預測,從而提前做必要措施和準備。

           

          那么這個能力在寫問卷有什么作用呢?很有必要,而且可以說是編寫問卷的剛需能力,做調研的應該都知道,為保證目標用戶對問卷的填寫完成率,我們多數采用被用戶選擇而不是填寫的方式進行受訪,在這樣的條件下,我們編寫的問題應該是精準的,可被用戶理解的(這里指使用用戶的語言表達問題,被用戶聽懂),同時問題對應的選項也應該是全面且精煉的,其選項應該保證幾個特性:

          1、選項文案應該精練且易懂;

          2、常規問題的選項應設定在四個內;

          3、選項內容應該是可以容納絕大多數用戶可能被選的選項,這樣最后的結果才有意義,有比例性;

           

          如果你不具備預判性,那么很有可能出現以下幾個問題:

          1、 用戶聽不懂你問的什么;

          2、 用戶錯誤的理解了問題的真正意圖;

          3、 用戶閱讀選項覺得繁瑣麻煩;

          4、 選項get不到用戶想要的或不包含用戶具備的條件,從而放棄選擇;

           

          所以說,預判能力是幫助我們提前預測問卷的答案,預測用戶可能想到的內容,預測產品的未來走勢的。

           

          說到這里,你可能會問了,我要都能預測到問題和結果我還問用戶干嘛,我把可能想到的都加上不就得了,錯!從邏輯上講,產品的調研問卷本身就不是一個提問題的手段,我們應該把它看作是一個驗證問題的手段才對。從另一個角度講,我們在設計產品時,同時也是先考慮到市場的機會點和痛點后,才會考慮如何入手市場,提供怎樣的服務,開發怎樣的產品,最終能獲得多少市場份額。但這些都是我們的設想,到底是否可行,就需要我們先用最小成本(MVP,這里指最小可行性的產品或手段)“調研問卷”對市場進行探測,從而最終驗證我們的邏輯是否正確,我們提供的服務是否被真實用戶喜歡,我們的用戶到底“長什么樣子”,然后根據調研結果對產品做適當調整和優化。


          2、問題要由淺入深

          這個能力同樣是編寫問卷時的剛需能力。用戶在面對一個陌生的問卷時,首先內心會自然地出現抗拒和危險的信號,同時也會考慮是否具有獎勵機制,所以多數會隨著好奇心和嘗試的心態進入填寫狀態,當然不排除部分忠實用戶對產品的無私奉獻(例如小米的米粉,很多米粉填寫問卷或許并不會得到相應的金幣和金券獎勵,但還是會有很多人填寫問卷,這就是產品的自身的魅力)。

           

          如果你一上來就直接問一些很冒昧很直白的問題,會直接影響用戶填寫問卷的完成率,這其實并不是用戶的錯,從生物學角度來講,這是每個人都具有的天性,是我們的舊腦和生理遺留下來的一些特性。我們天生不喜歡很突然的東西、行動、問題,當遇到急轉彎或者突如其來的事物時,我們的大腦神經、肌肉會快速收縮,而瞳孔會快速擴張,血液則會加速流動,同時大腦會快速分泌激素并預示你要警惕,其實這本身是我們的祖先在原始社會生存時為防止被獵殺的本能反應。所以,當開頭問到您的姓名后,緊接著就問您的收入是多少時,多少就有點唐突了。

           

          問題由淺入深,是用戶對問卷的逐漸適應過程,畢竟對于用戶來講,問卷并不是一個日常的高頻操作,基本可以說是比較陌生,所以,從用戶熟悉且不涉及到用戶隱私的前提下逐次進行詢問,可以大幅度提升問卷的完成率。

           

          當然,問卷的編寫也是有一定的規律可循,一般會分為三大模塊,順序依次為:

          1、基礎問題:其中包含姓名、年齡、學歷、職位、地域、收入等等,通過一些基礎問題對用戶有一個基礎了解,同時被用戶所接受;

          2、常規問題:應該圍繞產品相關且不涉及到產品本身的問題,比如你的產品是一款運動產品(例如:Keep),那你可以問用戶您日常喜歡鍛煉么,喜歡做什么運用,日常在哪些場景做運動等等問題,這些都是幫助你進一步了解用戶是否是產品基礎用戶做的前期鋪墊。假如你在這個時候就問關于你的產品問題,會導致用戶認為你的目的性很強,同時具有利益性,當然不排除其他可能性。所以,一般這個階段多數會圍繞但不涉及自身產品的問題。

          3、產品問題:到了這個時候就可以開始問一些自家產品的問題了,比如問:您用過某產品么?您對某產品的第一印象如何?您一般使用某產品的哪些功能?您使用某產品的頻率怎樣?等等這些類似的問題就可以進行詢問了。


          3、了解行業趨勢和相關數據報告

          該能力比較泛,因為我們并不能用一個具體的規則進行有序的編排,也沒有一個可量化的方式對其衡量,畢竟學無止盡,誰也不好說了解多少行業趨勢就算合格,瀏覽多少相關數據報告就算對該行業數據胸有成竹。其實我覺得多少都不算多,只能說了解的越多,對產品就越有把控度而已。

           

          問卷的問題和這些也是有著密切關系的,如果你完全不了解你的產品,不了解你產品所處的行業特征趨勢、不了解你產品和競品的數據報告、不了解國家對該行業的扶持和管控,你就無法在第二模塊(常規問題)和第三模塊(自身產品問題)內提出高質量的問題,當然最后的結果也不會很優質。

           

          舉例說明一下,還是拿“KEEP”這個運動健身產品為例,如果你不了解該行業的社會趨勢,不了解健身運動的行業特性,也不了解相關競品的數據,你如何提出符合該行業的深度問題?;蛟S你會問“你日常都用哪些運動健身產品?”這當然也是一個問題,但這種問題只能獲取到用戶常用的競品,卻不能挖出更深的問題。但如果你了解行業報告和相關數據后,你可能在寫問題之前,就對該行業有一個全面的認識,比如健身行業人群的年消費占比,健身人群的年齡占比,健身人群的職業類型和占比等等,然后通過這些已知數據對其進行設立問題,這樣的問題會更加具有針對性。


          4、明確的產品問題

          最后一個是關于產品目標的問題,這里的產品目標指的是你和你的團隊希望產品下一步優化什么,希望通過此次問卷達到什么目的。例如:優化產品的推廣渠道、具象用戶畫像從而調整產品視覺、深度挖掘用戶對產品的整體感受從而優化產品功能和交互。

           

          以上這些同樣是編寫問卷時的剛需能力,如果你不了解自身產品問題在哪,不了解相關行業的整體趨勢,不了解競品比自己做得好得地方,怎么能寫好問卷呢?俗話說:當你發現了自己的問題時,你就已經成功了一半,而另一半則是用無數顆粒的調整和努力換來的。如果不先明確產品問題,無法提前預測,無法拋出對應的結論供用戶選擇,那么,最后的結論又怎能價值度高呢?

           

          針對具有這個問題的同學,我建議在編寫問卷前,首先一定要了解行業屬性和趨勢,起碼要有一個大致的宏觀了解,然后是對自身產品和競品的高頻使用,自己先從中發現一些問題和差異點(如果你不具備同理心,那么就一定要實際上手操作,我想你日常在使用不同購物軟件的時候,一定有不一樣的主觀感受對么?那時的你,就是最真實的用戶!將這種感覺和方式帶到你自己的產品和競品中,也同樣奏效,不妨試試),然后再去和同事和產品等相關人討論,最后在開始編寫問卷。我相信這時的你應該會比之前寫的更好了。



          寫問卷前需要準備什么?

          剛才我講到的可以說都是問卷背后需要思考和掌握的能力,更是必備屬性,也是關乎問卷是否成功的關鍵點。接下來,在說說準備開始編寫問卷時需要籌備的“東西”吧。這里順帶提一下,問卷最終產出物是否成功需要通過六點來驗證的,它們分別是:邏輯是否縝密,問題是否嚴謹、文案是否精練、數據是否落地、是否參考報告、整體是否由淺到深。


          然后再說開始編寫問卷時需要籌備的“東西”。在寫產品調研問卷時,前置條件是必不可少的,在動手寫問卷前,首先應該解決以下幾個關鍵問題,并依次羅列,他們分別是:

          1、 明確調研目的和思路;

          2、 了解競品功能和優點;

          3、 預測用戶使用產品的動機和場景;

          4、 梳理產品功能框架和邏輯關系;

          5、 梳理產品業務線和推廣渠道;

          6、 瀏覽并摘錄行業數據報告;

          7、 對用戶群體分類,思考問題的分叉點;

          明確問題屬性,方便問題對號入座;


          1、 明確調研目的和思路

          俗話說:明確的方向比努力更重要。如果說你都不知道自己最后想要的是什么,毫無目的的去努力,那就是瞎忙活。問卷也是一樣,每一個產品調研問卷都會背負著1-2個核心的問題,如果再多,要么說明你的核心目的不明確,要么就是你沒有對問題做優先級分層,這樣的結果只會是毫無頭緒,最后哪個問題都解決不到根本。

           

          所以,在問卷編寫之前,一定要先確定一個或兩個目的,也就是你想通過本次問卷最終想得到什么結果和怎樣的效果,然后在圍繞這個目的展開你的問題思路,通過什么方式,怎樣的問題路徑進行詢問,最后才能達到這樣的結果。例如你想解決產品的視覺問題,那就需要圍繞用戶喜愛的色彩、行業的配色規則、有效的視覺比例等問題進行詢問,依次挖出普遍用戶對該行業和產品是理解。再比如你的產品只是一個剛開發不久的新產品,急需通過用戶的真實想法和體驗感進行優化升級,那你就需要圍繞收集用戶除使用你的產品外還用過哪些其他類似競品,好用點在哪,對你產品的第一印象是什么,用過哪些功能,建議是什么等等進行深挖。

           

          整體而言,沒有明確的調研目的和思路就開始編寫問卷,是不可能寫出主干路徑清晰,問題具有指引性的好問卷的。當然,目的清晰還不夠,還需要你對目的進行顆粒度細分化,也就是對目的獨立定位,做到目的與目的之間沒有交集點,這樣做的好處是每個目的都是獨立的個體,都是單獨“細胞”,通過各自的目的,將其不斷擴大和分裂,我們還可以延伸出更多新的細小問題,并對其做優化。如果沒有做到顆粒度細分,最大的隱患就是目的與目的之間會存在交叉點,在解決問題時會出現混交,例如在解決A問題時,同時B問題也出現了,這個時候要解決的問題就會模糊,不能對其設立明確的定位和標簽。(這里如果不明白的同學,我用另一種案例舉證一下,就好比小公司設計師和大公司設計師。小公司設計師基本做不到工作專攻,一般都是什么都干,這就是專業模糊且不獨立,最后出現的結果就是定位模糊,沒有獨樹一幟的技能,延展出新技能會出現徘徊狀態,什么都能干但又感覺都干不了。而大公司雖然設計師處于螺絲釘狀態,但完全就是不斷在加強自身長板,最終通過長板做到領域細分,無人能敵的狀態。剛才說的顆粒度細分就是這個意思,目的越模糊,標簽越不明確,也就越不好做延展,反之目的越明確且獨立,標簽也就卻清晰,后期延展性強,同時還可做歸檔處理,可幫助產品復盤。)


          2、 了解競品功能和優點

          這個應該比較好理解,俗話說知己知彼百戰不殆,如果都不了解競品的優勢和功能是什么,問卷還怎么寫呢?雖然每個行業的產品都有很多的競品,但不管哪個行業,其產品都有三六九等,我們只需要對其中排名前幾的進行翻閱使用即可(備注:不知道如何查找產品排名的,可瀏覽“做問卷需要的輔助工具”章節),并搞清楚他們的不同優勢、壁壘、差異在哪,然后對照自己的產品,就知道我們差在哪,缺在哪了,這個時候,如果你不確定競品的功能是否能運用到自身產品上,就可以通過問卷的形式提問。同時,還可以通過問卷的形式對競品功能和優點做假設性提問,這是最小成本模擬性的佐證功能是否符合大眾心理預期的手段。所以,并不是所有的產品功能都一定是好的或不好的,這一切的源頭都取決于用戶對它的期望值和必備屬性,也就是一切以用戶為核心。(不同類型的產品市場定位不同,用戶群體也不同,競品的功能看似強大,但不一定適合自身,所以這個需要通過問卷、訪談形式探索,當然也可以使用A/B測試、數據埋點等手法進行,只不過那樣會增加成本,但好處就是數據更可靠、實效性更強)


          3、 預測用戶使用產品的動機和場景

          行為結果是行動的最終產物,行為、能力、動機、環境是改變結果的必要前置條件,所有的結果都會隨著這四樣條件的不同發生質的改變。比如不同人從小接受的不同教育(環境),會影響他們不同的思維方式,并對同一件事運用不同的思考方式(動機),通過各自不同的能力(能力),然后做出完全不同的決策(行為),最終得到不同的結果。

           

          如果想了解用戶的行為方式和動機,就得對他們的場景有所了解,比如他們會在什么環境下使用該產品,他們使用該產品時的載體是什么(電腦、收集、ipad,或者其他),他們為什么要用這個產品,等等一系列問題都是需要我們收集和預測的,只有清楚知道用戶的動機、行為、能力和環境,我們才能知道我們的產品是在什么環境下、什么條件下產生的爆發點。這里面比較重要的是動機,動機是決定用戶是否能快速采取行動的重要因素,如果環境滿足,有行為動作,也有能力購買和承擔,但產品沒有可供用戶提起興趣的動機,也是會損失客戶的,這里的動機我們可以看作是欲望點,也就是G點。(這里可以引用福格行為模式,公示為:B=MAT,其中B代表行為,M代表動機,A代表能力,T代表觸發,也就是說所有用戶在完成特定目標前,都必須滿足MAT這三個基礎條件,第一要有充分的動機M,第二必須要有完成這個行為的能力A,第三必須要有促使用戶付諸行動的觸發T)。

           

          只有得到以上這些預判的結論,在編寫問卷時才能列舉出符合用戶的選項答案,最終的調研才是有價值的。


          4、 梳理產品功能框架和邏輯關系

          在調研問卷內,第三模塊(自身產品問題)的問題基本都是和自身產品息息相關的,如果不了解產品的所有功能和功能之間的邏輯關系,那么在編寫問卷時,就很難提供優質的關于功能和邏輯的問題。例如在你清楚了解自家產品的所有功能后,你認為某些功能是有可能存在漏洞的,或者發現某個功能在競品中是以另一種方式呈現的,在或者一個組件功能所包含的內容和競品是有差距的,那你就可以針對這些問題去進行假設舉例,提供對應的問題和選項。

           

          同樣的,功能之間的跳轉邏輯也需要設計問卷者做到心中有數,從而對比競品后得出結論,并對其設定問題和選項。當然,并不是所有的問卷都必須具備功能和邏輯相關的問題,問卷中是否需要設定關于產品功能和邏輯的問題,還是要按照問卷開始就想好的目的和思路展開提問。

           

          所以,清楚了解產品功能及邏輯關系,是為了輔助我們能提出更有價值、針對性更強的產品問題,同樣也是為了幫助我們對用戶進行設點,通過問卷先圈出一批目標用戶,然后進行針對性訪談,可大幅度降本增效,從而防止資源浪費。


          5、 梳理產品業務線和推廣渠道

          這里和第四點比較相似,主要的相似點來源于目的性,在編寫問卷之前,我們必須要了解產品的業務流程,還有產品在市場中所運用的推廣渠道,這些都是幫助我們設立問題做的前期準備。

           

          提出產品業務相關問題,有助于優化產品運營模式和產品服務板塊,這些雖然不被產品直接展示,但卻是公司的重頭戲,同時也是用戶非常注重的地方,尤其是依靠線下服務來提升用戶滿意度的公司,例如服務類產品“土巴兔、我愛我家、e家家政”,這類型產品都是重心在服務團隊上的,如果不了解產品的整體業務線,就不可能提出高質量的業務問題。

           

          推廣渠道同樣的,如果不了解產品往期的推廣方式和渠道,又如何在提問題中設定標準的答案供用戶選擇呢?所以,想要通過問卷獲得產品業務和提升訪客率的結果,就必須對產品的業務線和推廣渠道有具體了解。


          6、 瀏覽并摘錄行業數據報告

          行業數據報告對單一產品并不能起到多大作用,它主要是通過行業的宏觀局面,對該產品進行一個整體的把控,比如最近幾年比較火的教育行業,如果你的公司正在從事教育行業,那么獲取該行業最近2年的行業數據報告,可以瞬間開闊你對教育行業的整體認知,包括國家對教育行業的一些政策走勢,你也可以很好的了解到。

           

          通過了解行業的數據報告,有助于你對行業的人群收入、地域分布等問題進行比較客觀的熟知,從而設定一些帶有區間數字的問題時,能更好的設定結論被用戶選擇。舉例說明一下,假如你的產品是健身app,通過對市場的整體了解,對運動健身行業近幾年的數據分析和走勢,了解了人們在健身上每月每年的投入資金,在調研問卷中,就能更準確的設定用戶收入、健身消費金額等一系列問題,然后通過問卷結果查看資金占比,就能對應的知道匹配你產品的用戶群體消費情況了。

           

          所以行業數據報告并不是某一個產品的支撐物,也不具備被單一產品所參照,它就好比一張世界地圖,我們可以清楚的瀏覽到我們的中國在哪,身邊臨近國有哪些,對比國家的領土大小等等。


          7、 對用戶群體分類,思考問題的分叉點

          對用戶群體分類是比較重要的一個內容,它的主要作用是幫助我們預設用戶類型,通過不同維度對用戶進行分門別類,然后對他們依次設定不同角度的問題,最終獲得不同有價值的結果。這就好比一線城市設計師收入和三線城市設計師收入是完全不一樣的,針對這些不同,我們在詢問問題時,也是需要區分對待的。

           

          這種情況一般問卷中是高頻出現的,比如我們在回答問題三后,如果選擇A,那么會跳轉到問題五,如果選擇B,則跳轉到問題四,這就是設計問卷者在編寫問卷前就已經預想到不同的用戶群體類型了,然后對他們進行了多種類的問卷設計。這么做的好處是可以快速驗證出產品的目標用戶類型和比例,降低用戶調研成本,進一步推進培養種子用戶,然后再次接受高質量產品反饋,最終提高用戶的整體調研質量。


          8、 明確問題屬性,方便問題對號入座

          最后一個是問題屬性,其實這里大家可以將這個詞看成是一個“盒子”。我們在開始設定問題時,大家慣用的手法是直接羅列問題,按著主邏輯開始進行,然后依次往下寫,其實這并不是最有效的方法。我在這分享一個更加有效的方式,就是在調研問卷編寫之前,你要先預設幾個問題屬性的“盒子”,也就是問題維度,比如說:基本屬性、購物能力、行為特征、興趣愛好、心理特征、社交網絡等等,這里先不考慮問題的邏輯性,先按照問題屬性進行編輯,比如先想基本屬性,那么就針對用戶的基本內容進行編寫問題(這里的方法是想到什么就寫什么),比如你會想到“用戶的姓名、年齡、月收入、家庭情況、在哪個城市等等”,這些都是所有用戶所具備的基本屬性,當你將第一個屬性寫到寫不出來的時候,就開始在第二個問題屬性“購物能力”的盒子里開始寫問題,繼續編寫一堆和購物消費有關系的問題,直到將所有“盒子”寫到寫不出來后,再從新開始進行問題梳理,依次按照邏輯關系進行排列即可。

           


          大家可能比較疑惑我這個方式,這種手法看似笨拙,但卻是符合我們人類的基本思維的,在心理學和行為學中,科學研究表明我們人類其實真正能專注做的只有一件事,而如果有人可以同樣完成兩件事或三件事,那么這其中只有一件事是刻意行為,其余的事件都應該是下意識完成的(也就是刻意練習后的下意識反應),比如我們開車途中躲避其他車輛時可以和別人交談,可以從口袋里掏出香煙然后對準點燃,在開車和交談、點煙這個事件中,開車就是下意識的行為,而點煙或交談就是刻意行為,雖然開車是一個高技術能力且具有交通危險性,但由于你已經練習了很多遍,所以并不需要刻意思考就能打轉方向并調整到合適角度進行開車。

           

          問卷也是一樣,如果你在用大腦完成問題邏輯梳理的刻意行為下,同時又要絞盡腦汁的想問題怎么寫,寫什么,那么可想而知,當兩個事件都是刻意行為時,你哪件事都做不好。所以,不妨嘗試下我建議的方法。



          做問卷需要的輔助工具

          以上都是關于寫問卷時做的前期準備工作,雖然絕大多數都是需要自主完成的,但不妨有些內容確實比較有阻力,比如說:行業的研報,行業的數據報告、產品所涉及行業的宏觀分析。所以為了大家方便學習,我這里為大家提供了一些我日常慣用的工具網站,其中就包含:行業白皮書、行業洞見研究報告、數據分析、調研問卷模版等一系列相關內容。


          1、 洞見研報

          https://www.djyanbao.com/

          該網站包含所有行業的研究分析文案,市場宏觀策略,一個高質量的行業分析網站。


          2、 問卷模版網

          https://www.wenjuan.in/

          該網站包含了大量的問卷調研模版,可以輔助你增加對問題的靈感,同時做參考。


          3、 七麥數據

          https://www.qimai.cn/ 

          七麥數據可以輔助你去查找一些相關行業競品,同時根據排名進行選擇性對比。


          4、360趨勢

          https://trends.so.com/

          360趨勢是一個開源數據平臺網站,在這里你通過關鍵詞輸入可以查看到行業或產品的關注度、曝光量、需求分布等重要信息。


          5、 艾瑞數據

          https://data.iresearch.com.cn/

          艾瑞數據和七麥類似,同樣是查詢和瀏覽產品的排名、競品類型的平臺。



          總結

          其實還有很多相關的工具類網站,部分是需要付費的,部分是強制需要注冊的,價值度不高的我就不再推薦了,本著與大家分享的心態,將真實可落地的資源與大家共享我認為是最好的。

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

          文章來源:站酷   作者:西瓜的設計

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

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

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


          如何提高設計還原質量和驗收效率?

          資深UI設計者

          前言

          最近我們產品做了一次全新改版的項目。作為此次項目的設計師,從項目的前期分析、設計、交付開發、驗收上線,整個流程,在項目走查驗收階段我們設計師投入了30人/天!在我們覺得應該設計投入最少的階段,卻占了我們大量的工作 且最后還原度也遠不達預期。


          在這個項目中我遇到了哪些問題:

          還原問題不單單是設計師把設計稿做的多精準,標注的多仔細,這么簡單就能解決的。是設計和開發,團隊之間的合作共識問題。我把整個和開發對接工作分為前中后三個階段,在這里從頭來梳理一下,聊一聊設計師和開發如何高效對接,也是對自己的一次復盤總結。



          一、評審/排期


          1.1、設計師對還原的要求宣講


          在評審環節,設計師本人一定要將自己的設計稿進行宣講、幫助開發理解。注意給技術講述一些適配要求、設計規范、交互狀態及動效等,同時解答技術同學的一些疑問,這樣就能將一些可預見的問題解決掉,解決后期的溝通成本。

          有一些地方有多種實現方式,如果前期沒有跟開發溝通清楚,就會導致最終實現的效果存在誤差,比如:下方這個tab項,單給一張圖,開發根本不知道設計師想要的實現方式是什么,固定間距還是固定菜單寬度,還是每項平分寬度,最后很大可能就會按照自己的理解去做了,導致出現重復返工的現象。



          再比如一些點擊熱區,如果不手動標明,有可能就做的很小

          下圖是我們手動標注的熱區



          1.2、實際開發者要參與評審

          每個開發負責的具體頁面模塊不一樣,別人對具體了解程度也不會不一致,所以在評審會議上,一定要具體開發者在場,如果對應開發沒有發表意見,設計師可詢問,確保他已經理解需求。



          1.3、開發充分評估還原工作問題

          設計師在講解自己的要求后,開發也要及時反饋是否有還原困難,如:是否有技術限制?是否有組件改動困難(牽一發而動全身)?實現成本過高(投入產出的性價比不夠)?等意見和原因,設計師也可拋出之前是否遇到過類似的阻礙,幫助開發去了解。



          1.4、認真記會議紀要


          評審過程的問題和重要講解點,一定要記錄下來,會議中開發提出的一些問題及解決方案、或者沒有達成共識的地方,記錄下來等領導決策,在會議結束后以郵件形式、或wiki文檔發送前端們,抄送產品,確保會議內容的傳達到位。后面也好跟蹤。


          還有一點就是,我們之前遇到的情況,在宣講會上 講解的一些要求,開發在做的時候可能就忘記了,讓開發改他認為設計沒有明確要求、會有點難推動,就會搞得雙方都有抱怨。有會議記錄也可避免此類情況發生




          二、開發階段


          2.1、還原有問題及時反饋

          在前面我們做了詳盡的溝通和評審,但有時也避免不了在開發過程有些問題才發現暴露。這個就需要開發同學能重視還原問題,積極溝通反饋,和設計確認商議 是否有其它可替代方案,切勿自己發揮,等到后期驗收的時候才說出問題可能會影響進度


          2.2、開發完成后對齊設計稿自查

          開發者在完成自己負責的模塊界面時,可自己對齊設計稿自查一遍,參考【3.1驗收標準】的表格,可幫助判斷問題,在此階段也可發給設計者確認效果。


          三、驗收階段



          3.1、測試同學確保交互和視覺還原度至少在70%左右


          這里可以提前在項目排期階段,設計師將所需的驗收工時同步給技術和測試,將驗收時間考慮進去

          為什么要求測試同學保證還原度至少在70%呢?

          因為如果不要求測試走查還原度,設計驗收的時候就會有大量的問題,最后變成設計在測試界面而不是驗收。設計師不像測試對整個流程的測試配置那么熟悉方便,反復驗收需要測試和設計不斷配合,雙方的工作量都會加大。


          理想的狀態應該是測試整個流程走通,視覺和交互還原問題也要著重測試,設計和產品在測試沒什么大問題后再進行驗收。


          參考【驗收標準】的表格,可幫助判斷還原問題



          3.2、明確知道模塊的開發者

          最好是提前知道模塊的開發者,這樣驗收的時候一對一進行模塊的打版驗收效率更高


          3.3、設計走查問題標注優先級

          技術對功能上的BUG,可以自己很好的判斷哪些是嚴重的緊急的,但對于視覺和交互層面的感知就比較低。在提問題單的時候,我們可以幫他標注出優先級,告知開發哪些是比較嚴重的需要優先修改的,不然 開發自己很難判斷,可能就會挑一些比較好改的先改了,重要的問題反而被擱置了。尤其在項目時間比較緊張的時候,有優先級標注 開發能夠看出哪些是可以為項目進度做出妥協的,哪些是必須要修改的。



          3.4、BUG單

          設計提BUG單的不能簡單的說這里出錯了,請參考設計標注重新調整。要直接給出正確的尺寸、增多少、減多少、這樣可幫助技術提高更高效率,也能避免開發自己去看又出現誤差、又要返工修改。



          3.5、遺留問題有記錄



          四、結語

          設計師在驗收過程中容易遇到的一個比較頭疼的問題就是,技術和產品小伙伴可能因為項目上線時間緊,覺得視覺還原和頁面交互體驗上的問題不重要不給予修改,優先保障功能上線。

          除了這些原因,設計側也在檢討總結,自己有哪些做的不足的地方,所以 以上文檔也是對接下來工作的優化方案。設計還原度也是日??己酥?,需要大家重視,好的產品要嚴格把控精心打磨,希望這次的總結、相關流程和經驗,在接下來工作中能夠提升設計驗收效率和還原度。

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

          文章來源:站酷   作者:飛行的考拉

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

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

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


          設計輸入框原來這么簡單

          資深UI設計者

          導讀:系統設計當中除了按鈕之外,文本輸入框(Text Fields)應該是最常見的交互元素了。當你在淘寶買個東西,當你注冊個新賬號,當你買單輸入個金額時,各種使用場景簡直無處不在。可以說把握好輸入框設計,我們的表單設計就成功了一大半。

          一、「Text Fields」的基本結構

          今天直接單刀直入不講別的,直接把google的Material Design對于文本輸入框結構分解圖放上來,

          1. 容器(Container)
          2. 前導圖標(Leading icon)
          3. 標簽文本(Label text)
          4. 輸入文本(Input text)
          5. 尾隨圖標(Trailing icon)
          6. 激活指示器(Activation indicator)
          7. 幫助文本(Helper text)

          這里需要指出Material Design對于文本輸入框結構是經過多年設計發展洗禮,然后基于它規范之下而生成的標準構造體。我們拋開一些非必要元素之后會得到一個基礎版本文本輸入框的構造。

          一個表單項從結構上來看可以分為標簽、表單域、提示三個主要的元素。

          1、標簽文本(Label Text)

          “標簽文本”該表單項唯一的名稱,告訴用戶填入什么信息。

          2、幫助文本(Helper text)

          “幫助文本”在該處位置可將提示用戶的相關信息放置于此。

          3、容器(Container)

          “容器”用戶輸入文本信息區域,可以是單行文本,也可以是多行文本。

          二、「Text Fields」的交互狀態

          文本輸入框常規情況下具有4種交互狀態:「默認狀態」、「聚集狀態」、「錯誤狀態」、「禁用狀態」

          1、特別提下文本輸入框通常情況下不具有「Hover狀態」。

          2、在設計聚焦狀態的時候,需要注意用戶光標的位置。比如:text fields的信息來源不僅僅于來自用戶鍵入場景,同時還有可能用戶從別處復制一段文字的場景。

          三、「Text Fields」的外在樣式

          標簽「Label text」的對齊問題是讓設計師這么多年來一直頭疼的問題,也是讓設計師不斷創新交互形式的源動力。它直接影響到用戶對于表單的理解成本以及表單填寫的完成率,下面我們就來聊聊一些比較常見的標簽設計形式。

          1. 「Label text」左對齊

          標簽文本采用左對齊,文本的長短問題又會導致部分較短標簽文本與容器間距增大,讓用戶從左至右瀏覽的效率降低,并且看起來不夠協調。同時如果該產品存在國內與海外兩種版本的話,將中國翻譯成外文以后長度將會變的十分不可控。

          2. 「Label text」右對齊

          如果標簽文本采用右對齊,標簽文本的長短問題容易導致左側的視覺隱形邊界錯亂,用戶的規律眼動容易被打亂,同時如果該產品存在國內與海外兩種版本的話,標簽長度問一樣依然存在。

          3. 「Label text」與容器頂端對齊

          介于標簽左對齊與右對齊各自存在不同的優缺點,不能完美統一,從而催生出標簽與容器頂端對齊的交互方式。頂端對齊的方式使得用戶視覺動線變得十分規律,豎直向下瀏覽可以便捷地理解標簽文本閱讀效率提高明顯,同時標簽文字長度不再成為干擾設計師進行排版的一個糾結點,很好的解決了有些同時具有國內以及海外版本產品的問題。

          但是標簽與容器頂端對齊的方式也不是十全十美,在移動產品場景下或者對縱向空間使用率要求比較高的場景,標簽與容器頂端對齊的設計方式就比較尷尬。由于表單高度比其他幾個設計方式要高,造成用戶一邊填寫表單一邊不斷往下滑動。

          4. 前導圖標代替「Label text」

          前導圖標代替「Label text」這種設計方式在輕量級表單中較為常見,條件也比較苛刻:

          • 基本用在那些表單理解成本相對較低,用戶對此類表單熟悉程度較高的場景。
          • 視覺設計師對圖標繪制表意能力比較強。

          同時因為每個人生活習慣、文化差異非常之大,造成對于前導圖標的認知都有很大的不同,由于這種設計方式對于用戶理解成本很高,信息密度較大的表單類型也不適用,所以沒有很強的普適性。

          5. 占位符代替「Label text」

          占位符代替「Label text」或者將標簽與占位符合二為一的這種設計方式可以很好的節省大量縱向設計空間。但是也是存在比較大的設計弊端,假如用戶填寫的表單十分復雜且場景不熟悉需要邊填寫邊理解,那么這種設計方式就不夠優雅了,會讓用戶完全忘記自己在填寫什么類型的表單。

          基于上述一些存在的問題,Material Design的使用了一種比較討巧的設計策略。即采用占位符承載標簽文本,并且在用戶填寫信息時,標簽文本始終可見,由占位符轉移到文本框頂部。

          這種設計方式對視覺動線、標簽整齊度、排版空間等一系列問題都有改善,但是在填寫信息密度大、理解難度高的表單上表現就不盡如人意。讀者現在可以腦補下,在一個需要填寫大量表單的場景下,這種帶有動效的方式會造成視覺混亂,不能讓用戶沉浸式的填寫信息,容易讓用戶出戲。

          不過在某些商業場景下,這種設計方式對數據轉化會有比較不錯的表現。譬如在電商的搜索框當中,把一些需要重點的商品信息放在占位符上,一方面對該商品的曝光量必然有所提升,另一方面在用戶直接點擊搜索時,將會以當前占位符內容進行搜索,達到為所推薦商品引流的效果。

          四、需要注意的點

          1. 注意粘貼場景

          前文也提到過text fields的信息來源不僅僅于來自用戶鍵入場景,同時還有可能用戶從別處復制一段文字的場景。那么在用戶復制信息過來的時候,就需要特別注意focus狀態下的光標位置,必須在文字的末尾,而不是在其他什么亂七八糟奇特的地方。

          2. 合理的反饋

          1)負反饋

          合理的反饋信息對用戶降低理解成本、提高表單填寫率也是至關重要的一部分。這里我總結一些比較常見的錯誤類型供大家參考,沒有想到有缺失的類型也希望大家幫我補全。

          「內容是否為空」比如必填項;

          「二次確認是否相同」比如密碼校驗;

          「輸入信息是否合規」比如密碼格式;

          「輸入信息長度合法性」比如手機號碼長度;

          「輸入信息的唯一性」比如收到的驗證碼。

          2)正反饋

          從用戶體驗流派角度去分析,好的設計不僅在錯誤情況下給出明顯易懂的提示信息,也要在正確場景下給到正向反饋與鼓勵,讓用戶增強信心。

          3. 提供格式范例

          對于某些具有特殊格式的輸入信息(比如手機號碼、出生年月、信用卡到期日等等),我們在設計占位符的時候就可以預先把格式寫入其中,告訴用戶信息輸入的必要格式,起到提前防錯效果。

          4. 清除功能

          清除功能在pc端的表單中存不存在區別并不是很大,但是在移動端表單中小編強烈建議把它放上去,因為可以幫助用戶大大降低交互成本。

          5. 合理的字數提示

          在使用多行文本輸入信息的時候,我們經常會碰到輸入文字超出文本域字數規定的情況。那么一個優雅的字數限制方式就顯得尤為重要。一般采取兩種設計方式:

          • 當用戶輸入信息超過設計規定時,就不讓用戶繼續輸入,同時也不顯示超出信息。
          • 在文本框內顯示所有用戶輸入的信息對于不做限制,在幫助文本(Helper text)處告訴用戶你已經超出了規定。

          顯而易見第二種方式更為優雅,也更能夠獲得用戶的尊重,畢竟最高層次的用戶體驗就是讓用戶自由的輸入。

          6. 為特殊人群而設計

          根據相關研究機構調查報告得出每10個人當中就是1個具有某些方面的先天不足,所以恢復到初心「設計以人為本」,針對特殊人群在設計的時候我們必須要考慮周全,比如紅綠色盲。這里小編就不展開闡述了,有機會的話可以另外開一篇文章專門講講這方面設計需要注意的點。

          五、文末總結

          Text Fields是我們平常表單設計工作中無法避免的一環,幾乎20%的Text Fields承擔著表單當中80%的重要功能。與表單填寫率與完成率有著密不可分的關系。如何合理的設計表單當中的Text Fields成為了工作當中的重中之重。

          相關知識推薦:你到底會不會「下拉菜單」?。?



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

          文章來源:人人都是產品經理   作者:月亮與六便士

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

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

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


          JavaScript 中的作用域、預解析以及變量提升

          前端達人



          JavaScript 中的作用域、預解析以及變量提升

          作用域:變量的作用范圍

          局部作用域:函數內部



          在局部作用域聲明的變量稱為局部變量,局部變量只能在當前函數內部使用



          1)函數在執行的時候會在內存中開辟新空間



          2)當執行完畢函數之后,會關閉作用域空間(變量被銷毀)



          注意:形參也是局部變量



          function fn() {

              let b = 5

            // 局部訪問 變量 b 

              console.log(b) // 5

          }

          fn()

          // 全局訪問 變量 b

          console.log(b) // 訪問不存在的變量,報錯

          1

          2

          3

          4

          5

          6

          7

          8

          在控制臺打印得到如下結果







          全局作用域:函數外部



          1)在全局作用域聲明的變量是全局變量,全局變量可以在任何地方使用



          2)因為全局變量可以任何地方使用,所以要特別關注局部變量



          let a = 2

          function fn() {

              // 局部訪問 變量 a

              console.log(a) // 2

          }

          fn()

          // 全局訪問 變量 a

          console.log(a) // 2

          1

          2

          3

          4

          5

          6

          7

          8

          在控制臺打印得到如下結果







          函數內部之所以能夠訪問到變量 a ,是因為有一個作用鏈,函數內部訪問一個變量會先在自己的作用域內找,找不到會向上級作用域找,找不到就會報錯



          例如 如下代碼



          (找不到報錯的情況)



          function fn() {

              function fn1() {

                  function fn2() {

                      // 局部訪問 變量 a

              console.log(a) // 2

                  }

                  fn2()

              }

              fn1()

          }

          fn()

          1

          2

          3

          4

          5

          6

          7

          8

          9

          10

          11

          控制臺打印







          (全局變量局部訪問的情況)



          let a = 'hello javascript'

          function fn() {

              function fn1() {

                  function fn2() {

                      // 局部訪問 變量 a

              console.log(a) // hello javascript

                  }

                  fn2()

              }

              fn1()

          }

          fn()

          1

          2

          3

          4

          5

          6

          7

          8

          9

          10

          11

          12

          控制臺打印







          塊級作用域:類似局部作用域



          1)用 {} 包裹一塊



          2)let聲明變量具有塊級作用域,var聲明變量不具有塊級作用域



          例如



          (以字面量對象為例)



          let obj = {

              uname: '法外狂徒-張三',

              age: 68

          }

          1

          2

          3

          4

          想要訪問這個對象里面的屬性必須通過 obj.屬性,而不能直接訪問



          預解析

          預解析:在代碼執行之前把變量和函數會提前解析到當前作用域的最前面



          任何作用域在執行之前都要預解析 (函數優于變量)



          變量:帶有聲明的變量,只定義不賦值



          1)變量在聲明之前被訪問,變量的值為 undefined



          函數:帶有名字的函數,只定義不調用



          1)函數優于變量



          console.log(a) // undefined

          fn() // hello javascript



          function fn() {

              console.log('hello javascript')

          }

          var a = 2

          1

          2

          3

          4

          5

          6

          7

          代碼是自上而下執行,但是在代碼執行前會先進行代碼的預解析,把變量以及函數 聲明 提升到當前作用域的最前面,如上代碼,console.log(a) 會打印 undefined



          但是,注意?。?!注意!?。?br />


          變量必須是 var 聲明的才可以,如果是 let 聲明的變量會報錯



          圖 (var 聲明的 a)







          圖 (let 聲明的 a)







          變量提升

          預解析會引起變量的提升



          變量不聲明就輸出會報錯



          console.log(a) // 報錯

          1

          控制臺打印







          用 var 聲明



          console.log(a) // undefined



          var a = 'hello javascript'

          1

          2

          3

          控制臺打印 undefined ,我們知道變量定義不賦值會輸出 undefined,說明變量已經存在并且提升了,但是只提升了聲明沒有提升賦值,所以打印 undefined ,如果沒有提升的話,就會像上面一樣在執行 console.log(a) 的時候直接報錯



          結論:var 存在變量提升



          用 let 聲明



          console.log(a) // 報錯



          let a = 'hello javascript'

          1

          2

          3

          結論:let 不存在變量提升



          補充:

          申明變量:let \ var \ const



          1)let 聲明的變量不在window內



          2)var 聲明的變量相當于給window添加了個屬性,let不會



          3)var 聲明的變量不具有塊級作用域,let具有塊級作用域



          4)var 可以重復聲明,let只能聲明一次



          5)const 用來定義常量,不可以改值



          6)const 定義的常量必須初始化有值,let可以不設置值



          建議:常量名字因為是不可以改動的值,所以常量名建議用大寫,一般用于定義固定不變的值




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

          文章來源:csdn

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

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


          JavaScript -- Map數據結構

          前端達人

          什么是Map

          Map和對象類似都是鍵值對的集合。

          Map和對象的區別

          對象一般用字符串當鍵。

          Map可以用數字、字符串、布爾值、null、undefined、數組、對象、Set、Map等做鍵。
          在這里插入圖片描述

          Map實例的屬性和方法

          set()

          向Map實例中添加新成員,可連續添加。
          如果新成員的鍵已存在,那么新成員將會覆蓋以存在的鍵。
          在這里插入圖片描述

          get()

          通過Map實例的鍵,來訪問其對應的值。

          獲取不存在的成員返回undefined。
          在這里插入圖片描述
          在這里插入圖片描述

          has()

          通過Map實例的鍵,來判斷成員是否存在。
          在這里插入圖片描述

          delete()

          刪除Map實例成員,刪除實例中不存在的成員不報錯。
          在這里插入圖片描述

          clear()

          清空Map實例成員。
          在這里插入圖片描述

          forEach()

          遍歷Map實例成員,接收兩個參數,第一個是一個回調,回調接收三個參數:value、key、Map。第二個參數是是this指向。
          在這里插入圖片描述

          size屬性

          獲取Map成員個數。
          在這里插入圖片描述

          Map構造函數

          二維數組

          在這里插入圖片描述

          Set

          Set必須體現出鍵和值。
          在這里插入圖片描述

          Map

          Map作為參數,傳入構造函數,相當于Map實例的克隆。
          在這里插入圖片描述

          Map注意事項

          Map對于重復鍵的判斷基本遵循 ===,但在Map中NaN ===NaN。

          Map的應用

          操作DOM

           <p>1</p> <p>2</p> <script> const [p1,p2] = document.querySelectorAll('p'); const m = new Map([ [p1,'red'], [p2,'blue'] ]); m.forEach((color, elem) => { elem.style.color = color }) </script> 
          
          • 1
          • 2
          • 3
          • 4
          • 5
          • 6
          • 7
          • 8
          • 9
          • 10
          • 11
          • 12

          在這里插入圖片描述

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

          文章來源:csdn

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

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


          為什么這組設計有點奇怪?想了一個星期,終于知道了!

          seo達人


          圖片

          相對是比較統一的,其中一個統一的維度就是透視統一。
          但是我們可以看下下面這組練習:

          圖片

          透視就非常不統一了,而且在我看來這四個圖標的透視竟然多種類型。
          對于透視,我了解的也不多,但并不妨礙我和大家分享一些自己的看法。為了方便大家理解,我還是往簡單了說,盡量讓大家一看就明白,我暫且把透視分為四種類型:
          1點透視
          2點透視
          3點透視
          平行透視
          首先,我們來說下1點透視,很簡單,就是你的物體在畫面里都消失于一個點,比如:

          圖片

          然后,我們來說2點透視,就是你的物體在畫面里消失于兩個點,比如:

          圖片

          那3點透視大家應該已經猜到了,就是你的物體在畫面里消失于3個點,比如:

          圖片

          最后說一下平行透視,其實也可以說是0點透視,就是你的物體在畫面里沒有消失點,線與線都是平行的,比如下面這種:

          圖片

          現在我們應該大概能明白透視的類型了,這時候我們在回來看剛才的那張練習:

          圖片

          我們來分析一下,第一個圖標

          圖片

          有點像平行透視,又有點像一點透視,其實它是一個平行透視,就是透視關系沒找準。

           

          第二個圖標:

          圖片

          很明顯,偏向于平行透視。

           

          第三個圖標:

          圖片

          比較典型的兩點透視。

           

          第四個圖標:

          圖片

          透視關系有點難受。
          我們會發現,這四個圖標竟然有多種透視關系:透視不準、平行透視、2點透視、,這也就是不統一的原因,而不統一就造成了所謂的不精致。
          所以后面大家在做練習的時候,如果對于透視關系拿不準,千萬不要在一組圖標里嘗試太多種透視,就統一的做好一種就可以了,就像下面這些:

          圖片

          好啦,今天就分享這么多,文中有表達不太準確的地方,歡迎指正,希望可以幫助到大家,下期見!

           

          原文地址:菜心設計鋪(公眾號)
          作者:菜心設計鋪
          轉載請注明:學UI網》為什么這組設計有點奇怪?想了一個星期,終于知道了!

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

          截屏2021-05-13 上午11.41.03.png

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

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

          我們來聊一聊設計師成長的三個階段

          seo達人



          一  階段劃分

          按時間和經驗區間來看,大致可以分為三個階段:初級階段高級階段、專家階段

          圖片

          每個階段我們總結出一個最具有關鍵點的問題來展開分析。

           

          二  初級階段

          這個階段的設計師初入職場或者一兩年工作經驗,處于小白階段,對任何事物都有好奇心,精力也是最充沛的階段。

          圖片

          同時也是在這個階段,設計師往往是迷茫的,不知道自己要朝著哪個方向努力、該學習什么。一個不小心,努力錯了方向,耽誤的時間是彌補不了的。

          這里我給初級階段的設計師總結了一個問題,同時這個也是目前各大廠在招人的一些可參考的標準。

           

          (問題一)如何在眾多設計師中脫穎而出?

          圖片

          2.1 對設計有足夠的熱愛

          俗話說干一行愛一行,只有對設計有足夠的熱愛,才能激發出無限的潛力。加班到深夜完成一個項目后,才會有無比的滿足感而不是厭惡感。

           

          2.2 學習能力

          學習伴隨終生,互聯網發展如此之快,你如果只局限于現有的能力,早晚會被時代所拋棄。學習能力分為兩類:

          • 自我學習:抓住當下火熱的趨勢,不斷挑戰自己的能力,提升自己;
          • 項目中學習:項目完成后做復盤,可以讓你學到更多的東西,避免相同問題再犯錯。

           

          2.3 交叉能力

          職業有邊界,設計無邊界。不要只看重自己當下職業中的技能,要把有限的職業做出無限的可能。多學習相關知識和技能,充實自己。

           

          2.4 協作能力

          隨著互聯網的發展,協作能力變得越來越重要,很多項目是你一個人無法完成的,所以就需要多人協作,人效也尤為重要。為了提高效率,你就必須增強你的協作能力。

           

          2.5 責任心

          有責任心的設計師往往是會被看重的,像那些只為了眼下自己的任務而不關心項目整體的設計師,會被慢慢邊緣化。

           

          2.6 有想法

          這個是基本的能力,就不用過多闡述了吧?沒有想法的設計師只是一個沒有感情的做圖機器。

           

          2.7 高執行

          無論有多好的設計能力、想法,最后能落地才是好方案,高的執行力可以讓你的方案很快的落地,不至于讓別人認為你只有嘴上的功夫。

           

          2.8 懂商業

          隨著行業的發展,設計能力不僅僅是視覺能力,更大一部分是是否滿足商業化的需求,只有懂商業才能設計出更符合消費者的產品。

           

          2.9 正能量

          設計師一定要有正能量,是一個積極向上的人,每天都在想 *** 的事情,是不能成為真正的大神。

           

          2.10 有沉淀

          每個設計師的思想都是獨特的,你要把自己的想法和經驗沉淀下來,多年過去回頭看,你才不會覺得前些年什么都成績都沒有。

           

          三  高級階段

          高級階段一般處在 5 年左右的一個工作經驗,這個時候職業技能方面已經爐火純青,行業上面也有一些造就。

          這個時候呢,又到了職業生涯的第二個分叉口。我們就來引出第二個問題:

           

          (問題二)30+ 歲的設計師如果走不上管理崗,該如何做好自己的職業規劃?

          圖片

          在這里我想反問大家兩個問題:

          • 管理崗位跟你的職業目標是不是一一對應?
          • 你是想要獲得一個管理崗位還是管理的能力?

          其實在 30 歲這個年齡,是設計師最美好的時間。要職業技能有職業技能,要經歷有經歷,也有年輕人的干勁。

          其實很多人都是因為喜歡設計這個行業才做的設計,剛畢業的時候都是憧憬著自己哪一天能成為設計界的大?!,F在卻被行業內卷的,非要走上管理崗嗎?

          設計上走上管理崗是一種出路,但不是唯一出路,我們完全可以在專業度上深挖,把自己打造成一位大神(據大廠數據統計,專家級別的平均年齡在 30 出頭)。

          設計是有無限的可能,把所有的時間都放在專注設計上都不夠用的。

          最后,我想再反問大家一個問題:你真的想得到的是管理崗嗎?你有可能只是想得到認可。

          所以價值的體現會在各個方面,不要被內卷的世界所誤導。

          圖片

           

          四  專家階段

          這個階段你就已經站在了行業金字塔的頂端了。一般情況下,就算不專門的轉做管理崗,也會或多或少的帶一些職級低一些的設計師,需要有一些管理的能力。那么最后一個問題也就也就引出來了:

           

          (問題三)如何打造一個優秀的設計團隊?

          圖片

          4.1 對專業的熱愛,你要讓你團隊的成員感受到從上到下都是很專業的。很多優秀的設計團隊不是有很多人,而是有一群非常專業的人。

          4.2 愛的氛圍:你要把團隊成員當做家人一樣,讓他/她在這個團隊里感受到愛。

          4.3 給予大家更多的空間,不設定死的 KPI 目標,不設定框框架架,可以激發更多的潛力。

          4.4 接上一個點,如果沒有 KPI,那該如何量化設計價值?當團隊的專業能力達到足夠的高度,硬性指標的事情就會做的非常得心應手,反而大家都會去做一些沒有嘗試過的事情,激發框架之外的潛力。

          4.5 找一個比你還優秀的人,永遠有個人鞭策著你,讓你不斷前進。

          4.6 你要做決定,要不然要你做什么,做任何一個關于團隊的決定。

          最后總結下來,你要“雌雄同體”,既要有男性的理性和果斷,也要有女性的包容和愛,這樣才能成為一個合格的 leader。

           

          總結

          每一個階段的過度都是一個成長,勇于困難、不懼未來,你總會成為你理想中的樣子,加油!

          最后,希望本編文章能對看完的你有所幫助,這也是我做分享的初衷,我們下期見。

           

          原文地址:友設青年(公眾號)

          作者:Luckgg

          轉載請注明:學UI網》我們來聊一聊設計師成長的三個階段

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

          截屏2021-05-13 上午11.41.03.png

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

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


          解決vagrant上使用Homestead很慢(響應速度10s+)

          前端達人

          說明:

          使用vagrant和Homestead 在vBox上面跑laravel, 響應速度非常緩慢(大概在10+s),

          嘗試過增加虛擬機配置, 但是沒有任何效果, 經驗證也不是數據庫的原因 .

           

          通過網上查詢了解到, 是因為VirtualBox的IO引起的: http://mitchellh.com/comparing-filesystem-performance-in-virtual-machines


          解決方法1:

          在Homestead.yaml下添加type:nfs, 注意空格, map對應windows下面的物理路徑

          解決方法2:
          如果上訴方法, 還是不能增加響應速度(我的就是), 則嘗試以下方法
          安裝一個vagrant 插件


          $ vagrant plugin install vagrant-winnfsd


          然后修改 Homestead/scripts/homestead.rb 的代碼, 循環部分替換成如下:

           

          重啟vagrant 之后, 響應速度已經將至 200 ms


          ----------參考資料
          https://laracasts.com/discuss/channels/general-discussion/for-those-who-find-homesteadvagrantvirtualbox-slow-on-windows?page=1
          http://mitchellh.com/comparing-filesystem-performance-in-virtual-machines


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

          文章來源:博客園

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

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

          日歷

          鏈接

          個人資料

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

          存檔

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