🎨 PrimeTech3D

Gerador Profissional de Modelos 3D com IA
Transforme fotos ou descrições de texto em modelos 3D incríveis usando tecnologia World Labs.

---

📋 Sobre o Projeto

PrimeTech3D é uma aplicação web moderna que permite gerar modelos 3D de alta qualidade a partir de fotos ou descrições de texto, utilizando a poderosa API do World Labs combinada com visualização interativa em Three.js.

🎯 Problema Resolvido

Criar modelos 3D tradicionalmente requer:

• Habilidades técnicas avançadas em software 3D
• Horas ou dias de trabalho manual
• Equipamentos caros de captura 3D
• Conhecimento especializado em modelagem

💡 Nossa Solução

Uma plataforma intuitiva que oferece:

📸 Screenshots

Tela Inicial

Escolha entre upload de foto ou descrição de texto

Interface de Geração

Interface intuitiva com controles de parâmetros

Visualizador 3D

Preview interativo com controles de órbita

Histórico de Gerações

Acesse e gerencie suas criações anteriores

---

• Dual Input Mode: Escolha entre upload de foto ou descrição de texto
• Geração 3D em Tempo Real: Integração com World Labs API
• Preview Interativo: Visualize e interaja com seus modelos 3D
• Histórico de Gerações: Acesse e gerencie suas criações anteriores
• Controles de Parâmetros: Ajuste qualidade e detalhamento
• Interface Moderna: Design inspirado no Marble com gradientes e animações

🛠️ Tecnologias

• Next.js 16.2.4 - Framework React com App Router
• TypeScript - Tipagem estática
• Tailwind CSS - Estilização
• Three.js - Renderização 3D
• React Three Fiber - React renderer para Three.js
• React Three Drei - Helpers para R3F
• Lucide React - Ícones
• World Labs API - Geração de modelos 3D

📦 Instalação

# Clone o repositório
git clone <repository-url>
cd primetech3d

# Instale as dependências
npm install --legacy-peer-deps

# Configure as variáveis de ambiente
cp .env.local.example .env.local
# Edite .env.local e adicione sua API key do World Labs

🔑 Configuração

Crie um arquivo .env.local na raiz do projeto:

NEXT_PUBLIC_WORLD_LABS_API_KEY=sua_api_key_aqui

Obtenha sua API key em: https://platform.worldlabs.ai/api-keys

🚀 Uso

# Desenvolvimento
npm run dev

# Build de produção
npm run build

# Iniciar produção
npm start

Acesse http://localhost:3000 no seu navegador.

📖 Como Usar

1. Escolha o Modo de Input

   • Clique em "Upload de Foto" para enviar uma imagem
   • Ou clique em "Descrição de Texto" para descrever o que quer criar

2. Forneça o Input

   • Modo Foto: Faça upload de uma imagem (PNG, JPG, WEBP)
   • Modo Texto: Digite uma descrição detalhada do modelo 3D

3. Ajuste os Parâmetros (opcional)

   • Qualidade: Padrão, Alta ou Ultra
   • Detalhamento: Controle deslizante de 1 a 10

4. Gere o Modelo

   • Clique em "Gerar Modelo 3D"
   • Aguarde o processamento (pode levar alguns minutos)

5. Visualize e Baixe

   • Interaja com o modelo 3D no preview
   • Clique em "Baixar" para salvar o modelo
   • Acesse gerações anteriores no histórico

🏗️ Estrutura do Projeto

primetech3d/
├── app/
│   ├── page.tsx              # Página principal
│   ├── layout.tsx            # Layout raiz
│   └── globals.css           # Estilos globais
├── components/
│   ├── InputSelection.tsx    # Seleção de modo (foto/texto)
│   ├── GenerationView.tsx    # Interface de geração
│   ├── Scene3D.tsx           # Visualizador 3D
│   └── GenerationHistory.tsx # Histórico de gerações
├── lib/
│   └── worldlabs.ts          # Cliente da API World Labs
├── public/                   # Arquivos estáticos
├── .env.local               # Variáveis de ambiente (não commitado)
└── package.json             # Dependências

🎨 Componentes

InputSelection

Tela inicial com duas opções de input (foto ou texto). Design inspirado no Marble com cards interativos e gradientes.

GenerationView

Interface principal de geração com:

• Painel de input (upload ou textarea)
• Painel de parâmetros
• Preview 3D interativo
• Histórico de gerações

Scene3D

Visualizador 3D usando React Three Fiber com:

• Controles de órbita
• Iluminação ambiente e direcional
• Grid de referência
• Environment mapping

GenerationHistory

Lista de gerações anteriores com:

• Thumbnails
• Informações de data/hora
• Ações de visualizar e excluir

🔌 API Integration

O projeto usa o cliente WorldLabsClient para integração com a API:

import { worldLabsClient } from '@/lib/worldlabs'

// Gerar modelo 3D
const response = await worldLabsClient.generateFrom3D({
  type: 'image' | 'text',
  input: file | string,
  parameters: {
    quality: 'standard' | 'high' | 'ultra',
    detail: 1-10
  }
})

// Verificar status
const status = await worldLabsClient.getGenerationStatus(response.id)

// Poll até completar
const result = await worldLabsClient.pollGenerationStatus(response.id)

🎯 Roadmap

• Suporte a múltiplos formatos de exportação (GLB, OBJ, FBX)
• Editor de materiais e texturas
• Compartilhamento de modelos
• Galeria pública de criações
• Integração com Spark.js para features avançadas
• Suporte a animações
• AR preview (visualização em realidade aumentada)

🐛 Troubleshooting

Erro de espaço em disco

npm cache clean --force

Erro de peer dependencies

npm install --legacy-peer-deps

Servidor não inicia

# Limpe o cache do Next.js
rm -rf .next
npm run dev

📝 Licença

MIT

🤝 Contribuindo

Contribuições são bem-vindas! Por favor, abra uma issue ou PR.

📧 Contato

Para dúvidas ou sugestões, abra uma issue no repositório.

---

Powered by World Labs Technology 🚀