Rendlo | Plataforma de Renderização - Conversão Fotorrealista

Olá pessoal!

Queria compartilhar com vocês um projeto que venho desenvolvendo: o Rendlo, uma plataforma que transforma modelos do SketchUp em renderizações fotorrealistas e vídeos usando Inteligência Artificial.

Contexto:

Esse projeto surgiu da vontade de explorar tecnologias modernas de frontend/backend e entender melhor como funcionam
aplicações completas - desde autenticação até pagamentos e processamento de imagens com IA.

Tem sido uma jornada de muito aprendizado, especialmente na integração de múltiplos serviços (Supabase, Stripe, ImageKit) e na construção de uma experiência fluida para o usuário.

O que é?

É uma aplicação web que permite fazer upload de imagens/cenas do SketchUp e transformá-las em renderizações fotorrealistas ou vídeos através de IA. O sistema funciona com um modelo de créditos (coins): cada usuário começa com 1 moeda gratuita e pode adquirir mais através de planos pagos.

Principais funcionalidades:

• Renderização fotorrealista: Upload de imagens do SketchUp e geração de renders realistas com IA
• Conversão em vídeo: Transforme suas renderizações em vídeos animados
• Sistema de moedas (Coins): Modelo de créditos para uso da plataforma
• Autenticação completa: Sistema seguro via Supabase (JWT-based)
• Pagamentos integrados: Stripe com suporte a BRL e 3 planos (Starter, Growth, Pro)
• Galeria de renders: Histórico de todas as renderizações geradas
• Dashboard interativo: Interface moderna com gráficos 3D (Three.js + Simplex Noise)
• Upload otimizado: Integração com ImageKit para CDN e organização automática

Stack técnica:

Frontend:

• React 18 + TypeScript (type safety em tudo)
• Vite (dev server ultra-rápido)
• Tailwind CSS (tema dark com gradientes purple/pink/blue)
• Framer Motion (animações suaves)
• Three.js (gráficos 3D interativos no dashboard)
• Lucide React (ícones)

Backend:

• Express.js + TypeScript (API RESTful na porta 5555)
• Supabase (auth, database, real-time)
• Stripe (webhooks + checkout sessions)
• ImageKit (storage e CDN de imagens)

Arquitetura:

• Client-side routing customizado (sem biblioteca de rotas!)
• Proxy Vite (/api → Express em dev)
• Webhook handling com raw body para Stripe
• Row Level Security (RLS) no Supabase

Diferenciais técnicos:

• TypeScript strict mode ativado (zero any's, parâmetros não utilizados causam erro)
• Separação clara entre service role key (backend) e anon key (frontend) no Supabase
• Sistema de transações para rastreamento completo de uso de moedas
• Responsive design completo com breakpoints Tailwind
• Docker ready para facilitar deploy

O projeto está em desenvolvimento ativo. O código ainda tem espaço para evoluir, mas já está funcional e processando renderizações e vídeos reais de modelos SketchUp!

Se alguém tiver interesse em testar, dar feedback técnico ou discutir decisões arquiteturais, fico muito feliz em conversar!
Críticas construtivas sobre a stack, padrões de código ou melhorias na experiência do usuário são super bem-vindas.

LandingPage: www.rendlo.com.br