為了讓你雙11買買買，淘寶的互動設計太下功夫了！

引言

淘寶雙 11 互動玩法已持續多年，從 2018 年《雙 11 狂歡之城》到 2023 年《幻想島總動員》，過去雙 11 互動旨在營造一個輕松愉快的“游戲場”，吸引用戶持續游玩 - 積累獎勵 - 最終開獎，獲得權益后去購物，打造先蓄水后爆發的模式。設計側的重點主要圍繞世界觀的完整性、玩法的豐富度、組隊 PK 的對抗性等方面打磨體驗。

今年雙 11 淘寶為了給用戶更好的購物體驗，拉長了整個雙 11 的周期，用戶在過程中隨時可以購買自己心儀的商品，互動側也將過去“游玩蓄水-開獎爆發”的模式進行相應調整，轉換為用戶游玩可獲得雙線權益：淘金幣積累即時可用、最終抵扣金積攢定期開獎的模式，增強用戶持續游玩的動力、過程中即時獲得感以及權益直接可用于購買商品。

設計策略

最大化傳遞核心權益價值，引導用戶快速理解并獲取權益，并在互動過程中使用這些權益，實現邊玩邊買的無縫體驗。

一、玩法選型

更高的屏效、更普適的玩法、更直接的表達

基于邊玩邊買的命題，主界面切分為玩法區和導購區，玩法區縮窄至去年的五分之二，留出更多的空間給金幣抵扣商品曝光，讓用戶直觀感受到權益的價值，驅動用戶參與玩法獲得權益。

為了在有限的空間內打造一個易于理解、反饋清晰且具有持續牽引力的玩法，選用了淘金幣 IP“金仔”結合“大富翁”玩法，通過格子布局來營造一種向前的延伸感，配合金仔跳躍的動作，使用戶能夠直觀地理解前進獲取格子上的獎勵。

二、場景打造

簡單而不簡陋，豐富而不繁雜

互動場景的差異化塑造：場景設計上采用 2.5D 的視覺表現手法，以最簡潔的方式創造出玩法場景與導購場景的差異性。氛圍元素與光影采用了更加概括性的手法處理，保持了視覺上的連貫性和一致性，簡約但不失生動性和層次感。

簡單明快的色彩：為了營造出熱烈而充滿活力的大促氛圍，我們選擇了飽和度較高的色彩作為整體色調，大面積的淺色上配合一點明快的色彩作為點綴，讓整個頁面看起來和諧且不乏味。

IP 情緒調配：IP 的情緒表達在互動中一直扮演著重要角色，今年雙 11 互動與淘金幣頻道結合，故將淘金仔形象做了適當的風格化處理，出現在一些點位上，起到情緒價值調配的作用。

三、信息排布

核心價值最大化傳遞

自然瀏覽路徑：打破傳統的居中排版方式，依據人眼自然的 F 形掃描模式調整布局，讓重要元素更加靠近用戶視線左上起點，放大對用戶最重要的信息。

字體字號選擇：不同于以往的裝飾性字體，此次特別選擇了無襯線字體，僅對重要信息做了放大和加粗處理，最大限度呈現信息的可識別性，減少閱讀障礙。并把字號差異性拉大，并精簡了字號層級的數量，幫助用戶快速篩選重要的信息。

四、動線設計

圍繞權益價值的長線牽引和短線驅動

新手引導：引導步數從去年的 5 步縮短為今年的 1 步，短線驅動用戶，讓用戶更快速獲取權益，激發用戶參與玩法的動機。

任務參與：多個點位牽引用戶參與玩法，其中瀏覽型點位（如主標題、右下角）展示大目標，透出未來的總收益做長線牽引；操作型點位（浮層、主按鈕等）展示立即可得的收益做短線驅動，刺激用戶當下的點擊行為。

獎勵反饋：對于較短路程的獎勵，采用一個個跳躍的形式收取；而對于大額步數獎勵，則直接讓淘金仔飛過快速領取。此外，所有動畫都提供了“一鍵跳過”的選項，確保用戶在整個過程中保持高度掌控感。

深度參與激勵：不同梯度的每日累積任務獎勵，有效促進用戶做任務動力。

五、導購設計

圍繞權益梯度化展示優惠，刺激用戶購買

本次雙 11 商品卡片圍繞著“金幣抵扣”權益，強化金幣抵扣帶來的優惠，增強用戶對于權益的感知。此外還對不同幅度的優惠做了梯度化的視覺表達，額外的動效設計來表達抵扣加碼，具視覺沖擊力且更加直觀。

結語

本次雙 11 主互動在業務和設計側都做出了不同于以往的大膽嘗試，吸引用戶參與的同時也帶來了超預期的成交增量。本次嶄新輕盈的視覺風格讓互動、權益與購物無縫銜接，也用最概括化的語言傳遞趣味、烘托情緒，留出空間將最重要的信息呈現在消費者面前。

歡迎關注「淘寶設計」公眾號：