2b:null 2c:["$","title",null,{"children":"🛍️ Shopify Store Optimization | lihui-yang | Observable"}] 31:Tc30,

🎯 Key Actions

Enabled online ordering for bundle deals, allowing out-of-province customers to purchase directly and boosting total sales.

📉 Analysis

Conversion Rate Comparison: June 2024 vs. June 2025

Location Orders Comparison: June 2024 vs. June 2025

Devices Type Porpotion: June 2024 vs. June 2025

Total Clicks Comparison: June 2024 vs. June 2025

🌀 Animated Demo (Before / After)

32:Taab,stepContent = { if (step === "Step 1：User Experience Research") { return md`## 🎯 Step 1: User Experience Research **Establishing a New Bundle Purchase Flow** Unlike last year’s offline-only promotion model, this year users can place orders directly on the website. This significantly improves conversion, especially for customers from other provinces. **Impact:** - 🛒 Improved shopping convenience - 🌎 Expanded access for non-local customers - 💰 Increased total sales volume ` } else if (step === "Step 2：Behavioral Data Analysis") { return md`## 🧩 Step 2: Plugin Comparison and Analysis **Plugin Options:** - 🅰️ Plugin A: Mix & Match at the bottom of the product page - 🅱️ Plugin B: Separate bundle section with automatic price adjustment at checkout ✅ We chose **Plugin B**, which supports creating a separate section and automating price changes based on the contents of the cart. ` } else if (step === "Step 3：Identified Plugin Constraints") { return md`## ⚙️ Step 3: Setting Pricing Constraints **Problem Identified:** The plugin lacks native support for multi-tier bundle pricing, such as $333 for 2 items, $999 for 2 items, and so on. **Solution:** - Use **tags** to categorize products into bundle levels - Implement **automated price rules** based on cart total and product tagging ` } else if (step === "Step 4：UI/UX Design Optimization") { return md`## 🎨 Step 4: UI/UX Optimization — Labubu Theme **Design Theme:** Limited-edition Labubu collection **Engagement Strategies:** - 🎁 Top 5 spenders receive a Labubu gift - 🎟️ Customers meeting spending thresholds qualify for a Labubu prize draw > 💡 The thematic design enhanced page attractiveness and improved user interaction and collection intent. ` } else if (step === "Step 5：Feature Updates: Navigation / Filters / Search") { return md`## 🧭 Step 5: Navigation, Search & Filter Optimization **Enhancements:** - 🔖 Added a dedicated **Bundle section** to the navigation menu - 🔍 Filters include **brand**, **material**, **size**, **price**, etc. - ↕️ Sorting options include **price** and **popularity** > 📊 These changes make it easier for users to locate desired products and complete purchases efficiently. ` } else if (step === "Step 6：Performance Monitoring and User Feedback") { return md` ## 🧪 Step 6: A/B Testing and User Feedback **Outcome:** - Users preferred the **Plugin B flow** with a dedicated bundle page - Higher conversion rates were observed compared to regular product pages **Feedback Highlights:** - ✅ UI is clean and intuitive - 🎯 Prize draw incentives increased user engagement and repeat purchases ` } } 33:[] 2f:{"id":"ee94b02d598c2734","slug":null,"title":"🛍️ Shopify Store Optimization","thumbnail":"361d8b11d2b75ad16ecbb28e0f719a20ca8bac4dee153dd4ed1c2a48a3f43382","access_level":"public","create_time":"$D2025-07-24T22:16:21.648Z","update_time":"$D2025-07-24T22:19:14.918Z","view_time":null,"first_public_time":"$D2025-07-24T22:16:21.648Z","has_unpublished_edits":null,"fork":{"id":"24461cb3e9ec7716","slug":null,"title":"🛍️ Shopify Store Optimization","owner":{"id":"ef48ffa7119bbe8b","login":"lihui-yang","name":""}},"stars":0,"starred":false,"owner":{"type":"team","id":"ef48ffa7119bbe8b","login":"lihui-yang","name":"","avatar_url":"https://avatars-next.observableusercontent.com/fb83f5f50aad07d2298f221edbbc86ed71bd455f29c6293e931ab8054ea6e412","tier":"starter_2024"},"version":206,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"eaa348d11c40197d","login":"lihui-yang","name":"","avatar_url":"https://avatars-next.observableusercontent.com/fb83f5f50aad07d2298f221edbbc86ed71bd455f29c6293e931ab8054ea6e412","tier":null}],"members":[{"type":"individual","id":"eaa348d11c40197d","login":"lihui-yang","name":"","avatar_url":"https://avatars-next.observableusercontent.com/fb83f5f50aad07d2298f221edbbc86ed71bd455f29c6293e931ab8054ea6e412","tier":null,"role":"editor"},{"type":"team","id":"ef48ffa7119bbe8b","login":"lihui-yang","name":"","avatar_url":"https://avatars-next.observableusercontent.com/fb83f5f50aad07d2298f221edbbc86ed71bd455f29c6293e931ab8054ea6e412","tier":"starter_2024","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"🛍️ Shopify Store Optimization","cells":[{"id":0,"value":"# 🛍️ Shopify Store Optimization ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":10,"value":"## 🏅Anniversary Sale with Bundle Option","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":166,"value":"

\n \n \n

\n ${md`### 📈 Project Workflow`}\n ${mermaid1`\n flowchart TD\n A[User Experience Research] --> B[Behavioral Data Analysis]\n B --> C[Identified Plugin Constraints]\n C --> D[UI/UX Design Optimization]\n D --> E[Feature Updates: Navigation / Filters / Search]\n E --> F[A/B Testing and Deployment]\n F --> G[Performance Monitoring and User Feedback]\n `}\n

\n\n \n

\n ${viewof step} \n ${stepContent}\n \n

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":101,"value":"$31","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":12,"value":"import {mermaid} from \"@matthewkenny/mermaid-js\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"mermaidJs = require('mermaid@8.9/dist/mermaid.min.js');\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":26,"value":"mermaid1 = function (...values) {\n const div = (viewof mermaidContainer); //document.getElementById('mermaid');\n if (!div) {\n throw 'Cannot find div with id \"mermaid\"';\n }\n \n const src = String.raw(...values).trim();\n const id = \"mmd\" + Math.round(Math.random() * 10000);\n div.append(html`

`);\n \n try {\n const result = mermaidJs.render(id, src, undefined);\n return svg([result]);\n } catch (ex) {\n console.error(ex);\n throw ex;\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":47,"value":"viewof step = Inputs.select(\n [\"Step 1：User Experience Research\", \"Step 2：Behavioral Data Analysis\", \"Step 3：Identified Plugin Constraints\", \"Step 4：UI/UX Design Optimization\", \"Step 5：Feature Updates: Navigation / Filters / Search\", \"Step 6：Performance Monitoring and User Feedback\"],\n { label: \"Choose an option:\", layout: \"vertical\"}\n)\n\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":57,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":145,"value":"window.onload=function(){\n{\n const lightbox = document.getElementById(\"lightbox\");\n const lightboxImg = document.getElementById(\"lightbox-img\");\n\n // 所有 card 中的 img\n document.querySelectorAll(\".card img\").forEach(img => {\n img.addEventListener(\"click\", () => {\n lightboxImg.src = img.src;\n lightbox.style.display = \"flex\";\n });\n });\n\n // 点击 lightbox 区域关闭\n lightbox.addEventListener(\"click\", () => {\n lightbox.style.display = \"none\";\n });\n}\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":24,"value":"viewof mermaidContainer = html`

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W33","stdlib":"1","titling":"auto"}} 30:"$2f:body"