VibeMKT Hub

内容与创意 · newsletter-signup-generator

邮件订阅表单 Skill

把模糊的订阅想法变成包含表单字段、文案和布局建议的完整订阅组件设计方案。

在需要新建邮件订阅入口或优化现有表单时使用。该工具会评估展示位置和激励物，产出表单字段清单与提交按钮设计，并给出首屏弹出或页脚等具体展示建议，供前端直接开发上线。

WHAT IT SOLVES

解决的营销问题

把模糊的订阅想法变成包含表单字段、文案和布局建议的完整订阅组件设计方案

把模糊的订阅想法变成包含表单字段、文案和布局建议的完整订阅组件设计方案。跑完你拿到的是包含每个字段名称与对应前端展示文案的表单结构清单，中间一共 8 步。

最适合的真实场景

  • 01

    内容运营在博客上线时，需要为文章底部添加一个不干扰阅读的邮箱收集入口

  • 02

    独立站运营筹备首购折扣活动，需要设计一个转化率达标且不过度打扰用户的弹窗

  • 03

    增长策略师发现现有表单转化率低，需要重做表单结构并对比不同位置的优缺点

  • 04

    出海营销团队制作引流电子书，需要设计配套的留资表单并提供激励物文案

你要先准备的资料

  • 包含目标受众特征与核心业务价值主张的业务简报文档
  • 具体的订阅激励物信息，如折扣代码的使用门槛或电子书的目录
  • 目标投放的平台设备说明，明确指出是仅适配移动端还是需要桌面端响应式布局
  • 如果存在本地项目文件，需提供该文件的具体读取路径与读取授权
  • 现有订阅表单的转化数据或用户热力图截图，用于优化重做场景

跑完你会拿到什么

  • 包含每个字段名称与对应前端展示文案的表单结构清单
  • 针对 Header、页脚、弹窗与侧边栏等位置出具的优缺点对比表与最终排版建议
  • 符合业务透明要求的订阅激励物说明文案与发送频率提示文案
  • 符合网页无障碍代码标准的输入框与提交按钮前端开发检查表
  • 包含隐私政策跳转链接与前端数据验证逻辑的技术规范说明

METHOD

Skill 工作流程

读取项目上下文 → 明确投放位置 → 确认激励物内容 等 8 个环节

一共 8 步。其中 4 项能力决定了换个 AI 会不会更麻烦。

  1. 读取项目上下文优先检查本地项目上下文文件。从中提取目标受众画像和核心价值主张，避免脱离实际业务凭空设计表单。
  2. 明确投放位置确定表单摆放在网页的具体位置。范围包括 Header、页脚、弹窗或侧边栏。输出各个位置可见度与打扰程度的对比清单。
  3. 确认激励物内容确认用户留下邮箱能获得的具体回报。涵盖电子书、折扣代码或独家内容。将回报内容转化为表单上的明确展示文案。
  4. 设计表单字段遵循字段最小化原则。默认只收集邮箱地址以保证最高转化率。仅当后续营销确实需要个性化称呼时，才增加姓名字段。
  5. 撰写价值主张文案梳理订阅收益的具体内容与发送频率。直接撰写展示在表单旁边的说明文案，向用户透明交代后续安排，避免引起预期落差。
  6. 执行位置优缺点对比针对弹窗、页脚固定栏、文章内嵌等位置进行评估。弹窗转化率高但打扰用户，页脚不打扰但可见度低。根据评估结果给出排版建议。
  7. 规划视觉与无障碍规定按钮必须明确可点击，且触控区域大于等于 44 乘 44 像素。要求为所有输入框配置实体标签，并支持回车键提交。
  8. 补充隐私与技术提示要求在表单附近提供隐私政策链接。根据不同地区的法规要求，提示是否需要开启双重确认机制以及前端数据验证。

这个 Skill 用到的能力： 读本地资料运行脚本操作前确认页面预览 。不同 AI 对这些能力的支持程度不一样，所以同一个 Skill 换个 AI，有几步做法会变。

WORKED EXAMPLE

真实业务案例

护肤独立站首购折扣弹窗设计

护肤独立站首购折扣弹窗设计

某护肤品牌出海团队的独立站转化率遇到瓶颈。团队计划在网站推出首购九折活动，需要设计一个弹窗收集访客邮箱并发送折扣码。团队希望利用弹窗提高留资率，但担心立即弹窗会激怒用户导致跳出率升高。团队需要交付一份具体的弹窗结构清单和文案。

  1. 读取本地项目文件，确认核心受众为关注天然成分的欧美年轻女性。
  2. 将首购九折优惠转化为弹窗标题文案，并明确发送频率为每周一封。
  3. 依据最小化原则，设计只包含邮箱地址输入框的表单结构。
  4. 对比弹窗与页脚位置的转化数据，制定弹出时机为页面停留十五秒后。
  5. 输出包含隐私政策链接和移动端键盘适配要求的开发检查表。

预期结果：交付了包含邮箱输入框与提交按钮的表单结构清单。提供了包含九折优惠利益点与发送频率的展示文案。附带了无障碍标签关联要求与触控区域大小标准的开发检查表。由于涉及具体的弹窗触发逻辑代码，仍需前端工程师人工编写并接入实际的邮件发送系统。

PITFALLS · VERIFICATION

能力边界与常见问题

为了收集更多线索盲目增加姓名和电话字段，导致表单转化率显著下降

最常踩的坑

  • 为了收集更多线索盲目增加姓名和电话字段，导致表单转化率显著下降。
  • 使用弹窗但未控制触发时机，用户一进网页就立即弹出，造成页面跳出率升高。
  • 使用占位符文字代替实体标签，导致屏幕阅读器无法读取，不符合无障碍标准。
  • 提交按钮的触控热区小于 44 像素，导致移动端用户点击困难且容易误触其他区域。
  • 承诺订阅者获得电子书或折扣代码，但未在系统中配置自动发送邮件，造成用户投诉。

怎么确认这次跑对了

  • 已经形成可检查的包含每个字段名称与对应前端展示文案的表单结构清单，关键判断能回到输入资料或过程证据。
  • 已经形成可检查的针对 Header、页脚、弹窗与侧边栏等位置出具的优缺点对比表与最终排版建议，关键判断能回到输入资料或过程证据。
  • 已经形成可检查的符合业务透明要求的订阅激励物说明文案与发送频率提示文案，关键判断能回到输入资料或过程证据。
  • 已逐项检查「为了收集更多线索盲目增加姓名和电话字段，导致表单转化率显著下降」等高频问题，并记录需要人工确认的下一步。
邮件订阅表单 Skill适合哪些岗位使用？

内容运营、增长策略师、独立站运营、出海营销团队。典型场景包括内容运营在博客上线时，需要为文章底部添加一个不干扰阅读的邮箱收集入口；独立站运营筹备首购折扣活动，需要设计一个转化率达标且不过度打扰用户的弹窗；增长策略师发现现有表单转化率低，需要重做表单结构并对比不同位置的优缺点。

开始前需要准备什么资料？

至少需要包含目标受众特征与核心业务价值主张的业务简报文档、具体的订阅激励物信息，如折扣代码的使用门槛或电子书的目录、目标投放的平台设备说明，明确指出是仅适配移动端还是需要桌面端响应式布局。资料越具体，结果越能直接用于决策。

最后能得到什么可检查的结果？

包含每个字段名称与对应前端展示文案的表单结构清单、针对 Header、页脚、弹窗与侧边栏等位置出具的优缺点对比表与最终排版建议、符合业务透明要求的订阅激励物说明文案与发送频率提示文案。每项都可以逐条核对来源和数字。

哪些情况下结果会不可靠？

为了收集更多线索盲目增加姓名和电话字段，导致表单转化率显著下降；使用弹窗但未控制触发时机，用户一进网页就立即弹出，造成页面跳出率升高。出现这些情况时需要人工复核。

支持哪些 AI Agent？

已适配 WorkBuddy、OpenClaw、Hermes Agent、Codex、Claude Code、TRAE、ZCode 共 7 种，每种都有独立的安装说明和能力对照。

ORIGINAL SOURCE

完整 Skill 内容与版本资料

2 个原始文件，12 个文档章节，固定在 70987bad

上游原文完整保留在加搜服务器上，可逐节查看，也可以直接下载。 当前镜像共 2 个文件、4.3 KB。

原始 Skill 文档 上游原文完整保留，中文概述已转换为营销任务、输入资料和交付结果。

Components: Newsletter Signup

Guides newsletter signup form design for list growth. Email subscribers spend 138% more than non-subscribers; top popups convert at 23%+.

When invoking: On first use, if helpful, open with 1–2 sentences on what this skill covers and why it matters, then provide the main output. On subsequent use or when the user asks to skip, go directly to the main output.

Initial Assessment

Check for project context first: If .claude/project-context.md or .cursor/project-context.md exists, read it for audience and value proposition.

Identify:

  1. Placement: Header, footer, popup, inline, sidebar
  2. Incentive: What subscribers receive
  3. Platform: Web, mobile, both

Form Design

Minimal Fields
  • Email only when possible; highest conversion
  • Add name only if needed for personalization
  • Wrong number of fields significantly impacts conversion
Value Proposition
  • Clear: what subscribers receive, how often
  • Transparent: avoid disappointing subscribers
  • Incentive: lead magnet, discount, exclusive content
Visual Design
  • Clearly clickable submit button
  • Mobile-first; responsive layout
  • Appropriate input types (e.g., type="email" for mobile keyboards)
  • Trust marks or security indicators

Placement

Placement Best For Pros Cons
Header High visibility Always visible Limited space
Footer Secondary capture Non-intrusive Lower visibility
Footer bar Persistent Sticky Can annoy
Popup High intent High conversion Intrusive
Inline Content pages Contextual Depends on scroll
  • Avoid hiding forms behind unclicked buttons/links
  • Don't place competing forms nearby

Accessibility

Requirement Practice
Labels <label> for each input; for/id association
Placeholders Don't replace labels; supplement only
Error messages Clear, associated with field
Keyboard Full tab order; submit via Enter
Touch targets ≥44×44px for submit button

Technical

  • Validation: Client-side; server-side required
  • Privacy: Link to privacy policy; GDPR/CCPA compliance
  • Double opt-in: When required by jurisdiction or best practice

Output Format

  • Form structure (fields, copy)
  • Placement recommendation
  • Value proposition suggestions
  • Accessibility checklist

Related Skills

  • signup-login-page-generator: Full account signup; form design principles apply
  • landing-page-generator: Lead capture landing page contains signup form; LP exchanges value for email
  • email-marketing: Full email marketing strategy; EDM, newsletter, deliverability, content types
  • footer-generator: Footer often hosts signup forms
  • cta-generator: Submit button is a CTA
  • trust-badges-generator: Trust marks near form

来源与版本声明

本页面由加搜科技整理业务说明并托管安装文件。原始 Skill 来源渠道：GitHub； 原始项目名称：newsletter-signup-generator； 固定版本：70987bad4ebe； 许可证：MIT。技能包内保留完整出处和许可证说明。

各 Agent 能力说明参考对应官方文档。页面不提供外部跳转。

INSTALL

三种安装方式

邮件订阅表单 Skill v1.0.0，ZIP 带 SHA256 校验

默认做法是把提示词复制给 AI Agent，让它自己下载并安装。提示词里已经写清要用完整 ZIP、装完报告目录、并先跑一个小任务验证。

METHOD 01 · 交给 AI 自己装

复制提示词

适合大多数情况。Agent 会下载 ZIP、解压、放到正确目录，并在缺少权限时告诉你需要手工做哪一步。

请帮我把「邮件订阅表单 Skill」安装到我正在使用的 AI Agent。
1. 下载完整 Skill ZIP：https://www.vibemarketing.work/packages/skill-newsletter-signup/1.0.0/skill-newsletter-signup.zip
   注意：网页 HTML 不能当作 Skill 文件安装，必须使用 ZIP 里的完整文件。
2. 解压后保留 SKILL.md 及全部配套文件，按你所用 Agent 的 Skill 目录规则安装。
3. 安装完成后告诉我实际安装目录。
4. 用一个只读小任务验证 Skill 已被识别。
5. 如果你没有联网、下载或写目录权限，请直接告诉我哪几步需要我手工完成。
参考：原始 SKILL.md https://www.vibemarketing.work/raw/skill-newsletter-signup/SKILL.md；安装指南 https://www.vibemarketing.work/agent-install/skill-newsletter-signup.md

FURTHER READING

邮件订阅表单 Skill 相关的实操文章

别人做同类任务时踩过的坑和总结，动手前后都值得翻一下。

别急着堆提示词：先用提示词库生成能直接交付的客户方案

一页看懂提示词库。包含适用场景、最小输入和生成能直接交付的客户方案的示例。

  • 工具评测
  • 入门
  • AI Agent
  • 提示词库

销售团队要不要装 Excel Analyst？5分钟判断

围绕AI视频近期变化，测试表格分析在研究、生成和分发三个环节的表现。内容保留失败样本与调整记录，方便团队判断它能否降低机械感。

  • 工具评测
  • 可复制
  • 销售团队
  • 邮件

热点雷达提示词：从搜索词反推内容选题，复制后先改这3处

这份参考把 Trend Radar 放进B站生产流程，覆盖输入准备、提示词结构、结果验收和二次修改。适合销售团队快速试跑，也会提醒“标签过多导致召回失真”这一类高频问题。

  • Skill介绍
  • B站
  • 品牌策略
  • 热点观察

工作流编排提示词：把散乱数据做成管理层看板，复制后先改这3处

一页看懂工作流编排。包含适用场景、最小输入和把散乱数据做成管理层看板的示例。

  • 工作流
  • 电商运营
  • 品牌知识库
  • 内容创作

一次讲透去AI味：输入什么、输出什么、怎样提高引用率

为独立开发者准备的去AI味速查卡，适合第一次接触时直接照着走。重点放在提高引用率，不要求预先搭建复杂系统。

  • 故障排查
  • 飞书
  • 内容创作
  • 去AI味

网页原型极简用法｜批量发现用户真正会搜的问题

给出网页原型的最短操作路径，用一个真实感示例演示如何批量发现用户真正会搜的问题，并标出能减少返工的关键设置。

  • Skill教程
  • 零点击搜索
  • 内容编辑
  • 批量生产

以上文章正在编辑中，上线后可直接点击阅读。即将上线，敬请期待。

搭配使用

按这个 Skill 的产出能不能直接被下一个 Skill 用上来推荐，不是固定名单。多数情况下按顺序跑完一组，比单独用一个效果更好。

海外广告投放#02

原生广告策划 Skill

把产品卖点转化为 Taboola 和 Outbrain 的原生广告创意方案，包含 3 组标题、配图和落地页建议。

来源项目热度 同步中
内容与创意#06

专家评审 Skill

自动组建 7 到 10 人的虚拟专家团队，对文案、落地页或营销方案进行打分并提出修改建议，直到评分达到 90 分。

来源项目热度 同步中
  • 01

    高转化营销文案 Skill

    这个 Skill 产出的positioning、copy、landing_page，正好是它需要的输入，可以直接接着跑

  • 02

    原生广告策划 Skill

    这个 Skill 产出的positioning、copy、landing_page，正好是它需要的输入，可以直接接着跑

  • 03

    营销动作效果验证 Skill

    这个 Skill 产出的copy、landing_page，正好是它需要的输入，可以直接接着跑

  • 04

    冷启动获客 Skill

    这个 Skill 产出的positioning、landing_page，正好是它需要的输入，可以直接接着跑

  • 05

    海外社区论坛推广 Skill

    这个 Skill 产出的copy、landing_page，正好是它需要的输入，可以直接接着跑

  • 06

    专家评审 Skill

    这个 Skill 产出的copy、landing_page，正好是它需要的输入，可以直接接着跑

VibeMKT COMMUNITY

加入 VibeMKT 社群

微信扫码，交流营销 Skill 的选择、安装、试用与业务化改造。

加入 VibeMKT 社群的微信二维码

二维码会持续显示，关闭弹窗后返回当前页面。