[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"similar-ParthJadhav--app-store-screenshots":3,"tool-ParthJadhav--app-store-screenshots":62},[4,18,26,36,46,54],{"id":5,"name":6,"github_repo":7,"description_zh":8,"stars":9,"difficulty_score":10,"last_commit_at":11,"category_tags":12,"status":17},4358,"openclaw","openclaw\u002Fopenclaw","OpenClaw 是一款专为个人打造的本地化 AI 助手，旨在让你在自己的设备上拥有完全可控的智能伙伴。它打破了传统 AI 助手局限于特定网页或应用的束缚，能够直接接入你日常使用的各类通讯渠道，包括微信、WhatsApp、Telegram、Discord、iMessage 等数十种平台。无论你在哪个聊天软件中发送消息，OpenClaw 都能即时响应，甚至支持在 macOS、iOS 和 Android 设备上进行语音交互，并提供实时的画布渲染功能供你操控。\n\n这款工具主要解决了用户对数据隐私、响应速度以及“始终在线”体验的需求。通过将 AI 部署在本地，用户无需依赖云端服务即可享受快速、私密的智能辅助，真正实现了“你的数据，你做主”。其独特的技术亮点在于强大的网关架构，将控制平面与核心助手分离，确保跨平台通信的流畅性与扩展性。\n\nOpenClaw 非常适合希望构建个性化工作流的技术爱好者、开发者，以及注重隐私保护且不愿被单一生态绑定的普通用户。只要具备基础的终端操作能力（支持 macOS、Linux 及 Windows WSL2），即可通过简单的命令行引导完成部署。如果你渴望拥有一个懂你",349277,3,"2026-04-06T06:32:30",[13,14,15,16],"Agent","开发框架","图像","数据工具","ready",{"id":19,"name":20,"github_repo":21,"description_zh":22,"stars":23,"difficulty_score":10,"last_commit_at":24,"category_tags":25,"status":17},3808,"stable-diffusion-webui","AUTOMATIC1111\u002Fstable-diffusion-webui","stable-diffusion-webui 是一个基于 Gradio 构建的网页版操作界面，旨在让用户能够轻松地在本地运行和使用强大的 Stable Diffusion 图像生成模型。它解决了原始模型依赖命令行、操作门槛高且功能分散的痛点，将复杂的 AI 绘图流程整合进一个直观易用的图形化平台。\n\n无论是希望快速上手的普通创作者、需要精细控制画面细节的设计师，还是想要深入探索模型潜力的开发者与研究人员，都能从中获益。其核心亮点在于极高的功能丰富度：不仅支持文生图、图生图、局部重绘（Inpainting）和外绘（Outpainting）等基础模式，还独创了注意力机制调整、提示词矩阵、负向提示词以及“高清修复”等高级功能。此外，它内置了 GFPGAN 和 CodeFormer 等人脸修复工具，支持多种神经网络放大算法，并允许用户通过插件系统无限扩展能力。即使是显存有限的设备，stable-diffusion-webui 也提供了相应的优化选项，让高质量的 AI 艺术创作变得触手可及。",162132,"2026-04-05T11:01:52",[14,15,13],{"id":27,"name":28,"github_repo":29,"description_zh":30,"stars":31,"difficulty_score":32,"last_commit_at":33,"category_tags":34,"status":17},1381,"everything-claude-code","affaan-m\u002Feverything-claude-code","everything-claude-code 是一套专为 AI 编程助手（如 Claude Code、Codex、Cursor 等）打造的高性能优化系统。它不仅仅是一组配置文件，而是一个经过长期实战打磨的完整框架，旨在解决 AI 代理在实际开发中面临的效率低下、记忆丢失、安全隐患及缺乏持续学习能力等核心痛点。\n\n通过引入技能模块化、直觉增强、记忆持久化机制以及内置的安全扫描功能，everything-claude-code 能显著提升 AI 在复杂任务中的表现，帮助开发者构建更稳定、更智能的生产级 AI 代理。其独特的“研究优先”开发理念和针对 Token 消耗的优化策略，使得模型响应更快、成本更低，同时有效防御潜在的攻击向量。\n\n这套工具特别适合软件开发者、AI 研究人员以及希望深度定制 AI 工作流的技术团队使用。无论您是在构建大型代码库，还是需要 AI 协助进行安全审计与自动化测试，everything-claude-code 都能提供强大的底层支持。作为一个曾荣获 Anthropic 黑客大奖的开源项目，它融合了多语言支持与丰富的实战钩子（hooks），让 AI 真正成长为懂上",160015,2,"2026-04-18T11:30:52",[14,13,35],"语言模型",{"id":37,"name":38,"github_repo":39,"description_zh":40,"stars":41,"difficulty_score":42,"last_commit_at":43,"category_tags":44,"status":17},8272,"opencode","anomalyco\u002Fopencode","OpenCode 是一款开源的 AI 编程助手（Coding Agent），旨在像一位智能搭档一样融入您的开发流程。它不仅仅是一个代码补全插件，而是一个能够理解项目上下文、自主规划任务并执行复杂编码操作的智能体。无论是生成全新功能、重构现有代码，还是排查难以定位的 Bug，OpenCode 都能通过自然语言交互高效完成，显著减少开发者在重复性劳动和上下文切换上的时间消耗。\n\n这款工具专为软件开发者、工程师及技术研究人员设计，特别适合希望利用大模型能力来提升编码效率、加速原型开发或处理遗留代码维护的专业人群。其核心亮点在于完全开源的架构，这意味着用户可以审查代码逻辑、自定义行为策略，甚至私有化部署以保障数据安全，彻底打破了传统闭源 AI 助手的“黑盒”限制。\n\n在技术体验上，OpenCode 提供了灵活的终端界面（Terminal UI）和正在测试中的桌面应用程序，支持 macOS、Windows 及 Linux 全平台。它兼容多种包管理工具，安装便捷，并能无缝集成到现有的开发环境中。无论您是追求极致控制权的资深极客，还是渴望提升产出的独立开发者，OpenCode 都提供了一个透明、可信",144296,1,"2026-04-16T14:50:03",[13,45],"插件",{"id":47,"name":48,"github_repo":49,"description_zh":50,"stars":51,"difficulty_score":32,"last_commit_at":52,"category_tags":53,"status":17},2271,"ComfyUI","Comfy-Org\u002FComfyUI","ComfyUI 是一款功能强大且高度模块化的视觉 AI 引擎，专为设计和执行复杂的 Stable Diffusion 图像生成流程而打造。它摒弃了传统的代码编写模式，采用直观的节点式流程图界面，让用户通过连接不同的功能模块即可构建个性化的生成管线。\n\n这一设计巧妙解决了高级 AI 绘图工作流配置复杂、灵活性不足的痛点。用户无需具备编程背景，也能自由组合模型、调整参数并实时预览效果，轻松实现从基础文生图到多步骤高清修复等各类复杂任务。ComfyUI 拥有极佳的兼容性，不仅支持 Windows、macOS 和 Linux 全平台，还广泛适配 NVIDIA、AMD、Intel 及苹果 Silicon 等多种硬件架构，并率先支持 SDXL、Flux、SD3 等前沿模型。\n\n无论是希望深入探索算法潜力的研究人员和开发者，还是追求极致创作自由度的设计师与资深 AI 绘画爱好者，ComfyUI 都能提供强大的支持。其独特的模块化架构允许社区不断扩展新功能，使其成为当前最灵活、生态最丰富的开源扩散模型工具之一，帮助用户将创意高效转化为现实。",109154,"2026-04-18T11:18:24",[14,15,13],{"id":55,"name":56,"github_repo":57,"description_zh":58,"stars":59,"difficulty_score":32,"last_commit_at":60,"category_tags":61,"status":17},6121,"gemini-cli","google-gemini\u002Fgemini-cli","gemini-cli 是一款由谷歌推出的开源 AI 命令行工具，它将强大的 Gemini 大模型能力直接集成到用户的终端环境中。对于习惯在命令行工作的开发者而言，它提供了一条从输入提示词到获取模型响应的最短路径，无需切换窗口即可享受智能辅助。\n\n这款工具主要解决了开发过程中频繁上下文切换的痛点，让用户能在熟悉的终端界面内直接完成代码理解、生成、调试以及自动化运维任务。无论是查询大型代码库、根据草图生成应用，还是执行复杂的 Git 操作，gemini-cli 都能通过自然语言指令高效处理。\n\n它特别适合广大软件工程师、DevOps 人员及技术研究人员使用。其核心亮点包括支持高达 100 万 token 的超长上下文窗口，具备出色的逻辑推理能力；内置 Google 搜索、文件操作及 Shell 命令执行等实用工具；更独特的是，它支持 MCP（模型上下文协议），允许用户灵活扩展自定义集成，连接如图像生成等外部能力。此外，个人谷歌账号即可享受免费的额度支持，且项目基于 Apache 2.0 协议完全开源，是提升终端工作效率的理想助手。",100752,"2026-04-10T01:20:03",[45,13,15,14],{"id":63,"github_repo":64,"name":65,"description_en":66,"description_zh":67,"ai_summary_zh":67,"readme_en":68,"readme_zh":69,"quickstart_zh":70,"use_case_zh":71,"hero_image_url":72,"owner_login":73,"owner_name":74,"owner_avatar_url":75,"owner_bio":76,"owner_company":77,"owner_location":78,"owner_email":79,"owner_twitter":80,"owner_website":81,"owner_url":82,"languages":79,"stars":83,"forks":84,"last_commit_at":85,"license":86,"difficulty_score":32,"env_os":87,"env_gpu":88,"env_ram":88,"env_deps":89,"category_tags":98,"github_topics":99,"view_count":32,"oss_zip_url":79,"oss_zip_packed_at":79,"status":17,"created_at":117,"updated_at":118,"faqs":119,"releases":120},9257,"ParthJadhav\u002Fapp-store-screenshots","app-store-screenshots","end to end app store screenshot creation using AI","app-store-screenshots 是一款专为移动应用开发者设计的 AI 辅助工具，旨在自动化生成符合苹果 App Store 和谷歌 Google Play 商店规范的应用宣传截图。它解决了开发者在应用上架过程中面临的痛点：手动设计多尺寸截图耗时费力，且难以兼顾营销文案的吸引力与不同设备的适配要求。\n\n该工具通过与 AI 编程助手（如 Claude Code、Cursor 等）集成，能够根据用户提供的品牌风格、功能亮点及偏好，自动搭建 Next.js 项目并生成“广告级”而非单纯\"UI 展示级”的截图。其核心亮点在于内置了专业的应用商店文案写作模式，能自动生成极具吸引力的宣传语；同时支持一键导出涵盖 iOS、Android 手机及平板（横竖屏）等所有官方要求的分辨率素材。此外，它还具备独特的纯 CSS 渲染 Android 设备框架技术，无需额外图片资源，并支持多语言本地化及 RTL（从右向左）布局，极大提升了全球化应用的适配效率。无论是独立开发者还是专业设计团队，都能利用 app-store-screenshots 快速产出高质量的上架素材，显著缩短应用发布周期。","[![bloom-banner-01-light-tags-1500x500](https:\u002F\u002Foss.gittoolsai.com\u002Fimages\u002FParthJadhav_app-store-screenshots_readme_dc01b7e1d905.png)](https:\u002F\u002Fbloom.parthjadhav.com)\n\n### NOTE: MAKE SURE TO USE 6.1 INCH simulator to capture starting screenshots\nthis will save u from adjusting the images later\n\n# App Store & Google Play Screenshots Generator\n\nA skill for AI-powered coding agents (Claude Code, Cursor, Windsurf, etc.) that generates production-ready **App Store and Google Play** screenshots for iOS and Android apps. It scaffolds a Next.js project, designs advertisement-style screenshots, and exports them at all required Apple and Google resolutions.\n#### Screenshots & App approved by Apple - https:\u002F\u002Fapps.apple.com\u002Fus\u002Fapp\u002Fbloom-coffee-shelf-recipe\u002Fid6759914524\n![Example output — Bloom coffee tracking app](https:\u002F\u002Foss.gittoolsai.com\u002Fimages\u002FParthJadhav_app-store-screenshots_readme_83249cf4e22d.png)\n\n## What it does\n\n- Asks you about your app's brand, features, and style preferences\n- Scaffolds a minimal Next.js project (or works within an existing one)\n- Designs each screenshot as an **advertisement** — not a UI showcase\n- Writes compelling copy using proven App Store \u002F Play Store copywriting patterns\n- Renders screenshots at full resolution with a built-in iPhone mockup and CSS-based Android device frames\n- Exports PNGs at all required sizes for **both stores**\n- Supports **Android Phone, 7\" Tablet, 10\" Tablet** (portrait + landscape) and **Feature Graphic** (1024×500)\n- Supports locale-based screenshot sets and localized copy\n- Supports reusable theme presets so you can swap art direction quickly\n- Supports RTL-aware layouts and bulk export across locale\u002Fdevice\u002Ftheme combinations\n\n## Included assets\n\n- `mockup.png` — Pre-measured iPhone frame with transparent screen area\n- Android device frames are rendered with **CSS only** — no additional mockup PNGs needed\n\n## Install\n\n### Using npx skills (recommended)\n\n```bash\nnpx skills add ParthJadhav\u002Fapp-store-screenshots\n```\n\nThis works with Claude Code, Cursor, Windsurf, OpenCode, Codex, and [40+ other agents](https:\u002F\u002Fgithub.com\u002Fvercel-labs\u002Fskills#available-agents).\n\nInstall globally (available across all projects):\n\n```bash\nnpx skills add ParthJadhav\u002Fapp-store-screenshots -g\n```\n\nInstall for a specific agent:\n\n```bash\nnpx skills add ParthJadhav\u002Fapp-store-screenshots -a claude-code\n```\n\n### Manual (git clone)\n\n```bash\ngit clone https:\u002F\u002Fgithub.com\u002FParthJadhav\u002Fapp-store-screenshots ~\u002F.claude\u002Fskills\u002Fapp-store-screenshots\n```\n\n## Usage\n\nOnce installed, the skill triggers automatically when you ask Claude Code to:\n\n- Build App Store or Google Play screenshots\n- Generate marketing screenshots for an iOS or Android app\n- Create exportable screenshot assets for both stores\n\nOr just tell Claude Code what you need:\n\n```\n> Build App Store and Google Play screenshots for my app\n```\n\nClaude will ask you about your app's screenshots, brand colors, font, features, style direction, and number of slides before building anything.\n\n## Example prompts\n\nThese are good starting prompts because they provide product context while still leaving room for the skill to guide the design process.\n\n### Habit tracker\n\n```text\nBuild App Store screenshots for my habit tracker.\nThe app helps people stay consistent with simple daily routines.\nI want 6 slides, clean\u002Fminimal style, warm neutrals, and a calm premium feel.\n```\n\n### Finance app\n\n```text\nGenerate App Store screenshots for my personal finance app.\nThe app's main strengths are fast expense capture, clear monthly trends, and shared budgets.\nI want a sharp, modern style with high contrast and 7 slides.\n```\n\n### AI productivity tool\n\n```text\nCreate exportable App Store screenshots for my AI note-taking app.\nThe core value is turning messy voice notes into clean summaries and action items.\nI want bold copy, dark backgrounds, and a polished tech-forward look.\n```\n\n### Wellness app\n\n```text\nBuild marketing screenshots for my meditation app.\nThe app focuses on sleep, stress relief, and short guided sessions.\nUse a soft, warm, organic style and prioritize emotional outcomes over feature lists.\n```\n\n### Multi-language \u002F multi-theme\n\n```text\nBuild App Store screenshots for my language learning app.\nI need English, German, and Arabic screenshot sets.\nUse two reusable themes: clean-light and dark-bold.\nMake sure Arabic slides feel RTL-native, not just translated.\n```\n\n## Better prompt tips\n\n- say what the app does in one sentence\n- list the top 3-5 features in priority order\n- describe the visual style you want\n- mention how many slides you need\n- mention if you need multiple languages or RTL locales\n- mention if you want one art direction or reusable theme presets\n- provide references if you want the output to match a certain App Store style\n\n## What gets scaffolded\n\nIf starting from an empty folder, the skill creates:\n\n```\nproject\u002F\n├── public\u002F\n│   ├── mockup.png          # iPhone frame (copied from skill)\n│   ├── app-icon.png        # Your app icon\n│   ├── screenshots\u002F        # iOS screenshots (locale folders optional)\n│   │   └── android\u002F        # Android screenshots (when targeting both)\n│   └── screenshots-ipad\u002F   # Optional iPad screenshots\n├── src\u002Fapp\u002F\n│   ├── layout.tsx          # Font setup\n│   └── page.tsx            # Screenshot generator (single file)\n├── package.json\n└── ...\n```\n\nWhen targeting both stores, the skill uses a platform-based folder structure to keep iOS and Android screenshots separated.\n\nThe entire generator is a **single `page.tsx` file**. Run the dev server, open the browser, click any screenshot to export it as a PNG.\n\nThe latest version of the skill also guides the agent to generate:\n\n- locale tabs and locale-specific screenshot folders\n- reusable theme presets backed by design tokens\n- RTL-aware layouts for languages like Arabic and Hebrew\n- bulk export flows for locale\u002Fdevice\u002Ftheme combinations\n\n## Export sizes\n\n### Apple App Store\n\n| Display | Resolution |\n|---------|-----------|\n| 6.9\" | 1320 x 2868 |\n| 6.5\" | 1284 x 2778 |\n| 6.3\" | 1206 x 2622 |\n| 6.1\" | 1125 x 2436 |\n\n### Google Play Store\n\n| Device | Resolution |\n|--------|-----------|\n| Phone (portrait) | 1080 x 1920 |\n| 7\" Tablet (portrait) | 1200 x 1920 |\n| 7\" Tablet (landscape) | 1920 x 1200 |\n| 10\" Tablet (portrait) | 1600 x 2560 |\n| 10\" Tablet (landscape) | 2560 x 1600 |\n| Feature Graphic | 1024 x 500 |\n\nScreenshots are designed at the largest size per platform and scaled down for smaller sizes. Android device frames are CSS-rendered.\n\n## Advanced capabilities\n\n### Multi-language screenshots\n\nThe skill can generate screenshot systems for multiple locales by nesting images under locale folders such as:\n\n```text\npublic\u002Fscreenshots\u002Fen\u002Fhome.png\npublic\u002Fscreenshots\u002Fde\u002Fhome.png\npublic\u002Fscreenshots\u002Far\u002Fhome.png\n```\n\nThe generated page keeps slide structure the same and swaps only the locale base path and copy dictionary.\n\n### Theme presets\n\nInstead of hardcoding one art direction, the skill now encourages a token-driven preset system, for example:\n\n```ts\nconst THEMES = {\n  \"clean-light\": { bg: \"#F6F1EA\", fg: \"#171717\", accent: \"#5B7CFA\" },\n  \"dark-bold\": { bg: \"#0B1020\", fg: \"#F8FAFC\", accent: \"#8B5CF6\" },\n  \"warm-editorial\": { bg: \"#F7E8DA\", fg: \"#2B1D17\", accent: \"#D97706\" },\n} as const;\n```\n\nThis lets you reuse the same slide system while testing different visual directions fast.\n\n### RTL-aware design\n\nFor RTL locales such as Arabic and Hebrew, the skill now tells the agent to:\n\n- set `dir=\"rtl\"` on the screenshot canvas\n- rewrite line breaks for the target language\n- mirror asymmetric layouts intentionally\n- keep the composition feeling native instead of mechanically flipped\n\n### Bulk export matrix\n\nThe generator is now expected to support exporting not only the current slide, but also:\n\n- all slides for the current locale\u002Fdevice\u002Ftheme\n- all locales for the current theme\n- full locale + device + theme matrices when needed\n\n## Tech stack\n\n| Dependency | Purpose |\n|-----------|---------|\n| Next.js | Dev server + static image serving |\n| TypeScript | Type safety |\n| Tailwind CSS | Styling |\n| html-to-image | PNG export at exact resolutions |\n| React | Component composition |\n\n## Key design principles\n\n- **Screenshots are ads, not docs** — each slide sells one idea\n- **Copy follows the \"one second\" rule** — readable at thumbnail size in the App Store\n- **Layouts vary** — no two adjacent slides share the same phone placement\n- **Style is user-driven** — no hardcoded colors, gradients, or fonts\n\n## Quality Checklist\n\nBefore exporting, each slide should pass this quick review:\n\n- the headline communicates one idea in about one second\n- the first slide sells the strongest user benefit\n- adjacent slides do not reuse the same layout\n- decorative elements support the message instead of blocking the UI\n- text, screenshots, and framing still look correct after export sizing\n\n## Requirements\n\n- Node.js 18+\n- One of: bun, pnpm, yarn, or npm (detected automatically, bun preferred)\n\n## Contributing\n\nContributions are welcome, especially around:\n\n- screenshot generation reliability\n- skill prompt quality\n- clearer docs and onboarding\n- cross-agent compatibility\n\nIf you want to contribute, start with `CONTRIBUTING.md`. Bug reports and feature requests also have issue templates now to make reproduction and review easier.\n\n## License\n\nMIT","[![bloom-banner-01-light-tags-1500x500](https:\u002F\u002Foss.gittoolsai.com\u002Fimages\u002FParthJadhav_app-store-screenshots_readme_dc01b7e1d905.png)](https:\u002F\u002Fbloom.parthjadhav.com)\n\n### 注意：请务必使用 6.1 英寸模拟器来截取初始屏幕截图\n这样可以省去后续调整图片的麻烦\n\n# App Store 和 Google Play 屏幕截图生成器\n\n这是一项专为 AI 驱动的编码助手（Claude Code、Cursor、Windsurf 等）设计的技能，能够为 iOS 和 Android 应用程序生成生产就绪的 **App Store 和 Google Play** 屏幕截图。它会搭建一个 Next.js 项目，设计广告风格的截图，并以 Apple 和 Google 所需的所有分辨率导出这些截图。\n#### 截图及应用已获 Apple 审核通过 - https:\u002F\u002Fapps.apple.com\u002Fus\u002Fapp\u002Fbloom-coffee-shelf-recipe\u002Fid6759914524\n![示例输出 — Bloom 咖啡追踪应用](https:\u002F\u002Foss.gittoolsai.com\u002Fimages\u002FParthJadhav_app-store-screenshots_readme_83249cf4e22d.png)\n\n## 功能简介\n\n- 询问您的应用品牌、功能和风格偏好\n- 搭建一个最小化的 Next.js 项目（或在现有项目中运行）\n- 将每张截图设计成 **广告形式**，而非单纯的 UI 展示\n- 使用经过验证的 App Store \u002F Play Store 文案模式撰写吸引人的文案\n- 利用内置的 iPhone 模拟器和基于 CSS 的 Android 设备框架，以完整分辨率渲染截图\n- 导出适用于 **两家商店** 的所有所需尺寸的 PNG 文件\n- 支持 **Android 手机、7 英寸平板、10 英寸平板**（竖屏 + 横屏）以及 **特色图形**（1024×500）\n- 支持基于本地化的截图集和本地化文案\n- 支持可复用的主题预设，方便快速切换视觉方向\n- 支持 RTL 方向布局，并可批量导出不同语言\u002F设备\u002F主题组合的截图\n\n## 包含资源\n\n- `mockup.png` — 已预先测量好的 iPhone 框架，带有透明屏幕区域\n- Android 设备框架完全由 **CSS 渲染**，无需额外的模拟器 PNG 图像\n\n## 安装方法\n\n### 使用 npx skills（推荐）\n\n```bash\nnpx skills add ParthJadhav\u002Fapp-store-screenshots\n```\n\n此方法适用于 Claude Code、Cursor、Windsurf、OpenCode、Codex 以及其他 [40 多种助手](https:\u002F\u002Fgithub.com\u002Fvercel-labs\u002Fskills#available-agents)。\n\n全局安装（可在所有项目中使用）：\n\n```bash\nnpx skills add ParthJadhav\u002Fapp-store-screenshots -g\n```\n\n为特定助手安装：\n\n```bash\nnpx skills add ParthJadhav\u002Fapp-store-screenshots -a claude-code\n```\n\n### 手动安装（git 克隆）\n\n```bash\ngit clone https:\u002F\u002Fgithub.com\u002FParthJadhav\u002Fapp-store-screenshots ~\u002F.claude\u002Fskills\u002Fapp-store-screenshots\n```\n\n## 使用方法\n\n安装完成后，当您要求 Claude Code 执行以下操作时，该技能将自动触发：\n\n- 构建 App Store 或 Google Play 屏幕截图\n- 为 iOS 或 Android 应用程序生成营销截图\n- 创建可用于两家商店的可导出截图资产\n\n或者直接告诉 Claude Code 您的需求：\n\n```\n> 为我的应用构建 App Store 和 Google Play 屏幕截图\n```\n\nClaude 会先询问您关于应用截图、品牌色、字体、功能、风格方向以及幻灯片数量等信息，然后再开始制作。\n\n## 示例提示语\n\n以下是一些不错的起始提示，它们既提供了产品背景信息，又留有空间让技能引导设计流程。\n\n### 习惯追踪应用\n\n```text\n为我的习惯追踪应用构建 App Store 截图。\n这款应用帮助用户坚持简单的日常习惯。\n我想要 6 张幻灯片，干净简约的风格，暖色调中性色，营造宁静高端的感觉。\n```\n\n### 财务管理应用\n\n```text\n为我的个人财务管理应用生成 App Store 截图。\n该应用的主要优势在于快速记录支出、清晰展示月度趋势以及共享预算功能。\n我希望采用鲜明现代的风格，高对比度，共 7 张幻灯片。\n```\n\n### AI 生产力工具\n\n```text\n为我的 AI 笔记应用创建可导出的 App Store 截图。\n其核心价值是将杂乱的语音笔记转化为简洁的摘要和待办事项。\n我想要大胆的文案、深色背景，以及精致前卫的科技感外观。\n```\n\n### 健康类应用\n\n```text\n为我的冥想应用构建营销截图。\n该应用专注于睡眠、缓解压力和短时引导练习。\n请采用柔和温暖的有机风格，优先考虑情感效果而非功能列表。\n```\n\n### 多语言\u002F多主题应用\n\n```text\n为我的语言学习应用构建 App Store 截图。\n我需要英语、德语和阿拉伯语三种语言版本的截图。\n使用两种可复用的主题：简洁浅色和深色大胆风格。\n确保阿拉伯语版本的截图具有原生 RTL 感觉，而不仅仅是翻译过来的。\n```\n\n## 更好提示语的技巧\n\n- 用一句话说明应用的功能\n- 按优先级列出 3–5 个主要功能\n- 描述您想要的视觉风格\n- 提及所需的幻灯片数量\n- 是否需要多语言支持或 RTL 本地化\n- 是否希望统一视觉方向或使用可复用的主题预设\n- 如果希望输出符合特定 App Store 风格，请提供参考\n\n## 自动搭建的内容\n\n如果从空文件夹开始，该技能会创建如下目录结构：\n\n```\nproject\u002F\n├── public\u002F\n│   ├── mockup.png          # iPhone 框架（从技能中复制而来）\n│   ├── app-icon.png        # 您的应用图标\n│   ├── screenshots\u002F        # iOS 截图（可选本地化子文件夹）\n│   │   └── android\u002F        # Android 截图（当同时针对两个平台时）\n│   └── screenshots-ipad\u002F   # 可选的 iPad 截图\n├── src\u002Fapp\u002F\n│   ├── layout.tsx          # 字体设置\n│   └── page.tsx            # 截图生成器（单个文件）\n├── package.json\n└── ...\n```\n\n当同时针对两家商店时，技能会使用基于平台的文件夹结构，将 iOS 和 Android 截图分开存放。\n\n整个生成器仅包含一个 **single `page.tsx` 文件**。启动开发服务器后，打开浏览器，点击任意一张截图即可将其导出为 PNG 格式。\n\n最新版本的技能还能够引导助手完成以下任务：\n\n- 生成本地化标签页和特定于本地化的截图文件夹\n- 基于设计令牌的可复用主题预设\n- 针对阿拉伯语、希伯来语等语言的 RTL 方向布局\n- 支持按本地化\u002F设备\u002F主题组合进行批量导出\n\n## 导出尺寸\n\n### Apple App Store\n\n| 显示屏 | 分辨率 |\n|---------|-------|\n| 6.9\" | 1320 x 2868 |\n| 6.5\" | 1284 x 2778 |\n| 6.3\" | 1206 x 2622 |\n| 6.1\" | 1125 x 2436 |\n\n### Google Play 商店\n\n| 设备 | 分辨率 |\n|------|-------|\n| 手机（竖屏） | 1080 x 1920 |\n| 7 英寸平板（竖屏） | 1200 x 1920 |\n| 7 英寸平板（横屏） | 1920 x 1200 |\n| 10 英寸平板（竖屏） | 1600 x 2560 |\n| 10 英寸平板（横屏） | 2560 x 1600 |\n| 特色图形 | 1024 x 500 |\n\n截图会以各平台的最大尺寸设计，再缩小到较小的尺寸。Android 设备框架完全由 CSS 渲染。\n\n## 高级功能\n\n### 多语言截图\n\n该技能可以通过在本地化文件夹下嵌套图像来生成多语言版本的截图系统，例如：\n\n```text\npublic\u002Fscreenshots\u002Fen\u002Fhome.png\npublic\u002Fscreenshots\u002Fde\u002Fhome.png\npublic\u002Fscreenshots\u002Far\u002Fhome.png\n```\n\n生成的页面会保持幻灯片结构不变，仅切换本地化基础路径和文案词典。\n\n### 主题预设\n\n技能不再硬编码单一的设计方向，而是采用基于标记的预设系统，例如：\n\n```ts\nconst THEMES = {\n  \"clean-light\": { bg: \"#F6F1EA\", fg: \"#171717\", accent: \"#5B7CFA\" },\n  \"dark-bold\": { bg: \"#0B1020\", fg: \"#F8FAFC\", accent: \"#8B5CF6\" },\n  \"warm-editorial\": { bg: \"#F7E8DA\", fg: \"#2B1D17\", accent: \"#D97706\" },\n} as const;\n```\n\n这样可以在快速测试不同视觉风格的同时，复用相同的幻灯片系统。\n\n### 支持 RTL 的设计\n\n对于阿拉伯语、希伯来语等从右到左书写的语言环境，该技能现在会指示代理执行以下操作：\n\n- 在截图画布上设置 `dir=\"rtl\"`\n- 为目标语言重写换行符\n- 有意镜像非对称布局\n- 确保版面保持原生感，而不是机械地翻转\n\n### 批量导出矩阵\n\n生成器现在不仅支持导出当前幻灯片，还支持以下导出方式：\n\n- 当前语言\u002F设备\u002F主题下的所有幻灯片\n- 当前主题下的所有语言版本\n- 必要时导出完整的语言 × 设备 × 主题矩阵\n\n## 技术栈\n\n| 依赖项       | 用途                     |\n|-------------|--------------------------|\n| Next.js      | 开发服务器 + 静态图片服务 |\n| TypeScript   | 类型安全                 |\n| Tailwind CSS | 样式化                   |\n| html-to-image | 按精确分辨率导出 PNG     |\n| React        | 组件组合                 |\n\n## 核心设计原则\n\n- **截图是广告，而非文档** — 每张幻灯片只传达一个核心理念\n- **文案遵循“一秒法则”** — 在 App Store 的缩略图尺寸下仍可清晰阅读\n- **布局多样化** — 任何相邻的两张幻灯片都不会使用相同的手机摆放位置\n- **风格由用户驱动** — 不使用硬编码的颜色、渐变或字体\n\n## 质量检查清单\n\n在导出之前，每张幻灯片都应通过以下快速审核：\n\n- 标题应在约一秒钟内传达一个明确的理念\n- 第一张幻灯片应突出最强的用户价值\n- 相邻的幻灯片不应重复使用相同的布局\n- 装饰元素应服务于信息传递，而非遮挡界面\n- 文字、截图和构图在导出后仍应保持正确比例\n\n## 系统要求\n\n- Node.js 18 或更高版本\n- 使用 bun、pnpm、yarn 或 npm 中的任意一种包管理工具（自动检测，推荐使用 bun）\n\n## 贡献说明\n\n欢迎各类贡献，尤其关注以下方面：\n\n- 截图生成的可靠性\n- 技能提示的质量\n- 更清晰的文档和入门指南\n- 跨代理兼容性\n\n如需贡献，请先阅读 `CONTRIBUTING.md`。此外，Bug 报告和功能请求现已提供问题模板，以便更轻松地复现和评审。\n\n## 许可证\n\nMIT","# app-store-screenshots 快速上手指南\n\n`app-store-screenshots` 是一个专为 AI 编程助手（如 Claude Code、Cursor、Windsurf 等）设计的技能工具。它能自动搭建 Next.js 项目，生成符合 Apple App Store 和 Google Play 商店要求的高质量营销截图（广告风格），并导出所有必需分辨率的图片。\n\n## 环境准备\n\n在开始之前，请确保您的开发环境满足以下要求：\n\n*   **操作系统**：macOS、Linux 或 Windows (WSL)\n*   **Node.js**：版本 18 或更高\n*   **包管理器**：推荐使用 `bun`，也支持 `pnpm`、`yarn` 或 `npm`（工具会自动检测）\n*   **AI 编程助手**：已安装并配置好 Claude Code、Cursor、Windsurf 或其他支持 Skills 的代理工具\n*   **模拟器建议**：若需截取初始应用界面，请务必使用 **6.1 英寸** 的 iOS 模拟器，以避免后期调整图片尺寸。\n\n## 安装步骤\n\n推荐通过 `npx skills` 命令直接安装，该方式兼容 40+ 种 AI 代理。\n\n### 方式一：全局安装（推荐）\n安装后可在所有项目中通用：\n\n```bash\nnpx skills add ParthJadhav\u002Fapp-store-screenshots -g\n```\n\n### 方式二：为特定代理安装\n仅针对特定工具（如 Claude Code）安装：\n\n```bash\nnpx skills add ParthJadhav\u002Fapp-store-screenshots -a claude-code\n```\n\n### 方式三：手动安装 (Git Clone)\n如果不使用 npx，可手动克隆到本地技能目录：\n\n```bash\ngit clone https:\u002F\u002Fgithub.com\u002FParthJadhav\u002Fapp-store-screenshots ~\u002F.claude\u002Fskills\u002Fapp-store-screenshots\n```\n\n## 基本使用\n\n安装完成后，无需编写复杂代码，只需在您的 AI 编程助手对话框中输入自然语言指令即可触发。\n\n### 1. 触发生成\n在对话中输入类似以下的指令：\n\n```text\nBuild App Store and Google Play screenshots for my app\n```\n\n### 2. 提供关键信息\nAI 会引导您确认以下细节，您也可以直接在初始指令中提供以加快流程：\n*   **应用功能**：一句话描述应用是做什么的。\n*   **核心卖点**：列出 3-5 个主要功能。\n*   **视觉风格**：描述想要的风格（如：极简、现代、温暖、深色模式等）。\n*   **截图数量**：需要生成的幻灯片数量（通常 5-8 张）。\n*   **多语言\u002FRTL**：是否需要多语言版本或右向左（如阿拉伯语）布局。\n\n### 3. 使用示例提示词\n\n**示例 A：习惯养成类应用**\n```text\nBuild App Store screenshots for my habit tracker.\nThe app helps people stay consistent with simple daily routines.\nI want 6 slides, clean\u002Fminimal style, warm neutrals, and a calm premium feel.\n```\n\n**示例 B：多语言与多主题**\n```text\nBuild App Store screenshots for my language learning app.\nI need English, German, and Arabic screenshot sets.\nUse two reusable themes: clean-light and dark-bold.\nMake sure Arabic slides feel RTL-native, not just translated.\n```\n\n### 4. 预览与导出\n工具会自动 scaffold 一个最小化的 Next.js 项目：\n1.  运行开发服务器（通常由 AI 自动执行 `npm run dev` 或 `bun run dev`）。\n2.  在浏览器中打开生成的页面。\n3.  页面上会展示所有设计好的截图，**点击任意截图**即可将其作为高分辨率 PNG 文件导出。\n\n生成的文件结构将包含所有平台所需的尺寸（iOS 多种屏幕比例、Android 手机\u002F平板横竖屏及 Feature Graphic），并自动处理多语言文件夹结构。","某独立开发者刚完成一款名为“专注森林”的 iOS 习惯养成应用开发，急需在周末前向 App Store 提交一套高质量的营销截图以配合新品上线。\n\n### 没有 app-store-screenshots 时\n- **设计耗时极长**：需要手动打开 Figma 或 Photoshop，逐个寻找并调整不同 iPhone 型号的机模素材，仅适配尺寸就耗费半天时间。\n- **文案缺乏转化力**：开发者往往直接截取 UI 界面作为图片，缺乏吸引人的营销标题和痛点描述，导致用户下载意愿低。\n- **多尺寸适配痛苦**：面对苹果要求的 6.5 寸、5.5 寸等多种分辨率，手动导出极易出错，常因尺寸偏差被审核驳回或显示模糊。\n- **风格难以统一**：在没有专业设计师协助下，很难保证整套截图在色调、字体和视觉风格上保持高度一致的品牌感。\n\n### 使用 app-store-screenshots 后\n- **一键生成广告级素材**：只需告诉 AI 应用的核心功能和“温暖极简”的风格偏好，工具自动搭建 Next.js 项目并设计出具有广告吸引力的场景图。\n- **智能撰写营销文案**：基于成熟的商店文案模式，自动生成强调“告别拖延”、“建立微习惯”等直击用户痛点的标题，而非枯燥的功能罗列。\n- **全自动多端适配**：内置精确的 iPhone 机模和 CSS 安卓框架，一次性渲染并导出所有苹果及谷歌商店要求的特定分辨率 PNG，无需人工干预。\n- **品牌风格快速迭代**：通过预设主题即可瞬间切换整套截图的配色与艺术方向，轻松实现专业级的视觉统一性。\n\napp-store-screenshots 将原本需要数天协作的设计工作压缩为几分钟的对话，让开发者能像拥有专属设计团队一样高效发布应用。","https:\u002F\u002Foss.gittoolsai.com\u002Fimages\u002FParthJadhav_app-store-screenshots_dc01b7e1.png","ParthJadhav","Parth Jadhav","https:\u002F\u002Foss.gittoolsai.com\u002Favatars\u002FParthJadhav_7cde635a.png","SDE II @Atlassian","Atlassian","Pune, India",null,"ParthJadhav8","https:\u002F\u002Fwww.parthjadhav.com\u002F","https:\u002F\u002Fgithub.com\u002FParthJadhav",4094,272,"2026-04-18T14:14:45","MIT","Linux, macOS, Windows","未说明",{"notes":90,"python":91,"dependencies":92},"需要 Node.js 18+ 版本。包管理器支持 bun（首选）、pnpm、yarn 或 npm。该工具是一个用于 AI 编码代理（如 Claude Code、Cursor 等）的技能插件，通过运行 Next.js 开发服务器在浏览器中生成和导出截图，无需 GPU 加速。","不需要",[93,94,95,96,97],"Next.js","TypeScript","Tailwind CSS","html-to-image","React",[13,15],[100,101,102,103,104,105,106,107,108,109,110,111,112,113,114,115,116],"agentic-ai","apple","appstore","automate","claude","cursor","design","generate","ios","ios-app","marketing","screenshot","skills","skills-sh","swift","swiftui","ui","2026-03-27T02:49:30.150509","2026-04-19T03:06:37.001515",[],[]]