# Shopify 开发与电商设计

Shopify 开发、电商 UX/UI、主题架构与增长优化的项目作品和技术文章。

## 把品牌设计，落成可增长的Shopify 体验

从 UX/UI 到 Liquid 实现，兼顾品牌、性能与运营效率

浏览项目联系合作

[](https://www.novillashop.com/)NOVILLA · DESKTOP + MOBILERESPONSIVE STOREFRONT[查看案例 →](https://shopify.sofun.fun/work/novilla)

开发Liquid / Hydrogen / Shopify API

设计UX · UI · 品牌系统 · 交互细节

增长理解转化优化 / SEO / 运营效率

### 工作现场

同一品牌，多市场官网

COMPANYSHOKZ

ROLEShopify 开发与设计

SCOPE韩国 · 美国 · 响应式开发 · 多语言本地化

DESKTOP EXPERIENCE01 / RESPONSIVE

[](https://shokz.co.kr/)SHOKZ 韩国官网 · 桌面端RESPONSIVE · LOCALIZATION[查看案例 →](https://shopify.sofun.fun/work/shokz-multi-market)

MOBILE MARKETS · 03SELECT A MARKET

[](https://shokz.co.kr/)SHOKZ KOREA韩国官网韩语本地化、会员权益与移动端商品导购

### BUILD NOTES

四份界面档案，记录体验如何成形

FIELD NOTE 01

#### PDP

聚焦购买决策

01

##### DAYPACK 2.0

¥699.00采用 Cordura® Nylon 面料，耐磨耐用。
轻量防水，日常出行的可靠选择。

耐磨耐用

轻量防水

颜色 · 森林绿

数量

1

⬡ 免运费◷ 7天无理由退换⬢ 1年质保

明确行动路径
提升转化效率

FIELD NOTE 02

#### FILTER

更快找到所需

02匹配 6 件商品

包袋 (6)配件 (3)

¥199¥999

阶段化筛选
降低决策成本

FIELD NOTE 03

#### COLOR SWATCH

让颜色可感知

03颜色 · 森林绿

材质化呈现
传递触感与温度

FIELD NOTE 04

#### METAOBJECT

让内容可复用

04

产品名称

DAYPACK 2.0

材质

Cordura® Nylon

容量

20L

适用场景

日常通勤 / 旅行

metaobject: Product {
title: "Cordura® Nylon Daypack 2.0",
material: "Cordura® Nylon",
features: ["轻量耐磨", "防泼水面料"],
care: "建议局部清洁",
compatible: ["14英寸电脑", "旅行收纳包"]
}

结构化内容模型
一次创建，多处复用

ACTIVE OUTPUT / PRODUCT PAGE材质说明、卖点与护理方式自动进入商品详情。

### 从设计到上线

发现与研究用户与竞品分析，明确机会点

信息架构内容规划与页面结构设计

视觉设计品牌系统与界面高保真输出

主题开发Liquid 实现与交互组件开发

测试与优化性能、SEO、可用性全面打磨

上线与增长推广交付与数据迭代持续优化

### 技术文章

[查看全部文章](https://shopify.sofun.fun/blog)

[修改 Shopify 主题前先确认三件事主题开发 · 实战清单](https://shopify.sofun.fun/blog/theme-editing-notes)[Shopify 学习路径：从基础到实战学习路径 · 体系化](https://shopify.sofun.fun/blog/shopify-learning-path)[用 Metaobjects 构建可复用内容模型Metafields · 数据建模](https://shopify.sofun.fun/docs/development/metafields-guide)[集合页 Color Swatch 筛选实战筛选器 · 交互体验](https://shopify.sofun.fun/blog/shopify-color-swatch-collection-filter)[在 Shopify 中安全地扩展自定义代码Liquid · 可维护性](https://shopify.sofun.fun/docs/development/liquid-basics)

### 关于我

专注 Shopify 生态，把品牌想法落成可执行、可增长的线上体验。

[查看教程总览](https://shopify.sofun.fun/docs/intro)

START A PROJECT BUID

#### 一起把想法落地

新项目咨询、合作洽谈、技术支持，欢迎联系。

邮箱：

skyddyyu@outlook.com

微信：

fun_kaiwen

SOFUN把品牌设计，落成可增长的 Shopify 体验。

© 2026 SOFUN. All rights reserved.[鄂ICP备2026031629号-1](https://beian.miit.gov.cn/)

网页原文：https://shopify.sofun.fun/