entropiav2

生成式舞蹈视频 - NFT 平台

🎨 描述

交互式舞蹈视频体验平台，每次 NFT 铸造都会生成基于区块链的独特视频、音乐和叙事组合。

Usuario selecciona preferencias
    ↓
Sistema generativo crea composición única (determinística)
    ↓
Usuario ve video en vivo desde IPFS
    ↓
Usuario mintea NFT en Base blockchain
    ↓
NFT con metadata inmutable en IPFS

---

🚀 快速开始

前置要求

• Node.js 18+
• npm 或 yarn
• Base 钱包（MetaMask、Rainbow Kit 等）
• Pinata Cloud API 密钥

安装

# Clonar repositorio
git clone https://github.com/videodanza/nft-platform.git
cd videodanza-nft

# Instalar dependencias
npm install

# Configurar variables de entorno
cp .env.example .env.local
# Editar .env.local con tus credenciales

# Iniciar desarrollo
npm run dev
# Visitar http://localhost:3000

---

📁 项目结构

videodanza-nft/
├── docs/
│   ├── ARQUITECTURA.md              # Diagrama técnico completo
│   ├── ALGORITMO_GENERATIVO.md      # Lógica de combinaciones
│   ├── CONTRATOS.md                 # ERC-721 specification
│   ├── API.md                       # Endpoints detallados
│   ├── WIREFRAMES.md                # UI mockups
│   └── FASE0_RESUMEN.md            # Completitud de Fase 0
│
├── smart-contracts/                 # FASE 1
│   ├── contracts/
│   │   └── VideoDanzaNFT.sol        # Contrato ERC-721
│   ├── scripts/
│   │   └── deploy.js                # Deployment script
│   ├── test/
│   │   └── VideoDanzaNFT.test.js    # Test suite
│   ├── hardhat.config.js
│   └── package.json
│
├── backend/                         # FASE 2 (Next.js API)
│   ├── api/
│   │   ├── generate.ts              # POST /api/generate
│   │   ├── composition/
│   │   │   └── [seed].ts            # GET /api/composition/:seed
│   │   ├── ipfs/
│   │   │   ├── upload.ts            # POST /api/ipfs/upload
│   │   │   └── metadata/
│   │   │       └── [cid].ts         # GET /api/ipfs/metadata/:cid
│   │   ├── mint/
│   │   │   └── prepare.ts           # POST /api/mint/prepare
│   │   ├── nfts/
│   │   │   ├── [walletAddress].ts   # GET /api/nfts/:walletAddress
│   │   │   └── [tokenId].ts         # GET /api/nft/:tokenId
│   │   └── health.ts                # GET /api/health
│   │
│   ├── services/
│   │   ├── generativeEngine.ts      # Lógica de generación
│   │   ├── pinataService.ts         # Integración Pinata
│   │   ├── blockchainService.ts     # Queries a blockchain
│   │   └── videoComposer.ts         # Composición de videos
│   │
│   ├── utils/
│   │   ├── seedGenerator.ts         # Hash + seed
│   │   ├── ipfsGateway.ts           # URLs de IPFS
│   │   ├── contractABI.ts           # ABI ERC-721
│   │   └── validators.ts            # Validaciones
│   │
│   └── config/
│       ├── constants.ts             # Constantes
│       └── networks.ts              # Config redes
│
├── frontend/                        # FASE 3 (React)
│   ├── pages/
│   │   ├── _app.tsx                 # Provider global
│   │   ├── index.tsx                # Landing
│   │   ├── app.tsx                  # Selector de preferencias
│   │   ├── watch.tsx                # Video player
│   │   ├── nft-gallery.tsx          # Galería de NFTs
│   │   └── about.tsx                # Información
│   │
│   ├── components/
│   │   ├── PreferenceSelector/
│   │   │   ├── GenderPicker.tsx
│   │   │   ├── PerspectivePicker.tsx
│   │   │   └── MusicTonePicker.tsx
│   │   │
│   │   ├── VideoPlayer/
│   │   │   ├── Player.tsx
│   │   │   ├── VideoLoader.tsx
│   │   │   └── MusicSync.tsx
│   │   │
│   │   ├── MintFlow/
│   │   │   ├── MintButton.tsx
│   │   │   ├── MintModal.tsx
│   │   │   └── SuccessScreen.tsx
│   │   │
│   │   ├── NFTGallery/
│   │   │   ├── GalleryGrid.tsx
│   │   │   ├── NFTCard.tsx
│   │   │   └── DetailModal.tsx
│   │   │
│   │   └── Common/
│   │       ├── Header.tsx
│   │       ├── Footer.tsx
│   │       └── LoadingSpinner.tsx
│   │
│   ├── hooks/
│   │   ├── useGenerativeEngine.ts
│   │   ├── useVideoPlayer.ts
│   │   ├── usePinataGateway.ts
│   │   ├── useWeb3Auth.ts
│   │   ├── useNFTMint.ts
│   │   └── useSeeding.ts
│   │
│   ├── styles/
│   │   ├── globals.css
│   │   └── theme.ts
│   │
│   └── public/
│       └── logo.svg
│
└── .env.example                     # Variables de entorno (template)

---

🔧 配置

环境变量（.env.local）

# BLOCKCHAIN
NEXT_PUBLIC_CONTRACT_ADDRESS=0x...
NEXT_PUBLIC_CHAIN_ID=8453
NEXT_PUBLIC_RPC_URL=https://mainnet.base.org

# PINATA (IPFS)
PINATA_API_KEY=...
PINATA_API_SECRET=...
PINATA_GATEWAY_URL=https://gateway.pinata.cloud

# BASE TESTNET (Desarrollo)
BASE_TESTNET_RPC=https://sepolia.base.org
BASE_TESTNET_CHAIN_ID=84532

# API
NEXT_PUBLIC_API_URL=http://localhost:3000/api
API_SECRET=...

# JWT
JWT_SECRET=...

---

📚 文档

每个阶段都有完整文档：

阶段 0 - 架构 ✅

• ARQUITECTURA.md - 技术图示
• ALGORITMO_GENERATIVO.md - 逻辑
• CONTRATOS.md - ERC-721
• API.md - 端点
• WIREFRAMES.md - UI

阶段 1 - 区块链与 IPFS（即将推出）

• 智能合约部署
• IPFS 资源设置
• 视频固定

阶段 2 - 后端

• 生成引擎
• API 实现
• 数据库设置

阶段 3 - 前端

• React 组件
• Web3 集成
• UI/UX

阶段 4 - 交互性

• 摄像头集成
• ML5.js 姿势检测
• 交互效果

阶段 5 - 铸造

• 钱包连接
• 铸造流程
• NFT 画廊

阶段 6 - 部署

• 优化
• 测试
• Vercel 部署

---

🎬 使用流程

1. LANDING PAGE
   └─> Usuario aprende sobre el proyecto
   └─> Botón "Explorar Ahora"

2. PREFERENCE SELECTOR
   └─> Elige género (he, she, hybrid, avatar)
   └─> Elige perspectiva (dancer POV, spectator, multiple)
   └─> Elige música (melancholic, joyful, abstract, ambient)
   └─> Clic [GENERATE]

3. VIDEO PLAYER
   └─> Sistema genera composición única (seed)
   └─> Videos se cargan desde IPFS
   └─> Música sincronizada
   └─> Metadata visible
   └─> Clic [MINT NFT]

4. MINT FLOW
   └─> Conectar wallet (Web3)
   └─> Confirmación de transacción (0.001 ETH)
   └─> Blockchain: acuña token ERC-721
   └─> Metadata guardada en IPFS

5. SUCCESS
   └─> NFT acuñado exitosamente
   └─> Links a Etherscan, OpenSea
   └─> Ver en galería personal

6. NFT GALLERY
   └─> Ver todos los NFTs acuñados
   └─> Ver metadata de cada uno
   └─> Compartir en redes

---

🏗️ 技术栈

前端

• 框架： Next.js 14（React 18）
• 语言： TypeScript
• 样式： Tailwind CSS + Framer Motion
• Web3： Wagmi + Viem
• 钱包： RainbowKit
• 视频： 从 IPFS 流式传输
• 音频： Web Audio API

后端

• 运行时： Node.js
• 框架： Next.js API Routes
• 区块链： ethers.js + Base RPC
• IPFS： Pinata SDK
• 数据库： SQLite（开发环境）/ PostgreSQL（生产环境）

智能合约

• 语言： Solidity 0.8.20
• 标准： ERC-721 + ERC-2981
• 库： OpenZeppelin
• 网络： Base（8453）+ Base Sepolia（84532）

IPFS

• 服务： Pinata Cloud
• 存储： 视频 + 音乐 + 元数据
• 网关： Pinata CDN

---

🧪 测试

# Smart contracts
cd smart-contracts
npm run test

# Frontend
npm run test

# API integration
npm run test:api

---

🚀 部署

Base 测试网（开发）

npm run deploy:testnet

Base 主网（生产）

npm run deploy:mainnet

Vercel（前端）

vercel deploy --prod

---

📊 统计数据

• 独特组合： 2048 万
• IPFS 上的视频： 121 个片段
• 音乐曲目： 16 首（4 个音调 × 4 首曲目）
• 铸造费用： 0.001 ETH（在 Base 上约为 3.50 美元）
• 版税： 二级销售额的 7.5%
• 平均时长： 每段作品 7-8 分钟

---

🤝 参与贡献

这是一个生成式项目，欢迎贡献：

1. 添加更多舞蹈视频
2. 创作新的音乐曲目
3. 实现新的视觉效果
4. 改进生成算法
5. 添加交互性

详情请参阅 CONTRIBUTING.md。

---

📜 许可证

MIT 许可证 - 请参阅 LICENSE

---

📞 联系方式

• 网站： videodanza.art
• Twitter： @videodanzanft
• Discord： 社区
• 邮箱： [email protected]

---

🎯 路线图

• 2025 年第 1 季度： 阶段 0-2（架构 + 智能合约 + 后端）
• 2025 年第 2 季度： 阶段 3-4（前端 + 交互性）
• 2025 年第 3 季度： 阶段 5-6（铸造 + 部署）
• 2025 年第 4 季度： 主网上线 V1.0、营销、社区

---

📝 开发者须知

开发原则

1. 确定性： 相同的 seed 始终生成相同的作品
2. 可复现性： 可在区块链上验证
3. 可扩展性： 使用 IPFS 实现去中心化
4. 安全性： 智能合约经过审计
5. 用户体验： 从 IPFS 无延迟流式传输
6. 变现： 自动发放 ERC-2981 版税

关键要点

⚠️ IPFS 上的视频必须能够在没有 CORS 问题的情况下访问 ⚠️ 生成算法必须是确定性的（可复现） ⚠️ 视频与音频的同步必须毫无察觉 ⚠️ 铸造必须是原子的（要么全部成功，要么全部失败） ⚠️ 验证 seed，避免在区块链上出现重复项

---

🎓 学习资源

• ERC-721 标准
• IPFS 文档
• Base 区块链
• Solidity 示例
• Web3.js 文档

---

项目启动时间： 2025 年 2 月 24 日 状态： 🟢 阶段 0 已完成 下一步： 阶段 1 - 智能合约与 IPFS