rustcrazy

easy-app-maker

0
0
# Install this skill:
npx skills add rustcrazy/zhulg-skills --skill "easy-app-maker"

Install specific skill from multi-skill repository

# Description

为非程序员提供的一站式应用制作工具

# SKILL.md


name: easy-app-maker
description: "一站式应用制作平台,专为非程序员设计。支持创建 Web 应用、H5 页面、智能文档、聊天机器人和内容创作工具。通过简单对话即可生成完整的、可运行的应用代码。Use when user wants to create applications without coding, needs quick prototypes, or wants to automate content/document generation."
license: MIT
metadata:
author: Claude
version: "1.0.0"
tags:
- nocode
- app-maker
- beginner-friendly
- web-app
- h5-page
- document-generator
- chatbot
- content-creation
commands:
- name: /easy-app-maker
description: 为非程序员提供的一站式应用制作工具
usage: /easy-app-maker [category] [type] [options]
examples:
- "/easy-app-maker web form"
- "/easy-app-maker h5 activity theme festive"
- "/easy-app-maker document report data sales.csv"
- "/easy-app-maker chatbot knowledge faq.md"
- "/easy-app-maker content social platform xiaohongshu"


Easy App Maker - 简易应用制作器

为非程序员打造的一站式应用制作平台

"你描述需求,AI 生成应用,浏览器直接运行"

🌟 核心理念

  • 零编程基础:通过对话完成所有操作
  • 即开即用:生成的代码可直接运行
  • 五大方向:覆盖最常见的应用需求
  • 完全免费:无需付费工具或服务

🎯 支持的 5 大应用方向

1️⃣ Web 应用生成器 (Web App Builder)

适用场景: 表单、落地页、数据仪表盘、互动工具

支持的应用类型

类型 功能 示例
表单应用 问卷调查、信息收集、报名登记 活动报名、客户反馈
落地页 产品介绍、活动宣传、作品集 SaaS 产品页、个人简历
数据仪表盘 数据可视化、业务监控 销售分析、健康追踪
互动工具 计算器、转换器、小游戏 BMI 计算、单位转换

技术栈: HTML + Tailwind CSS + Vanilla JavaScript

使用命令:

/easy-app-maker web form fields "姓名,邮箱,留言"
/easy-app-maker web landing-page product "AI写作助手"
/easy-app-maker web dashboard data "sales.csv"
/easy-app-maker web tool type "BMI计算器"

2️⃣ H5 页面生成器 (H5 Page Builder)

适用场景: 微信活动页、产品展示、问卷调查、邀请函

支持的页面类型

类型 功能 示例
活动页 节日活动、促销宣传 新年抽奖、618 大促
产品展示 商品介绍、特性展示 新品发布、功能演示
邀请函 活动邀请、婚礼请柬 年会邀请、生日派对
问卷调查 移动端问卷、投票 满意度调查、意见收集
一页简历 个人介绍、求职简历 设计师作品集

特色功能:
- 📱 移动端优化(微信内完美显示)
- 🎨 丰富的动画效果
- 📊 数据统计和分享功能
- 🎁 内置常用组件(轮播、倒计时、抽奖等)

使用命令:

/easy-app-maker h5 activity theme "新年红包" style festive
/easy-app-maker h5 product name "智能手表" features "健康监测,消息提醒"
/easy-app-maker h5 invitation event "公司年会" date "2026-02-15"

3️⃣ 智能文档生成器 (Document Generator)

适用场景: 工作报告、数据分析、会议纪要、简历生成

支持的文档类型

类型 功能 示例
数据报告 自动分析 + 可视化 月度销售报告、财务分析
会议纪要 录音转文字 + 总结 项目会议记录、决策文档
简历生成 智能排版 + 多模板 求职简历、个人介绍
PPT 大纲 主题扩展 + 结构化 产品介绍、培训课件
合同模板 法律条款 + 自定义 劳动合同、租赁协议

特色功能:
- 📊 自动生成图表和可视化
- 🎯 智能提取关键信息
- 📄 支持导出 Word/PDF/Markdown
- 🎨 多种专业模板

使用命令:

/easy-app-maker document report data "sales.csv" type "月度分析"
/easy-app-maker document meeting transcript "meeting.txt"
/easy-app-maker document resume info "个人信息.txt" template "现代简约"
/easy-app-maker document ppt topic "产品发布会" slides 15

4️⃣ AI 聊天机器人配置器 (Chatbot Builder)

适用场景: 网站客服、知识问答、业务咨询、个人助手

支持的机器人类型

类型 功能 示例
客服机器人 FAQ 自动回复 电商客服、技术支持
知识问答 文档检索 + 回答 产品手册、政策咨询
业务助手 流程引导 + 表单 报销流程、请假申请
个人助手 日程管理 + 提醒 会议安排、待办事项

特色功能:
- 🤖 基于 AI 大模型(Claude/GPT)
- 📚 支持上传知识库文档
- 💬 可嵌入任何网站
- 📊 对话数据统计

使用命令:

/easy-app-maker chatbot knowledge "产品FAQ.md" tone "专业友好"
/easy-app-maker chatbot customer-service industry "电商" features "订单查询,退换货"
/easy-app-maker chatbot assistant type "日程管理" integration "Google Calendar"

5️⃣ 内容创作工具集 (Content Creation Suite)

适用场景: 社交媒体运营、营销文案、SEO 文章、视频脚本

支持的创作类型

类型 功能 示例
社交媒体 批量生成文案 + 配图建议 小红书、抖音、微博
营销文案 广告语、邮件、推广文 产品宣传、活动推广
SEO 文章 关键词优化 + 长文 博客文章、知识库
视频脚本 分镜 + 文案 + 字幕 短视频、教程视频
电商详情页 产品描述 + 卖点提炼 淘宝详情、京东页面

特色功能:
- 📝 批量生成(一次 10+ 条)
- 🎨 配图和排版建议
- 📅 发布时间策略
- 📊 热度预测和优化建议

使用命令:

/easy-app-maker content social platform "小红书" topic "职场效率工具" count 10
/easy-app-maker content marketing product "智能手表" goal "促销转化"
/easy-app-maker content seo keyword "AI写作工具" length 2000
/easy-app-maker content video topic "产品使用教程" duration 60

📋 通用工作流程

Step 1: 选择应用方向

/easy-app-maker

AI 会询问:你想创建什么类型的应用?
- web - Web 应用
- h5 - H5 页面
- document - 智能文档
- chatbot - 聊天机器人
- content - 内容创作

Step 2: 选择具体类型

根据你选择的方向,AI 会展示该方向下的所有类型供你选择。

Step 3: 回答引导问题

AI 会根据你选择的类型,询问针对性的问题:
- 用途和目标
- 风格和主题
- 功能需求
- 数据来源(如果需要)

Step 4: 获取成果

AI 会生成:
- Web/H5:完整的 HTML/CSS/JS 代码
- Document:格式化的文档文件(Word/PDF/Markdown)
- Chatbot:可嵌入的聊天窗口代码 + 配置文件
- Content:批量文案 + 使用建议

Step 5: 测试和部署

  • 本地测试:直接打开生成的文件
  • 在线部署:上传到 Netlify/Vercel(免费)
  • 迭代优化:告诉 AI 你想修改的地方

🎨 设计主题库(适用于 Web 和 H5)

主题名称 颜色方案 适用场景
modern 深蓝 + 白色 企业官网、SaaS 产品
vibrant 渐变彩色 创意工作室、个人品牌
minimal 黑白灰 作品集、博客
warm 橙黄暖色 餐饮、生活服务
tech 赛博蓝紫 科技产品、开发者工具
festive 喜庆红金 节日活动、促销页面
elegant 莫兰迪色 高端品牌、艺术展示

💡 使用示例

示例 1: 创建微信活动页

命令:

/easy-app-maker h5 activity

AI 引导对话:

AI: 你好!我将帮你创建一个 H5 活动页。请回答以下问题:

1. 活动主题是什么?
   用户: 春节红包抽奖

2. 活动时间?
   用户: 2026年2月1日-2月15日

3. 需要哪些功能?
   用户: 抽奖转盘,分享得机会,中奖记录

4. 喜欢什么风格?
   用户: 喜庆红色,带烟花动画

AI: 好的!正在为你生成 H5 页面...

生成结果:
- 一个完整的 H5 活动页
- 红色喜庆主题 + 烟花动画
- 抽奖转盘交互
- 分享功能(微信分享)
- 中奖记录展示
- 响应式设计(适配所有手机)


示例 2: 生成月度销售报告

命令:

/easy-app-maker document report data "sales-jan.csv"

AI 引导对话:

AI: 请上传你的 CSV 文件,或告诉我数据的列名。

用户: 列名是:日期,销售额,订单数,客户数,产品类别

AI: 你希望报告包含哪些分析?
用户: 总体趋势,产品对比,同比增长

AI: 报告的目标读者是谁?
用户: 公司管理层

AI: 正在生成专业报告...

生成结果:
- Word 文档(可编辑)
- 包含:
- 执行摘要
- 关键指标卡片
- 趋势折线图
- 产品对比柱状图
- 同比分析表格
- 结论和建议
- 专业排版 + 公司 Logo 位置预留


示例 3: 配置客服机器人

命令:

/easy-app-maker chatbot knowledge "产品FAQ.md"

AI 引导对话:

AI: 我将帮你创建一个智能客服机器人。

1. 机器人的名字?
   用户: 小智

2. 服务的行业或产品?
   用户: 智能家居产品

3. 语气风格?
   用户: 专业但友好,不要太正式

4. 需要哪些功能?
   用户: FAQ 问答,订单查询,人工转接

AI: 正在配置机器人...

生成结果:
- 可嵌入网站的聊天窗口代码
- 基于 FAQ.md 的知识库
- 订单查询接口(需连接数据库)
- 人工转接按钮
- 后台配置文件
- 部署指南(Vercel/Netlify)


示例 4: 批量生成小红书文案

命令:

/easy-app-maker content social platform "小红书" topic "居家办公好物"

AI 引导对话:

AI: 我将帮你批量生成小红书文案。

1. 目标受众是谁?
   用户: 25-35岁职场女性

2. 推广的产品或主题?
   用户: 人体工学椅、护眼台灯、桌面收纳

3. 需要多少条文案?
   用户: 10条

4. 语气风格?
   用户: 亲切分享型,带emoji

AI: 正在生成文案...

生成结果:
- 10 条完整的小红书文案
- 每条包含:
- 吸引人的标题
- 正文(150-300字)
- 相关话题标签
- 配图建议
- 发布时间建议
- Markdown 格式,可直接复制使用


🛠 技术栈说明

Web 应用 & H5 页面

  • HTML5 - 语义化标签
  • Tailwind CSS - 实用优先的 CSS 框架(CDN)
  • Vanilla JavaScript - 无需 React/Vue
  • Chart.js - 数据可视化(仪表盘)
  • Swiper.js - 轮播组件(H5)

智能文档

  • Markdown - 基础格式
  • Pandoc - 格式转换(可选)
  • Chart.js - 图表生成
  • 模板引擎 - 文档排版

聊天机器人

  • OpenAI API / Claude API - 对话能力
  • Embeddings - 知识库检索
  • WebSocket - 实时通信(可选)

内容创作

  • AI 大模型 - 文案生成
  • 关键词分析 - SEO 优化
  • 模板库 - 不同平台的格式

📚 学习路径(可选)

初级:理解生成的代码

  • 查看 HTML 结构
  • 尝试修改文字和颜色
  • 理解基本的交互逻辑

中级:自定义和扩展

  • 调整 Tailwind 类名
  • 添加新的功能模块
  • 连接真实的数据源

高级:独立开发

  • 理解完整的代码架构
  • 学习 API 集成
  • 部署到生产环境

🚀 部署指南

方法 1: Netlify(推荐)

  1. 访问 netlify.com
  2. 拖拽文件夹到页面
  3. 获得在线链接

方法 2: Vercel

  1. 访问 vercel.com
  2. 连接 GitHub 或直接上传
  3. 自动部署

方法 3: GitHub Pages

  1. 创建 GitHub 仓库
  2. 上传文件
  3. 启用 Pages 功能

❓ 常见问题

Q: 我完全不懂编程,能用这个吗?

A: 可以!你只需要描述需求,AI 会生成所有代码。

Q: 生成的应用可以商用吗?

A: 可以。生成的代码完全属于你。

Q: 支持哪些浏览器?

A: 所有现代浏览器(Chrome、Firefox、Safari、Edge)。

Q: 可以连接真实的数据库吗?

A: 可以。AI 可以帮你集成 Firebase、Supabase 等服务。

Q: 生成的文档可以编辑吗?

A: 可以。Word/PDF 文档可以用 Office/WPS 编辑。


🎯 快速开始

/easy-app-maker

AI 会引导你完成整个过程!🎉


让创造变得简单,让想法变成现实!

# Supported AI Coding Agents

This skill is compatible with the SKILL.md standard and works with all major AI coding agents:

Learn more about the SKILL.md standard and how to use these skills with your preferred AI coding agent.