Contact person: Digital Huabao: 数字化艺术收藏 -- 2

Phone:Show

Email:Show

Location: Phnom Penh, Cambodia

Budget: Recommended by industry experts

Time to start: As soon as possible

Project description:
"第一卷 · 总览与主要页面布局详解

⸻

第一章 项目总览与核心理念

1.1 项目名称

数字华宝（Digital Huabao）

1.2 项目定位
• 文化价值：通过数字化艺术品收藏，帮助全球华人传承中华文明。
• 技术基础：基于数字人民币硬钱包与区块链存证，实现所有权的真实性与不可篡改性。
• 市场方向：服务全球华侨与华人群体，打造一个集 艺术收藏 + 数字投资 + 文化认同 于一体的国际化平台。

1.3 用户价值
• 收藏稀缺数字艺术品。
• 参与价格发现与市场交易。
• 安全存储并随时提现。
• 共享文化认同，参与社区互动。

1.4 核心理念

数字华宝：收藏东方之美，共赢数字未来。

⸻

第二章 网站整体布局概览

整个官方网站分为七大核心模块：
1. 首页 / 艺术品展厅
2. 交易大厅
3. 用户中心
4. 客服与帮助中心
5. 社区与品牌内容
6. 管理后台（内部使用）
7. 公共组件与底层支撑

每个模块都会包含：
• 页面结构（布局、信息层级）
• 交互逻辑（用户行为、反馈）
• UI 元素说明（按钮、图标、动效）

⸻

第三章 首页（艺术品展厅）

3.1 顶部导航栏
• 布局：横向条，固定悬浮在页面顶部。
• 左侧：数字华宝 Logo（点击回到首页）。
• 中部导航项：
• 艺术品展厅
• 交易大厅
• 用户中心
• 社区
• 帮助中心
• 右侧：登录 / 注册按钮。点击后弹出模态框（输入邮箱 + 密码 + 验证码）。

交互逻辑：
• 页面滚动时导航栏缩小，背景透明度从 0.7 过渡到 1。
• Hover 效果：文字下划线动画。

⸻

3.2 视觉展示区（Hero 区）
• 背景：全屏循环视频（15 秒）。视频内容从水墨渲染开始，过渡到青花瓷纹理，最后出现敦煌飞天与数字光效融合。
• 中央文字：
• 主标语（大字）：数字华宝
• 副标语（小字）：收藏东方之美，共赢数字未来
• 右下角按钮：「立即探索」→ 点击后页面平滑滚动到产品展示区。

交互逻辑：
• 视频加载前，展示渐变背景 + Logo。
• 按钮 Hover：光晕扩散动效。

⸻

3.3 产品展示区（首发作品展厅）
• 网格布局：3 列 × 5 行 = 15 件首发作品。
• 卡片内容：
• 封面预览图（动态视频缩略图或 3D 模型快照）。
• 作品标题。
• 艺术家姓名。
• Hover 动效：卡片放大 5%，背景模糊，浮现按钮「查看详情」。
• 分类筛选：
• 标签：文化传承 / 时代印记 / 东方神兽
• 支持复选 + 搜索

交互逻辑：
• 点击卡片 → 跳转作品详情页。
• 作品详情页包含：动态展示 + 艺术家简介 + 市场信息（发行量、价格）。

⸻

3.4 首页底部区
• 新闻与公告轮播：艺术家访谈、行业资讯、项目公告。
• 页脚：
• 社交入口：Discord、微信群、X（原 Twitter）
• 法律声明与版权信息
• ICP/备案信息

⸻

第四章 交易大厅

交易大厅是用户的核心操作区，布局采用 左侧行情榜 + 右侧交易详情 双栏模式。

4.1 左侧行情榜
• 表格列：
• 艺术品名称
• 最新成交价（实时更新，变化时闪烁）
• 24 小时涨跌幅（绿色上箭头 / 红色下箭头）
• 24 小时成交量
• 交互：
• 列表支持上下滚动。
• 点击某一行 → 右侧交易详情刷新为对应作品。

⸻

4.2 右侧交易详情区
• 顶部：作品动态展示（高清视频 / 3D 模型），右上角收藏按钮（点击后加入“我的收藏夹”）。
• 中部：价格趋势图（折线图 / 蜡烛图切换）。
• 默认 7 日折线图，可切换 30 日、1 年。
• Hover 显示数据点详情（日期、价格、成交量）。
• 下方交易面板：
• Tabs：买入 / 卖出。
• 市价单输入框：输入数量，按最优价成交。
• 限价单输入框：输入价格 + 数量，提交挂单。
• 系统自动计算预计成交额。
• 最底部：实时成交记录。
• 每条包含：时间 / 成交价 / 数量 / 方向（买入/卖出）。

交互逻辑：
• 下单时弹出确认弹窗 → 显示手续费与总金额。
• 成交后提示“订单完成”，并推送到用户中心 → 交易历史。

⸻

第五章 用户中心

用户中心是资产管理与交易历史的核心模块。

5.1 总览（Dashboard）
• 顶部：总资产估值（按 USDT 实时换算）。
• 中部：资产分布饼图 → 艺术品 / 现金比例。

⸻

5.2 我的藏品
• 卡片式网格：
• 动态预览图
• 购买成本
• 当前市值（实时更新）
• 盈亏百分比与金额
• 点击卡片 → 藏品详情页
• 交易记录（买入价、卖出价、日期）
• 所有权流转历史（链上数据可视化）。

⸻

5.3 资金管理
• 充值：
• 显示 USDT 钱包地址（字符串 + 二维码）。
• 按钮：复制地址。
• 提现：
• 输入金额 + 目标地址。
• 二步验证：短信验证码 + 邮箱确认。
• 提现申请 → 审核 → 链上转账。

⸻

5.4 交易历史
• 表格结构：时间 / 类型（买入/卖出）/ 数量 / 价格 / 状态。
• 功能：
• 筛选（按作品、时间段）。
• 导出 CSV / PDF。

⸻

第六章 小结

在这一卷中，我们完成了：
• 网站整体定位与目标
• 首页布局与交互逻辑
• 交易大厅功能与交互
• 用户中心的功能细节

下一卷将进入：
• 数据库结构设计（中文全表说明 + SQL 脚本）
• 接口规范与错误码设计
• 后台管理逻辑

⸻" (client-provided description)