1仕組みと動作原理
本スキルは実行可能なプログラムではなく、プレーンテキストのプロンプトテンプレートです。ホストが正規表現で SKILL.md の YAML frontmatter をパースし、本文（body）をプロンプト本体として読み込みます。
next/src/lib/templates/loader.ts
const { fm, body } = parseFrontmatter(raw);
リポジトリのディレクトリ規約に関する説明：「SKILL.md — frontmatter (id, scenario, tags, …) + prompt body」および「Adding a template = adding a folder. No TS code change required」——テンプレートはディレクトリ規約に基づいて登録されます。リポジトリ全体の TS/TSX 内を検索しても "mobile-app" のハードコードされた参照は見当たらず、本テンプレートに対するコード上の特別処理は存在しません。
テンプレート本文は単独で実行されず、最終プロンプトの「テンプレートセグメント」に組み込まれます：共有デザイン指示 + 本テンプレート本文 + ユーザーコンテンツ。
next/src/app/api/convert/route.ts
prompt = assemblePrompt({ body: skill.body, content, format });
shared.ts の assemblePrompt における説明：「Wrap a per-template instruction body with the shared design directives and the user content tail.」；リクエストはまず const skill = loadSkill(templateId); を通じて本ディレクトリの body を取得し、その後に組み立てられます。
グローバルの「コンテンツ主導の数量」ルールはテンプレート内のあらゆる数値を上書きします：テンプレートはレイアウト／スタイル／配色／コンポーネントライブラリのみを定義し、出力の長さは定義しません。
next/src/lib/templates/shared.ts
数量**完全由【用户内容】的实际长度和信息结构决定**
このルールは「最優先事項であり、テンプレート内のあらゆる数値を上書きする」と明記されており、スライド系テンプレートにおける「6〜10枚」のような数値は「短いサンプルの下での参考下限値とみなす」と記載されています。したがって、本テンプレートが提供するのは利用可能なレイアウトと制約であり、ページ数の上限ではありません。
成果物の形式はグローバルで厳密に制約されています：単一ファイル HTML、コードフェンスなしの純粋な HTML、最初の文字は必ず < であること、ファイル書き込みの禁止（フロントエンドが stdout をキャプチャ）。
next/src/lib/templates/shared.ts
不要用 markdown 代码围栏包裹, 不要任何解释性文字
同セクションには「Write / Edit / MultiEdit / Bash / Create / いかなるファイルシステムツールの使用も禁止」と明記されています。ファイルのディスク保存はホスト側のフロントエンドが担当し、テンプレート側でファイル書き込み動作が発生することはありません。
frontmatter のメタデータがセレクターの表示（中国語名／英語名／絵文字／説明／カテゴリ／シナリオ／アスペクト比／タグ／サンプルメタデータ）を制御します。
next/src/lib/templates/loader.ts
zhName: fm.zh_name ?? fm.name ?? id,
本テンプレートのメタデータ：category=mobile、scenario=design、aspect_hint=iPhone 15 Pro frame（featured なし、セレクター内ではおすすめバケットの後に配置）。セレクターは category/scenario でグループ化され、featured でソートされます。すべて frontmatter によって決定され、コード側の特別分岐はありません。
同梱のサンプルアセットは2つの読み取り専用 API を介してフロントエンドに公開されます：example.html はそのまま iframe に返され、example.md は「プレビュー」ボタンの入力コンテンツとして機能します。
next/src/app/api/templates/[id]/preview/route.ts
verbatim so it can be loaded into an
example.html のレスポンスヘッダーは Content-Type: text/html; charset=utf-8 です。別ルートでは content: skill.exampleMd ?? "" としてサンプルテキストをクライアントに渡します。本ディレクトリには example.html（6249 バイト）のみが存在し、example.md はありません。
実行チェーン（本テンプレートのコードではなくホスト側の挙動）：ホストはローカルでログイン済みの agent CLI を spawn し、組み立てたプロンプトを stdin 経由で渡し、stdout から HTML をストリーミングで回収します。
next/src/lib/agents/invoke.ts
child.stdin.write(opts.prompt);
子プロセスは cwd=process.cwd()（cwd: opts.cwd ?? process.cwd(),）で実行され、stdio はすべて pipe されます。プロンプトはシェルの文字列連結ではなく、stdin/--message 経由で渡されます（not interpolated into a shell command）。
テンプレートは1画面のセマンティクス（ステータスバー → ヘッダー → メインコンテンツ → タブバー）のみを固定し、視覚的なスタイルリストは提供しません。スタイルは共有デザイン指示（タイポグラフィ／色彩／グリッド／モーション）によって一元的に制約されます。
next/src/lib/templates/skills/mobile-app/SKILL.md
- App header (标题 / 头像 / 搜索)
poster-hero や ppt-keynote とは異なり、本テンプレートには配色やフォントサイズに関するハード制約がなく、「スタイル型」ではなく「構造型」のテンプレートに分類されます。
出力の長さは本質的に短尺です：1画面 + 4つのレイアウトラインで構成され、共有指示の「コンテンツ主導の数量」ルール（スライド／フレーム／カード／セクションの数を対象とするもの）と競合しません。
next/src/lib/templates/skills/mobile-app/SKILL.md
【意图】一个屏幕的 mobile app 设计, 放在像素级 iPhone 15 Pro frame 里。
1画面テンプレートは「アプリのスクリーンショットが1枚だけ欲しい」という限定的なニーズに適しています。コンテンツ量が多い場合は、mobile-onboarding やプロトタイプ系のテンプレートを選択すべきです。
2コア機能
011画面アプリの情報アーキテクチャの骨格（ステータスバー / アプリヘッダー / メインコンテンツ / 下部タブバーの4層）
02メインコンテンツエリアを単一の明確なアーキタイプに収束させ、「何でも少しずつ詰め込む」状態を防止
03デバイスのリアルさを演出するディテール：Dynamic Island と safe-area の余白を仕様に規定
04ピクセルパーフェクトな iPhone 15 Pro 外枠をシーン設定として採用（1画面、複数画面のストーリー展開は行わない）
3外部依存関係
| Kind | Dependency / Endpoint |
|---|---|
| network | Tailwind Play CDN（共享指令对产物的要求） |
| network | jsdelivr CDN（可选：图表/动画脚本） |
| network | Google Fonts（共享指令指定） |
| cli | 本机 coding-agent CLI（宿主检测 PATH 并 spawn） |
4推奨統制措置と判定根拠
安全運用のための推奨統制措置
Agent 向け
アクセス可能ドメインとキー範囲を宣言
管理者向け
最小権限のキー、リクエストログを保持
判定根拠（ファイルパスと抜粋）
- 网络端点: 外部ネットワークアクセスの宣言：成果物側（共有デザイン指示による要請）：生成された HTML はブラウザ内で cdn.tailwindcss.com（Tailwind Play）および Google F を読み込みます
監査ノート： 判定基準：本スキルのディレクトリ（SKILL.md + example.html）のみを評価対象とし、ホスト側のシェルや成果物の外部リンクは判定に含めません。ディレクトリ内にはスクリプト、ネットワークエンドポイント、認証情報の読み込み、ディスク書き込み命令は一切存在しません。ディレクトリ全体のトークンスキャン（api_key|token|secret|.env|process.env|child_process|fetch(|curl|wget|npm|npx|exec(|subprocess|writeFile|fs.）の結果はヒット件数ゼロです。また、SKILL.md にもランタイムで読み込むべき CDN／フォント／インターフェースの指定はありません（http/CDN/fetch/API の文字列なし）。説明のみを目的とし判定結果を変更しない2点：① ホストシェル（loader.ts → assemblePrompt → agents/invoke.ts によるローカル CLI の spawn。claude の引数には --permission-mode bypassPermissions が含まれ、envFor は {...process.env} で環境変数を透過的に渡す）はホスト側の挙動であり、verdict.risks に記載済みです。② ホストから注入される共有デザイン指示により、成果物の <head> で Tailwind Play / Google Fonts が読み込まれます（成果物の実行時外部リンクに該当）。
5二重目の独立検証
- [ok] skill 目录资产面（脚本 / references / 数据 / 模板） — 目录实为 2 个文件：SKILL.md 与 example.html；无 scripts/、无 references 目录、无任何可执行文件（.sh/.py/.js/.mjs/.ts 零命中）。
- [ok] 「无脚本、无网络、无凭证、无写盘」的反例搜索 — 对目录递归 token 扫描（api[_-]?key|token|secret|\.env|process\.env|child_process|fetch\(|curl |wget |npm |npx |exec\(|subprocess|writeFile|fs\.）：零命中；SKILL.md 另按 http|CDN|cdn|font|API|api|fetch|Google|script 扫描，仅命中 font-semibold / font-black 这类字重类名，无端点。
- [ok] 官方描述 vs 实际能力（有无夸大） — frontmatter description（像素级 iPhone 15 Pro 边框, 一屏 app 截图）与正文一致：描述承诺的版式要素都能在正文找到对应条目，未见正文未支持的越界承诺。
- [ok] 外部资源/工具条目逐条回源 — external_deps 中的仓库级条目（Tailwind Play CDN / jsdelivr / Google Fonts / 本机 agent CLI）逐条回到 shared.ts 与 argv.ts 原文取证；本模板无目录级端点条目。
- [ok] 宿主执行链（供 security.reason / verdict.risks 使用，不参与判级） — prompt 经 stdin 送入被 spawn 的本机 CLI（invoke.ts），HTML 从 stdout 分流捕获；claude 参数含 --permission-mode bypassPermissions、envFor 透传 process.env；预览 iframe sandbox="allow-scripts allow-same-origin"（template-picker.tsx:544 / preview-pane.tsx:297）。
- [ok] 路径与 commit 一致性 — 工作副本 /var/ytdown/skills-portal/spy-repos/html-anything 的 git HEAD = 553ed98c283f9c0f489902d035416a972d6a9699（与任务表 pin 一致）；skill.path=next/src/lib/templates/skills/mobile-app 下确有 SKILL.md，全仓无第二份同名模板。
- [ok] 随包 example.html 的外链与脚本面 — mobile-app/example.html（6249 字节）全文无 http(s) 外链、无 <script>、无 <link>：样式为内联 CSS，属完全自包含的静态预览，预览 iframe 不会因它发起外部请求。
6結論
最適な用途： 「iPhone の1画面アプリのデザインカンプが1枚だけ欲しい」というシナリオに最適：アプリのトップページ／詳細ページの情報アーキテクチャの初案や、非デザイナーの同僚に「この画面がどのような見た目になるか」を見せる用途に向いています。コンテンツ自体が少なく、1画面での表現が中心の場合に最も手軽です。
不向きな用途： ストーリー性や長文コンテンツを必要とする用途（複数画面の遷移フロー、複数ページのスライド、長文ドキュメント）には不向きです。また、指定のブランドカラーやフォント体系が求められるシナリオにも適していません。テンプレートは視覚スタイルを制約しないため、スタイルの一貫性は共有指示およびユーザーコンテンツに含まれるデザイン指定に依存します。
Install Agent-Ready
① Verified Mirror 2026-09-15
Option A · Direct DownloadDownload mobile-app.tar.gz
sha256:
Option B · Copy Guide for Agentf478316a24ed4cc0…Agent はこの JSON ガイドから自動的にダウンロードして検証します。
② Upstream GitHub
GitHub Repo ↗
Pinned to commit 553ed98c28.