Fox Studio Hub is the website and management system of Fox Estúdio, a creative agency in Carlos Chagas, Brazil, serving businesses in the Mucuri Valley and northern Minas Gerais with brand identity, social media, video production and paid ads. The public page shows services and portfolio; behind a discreet login, the team manages requests on a Kanban board, along with clients, staff, one off jobs and proposals. It was built by André Gomes, through NexiaLabs, with Next.js, Prisma and MySQL.
The client
Fox Estúdio is an agency in Carlos Chagas that handles the online presence of local businesses: brand identity, social media management, video production, paid ads, graphic design and websites. An agency's daily work is a queue of requests from many clients at once, each with its own deadline, format, brief and brand assets. The agency had an earlier, simpler system and needed a dashboard that organized the team and showed progress to clients. The public site also needed to show up in local searches across the region.
The challenge
An agency request carries a lot of information: category, feed and story formats, deadline, priority, brief, supporting files and assignees. The team needed to see all of it on a board and move a card between stages without friction, on desktop and on mobile. Clients needed to approve a piece without creating an account. And the agency owner wanted contracts, monthly revenue, team productivity and proposals in one place, with finance restricted to the administrator.
What was built
André built a Next.js app that holds both the public page and the dashboard. Requests move across a five column Kanban board, from requested to approved, with drag and drop that also works on touch. Clients get a token link to follow their requests and another to approve a piece, with no password. Proposals become PDFs generated on the server, and automation rules change priority or status when a deadline passes. Agents built on the Claude API suggest briefs based on the client's niche and point out bottlenecks on the board.
What the system does
Kanban board for requests with five stages, color coded priority and assignee photos.
Request form with category, formats, deadline, brief, attachments and linked client.
Client portal and token based approval link, with no sign up.
Overview with active contracts, monthly revenue, urgent requests and team.
Client profile with brand assets, contacts and a request calendar.
Sales proposals as PDF and a finance area visible only to the administrator.
Automation rules triggered by status change, priority change or missed deadline.
Public page with services, a portfolio of approved work and local agency structured data.
// For whoever reviews the code: architecture and decisions.
Under the hood
Next.js
React
TypeScript
Prisma
MySQL
NextAuth
Tailwind CSS
dnd kit
Recharts
React PDF
Zustand
Claude API
The system is a Next.js 16 app with the App Router, React 19 and TypeScript, split into route groups for the public site and the dashboard. Authentication uses NextAuth with JWT sessions and two roles, administrator and collaborator, and role checks run in the API routes. The database is MySQL through Prisma, with models for requests, comments, activity, attachments, proposals, automation rules and approval tokens. Board updates arrive through server sent events, and proposal PDFs are rendered with React PDF on the server. The AI agents live in their own layer, with an orchestrator and a database log of every run.
Technical decisions
Client approval through a single use, expiring token, because asking the agency's clients to sign up stalls approvals.
Drag and drop with dnd kit and a touch sensor with a short delay, so the board works on the team's phones without mistaking a drag for a scroll.
Dashboard access through a discreet lock icon on the public page, without exposing an admin area to site visitors.
Does your business look like this one?
Fits agencies, studios and creative service providers handling many clients at once who need to organize requests, deadlines and approvals.
Fox Studio Hub was developed by André Gomes Andrade, a full stack developer from Carlos Chagas, Minas Gerais, Brazil, at NexiaLabs, from planning to launch.
Where is the client of Fox Studio Hub based?
Creative and marketing agency in Carlos Chagas. Carlos Chagas, MG, Brazil.
Which technologies were used to build Fox Studio Hub?
Fox Studio Hub uses Next.js, React, TypeScript, Prisma, MySQL, NextAuth, Tailwind CSS, dnd kit, Recharts, React PDF, Zustand, and Claude API.
Can you build a similar project for my business?
Yes. Every project is custom built, with code and accounts in the client's name. The first step is a WhatsApp conversation at +55 (33) 98465 6356 to understand what you need.
