cslawyer1985 法普小象 · 法律责任分析H5生成器
Author: 张卓 (Zhang Zhuo) | Contact: 13122207385 | Version 2.2.0 | © 2026 All Rights Reserved
概述
此技能用于快速生成法律知识类的交互式H5页面。核心流程：元典MCP查判例 → 研究司法解释 → 交叉验证裁判口径 → 构建场景问答 → 判例匹配分析 → 生成朋友圈长图 → CloudBase部署上线。
当前已支持场景：
- 共同饮酒责任分析（
assets/template.html） - 彩礼返还纠纷（
assets/bride-price-template.html） - 被辞退赔偿计算器（
assets/dismiss-compensation-template.html）← v2.1 新增 - 宠物伤人赔偿计算器（
assets/pet-injury-template.html）← v2.2 新增，基于民法典第1245-1251条+17个判例
触发条件
当用户提到以下任意关键词时使用此技能：
- 法普小象、普法H5、责任分析、法律风险测评
- 帮我做一个XXX的法律分析工具
- 朋友圈普法长图、判例查询工具
- 共同饮酒、彩礼纠纷、合同纠纷、侵权责任等法律场景的H5
工作流程
第一步：判例数据收集（想比做重要）
- 使用华宇元典MCP工具检索真实判例：
yuandian_case_vector_search搜索相关判例（至少10个，覆盖不同省份）yuandian_law_vector_search确认适用法条原文
- 研究司法解释：查阅最高法院最新司法解释（如法释〔2024〕1号）
- 交叉验证：最高法典型案例 vs 各地中院裁判口径，确保一致性
- 记录每个判例的：案号、法院、案情摘要、返还比例/赔偿金额、裁判理由
第二步：场景问卷设计（每题必加补充框）
根据判例覆盖的裁判维度，设计5-8个核心问题：
- 登记状态（如领证/未领证）
- 时间因素（如共同生活时长、同居时间）
- 行为要素（如过错方、过错行为）
- 结果要素（如子女情况、金额大小）
- 区分题（如区分日常消费与彩礼）
每个问题必须提供补充输入框，让用户自己描述未覆盖的情况。
第三步：构建分析逻辑（先用真实案例验证）
- 实现评分函数，根据用户选择计算风险等级
- 先用2-3个真实案例跑一遍算法，验证结论是否与法院实际判决一致
- 修正方向：如果评分跟判例矛盾，检查是否逻辑反了（如"登记结婚"是保护因素应减分而非加分）
- 实现
getMatchCases()按风险分类匹配判例（safe类只显示不返还案例，risk类只显示返还案例）
第四步：生成H5页面（永远不用PIL画图）
基于模板构建完整的H5页面，包含：
- 品牌标识: 法普小象🐘 + 版权声明
- 进度引导: 每题答完自动显示进度，引导用户完成全部题目
- 分析输出:
- 案情相似度对比（引用真实判例）
- 参考判例简述（案号+法院+判罚）
- 返还/赔偿比例预判（可视化区间）
- 建议处理方式（分场景操作指南）
- 长图生成: 使用 html2canvas + qrcodejs 生成带品牌头尾+二维码的朋友圈长图
- 弹窗保存: 全屏弹窗展示长图，长按保存，配「复制文案·去发圈」按钮
第五步：生成朋友圈海报（HTML+CSS渲染，不用PIL）
创建 poster.html 海报页：
- 600×600 正方形（朋友圈缩略图完整显示）
- 品牌色 #534AB7 紫底白字
- 二维码居中（qrcodejs生成，不用外部CDN）
- 标题 + 副标题 + 3条卖点 + 引导文字
- 底部「© 张卓 · 法普小象」版权
点「生成图片发朋友圈」→ html2canvas截图→ 弹窗显示→ 长按保存。
第六步：部署到CloudBase
使用 @cloudbase/cli 部署到腾讯云CloudBase静态托管：
tcb hosting deploy . / -e <环境ID>
CloudBase域名（tcloudbaseapp.com）比CloudStudio更适合微信分享。
第七步：生成公众号文章（简洁版，不花哨）
公众号文章只生成简洁版，不带深色CSS科技风背景：
- 内容结构：标题 → 正文 → 引用框 → 截图位
- 直接复制粘贴到公众号后台即可
- 由编辑者手动加粗、引用、插图
- 记录文章SHA256并写入每日存证链
关键设计原则（铁律）
- 先搜后造：动手前先搜 SkillHub / ClawHub / GitHub 有无现成技能
- 快速迭代：第一版像坨屎也要先上线，再慢慢改
- 图片 > 链接：朋友圈里存图发圈的打开率比甩链接高5-10倍
- 一个按钮：每个页面只留一个核心操作按钮，不要给用户选择
- 永远不用PIL画图：设计类图片只用HTML+CSS渲染，PIL画得又丑又浪费时间
- 想比做重要：做之前研究透法律依据+裁判规则，先用真实案例跑一遍算法再上线
- 最少积分成本：每次操作先评估是否有更省积分的路径（复用模板、用现有工具、不做重复工作）
- 每题必须加补充框：选项覆盖不了的情况让用户自己写，这是互动性的核心改进
- 公众号文章只生成简洁版：不带深色CSS，公众号编辑器不支持样式粘贴
已知限制
- 微信H5内长按图片无法识别二维码（需截图后用微信扫一扫）
- 微信对外部链接有「继续访问」安全拦截（不可消除，用二维码长按识别绕过）
- 微信浏览器不支持自动下载触发（走弹窗+长按路线）
- 微信域名tcloudbaseapp.com显示卡片时可能关联到WorkBuddy（无法完全控制，优先用图片传播）
产品矩阵规划
当前已上线：
- 共同饮酒责任分析（Day 1）
- 彩礼返还纠纷（Day 2）
待开发话题：
- 租房押金纠纷
- 网购退货纠纷
- 劳动合同纠纷
- 高空抛物责任
- 宠物伤人纠纷
- 网贷纠纷
版权
© 2026 张卓 (Zhang Zhuo). All Rights Reserved. 此技能产出的所有H5页面、代码和文章内容均包含作者署名。 联系方式：13122207385