跳到正文
cccskills
免费在 GitHub 公开

nano-banana-visual

[OPTIONAL] AI-powered visual generation using Google Nano Banana Pro. For user flows, architecture diagrams, mockups.

中文简介正在准备中。当前显示原文说明。

实测评分 未实测

查看安装方法

包含的文件(3)

  • SKILL.md1.8 KB
  • references/prompt-library.md9.6 KB
  • SKILL.extended.md5.5 KB

SKILL.md(原文)

安装前可以查看交给 AI 代理的指令内容。

Nano Banana Pro Visual Integration

OPTIONAL SKILL - AID works without this. Apply only when a visual artifact is requested (see When to Use); otherwise skip.

Setup

ENABLE_NANO_BANANA=true
NANO_BANANA_PROVIDER=google
GOOGLE_AI_API_KEY=your-key

When to Use

PhaseTriggerOutput
Discovery"Create stakeholder map"Diagram
PRD"Create user flow"Flow diagram
Tech Spec"Create architecture"System diagram
Development"Create mockup"Screen mockup

Quick Start

Text prompt (user flow, architecture, infographic):

const result = await client.generateFromText(`
Create user flow for checkout:
1. Cart Review
2. Shipping
3. Payment
4. Confirmation

Style: Clean, modern
`);

Screen mockup:

const builder = new WireframePromptBuilder({
  designSystem: 'material3',
  primaryColor: '#3B82F6',
});

const prompt = builder.generateScreen({
  name: 'Dashboard',
  components: [
    { type: 'header', position: 'top' },
    { type: 'card', description: 'Stats' },
    { type: 'list', description: 'Activity' },
  ],
});

Ready-made prompt bodies per phase: references/prompt-library.md

File Organization

docs/visuals/
  discovery/stakeholder-map.png
  prd/user-flow.png
  tech-spec/architecture.png
  design/mockup.png

API Methods

MethodDescription
generateFromText(prompt)Image from text
editImage(base64, instruction)Edit image
wireframeToUI(sketch, description)Sketch to UI

Options

OptionValues
aspectRatio1:1, 16:9, 9:16
resolution1K, 2K, 4K
numImages1-4

评价

还没有评价。欢迎分享你的使用感受。

评论

无需登录即可发表。欢迎分享使用感受、提问,或说明在哪些环境下无法运行。

还没有评论。来写第一条吧。

提交后会立即公开。请勿填写邮箱、电话等个人信息。URL 最多 2 个。

0 / 1000 字

此表单受 reCAPTCHA 保护,适用 Google 的隐私权政策和服务条款。

同一仓库的技能

AID Phase 4 - Development phase. Use for implementing features, TDD practices, code reviews, transitioning from planning to QA.

中文简介正在准备中。当前显示原文说明。

ilandahan/AID102026年9月23日 更新

AID Phase 0 - Research & discovery. Use for validating problem spaces, identifying stakeholders, defining success metrics, deciding whether to proceed.

中文简介正在准备中。当前显示原文说明。

ilandahan/AID102026年9月23日 更新

AID Phase 3 - Implementation Planning with consolidation-first approach. Resolves contradictions between PRD and Tech Spec, creates consolidated master document, then breaks down into actionable tasks and populates Jira. Includes sprint planning and risk assessment.

中文简介正在准备中。当前显示原文说明。

ilandahan/AID102026年9月23日 更新

aid-prd

免费

AID Phase 1 - PRD creation. Use for user stories, acceptance criteria, scoping features, transitioning from discovery to tech spec.

中文简介正在准备中。当前显示原文说明。

ilandahan/AID102026年9月23日 更新

AID Phase 5 - QA and Release. Use for validating implementations, acceptance tests, preparing releases, deployment, operational readiness.

中文简介正在准备中。当前显示原文说明。

ilandahan/AID102026年9月23日 更新

AID Phase 2 - Technical Specification. Use for system architecture, API contracts, data models, security architecture, transitioning from PRD to implementation.

中文简介正在准备中。当前显示原文说明。

ilandahan/AID102026年9月23日 更新

查看 ilandahan 的全部技能

报告此技能的问题