Sistema operacional criativo no browser — desktop com mini-apps de IA
Desktop metaphor fell out of fashion na web, mas ambientes criativos (DAWs, IDEs, editores de vídeo) preservam porque organização espacial importa. Queria provar que SaaS poderia roubar essa UX de volta — especialmente com IA como sidekick sempre à mão.
Construir desktop navegável com 15+ mini-apps, window management real (drag, resize, min/max), persistência por usuário, e IA integrada — tudo no browser, com framework que permita replicar a estrutura para outros SaaS depois.
Next.js como shell, PostgreSQL para content/state, Docker Swarm para deploy, Groq + Gemini para IA. Executado em sessão épica de 20 plans via GSD. Framework resultante é reutilizável — qualquer SaaS futuro pode herdar a estrutura de desktop/janela.
How the project came together
A premissa era simples. Ferramenta criativa pede espaço, memória visual e contexto ao mesmo tempo. Em vez de empilhar tudo em coluna, o produto retomou a lógica de desktop para transformar o navegador em ambiente de trabalho de verdade.
O núcleo foi desenhado como sistema operacional criativo. Mais de 15 miniapps convivem no mesmo plano com arrastar, redimensionar, minimizar, maximizar, ordem de camadas, abertura em cascata e encaixe em grade. Cada app ocupa seu lugar sem quebrar o todo.
Terminal de IA, ferramenta de desenho, pomodoro, jogo de tangram, navegador de arquivos, lixeira com restauração, configurações e páginas institucionais passaram a conviver no mesmo ambiente. A inteligência da IA entra integrada, conectada nos lugares certos. A lixeira foi pensada com descarte suave e restauração — o usuário deleta sem medo de perder.
A construção foi planejada e executada em ritmo de operação concentrada. Em vez de mês e meio espalhado, o trabalho saiu numa sessão única de produção contínua. O resultado não foi só o lançamento do mosaiko.cc — foi também uma base reaproveitável que acelera os próximos produtos do studiomosaiko sem precisar montar o piso de novo.
Arraste, redimensione, minimize, maximize. Z-index respeitado. Cascata de janelas novas. Grid snap opcional.
AI terminal (Groq), paint, pomodoro, tangram puzzle, paleta Claude Code, file explorer, trash com restore, settings, about — cada um com UX própria.
Dois painéis laterais fixos com módulos configuráveis — monitor sistema, quick notes, agenda, música.
16+ ícones pixel-art em SVG animados com spring physics no Framer Motion. Mosaiko personality.
Posts, notes, tasks — tudo em PostgreSQL com API completa. Migrou do fluxo MDX estático para dinâmico sem perder content.
Delete qualquer item vai pro lixo. Restore em 1 clique. Purge opcional por admin.
Why we chose each path
What we take to the next one
Interface plana força navegação linear — uma coisa de cada vez. Desktop deixa o usuário organizar ferramentas em paralelo. Pra fluxo criativo onde IA, desenho, anotação e leitura precisam coexistir, isso vira diferença real: sai da troca constante de aba e entra em ambiente de trabalho que respeita a memória espacial humana.
Em vez de produto único, a fundação foi montada pra ser herdada por outros. Isso transforma cada produto futuro em montagem sobre a base existente, não em obra do zero. O esforço inicial pesado deixa de ser custo afundado e vira ativo — quem reutiliza paga uma vez e aproveita várias.
Construir um sistema completo em ritmo concentrado só funciona com mapa fechado antes da primeira hora. Cada parte pré-definida, cada dependência mapeada, cada decisão tomada antes da implementação começar. Sem esse mapa, a mesma sessão produziria caos e abandono no meio — com ele, vira ritmo constante até o lançamento.
Tell us your idea. We deliver a concrete proposal within 24h.
Start conversation