mcpField
G
gamified-app

gamified-app

github.com/nexu-io设计与 UI9.3k39 次安装2 周前更新
代码仓库

关于 gamified-app

用于展示 RPG 风格习惯养成 App 的界面模板,面向设计此类产品界面的团队。通过三个手机画面呈现封面、每日任务和任务详情,并突出经验值与等级元素。

主要功能

  1. 01深色展示舞台与三个手机框
  2. 02封面或海报画面
  3. 03每日任务与经验值条
  4. 04任务详情、子任务与奖励
  5. 05渐变任务卡片和等级条

适用场景

  1. 01展示 RPG 风格习惯养成 App
  2. 02设计每日任务和等级界面
  3. 03呈现任务详情与奖励

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/nexu-io/html-anything --skill gamified-app

安装后在 Claude Code 中输入/gamified-app确认已加载。

附带文件example.html

详细介绍

【模板:游戏化 App / Quest UI】 【意图】类 RPG 习惯养成 App,深色展示舞台上摆放三个手机框架。 【布局】

  • Frame 1:封面 / 海报
  • Frame 2:今日任务 + XP 条幅 + 等级进度条
  • Frame 3:任务详情(子任务 + 奖励) 【设计细节】
  • 醒目的任务卡片渐变 + 等级条幅 + 底部标签栏

评论

支持 Markdown