2025-04-07活动前端重构

以下是重构后的游戏活动管理页面设计方案,采用模块化布局和用户导向的设计原则:

游戏活动管理系统 - 重构方案


核心配置模块

1. 基础信息(卡片式布局)

配置项 输入方式
活动名称 文本输入框(带*必填标识)
活动时间 双日期选择器(开始/结束)
每日时段 时间范围选择器(带预设模板)
活动平台 多选按钮组(APP/网页/小程序)

2. 展示设置(开关组设计)

✅ 显示活动规则      ✅ 显示剩余次数
✅ 展示中奖消息      ✅ 个人中心提示
✅ 活动范围公示      

3. 高级配置(折叠面板或进度条)

  • 参与条件
    • 可根据每个大的配置内容进行折叠配置,按面板进行配置
  • 状态可视化
    • 用颜色区分不同配置状态
    • 添加配置进度指示条

4. 列表页优化

A. 需要有超链,查看当前的活动的详细信息,比如活动编号加上超链
B. 状态,通过颜色来表示,是开关,可以直接改状态,不需要单独的“下线”按钮
C. 每一个活动项,最后一列的操作项,可以通过...展开选择


企业微信截图_17440116404043.png

5. 编辑页优化

A. 按内容分块展示和编辑
B. 如果是上线的活动,则保存按钮为灰的,不能保存
C. 把非必填项或可以有默认项的,空间收缩起来,点“更多”或“高级”再展开可以编辑,减少页面占用
D. 所有的单选项,做成开关
E. 抽奖类型做成卡片式选择即可,图片缩小,点击再放大
F. 有些地方可以做文字展开说明,比如加个问号,一点就可以展示帮助信息

企业微信截图_17440117626583.png

6. 奖品项的设置

A. 奖品项在一个地方设置,参考:

企业微信截图_17440123571173.png

7. 其它设置

如何优化布局、简化操作流程、提高信息的清晰度。

A. 有些配置项,需要更清晰的标签或说明。
B. 整体布局可能较为松散,信息分组不够明确。可以考虑使用卡片式设计,将相关配置项分组,并添加区块标题,帮助用户快速定位。
C. 表单字段的排列可能需要调整,比如将关联性强的配置项放在同一行,使用网格布局提高空间利用率。
D. 考虑用户的操作流程,例如是否需要分步骤引导用户完成配置,或者提供默认值减少用户输入。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容