VIS 噐度是一款自动化品牌视觉识别系统生成器。它将单一品牌标识转化为完整的设计语言体系——从基础视觉规范到沉浸式应用场景，每一步都是品牌美学的精准演绎。
由 Gemini 3 Pro Image 驱动，以摄影级真实感渲染您品牌的每一个触点。
上传品牌标识，VIS 噐度将自动演绎 45+ 枚高保真品牌资产：
━━━ 阶段壹 ━━━ 基础视觉规范（30+ 构图单元）
- 标识解构 · 呼吸空间 · 组合构成
- 色彩光谱 · 字体对话 · 图形图腾
- 界面套件 · 材质纹理 · 工艺美学
━━━ 阶段贰 ━━━ 沉浸式场景演绎（16+ 美学呈现）
- 商务名片 · 信封信笺 · 移动应用
- 文化衫 · 环保袋 · 咖啡外带
- 办公招牌 · 户外大牌 · 店铺门头
- 自然语言交互：以日常语言表达您的品牌构想
- 意图智能解析：系统自动识别设计意图并提供建议
- 视觉重构引擎：选择任意资产，描述您的美学调整，系统即刻重构
- 4x 并行生成：四线程同步渲染，效率与美学兼得
- 智能分批处理：优化批次调度，平衡速度与品质
支持 1:1 · 3:4 · 4:3 · 9:16 · 16:9 多种宽高比，适配全渠道品牌呈现。
| 技术 | 版本 | 用途 |
|---|---|---|
| React | 19.2.3 | 用户界面框架 |
| Vite | 6.2.0 | 极速构建工具 |
| TypeScript | 5.8.2 | 类型安全保障 |
| Lucide React | 0.561.0 | 符号图标库 |
- Gemini 3 Pro Image Preview：新一代图像生成模型，卓越的中文理解与视觉呈现能力
- Node.js 18+ 已安装
- 兔子 API 访问令牌 (获取入口)
# 克隆仓库
git clone git@github.com:xiaoxihexiaoyu/VIS.git
cd VIS
# 安装依赖
npm install
# 配置访问令牌（可选，也可在界面中输入）
echo "VITE_API_KEY=your_token_here" > .env.local
# 启动开发服务器
npm run dev访问 http://localhost:5173 开启您的品牌视觉之旅。
首先上传您的品牌标识文件。系统支持 PNG · JPG · SVG 等主流格式。
系统将自动完成：
- 标识规范：几何解构 · 呼吸空间 · 组合样式 · 比例测试
- 色彩系统：主辅光谱 · 语义色彩 · 渐变光谱
- 字体对话：字体样本 · 搭配指南 · 字态微观
- 图形资产：几何图腾 · 超级图形 · 符号体系
- 应用呈现：名片 · 应用 · 周边 · 标识
使用对话界面：
- 生成新资产：「帮我设计一套咖啡杯视觉」
- 重构现有资产：选择资产后说「调整为金色系」「替换深色背景」
- 获取随机灵感：点击 ✨ 图标触发创意涌现
点击任意资产可全屏审视并导出，支持 PNG 无损与 JPG 压缩两种格式。
vis-genius/
├── components/
│ ├── ActionCard.tsx # 操作确认界面
│ ├── Button.tsx # 可复用按钮组件
│ ├── ImageGrid.tsx # 资产画廊矩阵
│ ├── ImageViewer.tsx # 全屏审视模态框
│ └── UploadArea.tsx # 标识上传界面
├── services/
│ └── imageService.ts # 图像生成服务
├── App.tsx # 主应用逻辑
├── types.ts # 类型定义与视觉分类
├── vite.config.ts # Vite 配置
└── tsconfig.json # TypeScript 配置
npm run build构建产物位于 dist/ 目录。
npm run preview预览生产构建版本。
| 分类 | 包含内容 |
|---|---|
| 标识规范 | 几何解构 · 呼吸空间 · 横纵构成 · 符号独白 · 单色/反转版本 |
| 色彩系统 | 主辅光谱 · 语义色彩 · 渐变光谱 · 视觉权重 |
| 字体对话 | 主辅字体族 · 字体搭配 · 基线网格 · 字态微观 |
| 图形资产 | 几何图腾 · 抽象超图 · 流体形态 · 符号体系 · 插图风格 |
| 工艺标准 | 界面套件 · 应用图标 · 纸纹触感 · 金属工艺 · 玻璃蚀刻 |
| 领域 | 视觉呈现 |
|---|---|
| 企业用品 | 商务名片 · 信封信笺 · 身份牌 · 手账本 · 演示文稿 |
| 数字产品 | 移动应用 · 品牌官网 · 社交矩阵 |
| 周边产品 | 文化衫 · 环保袋 · 咖啡外带 · 包装礼盒 |
| 标识标牌 | 办公招牌 · 户外大牌 · 车辆涂装 · 店铺门头 |
| 变量 | 必需 | 说明 |
|---|---|---|
VITE_API_KEY |
否 | 兔子 API 访问令牌（也可在界面中配置） |
本项目采用 MIT 协议开源。