Plataforma Premium de Agendamento para Estética Moderna
Lume Studio é um site institucional e plataforma de agendamento desenvolvida para o mercado de beleza e estética de luxo. Combina um catálogo editorial sofisticado com um sistema de agendamento inteligente, entregando uma experiência client-facing de alto padrão que converte visitantes em clientes através de integração estratégica com WhatsApp.
Status: v1.0.0 (Stable) | Integração: API Beautime + WhatsApp | Tipo: Multi-Page App com Concierge Inteligente
- 📖 Catálogo visual de serviços organizados por categoria
- 👥 Conheça os artesãos que prestam cada serviço
- 📅 Agendamento simplificado com feedback em tempo real
- 🌙 Interface elegante em modo claro e escuro
- 💻 Vitrine digital que reflete a exclusividade da marca
- ⚡ Processamento otimizado de dados com Zero Waterfall Effect
- 🔄 Integração nativa com WhatsApp para conversão
- 📊 Gestão centralizada via Admin Beautime
Home & Brand Experience
- Apresentação visual imersiva da marca
- Depoimentos de clientes estrategicamente posicionados
- Call-to-action inteligente para conversão
Sobre Lume Studio
- Manifesto e filosofia do estúdio
- Herança, propósito e abordagem humanizada
- Storytelling editorial de alta fidelidade
Rituais para a Estética Moderna
- Catálogo dinâmico alimentado via API Beautime
- Filtros interativos por categoria: Estética, Unhas, Cabelos, Maquiagem
- Busca e navegação intuitiva
Os Artesãos (Profissionais)
- Perfil editorial completo de cada especialista
- Especialidades, bio e avatares dinâmicos
- Conexão direta com serviços oferecidos
Conecte-se Conosco
- Formulário de consulta sofisticado
- Alinhamento de expectativas e prazos de atendimento
- Integração suave com whatsapp
Fluxo de Agendamento Inteligente
- Cliente seleciona Serviço
- Escolhe Profissional especializado
- Agenda horário disponível
- Dados são estruturados e enviados para WhatsApp do salão
- Admin Beautime confirma e finaliza a marcação
Gerenciamento de Perfil
- Edição segura de informações pessoais
- Gestão de dados de contato
- Central de segurança com alteração de senha
Central de Notificações
- Listagem dinâmica de alertas em tempo real
- Busca textual e filtros por status
- Paginação inteligente
- Rastreamento de confirmações
Dashboard de Agendamentos
- Visualização centralizada de todos os agendamentos
- Cards detalhados com status (Confirmado/Pendente)
- Informações do profissional, duração e dados financeiros
- Controle de pagamento: Pix, Cartão com rastreamento de status
Performance First
- Promise.all Orchestration: Requisições de históricos, serviços e profissionais executadas em paralelo no servidor
- Zero Waterfall Effect: Eliminação de requisições em cascata garante carregamento instantâneo de telas densas
- Server-Side Data Enrichment: Processamento pesado acontece no servidor Next.js, não no cliente
Data Mapping Eficiente
- Estruturas O(1): Uso de
Map()do JavaScript para indexação de dados relacionais - Runtime Indexing: Cruzamento instantâneo de IDs de profissionais/serviços/agendamentos em memória do servidor
- Type-Safe Queries: Zero ambiguidade na estrutura de dados com TypeScript
React & Next.js Modernos
- App Router Architecture: Roteamento moderno e performático
- Server Components: Segurança de dados e renderização rápida de HTML no servidor
- Client Components Estratégicos: Interatividade (filtros, buscas, modais) apenas onde necessário
- React 19: APIs modernas para melhor performance e DX
| Categoria | Tecnologia | Versão | Propósito |
|---|---|---|---|
| Framework | Next.js | 16.2 | App Router, SSR, API Routes |
| Runtime | React | 19 | UI Components, Interatividade |
| Linguagem | TypeScript | 5.x | Type Safety, DX |
| Styling | Tailwind CSS | v4 | Variáveis CSS, Utilidades |
| Animações | Framer Motion | 12.x | Micro-interactions, Transitions |
| Temas | Next-Themes | 0.4.x | Light/Dark Mode |
| Ícones | Lucide React | 1.8.x | SVG Icons |
| Notificações | Sonner | 2.x | Toast System |
| Linting | ESLint | 9.x | Code Quality |
- Tipografia serifada imponente e hierárquica
- Espaços negativos cuidadosamente planejados
- Componentes de alta fidelidade
- Paleta de cores sofisticada
- Layout fluido para smartphones, tablets e desktops
- Mobile-first approach
- Touch-friendly interactions
- Light Mode: Contraste otimizado para leitura
- Dark Mode: Redução de fadiga ocular à noite
- Persistência: Preferência do usuário armazenada
- Transições Suaves: Mudança de tema sem jarretões
src/
├── app/ # Rotas Next.js App Router
│ ├── (Pages)/ # Páginas públicas e autenticadas
│ ├── (credentials)/ # Rotas de auth (login, cadastro, etc)
│ ├── api/ # API Routes
│ └── types/ # Type definitions compartilhadas
├── components/ # React Components reutilizáveis
│ ├── Home/ # Componentes da homepage
│ ├── Services/ # Catálogo de serviços
│ ├── Professionals/ # Galeria de profissionais
│ ├── Appointment/ # Fluxo de agendamento
│ ├── Profile/ # Gerenciamento de perfil
│ ├── Header/ # Navegação principal
│ └── Footer/ # Rodapé
├── lib/api/ # Integração com API Beautime
├── utils/ # Utilitários e helpers
├── providers/ # Context Providers (Theme, etc)
└── proxy.ts # Proxy de requisições
- Server-Side Sessions: Validação de autenticação no servidor
- Protected Routes: Client-side route guards
- Password Hashing: Segurança de credenciais
- TypeScript: Prevenção de type errors em tempo de compilação
- API Validation: Tipagem rigorosa de dados externos
- Sistema de avaliações e comentários de clientes
- Integração com payment gateways
- Progressive Web App (PWA) support
- Analytics e insights de agendamentos
- Multi-idioma (i18n)
Este projeto é de uso privado e exclusivo para o ecossistema Lume Studio e Beautime.
Desenvolvido com ❤️, 🧠 e 📐 por Emerson Carneiro da Silva