tft每日頭條

 > 圖文

 > 小程序如何拼團

小程序如何拼團

圖文 更新时间:2025-03-05 12:15:15

上一篇文章《營銷工具之拼團活動如何設計》,我們從實操角度,對拼團活動的前後端整體流程進行了梳理,發布之後收到小夥伴們對小程序前端設計的問題。所以本篇就拼團活動的小程序前端頁面,做一個詳細的說明。

小程序如何拼團(拼團活動之小程序前端頁面實例講解)1

我們發起一個拼團活動,通常需要以下幾支功能去支撐拼團活動的運行:活動入口、商品詳情頁的展示和交互、購物車和訂單展示及結算層面、訂單管理、退款管理、以及我的拼團管理。

小程序如何拼團(拼團活動之小程序前端頁面實例講解)2

一、活動入口

小程序如何拼團(拼團活動之小程序前端頁面實例講解)3

活動入口除了從首頁列表進入,還可以通過分享商品鍊接,商品二維碼以及朋友的參團邀請進入(這個上一篇文章《營銷工具之拼團活動如何設計》中忽略了,在此補充一下)。

1. banner廣告位指定跳轉活動商品。

2. 通過列表頁進入:首頁推薦活動列表以及拼團活動列表。

小程序如何拼團(拼團活動之小程序前端頁面實例講解)4

3. 通過分享進入:朋友分享的活動商品鍊接,活動商品二維碼,以及參團邀請等。

小程序如何拼團(拼團活動之小程序前端頁面實例講解)5

二、商品詳情頁的展示和交互

同一個商品的拼團活動商品詳情頁和普通購買詳情頁是分開的2個頁面,即:拼團商品詳情頁,僅展示參與活動的SKU;普通商品詳情頁,展示此商品的全部SKU。

什麼意思呢?

假設SPU1下面有4個規格,分别是:SKU1、SKU2、SKU3、SKU4,其中SKU3、SKU4參與了拼團活動。

那麼在那麼在普通商品詳情頁,能選擇4個規格:SKU1、SKU2、SKU3、SKU4。

在活動預熱或者進行中狀态時,有對應的拼團活動的提示,點擊【去拼團】跳轉SPU1對應的拼團商品詳情頁,此頁面僅能選擇2個活動的SKU:SKU3、SKU4。

其中拼團商品詳情頁,不管已選哪個SKU,點擊【單獨購買】,均跳轉普通商品詳情頁,且定位到上一頁面選中的SKU,走普通商品購買流程。

小程序如何拼團(拼團活動之小程序前端頁面實例講解)6

三、購物車和訂單展示及結算層面

1. 購物車活動商品展示的場景有以下2個

  • ①無活動時,SKU已加入購物車的情況;活動
  • ②活動預熱或者活動進行中時,在普通商品詳情頁加入購物車的情況;

當購物車中的商品有參與拼團活動時,在活動預熱或者進行中狀态時,購物車會對應出現活動信息,支持點擊跳轉拼團活動詳情頁。

2. 結算頁面取值

  • ①購物車選中商品,不管是選單個商品還是多個商品,點擊進入結算頁面時,是以單買價(即商品正常銷售價)下單。
  • ②隻有通過拼團商品詳情頁【我要開團】或者參團邀請【我要參團】入口,才支持以拼團價下單,也相當于參與拼團活動都是單個SKU下單。

小程序如何拼團(拼團活動之小程序前端頁面實例講解)7

四、訂單管理

1. 訂單類型标記

拼團訂單、普通訂單2種。

2. 訂單狀态

  • 普通訂單流:待支付–待發貨–待收貨–已完成–已關閉
  • 拼團訂單流:待支付–待成團–待發貨–待收貨–已完成–已關閉

小程序如何拼團(拼團活動之小程序前端頁面實例講解)8

小程序端待成團訂單同樣放在待發貨狀态裡,支持客戶邀請好友,處理方式如下:

小程序如何拼團(拼團活動之小程序前端頁面實例講解)9

五、退款管理

拼團的退款單生成的2種場景(前提條件:已支付待成團狀态時,不支持發起退款):

1. 拼團成功,用戶主動申請退款的情況

拼團成功待發貨狀态時,支持用戶在訂單詳情頁申請退款,申請後,僅退此訂單,同團的其他訂單不受影響。

2. 拼團失敗,系統自動觸發退款的情況

小程序如何拼團(拼團活動之小程序前端頁面實例講解)10

六、我的拼團管理

用戶發起拼團,下單支付成功後,即開團成功,或者用戶參團,下單支付成功後,即參團成功。開團或參團成功後,【我的拼團】會新增一條拼團記錄,用來跟蹤此拼團活動的拼團狀态。

拼團狀态有3個:拼團中,拼團成功,拼團失敗,如下圖所示:

小程序如何拼團(拼團活動之小程序前端頁面實例講解)11

1. 拼團中狀态頁面分2種場景處理

  • ①自己發起的團,支持用戶邀請好友參團
  • ②點擊别人的團,支持用戶參團

小程序如何拼團(拼團活動之小程序前端頁面實例講解)12

2. 拼團成功狀态頁面分2種場景處理

  • ①用戶已參與該團,且該團已拼團成功時;
  • ②用戶未參與該團,但該團已拼團成功時;

小程序如何拼團(拼團活動之小程序前端頁面實例講解)13

3. 拼團成功狀态頁面分2種場景處理

  • ①用戶已參與該團,且該團拼團失敗時;
  • ②用戶未參與該團,但該團拼團失敗時;

小程序如何拼團(拼團活動之小程序前端頁面實例講解)14

作者:shirly ,公衆号:小小何小廚

本文由 @shirly 原創發布于人人都是産品經理。未經許可,禁止轉載

題圖來自Unsplash,基于 CC0 協議

,

更多精彩资讯请关注tft每日頭條,我们将持续为您更新最新资讯!

查看全部

相关圖文资讯推荐

热门圖文资讯推荐

网友关注

Copyright 2023-2025 - www.tftnews.com All Rights Reserved