<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設計分享達人

          數字化駕艙近來大熱,數字化駕艙的組成元素包含哪些以及又有哪些駕艙相關的新技術出現?在這里,MOMOUX帶你讀懂數字化駕艙。

          讓設計更具有趣味性的5大TIPS

          用心設計

          如果您想訂閱本博客內容,每天自動發到您的郵箱中, 請點這里

           

          這是一個創新的年代,如果你的設計千篇一律,哪對用戶來說,這是很乏味的作品。所以在滿足設計需求的同時,我們可以加入一些趣味性的東西,比如方案、聲音、交互細節、圖像等等,讓頁面更加有趣。

          這里有5個提高設計更有趣味性Tips,歡迎大家在設計項目中嘗試。

          一. 就是不能好好講話

          通過夸獎、傲嬌的語氣滿足用戶虛榮心及好奇心

          文案的趣味化,簡單有力,看似不經意,但卻是最直白的幽默。像下圖小紅書的隨機點贊設計,每次點贊的提示不同,有的是夸獎、有的是暖心告白、有的是引導用戶繼續點贊…這樣的設計,因為有驚喜感,所以激發了用戶的好奇心,并不斷點贊嘗試。

          而網易云音樂的Mac安裝包提示文案:「你的Mac終于擁有最佳音樂App了!」不討論產品好壞,這句文案就一語雙關,既夸獎了自己產品好,也夸獎了用戶有品。

          用「機智」的話有情感的引導用戶

          下面的兩個場景是我們最熟悉不過的聊天頁及注冊頁。左邊是主打微社交的Nice,在沒有消息的時候它不是生硬的提示0條消息,而是很好的結合了自己產品的微社交調性,委婉的告訴用戶你是不是應該主動些?而不是被動的等待。從情感上用戶會覺得更放松也更容易接受這樣的建議。

          右邊是same的注冊頁,通常注冊頁都枯燥而冗長,為了避免用戶產生負面情緒,Same這里的性別選擇文案是:女生果然總是對的!男生有時候也是對的!在填表產生抗拒心理的時候出現這樣討好的文案,誰還會有什么負能量呢?

          文案說他想領便當了

          對于開玩笑要有一個度,像作到飛起的手機端網易云音樂的推送文案:「你這么愛聽歌,一定活的很難過吧」。雖然可能說的是實話,但是沒人愿意聽這樣的大實話,所以對于一些相對玻璃心的用戶來說會覺得受到了嘲諷,這樣的文案就容易起到反向作用。

          △ 微博評論截圖

          二. 扁平里的寫實派

          模擬真實場景,讓用戶感受細節的用心

          這里更像是擬物化行為的設計,模擬真實的使用場景。將我們在日常生活中習以為常的小細節,融入到頁面細節的設計中去,被用戶發覺時應該會會心一笑吧。這也最能體現設計師的觀察力及對細節的把控力。像iOS的手電筒開關設計和飛行模式的設置就是這樣的,手電筒開關的時候,上面的小按鈕也會跟著開和關,飛行模式的開關則有一個向右的飛行路徑,并不是生硬的出現然后消失。

          對模式化的元素注入性格,增加新鮮感

          這里還是拿Same舉例,通常我們用的p圖軟件的濾鏡,一般是以色彩給人的直觀感受來命名的。而Same的每個濾鏡有自己的名字、性別、出生年月甚至的表情、性格(據說每個原型是來自他們團隊的設計師),這樣的設計確實會讓人覺得:「誒!有點意思,跟外頭那些妖艷濾鏡果然不一樣呢!」

          三. 玩不膩的小彩蛋

          打破常規,吸引用戶注意

          對于熟悉的行為我們會產生枯燥的情緒,然后隨之會忽略。當在熟悉的情境下,出現了意想不到的小彩蛋,必然會增加用戶印象,提高用戶注意力,并產生積極愉快的情感。像Facebook的聊天表情,在輸入時長按,就會變成超大的表情,好比在說給你一個大大的贊、給你一個大大的愛心……這樣的設計,真的是會玩到停不下來 。

          情理之中意料之外,增加用戶印象

          我們都知道的格瓦拉,在線選座時遇到一些院線熱映,選座狀態會變成電影的主角頭像 ,這對用戶來說是一種加深印象的預熱,要比默認選座狀態更有代入感。

          最美有物,是一款銷售設計師產品的平臺,印象最深刻的是喜歡與不喜歡的表態設計,他的主張是找到同樣品味的人,所以這里的小動畫就做的細膩又有趣,將不屑和喜歡表達的淋漓盡致,比起正常的點擊即高亮,更能表現用戶的情緒、產生共鳴。

          貼心設計,讓用戶產生好感

          使用金融類軟件時,最怕的是沒錢,更怕的是有點錢剛點開App旁邊有人過來了, 這時候匆忙關閉顯得很不自然。微眾銀行的滑動隱藏資產的設計很好的解決了這個問題,保護了私密性的同時操作起來也不會顯得那么尷尬,這樣真正的替用戶考慮的設計怎么會不讓人產生好感?

          四. 不如一起玩游戲

          用激勵的方式滿足用戶虛榮心與攀比心

          通過設計一些有挑戰性的小游戲,讓用戶參與進來,可以激發用戶的好奇心以及攀比心,在完成任務的過程中滿足用戶的存在感、歸屬感及參與感,游戲的設計也是這里面互動性最強的一種設計,也是最有趣味的。Nice就使用了收集徽章的方式來鼓勵用戶發圖片、使用功能等,對用戶是激勵的同時,并可滿足用戶在其好友跟前的攀比心。

          獎勵化,讓用戶有存在感與歸屬感

          Same平臺的早安、晚安打卡功能,會隨機贈送給用戶一首歌,打卡這件事一方面對于平臺來說提高了用戶留存,另一方面對喜歡音樂的用戶來說則找到了歸屬感與存在感,會覺得有這么一個平臺是懂他們的。

          下面兩個利用獎勵化機制提升參與感的例子來自騰訊先游。

          第一個是貼熱。用趣味選擇題的方式讓枯燥的簽到變得有趣起來了。

          第二個是游戲體驗建議收集。其實通俗點就是產品體驗反饋、幫助產品優化流程等,但是這里變成了領取任務,并且有相應的獎勵,提升了用戶參與感的同時滿足了用戶的歸屬感,因為獎勵機制會讓用戶覺得自己的建議會有可能被采用,而不是反饋了就沒有然后了。

          五. 制造點聲響

          不同感官的刺激來增加產品印象及代入感

          聲音的提示可以起到未見其人先聞其聲的效果。聲音作為操作行為的一種反饋,提示用戶的同時,增強代入感。比如微博國際版客戶端,在發送狀態時,小飛機飛出去的時候會伴隨著:「嗖」的一聲,讓用戶有一種發送成功的確定感。而Mac系統截圖行為,則伴隨著像裁切紙張一樣的「咔嚓」聲來提示截圖成功,就非常的具有代入感。

          最后,我會以我比較熟悉的游戲平臺項目,簡單總結一下各種置入趣味設計的方法:

          可以嘗試從文案的方向進行優化,比如將搜索游戲提示語:「未搜索到某某游戲」變成:「誒,你剛才可能輸入了假游戲,不如再來一遍?」。

          融入一些激勵化的小游戲來增強玩家互動,提升用戶品牌感知等。

          設計與品牌風格統一的有趣反饋動畫,或在適時置入聲音作為彩蛋,增加整體的趣味氛圍。

          而不論是以上哪種手段,在使用之前都要認清,趣味設計都是設計上的一種錦上添花,增加趣味需要在滿足產品功能的前提下進行,不必為了有趣而強行有趣。在設計的過程中也要多思考下是否可以做更多深入的細節優化,反復推敲,最適當的場景中融入細膩的情感化設計,讓趣味成為我們設計的點睛之筆。

          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 

          掌握這5個關鍵點,零基礎也能建立信息架構

          資深UI設計者

          如果您想訂閱本博客內容,每天自動發到您的郵箱中, 請點這里

          什么是信息架構?怎么理解用戶體驗五要素?本文用大量的案例和插圖幫你輕松掌握這個基礎知識。

          今天想要跟大家聊一聊關于 UX 和 IA 的話題。其實在寫今天這次分享的題目的時候我修改了很多次,為什么會修改很多次?這要從我在 medium 看的一篇文章說起,這篇文章的標題是《6 Tips How to Apply Information Architecture in UX Design》,翻譯過來的意思是在用戶體驗設計中如何建立信息架構的6點建議。

          當時讀完文章,雖然覺得文章里講的一些散碎的概念迷迷糊糊可以理解,但這些概念就像蓋房子的磚塊一樣,我完全不知道這些磚塊該怎樣才能蓋成一棟大樓,或者我就站在樓下而因為自己視野有限完全不知道這棟大樓到底長什么樣子,所以因為這個原因我一直苦惱于該如何去清晰的表達想要分享的內容,思來想去決定這次分享不能僅僅是我對某篇文章的翻譯,想要弄清楚這篇文章到底在講什么,先要弄明白文章里的知識,當我們了解清楚了這些信息之后再來理解這篇文章就會輕松容易得多,下面就將我總結出來的內容分享給大家。

          一、UX & IA

          UX 即 user experience,譯為用戶體驗。

          IA 即 information architecture,譯為信息架構。

          他們的關系可以簡單理解為良好的信息架構是用戶體驗的基礎。

          我們平時聽到了太多關于用戶體驗的東西,大家都以為用戶體驗就跟交互設計差不多。我之前確實也是這么理解的,但是最近發現我的這個想法是有些過于片面了。

          我們可以把用戶體驗的工作分解成五個組成要素,分別為戰略層、范圍層、結構層、框架層、表現層。

          它們都是自下而上起作用的,每一個層面都是根據它下面的那個層面來決定的,所以表現層由框架層來決定,框架層則建立在結構層的基礎上,結構層的設計基于范圍層,范圍層是根據戰略層來制定的。每一個層面的決定都會影響到它之上層面的可用選項,信息架構只是用戶體驗結構層的一部分而已。

          二、什么是IA

          IA 即 information architecture,解釋出來就是合理的組織信息的展現形式。

          主要任務是為信息與用戶認知之間搭建一座暢通的橋梁,是信息直觀表達的載體,通俗點說就是信息架構不僅僅是設計信息的組織結構,還需要研究信息的表達和傳遞。

          這么說也許還有些抽象,舉個簡單易懂的例子:

          我們來看這個商場的平面解析圖,通過這個圖我們可以很清楚的了解商場的結構,從而快速定位自己的位置還能順利找到自己想要購買的產品。信息架構對于一款產品來說就相當于商場的平面解析圖,就像現在我們看到的這幅圖一樣,商場的每一層都有相對應的分類區塊來指導消費者。試想如果一個商場沒有對商品進行有序的分類,那么我們在逛商場的時候就很難順利挑選出自己所需要的商品,面對各種無序且數量繁多的商品我們一定會崩潰,這樣的情況對于男士來說絕對是場災難,但對于女性來說也許會是一個充滿未知探索的挑選過程吧。

          但不管怎么說在這里設計師需要做的就是規劃好這些樓層信息層級,主要做的工作就是:分類、層級梳理等。簡單的說就是規劃好每一層有什么商品,同一層商品怎么分布等等信息。

          所以在互聯網產品設計中:設計師梳理信息架構,其實和剛才說的梳理商場樓層架構的概念是差不多的。

          三、IA的作用

          一個好的信息架構一定是會滿足兩個維度的需求,即用戶需求和產品目標。

          從用戶的角度出發它可以讓用戶在一定的信息規劃下更容易找到自己想要的「東西」。

          從產品目標角度來看它能通過「信息架構設計」去教育、說服、通知用戶。

          所以用最簡單的兩個字來說其實信息架構就是在做分類。

          再回到剛才那個例子想一想,把商場里的商品分類其實對于我們產品而言就是在給我們產品中的信息分類,以方便用戶能更好的使用我們的產品,而不會想要把產品卸載,從而使產品達到易用好用想用的目的。就跟我們逛商場一樣,當我們能夠根據指示順利買到自己所需的商品的時候我們就不會因為找不到我們想買的商品而失望的離開商場。

          那么問題來了,我們該如何進行信息架構分類呢?也就是信息架構的分類方法是什么呢?

          四、IA分類方法

          這里給大家介紹2種方法,從「產品目標」出發我們可以采用「從上到下」的分類方法;從「內容和功能需求分析」出發就可以用「從下到上」的方法進行分類。下面來跟大家分享一下這兩種方法的具體做法。

          剛才說了從上到下是以產品目標即戰略層出發的分類方法,所以最開始就是先從最廣泛的、可能滿足決策目標的內容與功能開始進行分類,然后再按邏輯細分出次級分類,這樣的「主要分類」和「次級分類」就構成了「一個個空槽」,將想要的內容和功能按順序一一填入即可。

          我們以微信為例:首先根據產品目標將「主要分類」即一級架構分為「最近會話(微信)」、「通訊錄」、「發現」和「我」;然后再進行「次級分類」分類,比如「發現」下再分「朋友圈」、「掃一掃」、「搖一搖」等等;最后將相應的功能(如朋友圈feeds、發朋友圈、朋友圈消息等)填入到相應的「朋友圈」分類中。

          這樣就像是先有了大概的框架我們再根據這些框架往上面加東西的感覺是一樣的。

          接下來我們再來說一說從下到上的方法:

          剛才說了從下到上是由范圍層驅動從產品的功能和內容層面出發的,所以我們就要先把已有的所有內容,放在層級分類中,然后再將他們分別歸屬到較高一級的類別。這種分類方法其實就是在做「歸類」。

          其實從下到上的信息架構方法也包括了主要分類和次級分類,但它是根據對內容和功能需求的分析而來的。先從已有的資料開始,我們把這些資料統統放到級別的分類中,然后再將它們分別歸屬到較高一級的類別,從而逐漸構建出能反應我們的產品目標和用戶需求的結構。

          具體工作中我們可以將所有的功能點用一張張卡片寫下來,然后讓目標用戶參與到信息分類中,并反饋相關分類標準作為我們產品設計師去梳理信息架構的參考。實踐過程中,更需要設計師或者產品經理本身有一定的信息篩選、梳理、分類的能力,進一步通過用戶測試去檢驗分類的信息傳達有效性。

          其實就好像我們日常生活中收納衣服,我們會根據不同標準去收納,比如我們可以根據季節分類,也可以根據顏色分類,或者是根據款式分類,每個人都會有不同的分類習慣,所以這里歸結到工作中才會讓目標用戶參與到信息分類中,畢竟我們的產品是服務于用戶,所以還原用戶使用習慣和使用心理也是我們同樣要注意到的,這樣可以給我們提供一些有效的分類信息幫助我們更好的做出清楚的信息架構。

          當然這兩種方法都有一定的局限,從上到下的架構方法有時可能導致內容的重要細節被忽略,而從下到上的方法則可能導致架構過于的反應了現有的內容,因此不能靈活地容納未來內容的變動或增加,所以在實際運用中是需要我們將這兩種方式結合起來靈活運用。

          這兩種方法雖然有不同的視角但其實最終目的都是讓我們的產品易用好用最終達到想用的目的,所以讓這兩種方法對接、交匯、融合之后得出的結果才應該是我們理想中的產品信息架構。

          五、影響IA的因素

          剛才提到用戶體驗的5個層級是自下而上對其上面一層起作用的,信息架構位于用戶體驗要素第3層結構層,剛才說了結構層的設計基于范圍層之上,所以這里遇到的影響因素我們還要返回到范圍層面去尋找,范圍層又包含兩個維度,功能和內容,在從范圍層到結構層這個過程中我們會遇到很多影響因素,所以把這些影響因素總結起來我們還是要從用戶層面(內容)和產品層面(功能)兩個維度來理解。

          從用戶的角度出發,理解能力、操作習慣、目標內容使用頻率等等這些都會成為影響因素。

          從產品角度來看,產品的核心價值、主線功能、特色功能等才是影響信息梳理的因素。

          這兩個層面當然也不是完全割裂的,在做信息架構的時候可以先從一個層面出發得出一個結論之后再用另外一個層面去驗證得到的答案,然后再不斷優化在驗證過程中遇到的問題。

          不同人會有不同的分類結果,因為根據不同情況我們所需要關注的側重點會有不同,我們根據不同的影響因素會得出不同的答案。每個人都會得出不一樣的分類結果,沒有哪個結果是完全正確或者說是完全相同的,就像數學中的排列組合一樣,內容越多我們得到的結果就會越豐富,但是這些結果當然不是全都合理的,所以就需要設計師根據自己的經驗結合產品層和用戶層的需求找到合理的解決方案。我們都知道在產品設計中想要設計出來一款完美不需要迭代優化的產品幾乎是不可能的,所以我們能做的只能是結合各方面的影響因素和自己的經驗理解一直優化產品讓它接近于完美的狀態。

          現在我們來思考一個問題:為什么微信朋友圈這么高密度使用的功能要放到二級菜單呢?

          微信的創始人張小龍是這樣解釋的:

          • 微信是個社交軟件,核心功能是社交,是溝通,是好友,所以一級菜單只能跟這個相關。(產品功能層面)
          • 當朋友圈為二級tab 時,掃一掃,搖一搖,附近的人,漂流瓶,購物這些功能的曝光度就會下降,不利于微信功能的拓展。(產品功能層面)
          • 也許會造成各個模塊分配不平衡,而且發現里的功能與其他模塊的功能屬性混在一起也許會不恰當,微信為了不讓用戶被過多的信息打擾把公共號打包放在一起,那么朋友圈隨著聯系人增多,分享動態也會增加,而且內容都是一些生活中的瑣事,多少也會像公共號一樣打擾到用戶。(用戶角度)
          • 設計并不是對用戶有求必應,而是應該在產品發展戰略的指導下平衡各功能。如果將朋友圈提升為一級入口,很明顯微信的社交分享功能將得到強化,那么相應的其他功能將會被弱化,這與微信鏈接一切的發展戰略是相違背的。(產品層面)

          保持主干清晰,枝干適度。產品的主要功能架構是產品的骨骼,它應該盡量保持簡單、明了,不可以輕易變更,讓用戶無所適從。次要功能豐富主干,不可以喧賓奪主,盡量隱藏起來,而不要放在一級頁面。

          舉這個簡單的小例子供大家了解信息架構這個概念,體會一下如何用一個更全面更發展的眼光去看待產品結構這個抽象的問題。

          總結

          要在 UX 中建立良好的 IA 我們需要特別注意的5個關鍵點:

          • 在建立信息架構之前確定產品目標(戰略層)
          • 進行用戶研究預測用戶對產品可能產生的反應(范圍層)
          • 合理運用認知心理學原理預測用戶對產品可能產生的反應(結構層)
          • 根據產品信息結構去規劃導航(框架層)
          • 注意視覺層次在內容的視覺表現中的重要作用(表現層)

          所以我們繞了一大圈來看,在 UX 中建立良好的 IA 的5個關鍵點其實最后還是回歸到了用戶體驗的5個要素。再回到剛開始分享提到的那句話,從上到下表現層是由框架層來決定,框架層建立在結構層基礎之上,結構層基于范圍層,范圍層根據戰略層制定。這里每一個層面都是根據它下面的那個層面來決定的,相當于把用戶體驗要素每一層需要做的事情從另一個維度又解釋了一遍。

          當然這里要注意一點,這些層級都不是完全割裂的,如果你要求每個層面的工作在下一個層面可以開始之前完成,那樣一定會導致你和你的用戶都不滿意的結果,而相反的,應該規劃好你的項目,讓任何一個層面中的工作都不能在其下層面的工作完成之前結束。這里最重要的一條是,在我們知道基本形狀之前,不能為房屋加上房頂。 不管我們是在這5個層級的哪一層,我們不能忘記的就是要把這些連成一個整體去理解,他們一定是相輔相成互相影響的。

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

          關于頁面打開的交互方式,這篇堪稱最全面的總結!

          資深UI設計者

          如果您想訂閱本博客內容,每天自動發到您的郵箱中, 請點這里

          本篇文章分別從頁面打開方式的類型、當前頁打開&新開頁面、彈出框三方面對頁面鏈接打開方式進行了探討,給大家提出一些意見以供參考。

          頁面打開方式作為鏈接產品路徑的基礎,在設計的過程中,或多或少都會遇到選擇的困擾,尤其是產品功能復雜,層級較多時,如何讓用戶按照自己的意愿清晰的瀏覽信息,保持操作連貫性,是值得體驗設計仔細思考與分析的。

          近期在所負責的設計項目中,團隊對鏈接操作的打開方式產生了分歧,借此機會整理了一些案例與資料,就這個問題進行分析探討,也給遇到同樣問題的同行一些參考意見。

          一、頁面打開方式的類型

          網頁中可操作的鏈接,主要有按鈕、icon 以及文字鏈接,設計中常用的打開方式則主要有以下三種:

          1. 當前頁打開

          點擊操作鏈接后,在當前的瀏覽器頁面中進行內容顯示與操作。

          2. 新開頁面

          點擊操作鏈接后,在瀏覽器中新開一個獨立的標簽頁面,進行內容顯示與操作。

          3. 彈出框

          點擊操作鏈接后,在當前的瀏覽器頁面中,彈出一個小尺寸的對話框,進行內容顯示與操作。

          二、當前頁打開 & 新開頁面

          首先來說說最具爭議的新開頁面&當前頁打開。在 HTML語言中,target目標有「target=_blank」和「target=_self」兩種屬性,分別代表「新窗口打開」和「當前窗口打開」,下圖是這兩個參數的屬性描述。

          從這兩個參數的屬性上來看,「當前窗口打開」是系統默認的處理方式。這個打開方式在國外的網站中實現方式比較統一,用戶也形成了一致的習慣,但國內的形式則不盡相同,以至于一直頗具爭議,不同類型網站之間、同一網站不同場景之間也沒有一個明確的規則標準可供大家學習和參照。

          針對這個問題的討論,可以聽到兩種不同的用戶聲音,并且都站在各自的角度闡述其道理。

          舉個例子,我們以同類型網站(淘寶和亞馬遜)的打開處理方式進行對比,來看一下用戶習慣、功能場景對鏈接打開方式選擇的影響。

          首先,我們確定一致的功能場景:用戶從首頁中根據各種篩選條件,查找到心儀的商品。來看一下兩個網站的處理方式:

          可以看出基本是兩個極端,差異非常明顯,再來看個有意思的現象,亞馬遜中國的商品搜索方式竟然又和淘寶一致了,難道鏈接打開方式的差異竟是中外用戶習慣的差異?

          這確實占了很大一部分原因,那么造成這種差異的原因主要有:

          • 早期的 W3C標準不支持 target=”_blank”(HTML語言中,在新窗口中打開鏈接)的屬性,國外互聯網普及也比國內早,于是用戶慢慢養成了習慣。
          • 默認當前頁面打開讓國外用戶覺得更有「禮貌」。如果用戶想新開頁面,可以鼠標中鍵、按住ctrl點擊鏈接或者右鍵新窗口打開,此時用戶更有選擇權,可以自己決定打開方式;如果默認新開頁面,則讓用戶失去了選擇權。
          • 早期國內互聯網發展較為浮躁,網站想通過新標簽頁打開方式,提高PV。
          • 國內網絡普及晚,部分用戶尤其很多老年人不習慣甚至或許不知道,頁中有個后退前進按鈕、面包屑可用,新開頁面便于他們的操作。

          那么,淘寶中所有的頁面打開方式都是新開嗎?不是。像「我的收藏」、「已買到的商品」、「購物車」等功能頁面就是當前頁打開。

          同一個產品內部,如此區別設計的原因我認為有:

          • 用戶的目的較為明確,查找對象確定。(用戶想要查看的對象是確定的,如購物車中的產品,用戶有明確的目標,找到鏈接打開頁面即可,不像搜索查找商品,需要一步步縮小范圍甚至比對查看)
          • 鏈接入口常駐在網站的信息欄,用戶可以隨時切換,操作方便,且不存在重新輸入的成本。

          關于這兩種打開方式,到底哪種操作更順暢,確實難分高下,就跟「確定和取消哪個在左,哪個在右」是一種性質的問題,沒有好壞之分,關鍵是要看在哪種場景下使用更合適。

          新頁面打開適用的場景:

          • 頁面內容沒有關聯性,且從邏輯上沒有從屬關系,相對獨立。如:產品中的外鏈。
          • 存在多頁面「比較」的操作,需要經常切換。如:淘寶商品詳情。
          • 需要保留住前一頁的操作不丟失。如:知乎上過濾出來的結果列表。
          • 功能分支存在穿插,當路徑發生交叉時,最好新開頁面。如:產品內部的跳轉鏈接,導致信息關聯的層級發生改變。
          • 具有輔助功能的操作。如:使用文檔(PDF、圖片等)需要來回參照。

          當前頁打開適用的場景:

          • 流程性的功能頁面,前后操作存在關聯和影響。如:下單支付、按步驟新增。
          • 同一層級內容間的操作。如:tab欄的切換。
          • 同一路徑中的操作,用戶當前的操作會對主頁的內容產生影響。如:編輯一個配置,用戶操作完,會回到當前頁查看結果。
          • 用戶具有明確目的性的操作,當前頁有利于鎖定用戶注意力。如:淘寶中「我的收藏」。

          以上是結合功能場景進行的選擇側重,如果就「用戶體驗」一定要分出個高下,我個人還是比較支持默認「當前頁打開」,從體驗角度分析,「當前頁打開」略勝一籌的主要原因有以下兩個:

          • 尊重用戶的決定。當前頁打開,將更多選擇機會留給用戶(鼠標中鍵、按住ctrl點擊鏈接或者可以右鍵新窗口打開),一個具有良好用戶體驗的產品,在用戶做操作的時候,總是能讓他們按自己的意志做出決定。網站對每個鏈接強制打開新頁面則剝奪了用戶的選擇權,因為不同的人有不同的瀏覽習慣和使用需求。
          • 體驗一致。保持一致體驗的設計才能讓用戶產生信任感與安全感。當用戶在操作界面元素的時候,可以順暢的知道、理解,并且能預料到將會發生什么,不會被分神,也不會被打斷。任何違反這個原則的設計都將會演變成一種「以設計方意志為導向」的設計,而不是「以用戶為中心」的設計。

          小結

          當我們不知道兩種方式如何選擇時,或許「不強制用戶」才是最好的體驗。因為我們面臨的用戶多樣,電腦操作熟悉程度多樣,因此不同用戶對于打開方式的習慣也具有多樣性,這個是設計者無法揣測和調查清楚的。

          在「兩害取其輕」的情況下,在當前窗口打開鏈接,不失為一個選擇,尊重用戶自己的決定,讓用戶對交互界面自主可控。

          三、彈出框

          彈出框(彈層)又叫模態對話框,是指在用戶想要對當前對話框以外的應用程序或內容進行操作時的提示方式。它一般覆蓋在整體頁面之上,避免了頁面跳轉。

          彈出框通常是為了顯示一個單獨的內容,在不離開整體頁面的情況下有一些互動,提供信息和交互。

          如下圖知乎中的「寫想法」,用戶可以快速的在彈出框中記錄個人想法,記錄發布后,很順暢的回到之前的路徑上繼續操作,便捷,操作思路清晰。

          △ https://www.zhihu.com/

          現在很多產品中的新增、創建,也都會采用彈出框的交互方式,當然前提是在彈出框中編輯的內容不是很多,此時彈出框不僅承載了信息編輯的功能,還可以作為上下文的跳轉,幫助用戶銜接路徑。

          如 iconfont 中的新建項目,用戶新增后,頁面會直接跳轉到新的項目空間。

          △ http://www.iconfont.cn

          彈出框適用的場景:

          • 內容簡單,沒有復雜的操作,且具有臨時性。如:新增一個收貨地址,進行簡要的輸入編輯。
          • 更為詳細的輔助說明,是對當前內容的快速擴展。如:縮略圖,點擊放大查看。

          因此,彈出框可以較好的實現上下內容層疊的感知,不打擾用戶的主路徑,同時作為頁面承載元素和用戶操作的補充,起到承前啟后的作用。

          總結

          本文結合這三種鏈接打開方式的頁面交互關系,進行適用場景舉例,并總結每種方式的優缺點,方便在設計中更好的根據不同的場景選擇合適的頁面打開方式。

          當然,以上總結也是基于我個人的理解與經驗,沒有統一的用法和標準,在具體設計實踐中,仍要靠設計者的直覺和經驗來進行綜合考量與判斷。

          作為體驗設計師,如何規劃用戶瀏覽路徑,是個需要嚴肅對待的命題。沒有絕對的好與壞,但一定要結合產品類型、場景、目標用戶等進行具體問題具體分析。

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

          總結頁面打開的交互方式,很全面!

          用心設計

          如果您想訂閱本博客內容,每天自動發到您的郵箱中, 請點這里

          本篇文章分別從頁面打開方式的類型、當前頁打開&新開頁面、彈出框三方面對頁面鏈接打開方式進行了探討,給大家提出一些意見以供參考。

          頁面打開方式作為鏈接產品路徑的基礎,在設計的過程中,或多或少都會遇到選擇的困擾,尤其是產品功能復雜,層級較多時,如何讓用戶按照自己的意愿清晰的瀏覽信息,保持操作連貫性,是值得體驗設計仔細思考與分析的。

          近期在所負責的設計項目中,團隊對鏈接操作的打開方式產生了分歧,借此機會整理了一些案例與資料,就這個問題進行分析探討,也給遇到同樣問題的同行一些參考意見。

          一、頁面打開方式的類型

          網頁中可操作的鏈接,主要有按鈕、icon 以及文字鏈接,設計中常用的打開方式則主要有以下三種:

          1. 當前頁打開

          點擊操作鏈接后,在當前的瀏覽器頁面中進行內容顯示與操作。

          2. 新開頁面

          點擊操作鏈接后,在瀏覽器中新開一個獨立的標簽頁面,進行內容顯示與操作。

          3. 彈出框

          點擊操作鏈接后,在當前的瀏覽器頁面中,彈出一個小尺寸的對話框,進行內容顯示與操作。

          二、當前頁打開 & 新開頁面

          首先來說說最具爭議的新開頁面&當前頁打開。在 HTML語言中,target目標有「target=_blank」和「target=_self」兩種屬性,分別代表「新窗口打開」和「當前窗口打開」,下圖是這兩個參數的屬性描述。

          從這兩個參數的屬性上來看,「當前窗口打開」是系統默認的處理方式。這個打開方式在國外的網站中實現方式比較統一,用戶也形成了一致的習慣,但國內的形式則不盡相同,以至于一直頗具爭議,不同類型網站之間、同一網站不同場景之間也沒有一個明確的規則標準可供大家學習和參照。

          針對這個問題的討論,可以聽到兩種不同的用戶聲音,并且都站在各自的角度闡述其道理。

          舉個例子,我們以同類型網站(淘寶和亞馬遜)的打開處理方式進行對比,來看一下用戶習慣、功能場景對鏈接打開方式選擇的影響。

          首先,我們確定一致的功能場景:用戶從首頁中根據各種篩選條件,查找到心儀的商品。來看一下兩個網站的處理方式:

          可以看出基本是兩個極端,差異非常明顯,再來看個有意思的現象,亞馬遜中國的商品搜索方式竟然又和淘寶一致了,難道鏈接打開方式的差異竟是中外用戶習慣的差異?

          這確實占了很大一部分原因,那么造成這種差異的原因主要有:

          • 早期的 W3C標準不支持 target=”_blank”(HTML語言中,在新窗口中打開鏈接)的屬性,國外互聯網普及也比國內早,于是用戶慢慢養成了習慣。
          • 默認當前頁面打開讓國外用戶覺得更有「禮貌」。如果用戶想新開頁面,可以鼠標中鍵、按住ctrl點擊鏈接或者右鍵新窗口打開,此時用戶更有選擇權,可以自己決定打開方式;如果默認新開頁面,則讓用戶失去了選擇權。
          • 早期國內互聯網發展較為浮躁,網站想通過新標簽頁打開方式,提高PV。
          • 國內網絡普及晚,部分用戶尤其很多老年人不習慣甚至或許不知道,頁中有個后退前進按鈕、面包屑可用,新開頁面便于他們的操作。

          那么,淘寶中所有的頁面打開方式都是新開嗎?不是。像「我的收藏」、「已買到的商品」、「購物車」等功能頁面就是當前頁打開。

          同一個產品內部,如此區別設計的原因我認為有:

          • 用戶的目的較為明確,查找對象確定。(用戶想要查看的對象是確定的,如購物車中的產品,用戶有明確的目標,找到鏈接打開頁面即可,不像搜索查找商品,需要一步步縮小范圍甚至比對查看)
          • 鏈接入口常駐在網站的信息欄,用戶可以隨時切換,操作方便,且不存在重新輸入的成本。

          關于這兩種打開方式,到底哪種操作更順暢,確實難分高下,就跟「確定和取消哪個在左,哪個在右」是一種性質的問題,沒有好壞之分,關鍵是要看在哪種場景下使用更合適。

          新頁面打開適用的場景:

          • 頁面內容沒有關聯性,且從邏輯上沒有從屬關系,相對獨立。如:產品中的外鏈。
          • 存在多頁面「比較」的操作,需要經常切換。如:淘寶商品詳情。
          • 需要保留住前一頁的操作不丟失。如:知乎上過濾出來的結果列表。
          • 功能分支存在穿插,當路徑發生交叉時,最好新開頁面。如:產品內部的跳轉鏈接,導致信息關聯的層級發生改變。
          • 具有輔助功能的操作。如:使用文檔(PDF、圖片等)需要來回參照。

          當前頁打開適用的場景:

          • 流程性的功能頁面,前后操作存在關聯和影響。如:下單支付、按步驟新增。
          • 同一層級內容間的操作。如:tab欄的切換。
          • 同一路徑中的操作,用戶當前的操作會對主頁的內容產生影響。如:編輯一個配置,用戶操作完,會回到當前頁查看結果。
          • 用戶具有明確目的性的操作,當前頁有利于鎖定用戶注意力。如:淘寶中「我的收藏」。

          以上是結合功能場景進行的選擇側重,如果就「用戶體驗」一定要分出個高下,我個人還是比較支持默認「當前頁打開」,從體驗角度分析,「當前頁打開」略勝一籌的主要原因有以下兩個:

          • 尊重用戶的決定。當前頁打開,將更多選擇機會留給用戶(鼠標中鍵、按住ctrl點擊鏈接或者可以右鍵新窗口打開),一個具有良好用戶體驗的產品,在用戶做操作的時候,總是能讓他們按自己的意志做出決定。網站對每個鏈接強制打開新頁面則剝奪了用戶的選擇權,因為不同的人有不同的瀏覽習慣和使用需求。
          • 體驗一致。保持一致體驗的設計才能讓用戶產生信任感與安全感。當用戶在操作界面元素的時候,可以順暢的知道、理解,并且能預料到將會發生什么,不會被分神,也不會被打斷。任何違反這個原則的設計都將會演變成一種「以設計方意志為導向」的設計,而不是「以用戶為中心」的設計。

          小結

          當我們不知道兩種方式如何選擇時,或許「不強制用戶」才是最好的體驗。因為我們面臨的用戶多樣,電腦操作熟悉程度多樣,因此不同用戶對于打開方式的習慣也具有多樣性,這個是設計者無法揣測和調查清楚的。

          在「兩害取其輕」的情況下,在當前窗口打開鏈接,不失為一個選擇,尊重用戶自己的決定,讓用戶對交互界面自主可控。

          三、彈出框

          彈出框(彈層)又叫模態對話框,是指在用戶想要對當前對話框以外的應用程序或內容進行操作時的提示方式。它一般覆蓋在整體頁面之上,避免了頁面跳轉。

          彈出框通常是為了顯示一個單獨的內容,在不離開整體頁面的情況下有一些互動,提供信息和交互。

          如下圖知乎中的「寫想法」,用戶可以快速的在彈出框中記錄個人想法,記錄發布后,很順暢的回到之前的路徑上繼續操作,便捷,操作思路清晰。

          △ https://www.zhihu.com/

          現在很多產品中的新增、創建,也都會采用彈出框的交互方式,當然前提是在彈出框中編輯的內容不是很多,此時彈出框不僅承載了信息編輯的功能,還可以作為上下文的跳轉,幫助用戶銜接路徑。

          如 iconfont 中的新建項目,用戶新增后,頁面會直接跳轉到新的項目空間。

          △ http://www.iconfont.cn

          彈出框適用的場景:

          • 內容簡單,沒有復雜的操作,且具有臨時性。如:新增一個收貨地址,進行簡要的輸入編輯。
          • 更為詳細的輔助說明,是對當前內容的快速擴展。如:縮略圖,點擊放大查看。

          因此,彈出框可以較好的實現上下內容層疊的感知,不打擾用戶的主路徑,同時作為頁面承載元素和用戶操作的補充,起到承前啟后的作用。

          總結

          本文結合這三種鏈接打開方式的頁面交互關系,進行適用場景舉例,并總結每種方式的優缺點,方便在設計中更好的根據不同的場景選擇合適的頁面打開方式。

          當然,以上總結也是基于我個人的理解與經驗,沒有統一的用法和標準,在具體設計實踐中,仍要靠設計者的直覺和經驗來進行綜合考量與判斷。

          作為體驗設計師,如何規劃用戶瀏覽路徑,是個需要嚴肅對待的命題。沒有絕對的好與壞,但一定要結合產品類型、場景、目標用戶等進行具體問題具體分析。

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

          論打造用戶體驗和數值系統,你得看看游戲類產品

          用心設計

          如果您想訂閱本博客內容,每天自動發到您的郵箱中, 請點這里


          互聯網產品有很多種,比如電商類、工具類、資訊類、財經類。但在看過很多產品之后,作者發現論產品體驗,最強的是游戲類。當然游戲做為一種特殊的產品,有時候不會被列入以上類型,且游戲的產品經理一般被叫做游戲策劃以及數值策劃,分別負責不同的內容。

          一、為什么說游戲的產品體驗很好?

          之所以這樣說是因為游戲類產品有一個特點即它是沒有用的,或者說它的唯一用途就是好玩。這樣有一個問題便顯而易見了,即對于大多數產品來說用戶體驗好是錦上添花的事情,而對于游戲類產品而言,這可能是唯一的賣點以及生死線。

          舉幾個例子來說明:

          • 單位或者學校的官網,相信用過這些的人都會發現它們是多么的難用,而且很多年從不更新,但是你沒有得選,只好使用它;
          • 微信以及 QQ 也是同理,雖然不是必選,但是以其覆蓋率來講,大多數人依然無法選擇不使用它們。因此微信有足夠的理由不全力以赴,騰訊完全可以將精力和人力投入到更加賺錢的網游領域。當然,最近新型社交軟件(抖音、快手)的崛起似乎是給了騰訊一定的威脅,讓它不得不再次嚴陣以待;
          • 而抖音和快手就得好好做了,必須足夠好玩以及新奇,畢竟這并不是剛需,如果沒有足夠好的用戶體驗完全可能被刪除。畢竟刪除了他們對于用戶而言幾乎沒有任何不便,還能節省不少時間;
          • 那么再進一步呢,再進一步就到了游戲類產品。游戲類產品的剛需性更加弱,而且還被全社會妖魔化,最近 steam 入華不利,以及孩子跳樓怪絕地求生又將它推向了風口浪尖。讓不少人不得不呼吁「管管孩子,救救游戲」。

          通過上面幾個例子不難看出,隨著剛需的減弱以及依賴性的降低,產品對于用戶而言不可替代性就越低。比如單位或者學校的官網哪怕做成非圖形界面,恐怕員工和學生都得自學了接著用。而游戲則不然,不僅面臨著用戶隨時可以放棄的情形還得時刻注意政策動向。

          因此即使不去使用產品,我們也不難猜出游戲類產品的用戶體驗必須非常好才行。畢竟只有有依靠的產品才能夠做到有恃無恐,而游戲類產品則是時刻在刀尖上舞蹈,用戶和政策都不敢得罪,必然得絞盡腦汁才能生存下去。

          人都是有惰性的,一旦有恃無恐將沒有多少人和公司愿意繼續創新,畢竟你沒得選。

          二、以崩壞3為例談談用戶體驗

          1. 從側面展示其用戶滿意度

          為何選崩壞3呢?原因很簡單,因為它的推廣模式以及用戶體驗都是一流的,不僅做游戲,而且 CG,漫畫,周邊同步推進。選擇了3D萌風格后又通過嗶哩嗶哩這一平臺進行了推廣,對用戶的了解之深入讓人佩服。

          b站的推廣對于崩壞3而言,絕對是最好的選擇可能都沒有之一。原因很簡單,兩者用戶重疊度太高了,且 b站專門有崩壞3類似的模塊MMD 3D。當崩壞3到達b站后,up主們則自發的開始了宣傳,例如熱門中的第四位就是崩壞3的內容。

          如果搜索崩壞3的經典角色 CG女王降臨,可以得到如下結果:

          僅前面幾個視頻的播放量可能就有近300w,而且是精準用戶的300w次播放,其宣傳的成功不難理解。當然這里你可能要問了,不是談用戶體驗嘛,說這些和用戶體驗有什么關系。

          其實是有關的,通過下面這張圖很容易從側面反映出用戶對其熱愛的程度。

          這些視頻全都是用戶自制的,這種熱愛是很切實的。試想當初最火的魔獸世界上映,很多人穿著聯盟或者部落的衣服去電影院不就是對游戲最大的認同嗎。

          這里也是一樣,你會為一個你不喜歡,用戶體驗差到崩潰的產品花費幾天甚至一個月的時間去做它的周邊視頻嗎,所以其優秀其實是毋庸置疑的。

          2. 分析其用戶體驗

          這張圖片即該游戲的歡迎界面,接下來讓我們細細來分析其用戶體驗點好在哪里。

          上圖即為游戲界面展示,僅一個界面就有很多點設計來增強用戶體驗。

          • 感嘆號:代表了可以領取的獎勵,大家領取獎勵的時候是開心的,所以就給了最醒目的標志;
          • 波紋效果:次一級的提示,表示該功能下有可以做的事情,算是任務發布;
          • 收起功能:點擊可以收起,然后截一張圖,截圖如上上圖所示,很完美的效果,用戶有炫耀的心理,所以可能會將其發朋友圈或者作為桌面,增強傳播。當然這里不玩游戲的人可能不好理解,其實有的角色是非常難獲得的,加上皮膚價格會很高,用戶有足夠的動力去炫耀;
          • 拍照功能:如上上圖所示,可以對圖像進行拍照,雖然也可以截屏,但確實是很貼心的功能;
          • 和看板娘對話:這樣的做法并不少見,即給產品一個人設,增加用戶的認同感,比如小冰等,這里的看板娘對話根據角色的不同而不同,甚至有的用戶會為了看不同人物的對話而去收集人物,在增強用戶體驗的同時也增加了用戶購買欲,一舉兩得;
          • 全屏VR:畫面并不是靜止的,如果手機旋轉,圖像會移動,給人手機屏幕后的場景是真實場景的感覺,雖然幅度不是很大,但還是有一定的 VR感的。

          當然其優秀的用戶體驗點完全不止這些,作為一個體積3G多的程序有許許多多的界面,但介于游戲和產品的邏輯還是有區別的,就不展開繼續講了。但有一點是值得注意的,即整個游戲的任何界面幾乎都是在用心去做,將用戶體驗做到了。

          三、以崩壞3為例談談數值系統

          數值系統顧名思義就是一個產品的數值設計,比如:得多少積分用戶可以升級,在搞活動的時候是否應該贈送 VIP,如果贈送了 VIP 多久比較好,VIP 應該有哪些權限,如果各種等級的 VIP 功能是不同的,那么一個級別應該差多少。

          以上僅僅是產品的數值體系,而游戲的數值體系就更復雜了,比如:游戲貨幣的產出量以及回收機制,維持整個游戲世界的裝備價值以及金幣價值,防止產生通貨膨脹。

          產品和游戲有這樣的區別很正常,畢竟產品只是提供一種服務,而游戲更像是打造一個世界,要考慮的東西在一定程度上和現實世界有相似之處,比如:交易方式、稅收、貨幣體系、資源體系、玩家社群、不同勢力的實力均衡。

          現在讓我們來簡單分析,當然我們只分析在產品中也存在的數值體系,畢竟相信本文的讀者都是產品人而不是游戲迷。

          1. 崩壞的VIP體系

          VIP體系對于企業而言是非常重要的,因為這是企業收入最主要的來源之一。

          所以誘導充值是所有企業都必須面臨的問題,那么大多數產品有哪些套路呢,一般有以下三個常見方式:

          • 首沖優惠:第一次充值會比較便宜,降低用戶付費門檻,而當用戶真的使用過 VIP 之后,再回到非VIP 就比較難了,可能將一個本來不想充值的用戶轉化為 VIP用戶,即由奢入儉難;
          • 連續包月:不少用戶懶于去取消掉這個功能,對于那些對價格不敏感且搖擺不定的用戶而言,讓他們通過連續包月進行消費是不錯的策略;
          • 活動贈送:完成一定的任務,贈送VIP,理由和首沖優惠很相似,都是降低用戶進入門檻。

          現在讓我們再來看看崩壞3是如何設計其 VIP體系的。

          初始獎勵非常豐厚:讓用戶忍不住想要充值,如上圖所示,只需要充值非常少的錢,就可以獲取以上獎勵,而這些獎勵非常不錯。這點最大的意義在于讓用戶愿意去嘗試充值,只要充值一次,以后就有可能繼續消費。

          限時購買:促銷雖然老套,但卻十分有用,這種倒計時總能夠刺激用戶的消費欲望。

          月卡系統:很有意思的系統,充值一次之后可以每天都領取獎勵,而效果是直接購買獎勵的十倍。但只有每天不斷的進行領取才能夠達到獲得獎勵的目的。這種模式其實就是用日活換金幣,雖然用戶節省了錢但卻必須每日登錄才能夠獲取這些金幣。

          類似的策略拼團也有使用,不過不是用日活換金幣而是用用戶換金幣。

          2. 數值系統

          數值系統對于游戲而言是生命所在,史玉柱曾說過:我不擔心別人抄走我的系統,因為數值體系他們抄不走。

          崩壞3的數值系統就不提了,因為太過復雜,而且與產品相關性也不是很大。

          對于產品而言,數值系統沒有那么意義重大,但也需要很好平衡各方的利益,否則可能讓產品迅速衰落。

          一個簡單的例子即會員該有多少權利,不同等級的會員權利應該如何區分。比如以視頻網站為例,假設有兩種級別的會員,大會員和小會員。那么用戶就有三種,免費用戶,小會員以及大會員。假設會員的作用是看高清視頻,而視頻的級別有五個,等級越高質量越好。

          那么該如何設置他們的權限呢,可能的方式有以下幾種:

          • 方式一:普通用戶等級一,小會員等級二,大會員等級三;
          • 方式二:普通用戶等級一,小會員等級三,大會員等級四;
          • 方式三:普通用戶等級一,小會員等級四,大會員等級五;
          • 方式四:普通用戶等級二,小會員等級三,大會員等級四;
          • 方式五:普通用戶等級二,小會員等級四,大會員等級五;
          • 方式六:普通用戶等級三,小會員等級四,大會員等級五。

          當然一般的 VIP 肯定不止有視頻權限,還會附帶一些其他權限,比如可以有打賞用的幣,可以有更好看的頭像框,文字的顏色是可以選的等等。

          不難發現,這將是非常復雜的一個體系,哪種體系都對一些用戶有利,對另外一些用戶不利,如何合適的定制產品的數值系統就是一個很復雜的問題。如果體系偏向免費用戶,可能讓付費用戶付費意愿降低,如果偏向付費用戶,可能讓免費用戶覺得沒有存在感,直接離開。

          四、游戲給產品的啟示

          用心做產品是有用的:如今流量獲取非常困難,產品的成功很大程度上取決于是否有流量扶持。這對于產品人而言是比較沮喪的現狀,畢竟辛辛苦苦做一個產品結果比不上某些巨頭產品的一個入口有效。這種情況確實是存在的,但我們也要相信產品的優秀絕對不是沒有意義的;

          可以用日活換收益:現在的產品VIP系統大多都是充值后獲得權限,但完全可以做以下這樣一個策略。比如:視頻網站的 VIP 是一個月15元,那么我們可以推出一個套餐,一個月只要5元,但是這個套餐有個條件是每天登錄后第二天可以享受 VIP服務,如果用戶有一天未登錄,那么第二天就沒有 VIP服務可以享受,這種策略其實就是用10元錢換取了一個用戶的每日登錄;

          精準營銷事半功倍:崩壞3在 b站的廣告效果非常好,而且直接引起了 up主的關注,他們會再次創作內容對崩壞3進行推廣。但如果將這個廣告投到58同城呢,可能就沒有什么意義了;

          數值系統平衡各方:免費用戶和付費用戶的關系非常復雜,兩者既有利益沖突又可能相互轉化,因此做好平衡非常重要,不要得罪任何一方。




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

          超好用的用戶體驗提升模型

          用心設計

          如果您想訂閱本博客內容,每天自動發到您的郵箱中, 請點這里


          用戶體驗一直是我們在產品設計中反復強調的問題,那么我們應該怎樣提升用戶體驗呢?

          經過項目中不斷的探索與研究,結合幾個方法論,我們整合出了一套用戶體驗提升的方法流程——用戶體驗提升模型。下面就來詳細的介紹一下,希望能給大家幫助和啟發。

          先問幾個問題?

          • 你知道你所負責的產品/設計方案的用戶體驗好還是不好?
          • 產品/設計方案體驗不好時應該怎么做?
          • 這個產品/設計方案的體驗具體有哪些問題?
          • 怎么優化出現的體驗問題?
          • 哪些模塊或頁面的問題最迫切需要解決?先優化哪些?后優化哪些?

          用戶體驗提升模型能很好的幫我們解決以上問題。

          先介紹一下用戶體驗提升模型的流程:線上版本調研 – 協作啟發式評估 – 問題分析整理 – 優化方案。

          這篇文章也會以這個流程一一介紹。

          一、線上版本調研

          也可以是設計方案,我們采用了 SUS系統可用性量表進行調研,SUS 是評估產品可用性的一個花費少,但十分有效的工具。該量表包含了10條定向問題,每個問題均為5分,按強烈反對(1分)到非常同意(5分)評分。(各位小伙伴可自行網上查詢系統可用性量表,有很詳細的介紹,在這里不贅述了。)

          最佳的方式是在線上直接上一個問卷調研來收集真實用戶的反饋,然后對收集到的結果做如下算法:

          • 對于奇數序號的問題,將其得分減1;
          • 對于偶數序號的問題,將其得分被5減去;
          • 將所有問題的減法后得分加在一起,然后乘以2.5;
          • 計算出的結果即為我們產品可用性的得分。

          1. 那么如何通過評分看出一個產品的好壞?

          上圖是一個評分參考,通過數據得出,系統可用性量表最終算出的評分達到70分左右,就可以比市面上一半產品可用性要好,也就是說這個產品的用戶體驗算是合格了。

          但是系統可用性量表的評分結果是抽象的,這個分數只能讓我們大概了解產品用戶體驗的好壞,在具體問題上卻是缺失的,那我們知道產品評分較低時我們如何聚焦產品的優化方向呢?

          二、協作啟發式評估

          1. 為什么是協作啟發式評估而不是啟發式評估?

          因為啟發式評估主要由幾名交互專家以角色扮演的方式來完成設置的任務給出評估結果。優點是成本低、快捷,缺點也顯而易見,一是交互專家團隊中不一定有或者很少,二是可用性問題意見一致率很低,并不能很明確的指出為什么這是一個體驗問題,有很多個人因素的主觀見解。

          因此我們決定用協作的形式來進行評估,而且不需要交互專家,可以是用戶、測試、設計、產品、運營、商務等等,只要愿意參與測試,就可以。協作啟發式評估以小組為單位,能夠很好的整合出更多的問題,而且更準確。你說他們也不是交互專家,能起到好的結果嗎?竟然都整理出方法了,那答案當然是能啊。

          為什么能,因為整個評估過程中,我們是有的可用性原則來給予啟發的,有了這套可用性原則,一秒變專家。

          說到可用性原則,了解用戶體驗的都知道尼爾森的十大可用性原則,但是從1995年提出到現在,已經過去了二十多年,互聯網世界已經發生了巨大的變化。在這樣的情況下,尼爾森的十大可用性原則明顯有些不那么符合或者說不能給出針對現今產品太全面的啟發,所以,我們重新整理了一套可用性原則,這套可用性原則更針對現今互聯網產品,基本可以覆蓋到所有出現的用戶體驗問題。

          我們稱之為21條可用性原則。

          有了這21條,可以讓任何沒有用戶體驗知識的人參與到協作啟發式評估中來了,一秒變專家了。當然,這21條可用性原則我們也會迭代優化,目的是做到更符合現今產品、更全面的可用性原則。

          2. 通過什么來確定的這21條可用性原則?

          首先,我們都知道用戶體驗五要素,這已經是做產品設計的基本常識了。我們來看這五個層級對用戶體驗能產生影響的有哪些?戰略層一定不會,如果一個產品立項了、已經上線了,一定是戰略層成立了,如果戰略層出現了問題那就要重新考慮產品要不要做或者是改變方向了。那么剩下的4個層級呢?范圍層、結構層、框架層、表現層,其實都會出現用戶體驗的問題。那我們看看這幾個層級所包含的內容,視覺呈現、界面設計、導航設計、信息設計、交互設計、信息架構、功能規格、內容需求,這樣的話就有8個大類,然后我們通過多年的經驗和對尼爾森可用性原則的理解,把可用性原則對應到這8個大類中,最后得到了這分類明確的21條可用性原則。

          但是分了這8個類有什么用呢?讀下去,你就會知道。

          3. 具體方法

          先說說調研的具體方法。我們以協作啟發式評估的方法,組織好調研小組(8人以上,樣本越多越好,反正最后還要去重),宣講完流程方法和操作任務,就可以開始進行評估了。我們一般為了省時間,宣講完就把表格發下去,讓他們自己找時間完成表格,然后再收回來。

          這個表格就是用戶體驗問題記錄表。包括問題所在位置、對應的21條可用性原則、嚴重程度等級、問題描述。

          三、問題分析整理

          1. 收集了一堆問題之后應該怎么做呢?

          通過小組會議討論,把相同、相近的問題統一成一個,可優化的問題保留下來,不是體驗問題的去掉,然后整理到一起,這就是整個產品存在的大大小小、各種各樣的問題了。

          接下來,我們引入另一個方法,就是用戶體驗八陣圖。

          這張用戶體驗八陣圖的8個點是不是有些眼熟?沒錯,就是21條可用性原則里的8大分類,這就是上文為什么分為8個類的原因。中心向外為問題嚴重等級,依次為:小問題(1)、次要問題(2)、主要問題(3)、災難性問題(4),一一應對到「用戶體驗問題記錄表」中的「問題嚴重等級」。

          2. 怎么使用呢?

          首先,對記錄表里的「問題位置」進行歸類,以模塊化區分,比如把登錄注冊流程做為一個模塊,用一張八陣圖來表示,最終把產品的每個模塊都用一張八陣圖來承載所對應的體驗問題。

          然后,把收集到的問題以「點」的形式點到對應模塊的八陣圖當中。

          哪個模塊問題最多?問題出現在哪個方向上?是視覺?還是交互?還是內容?哪些問題很嚴重需要迫切解決?一目了然。

          四、優化方案

          • 通過 SUS系統可用性量表知道了產品的整體體驗處于什么水平。
          • 通過協作啟發式評估知道了產品的用戶體驗到底有哪些問題。
          • 通過21條可用性原則知道了如何避免出現體驗問題。
          • 通過用戶體驗八陣圖知道了哪些模塊最迫切需要優化。

          知道了這些,我們進行產品優化的時候還會不知道如何下手嗎?接下來就要靠你自己了,你一定會做的更好。

          當然,這套模型只能對線上產品的用戶體驗提升起到一定幫助,一個產品真的厲害還要從戰略層一步步做起,我們需要去清楚的知道產品的目標是什么,我們能提供什么,我們想要去得到什么。對于產品的迭代,我們可以從使用人群(目標客戶),主要功能(產品的服務方向),產品特色(與競品的差異化),商業價值(盈利模式)上深入研究。



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

          系列位置效應在UI界面中的應用

          資深UI設計者

          如果您想訂閱本博客內容,每天自動發到您的郵箱中, 請點這里

          系列位置效應大家可能有點陌生,因為它不像格式塔那樣被大家熟知,但是當我看了它的概念之后,我決定和大家分享一下。


          Image title

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



          產品設計中“+”功能的相關思考。

          資深UI設計者

          如果您想訂閱本博客內容,每天自動發到您的郵箱中, 請點這里

          日常工作中,有很多看似平凡的小細節,常被大家忽視,卻影響著用戶的真實體驗。比如,前幾天跟同事們針對產品設計中“+”功能所運用的場景、展開形式進行討論,發現這是一個挺有意思的話題。


          所以跟大家分享下,我的一些相關思考。






           1. “+”的運用場景 


          我們常見的產品中,采用“+”功能的場景,大致分為兩種:a.(上傳)內容選項;b.(聚合)快捷功能。



          a.(上傳)內容選項


          根據“+”的直觀表意,大致也能猜到它的運用跟“添加”、“上傳”某個東西相關。

          比如:微博,點擊“+”入口后,是選擇所要上傳的內容類型。(可以曬自己精修X小時后媽都認不出來的自拍、也可以曬逗比的小視頻、或者老子就想搞一場直播)。



          比如:下廚房左上角的“+”,點擊后,是選擇上傳作品,或者創建菜譜的選項。




          再比如:工具類產品:Google drive,dropbox、百度網盤、微云,點擊“+”后,同樣是選擇上傳不同文件的入口。 


          可以看出,這種情況下的“+”功能,多指“添加”、“上傳”的含義,所承載的內容,是同一緯度下的不同選項。





          b.(聚合)快捷功能。


          眾所周知,產品為了節省界面空間,同時避免過多功能給用戶不必要的干擾,會選擇把一些不常用的快捷功能收到二級展示。常見的產品中,他們選擇把這些快捷功能塞進“+”里。


          那么,你是不是覺得“+”功能跟“…”功能承載的內容是一樣的?比如:樂趣首頁右上角“...”,同樣是對頻率較低的功能的集合。





          那為什么有的產品不直接用“...”,還是選擇用“+”呢?


          通過分析發現,“+”雖然也是聚合快捷功能的入口,但承載的功能有一個共性:都是圍繞著用戶主動打開、發起、新建...等操作進行的,因此用“+”更貼切。


          比如:微信里的“+”,包含著:“發起群聊”,“添加朋友”,“掃一掃”,“收付款”,其實都跟“添加”有關。 




          比如:淘寶也是類似的處理方式。


           



          再比如:愛奇藝的“+”,里面包含的也是跟“添加”,“上傳”相關,像上傳視頻、掃一掃、我要直播….





          反過來看“...”,它聚合的功能,大多是相互關聯較弱,且沒有主動添加、上傳等含義的。因此,用一個相對模糊,沒有指向性的符號詮釋,更為合適。





          由上可以看出,在這種情況下,“+”作為聚合快捷功能的入口,包含的是頻率較低,且跟主動“新建”、“發起”、“掃描”等相關的功能。





           2. “+”的展開方式 



          當用戶觸發界面中的“+”時,常見的展開方式有3種,分別是:a.氣泡彈出框;b.動態欄;c.沉浸模式。



          a.氣泡彈出框


          氣泡彈出框,這個控件又常被稱為Popover,一般是由一個矩形和三角箭頭組成的彈出窗口,通過點擊Popover內的按鈕或者非Popover的屏幕其他區域可關閉。 


          比如,以微信為代表的“+”的展開方式,采用的就是Popover。一般用于聚合快捷功能。優點是觸發“+”到Popover的距離很近,操作順手,效率高(更像是導航的延伸)。





          b.動作欄


          動作欄,這個控件官方稱之為Action Sheet,是用戶觸發“+”后,出現的一種模態彈出框,里面包含一組與當前情景相關的選項,一般用于上傳內容選項。 


          在iPhone屏幕上,為了便于單手持握時操作,Action Sheet通常占據屏幕底部區域。



          比如:以Google drive、Dropbox為代表的產品,需要選擇上傳文件類型的選項。




          在這個部分,同事們討論有些爭議點,在于:google drive 和 Dropbox或者微博,它們的加號本來就在底部,所以彈窗讓用戶感覺視線統一。




          而有的產品“+”在上面,彈窗從底部出來,擔心注意力切換和手指移動的路徑比較長,顯得割裂。


          帶著這個問題,我調研了下有類似情況的產品,會不會讓人覺得不舒服。


          后來發現,不會的。原因在于我們常用的、擁有10億+用戶的微信,發朋友圈時操作就是這樣,而我們并沒有感覺很割裂,反而已經習慣。




          同樣,iPhone自帶的“提醒事項”App,也是這樣處理。




          后來看了規范發現,iOS確實意識到在iPad上,如果繼續將Action Sheet顯示在屏幕底部,如果頻繁操作使用會比較累。因此,做了特殊處理。而手機屏幕上以底部為主,同時點擊空白區域取消的操作,也是系統用戶所熟知的。



          總的來說,操作欄適合承載同一緯度下的內容選項,同時,就算“+”在頂部,采用底部動態欄,體驗上也是沒問題的。




          c.沉浸模式


          沉浸模式,指的是當觸發“+”時,用戶在全局蒙層上進行功能操作,同樣適用于上傳內容選項。


          優點是拓展性更強,體現在:1.提升收益;2.品牌認知;3.內容運營。




          1.提升收益


          比如:微博,采用沉浸模式,下面是上傳不同狀態類型的入口,上面可以增加廣告收入。




          再比如:微云,在沉浸模式下,可以植入自己的“會員”廣告,從而提升會員轉化。





          2.品牌認知


          比如:有道云筆記,在頂部的空間內,宣傳自己的品牌slogn:“記錄,成為更好的自己”,是一種品牌情感化的傳遞。  



           


          3.內容運營


          像“好好住”,它們在這個頁面加入“話題”運營推廣。從而給UGC內容模塊帶節奏。





          大多數產品都想營造社區氛圍,建立用戶關系,從而增加用戶粘性,提升產品留存。

          但要想擁有濃厚的社區氛圍,首先要有內容、才有人愿意看、才有人在里面互動。

          現實問題是,有很多用戶有想發狀態的心,但不知道發啥,從而放棄。因此,我們應該作出相應的引導。


          比如,“好好住”在發布環節,增加話題運營“#每天一張生活日常#”入口,就是解決剛才說的“用戶不知道發什么”的問題。運營同學想點子、造話題、帶節奏,從而提升用戶的發布量。

          因此可以看出,“沉浸模式”,對于那些有拓展需求(收益、品牌、運營)的產品更適用。


          不知道你有沒有發現,相比國外,國內采用這種“沉浸模式”的產品偏多。或許在中國這個互聯網競爭如此激烈的大環境下,大家不愿意放棄任何一個能夠運營或留住用戶的機會。 



          總結 



          總的來說,在常見的產品中“+”功能的運用場景有:(上傳)內容選項、(聚合)快捷功能;它的展開方式可分為:氣泡彈出框(適合承載快捷功能)、操作欄(適合容納內容選項)、沉浸模式(容納內容選項的同時,拓展性更強)。其實,交互形式沒有好壞之分,只有哪個更適合自己的內容需求和產品目標,正如Louis Sullivan所說:“形式追隨功能”。


          小tips:日常工作中有太多類似“+”這種,看似一個不起眼的小功能,被大家忽略。我們習慣性看一下競品,拍腦袋決定方案。


          但是,慢慢你會發現,只有深挖和分析這些所謂的“小細節”,才能知道別人這么做背后的原因、才能舉一反三的去運用、才能更好的兼顧統一性和拓展性,而不是停留在浮于表面的模仿。


          希望這篇文章對你有所幫助。 

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

          日歷

          鏈接

          個人資料

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

          存檔

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