關于移動App“換一換”的發散和思考

5 評論 6768 瀏覽 28 收藏 12 分鐘

本文由衣柜里的“換一換”發散到app的“換一換”,探究“換一換”的本質和特點。

換一換是移動應用app中經常會用到的操作,時間久了也就形成了固定的形式。但設計沒有終點,本文希望更加深入去探討換一換的本質。

一、衣柜里的換一換

我們平時換一件衣服是怎么樣的呢?

下面是一個流程:

圖1.衣柜使用流程示意圖

人是喜歡新鮮的動物,換衣服如此,與世間的物體交互也是如此。

由于“換”包含了很多概念,于是在開篇之前我想澄清一個概念上可能會混淆的點:“換一換”的范圍包括哪些?

本文中的“換一換”,包括“切換”、“刷新”、“更換”等。凡是操作后會引起當前內容變化的,都在文中作為“換一換”討論。

二、我們為什么要換一換

  • 當我們瀏覽新聞app的時候,看厭了現有的內容,可以換一換。
  • 當我們聽音樂,不喜歡這首,可以換一換。
  • 當我們不喜歡現在的桌面壁紙,我們可以換一換。

人是追求新鮮感的動物,換一換的機制給予整個系統翻篇換血的機會,使得用戶保持對系統的好奇,持續挖掘。

三、一般形態的換一換

一些內容,加上一個“換一換”的按鈕,點擊就可以更換了,這是基本的形式。

這似乎也滿足了用戶的基本需求了?

圖2.一般形態的換一換

最近看了不同的產品,重新自己思考這個課題,發現換一換還是有可創新的地方的。

比如:qq錢包里面的優惠券,需要支付一定的金額才可以更換,這樣就提高了門檻。提高門檻的同時,使得用戶會更加慎重地進行考慮,同時更加珍惜更換的結果。

圖3.qq錢包換一換的設計

但,如果每次我想看一個新聞,我就要付錢,豈不是很貴?因此換一換也是有它適用的場景的。

為了區分這些場景,找到這些場景的使用規律,我按照不同的維度搜集了一些競品,并進行了分類。

在分類的過程中,我發現有一些換一換的特點:

四、面向過去與未來的換一換

被動輸入的,例如資訊類的應用,就會以快速的換一換為主。這種換一換不可逆轉,只能往后繼續推薦,所以是面向未來的換一換。

例如,圖4右側的知乎中,點擊“換一換”可以更換一批感興趣的人。而如果是用戶輸入為主的應用,比如瀏覽器,用戶需要主動輸入大量的信息,去檢索他們想要的內容。那么就會提供追溯的歷史,用戶可以尋找過去的蹤跡,如圖4左側——百度的簡單搜索,點擊按鈕可以切換不同的瀏覽頁面。

圖4.(左)簡單搜索,(右)知乎

五、換一換的手勢

換一換的操作方向會影響用戶的閱讀體驗。

如果方向與閱讀瀏覽的順序一致,會呈現更多的內容以及使得閱讀更加順暢。如果方向與閱讀順序不一致,則需要用戶停留,進行思考。

如圖5的最左邊,是可以左右撥動更換卡片的。中間的新聞app則需要下拉刷新進行更換,右圖的音樂app則是通過左右滑動進行更換。

相比較而言,中間app的自動切換方式與閱讀順序一致,用戶只需要一直下滑,就可以持續刷新更換的信息。而如果左右滑動或者撥動,則會讓用戶停下來思考“我是不是真的要切換到下一首音樂呢?“我是不是確定不需要這一張卡片了呢?”。

當然并不一定切換越快就是越好的,比如新聞流,更新速度快、有時效性,快速更換便于用戶閱讀。但一些精品的內容——比如推薦關注的人、沉浸式的音樂,我們更期待看到用戶多多地駐足,去關注,去享受。那么快速的切換,就不太合適了。

圖5.(左)即刻,(中)今日頭條,(右)qq音樂

六、主動or被動

換一換雖然聽上去是一個用戶主動的操作,但設計的時候也可以想一想:

  • 這個內容是不是真的需要用戶主動來換一換呢?
  • 如果可以的話,系統能不能幫用戶把這個事情做了呢?

比如圖6的右圖,一些更新比較快的新聞資訊、優惠活動,有時候也可以使用輪播自動更新的方式呈現給用戶。

主動的換一換給予用戶選擇權,使用戶感覺到對內容的掌控。而被動的換一換則給予用戶緊迫感,吸引用戶去點擊。

雖然平時我們對換一換的理解更多的是“主動點擊”的換一換,但系統自動變化的形式是否也是可以的呢?

比如優惠券,如果在展示的時候是自動變化的,是否就能產生緊張感,吸引用戶更快去點擊呢?

圖6.(左)喜馬拉雅,(右)小米資訊

七、如何設計更好的換一換?

開頭提到了衣柜,于是我從衣柜開始發散。

怎么樣才能更好地換衣服?

下面是一張換一換的細分流程圖:

圖7.衣柜與app的換一換細分流程圖

于是,針對細分的流程節點,我產生了一些構想,供大家參考??赡懿⒉灰欢軐崿F,因為還要結合業務和實際考慮,但也許可以擴展一些思路。

1. 預覽與前饋

因為換一換是不可預期的,那么也許可以提供一個預覽的小窗口,幫助用戶去預覽接下來會發生的事情,減少不確定的感覺。

圖8.換一換的預覽機制

2. 趣味的圖標與文案

換一換一般是使用循環的圖標表示,但我們也可以加一點微創新,比如熱門的新聞,可以用火苗圖標,而對于地址,可以用地點圖標等。

圖9.帶有不同圖標示意的換一換

另外在文案上,換一換也可以用比較吸引人的親切話語來表達,這樣就可能可以更加吸引讀者去點擊。

?圖10.換一換的不同文案

3. 有門檻的換一換

人類是糾結的動物,太容易得來不會珍惜,太難又會容易放棄,因此把握好換一換的度是比較重要的。

比如用戶可以用自己的積分,或者經過一定時間的等待,又或者完成一些簡單的任務進行換一換,這樣換來的結果轉化率可能更高。

圖11.為換一換設置不同門檻

4. 更換的控制感

更換的時候的,如果系統不是那么精準,可以適當提供用戶反饋的機制,這樣得到的結果會更加精準。這樣也使得用戶對整個更換系統的有一定的了解,更加放心地去更換。

圖12.可供用戶選擇的換一換

5. 內容出現的儀式感,回退的機制

更換之后,內容的出現可以帶有一些巧思。畢竟是新的內容,可以賦予一種登臺的、新鮮的感覺,給人耳目一新之感。

另外,如果更換的內容用戶不喜歡,還是有可能回退的。這個時候稍微保留上一次更換的痕跡,給予用戶返回的操作,可能也可以提升用戶的體驗。

比如上次的內容可以堆疊在下方,通過手勢或者按鈕返回。

圖13.出場儀式感,飄舞的彩帶

圖14.用戶上次更換的內容沒有直接消失,而是疊在下方

當然,這些內容不是一次全部都要出現。只是作為參考與啟發,隨著業務屬性的不同,不妨試試在每個節點思考一下可以加點什么,使得換一換更加細致可感。

八、小結

本文針對平時常見的“換一換”作了一些發散和思考。

作為設計師,希望鞭笞自己從設計理所當然的舒適圈中跳出,去嘗試更多的東西,也與大家分享。

 

作者:交互小怪獸,微信公眾號:交互小怪獸

本文由 @交互小怪獸 原創發布于人人都是產品經理。未經許可,禁止轉載。

題圖來自Unsplash,基于CC0協議

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 短視頻平臺,展示頁面左上角的換一換按鈕。它背后的邏輯是什么? 是不是在后臺提前緩存了一批的量,然后點擊按鈕的時候,它就更換,此時在它更換的同時后臺也在自動緩存下一批?

    回復
  2. 1.預覽和前瞻,如果我提前知道了這個結果,并且對該結果沒有興趣,是不是就不換了?
    2.這個有門檻的換一換會提高轉化率嗎?有數據支撐嗎?

    來自廣東 回復
    1. 謝謝提問!第一點的話,本意是如此哈,如果用戶不感興趣就不換,但如果不操作會對產品有什么影響,就要慎用;第二點也是可以討論的,畢竟不同產品的屬性不同,目前我看到的是有些帶“錢”屬性的產品有這樣使用

      回復
  3. 支持

    來自江蘇 回復
    1. 謝謝麗偉:)

      回復