幸運大轉盤模板

零售餐飲互動玩法

示例：柚見三週年 · 幸運大轉盤 · 大轉盤

幫我給我們奶茶店的週年店慶做一個幸運大轉盤，發成一個網頁連結到會員群：首屏就是一隻用 canvas 畫的大轉盤，8 格獎品，每格有一個現畫的小插畫和短字，外圈一圈會閃的燈泡，頂上一個指標，中間一個大的「開始」按鈕；上面是店名、活動日期、一句大標題和一句店長的話，右上角一個靜音鍵；點開始後轉盤像真的一樣減速停下，指標過格子邊界時輕輕抖一下，停下時撒綵帶、手機輕震、響一聲合成的音效（點了才響），然後彈出一張獎券卡：獎品、插畫、券碼、有效期、在哪核銷，下面填稱呼點領取，存進一張資料表（name / prize / code）。轉盤下面寫今天還有幾次機會、獎池還剩多少，一條「最近中獎」捲軸讀這張表。往下是獎品與剩餘：每樣獎品的總數、剩餘、此刻機率和一條剩餘進度條，機率按剩餘數算，寫明規則；然後摺疊的活動規則、門店地址帶複製按鈕。手機豎屏一屏看完首屏，電腦上居中一塊手機比例的舞臺；轉盤不出來時也能看到獎品表、規則和一張登記表單。活動期間有變化就更新同一個連結。

參考模板：先讀 https://space.24haowan.com/examples/sample-lucky-wheel/agent.md ，照它的結構和版式做，內容全部換成我的；做成一個單檔案 HTML（樣式寫在頁面裡、不引用外部檔案，手機上好看），並提供 .html 檔案下載。
· 你有活頁工具（MCP）：用樣例 sample-lucky-wheel 當底稿（list_examples key=sample-lucky-wheel），發成活頁，先給我看預覽。
· 沒有活頁工具、但能發 HTTPS 請求：把做好的 HTML 以 Content-Type: text/html POST 到 https://space.24haowan.com/api/quick?client=template-sample-lucky-wheel ，把返回的預覽連結和認領連結給我（7 天臨時連結）。
如果你還沒有活頁聯結器（MCP），先讀 https://space.24haowan.com/for-agents.md ，照裡面的說明接入，或不登入直接發布。

豆包、DeepSeek、Kimi、元寶、ChatGPT、Claude……能上網讀連結的都可以

看真頁面

發成微信裡能開啟的連結

WorkBuddy、Claude、Codex 等支援 MCP 的 Agent，微信掃碼登入

第一次在 WorkBuddy 裡接活頁？看圖文手冊 ›

幫我接入活頁：先讀 https://space.24haowan.com/for-agents.md ，一步步帶我完成；然後參考 https://space.24haowan.com/examples/sample-lucky-wheel/agent.md 做一份我自己的「柚見三週年 · 幸運大轉盤」，發成活頁，先給我看預覽。

我的要求：幫我給我們奶茶店的週年店慶做一個幸運大轉盤，發成一個網頁連結到會員群：首屏就是一隻用 canvas 畫的大轉盤，8 格獎品，每格有一個現畫的小插畫和短字，外圈一圈會閃的燈泡，頂上一個指標，中間一個大的「開始」按鈕；上面是店名、活動日期、一句大標題和一句店長的話，右上角一個靜音鍵；點開始後轉盤像真的一樣減速停下，指標過格子邊界時輕輕抖一下，停下時撒綵帶、手機輕震、響一聲合成的音效（點了才響），然後彈出一張獎券卡：獎品、插畫、券碼、有效期、在哪核銷，下面填稱呼點領取，存進一張資料表（name / prize / code）。轉盤下面寫今天還有幾次機會、獎池還剩多少，一條「最近中獎」捲軸讀這張表。往下是獎品與剩餘：每樣獎品的總數、剩餘、此刻機率和一條剩餘進度條，機率按剩餘數算，寫明規則；然後摺疊的活動規則、門店地址帶複製按鈕。手機豎屏一屏看完首屏，電腦上居中一塊手機比例的舞臺；轉盤不出來時也能看到獎品表、規則和一張登記表單。活動期間有變化就更新同一個連結。

分享海報

微信里長按圖片儲存或轉發給朋友；掃碼就能開啟這個模板。

下載海報

這份模板

門店店慶、會員日、開業、節日，想發一個在群裡點開就能抽一次的轉盤：獎品有限量、要顯示還剩多少、抽中的券到店核銷，選它。只收報名、按場次分名額選 sample-event-signup；請人來吃飯回個執選 sample-invitation；不需要抽獎、只想把商品和價格擺出來選 sample-product-catalog。

頁面結構：轉一次 · 獎品與剩餘 · 活動規則 · 門店地址

canvas 現畫的轉盤、綵帶粒子與 Web Audio 合成音（點按後才發聲，可靜音），一張值得截圖的獎券卡
獎券卡里填稱呼領取寫回資料表（原生表單 POST ./_data/draws），頁面讀回扣減各獎品剩餘、滾動顯示最近中獎
同一連結活動期間持續更新（改獎池、補門店已抽數都在這一頁）
微信卡片（share.title / share.desc）

發之前要備好：資料表 draws（列 name / prize / code，append_open=true）：獎券卡里的領取寫進這裡，頁面讀回扣減剩餘、顯示最近中獎；發布前先用 set_data 建好，活動結束把 append_open 關掉

看模板原始碼 ›

這份哪裡不合適？提改進建議模板工廠每天看一次，改好了寫進改進記錄

幸運大轉盤模板

同類案例