João Victor Cruz — designer e desenvolvedor fullstack
João Victor Cruz,
Desenho a interface.
Construo o produto.
UI/UX, front-end, back-end, dashboards, SEO e automação — do Figma ao deploy, inclusive o que ninguém vê.
O que te trouxe aqui?
projetos
Projetos reais, do Figma ao código.
Abra um projeto para ver o case completo, com as telas originais e uma demonstração que você pode usar.
Aly+comece por aquiConta digital para gestão de cartões e pagamentos corporativos: incentivos e despesas, cartões virtuais para anúncios (AlyAds) e Pix em lote para fornecedores e colaboradores.papel produto de ponta a pontaabrir case site ao vivo de Aly+, abre em nova aba
El Magocomece por aquiLoja de itens de Diablo 4: seleção de servidor, filtros por tipo de item, busca, quantidade e carrinho, além de uma área de afiliados. Do protótipo interativo ao front-end em Next.js.papel direção e front-endabrir case
Agroluminacomece por aquiSite de uma consultoria agropecuária credenciada ao Banco do Brasil, focada em crédito rural em Sertãozinho, Ribeirão Preto e região. Low-code no site, back-end para SEO.papel direção, back-end e SEOabrir case site ao vivo de Agrolumina, abre em nova aba
English OnBoardcomece por aquiPlataforma de e-learning de inglês para comissários de bordo: trilhas em módulos e unidades, EXP, ranking e o Re-check for Cabin Crew, um simulado cronometrado com áudio, resultado e gabarito.papel UI/UX: jornada, fluxos e telasabrir case
Ascendacomece por aquiPlataforma de elojob para League of Legends, Valorant, TFT e Wild Rift: calculadora de preço, pedidos com estados e painéis de cliente, booster e admin, com a regra de dinheiro no servidor.papel projeto de estudo: produto e back-endabrir case
serviços
O que eu faço, e onde você pode ver.
Cada serviço aponta para os projetos em que ele aparece, com atalho direto para o case.
UI/UX e design systems
Fluxos, protótipos interativos e design systems no Figma. A decisão é testada clicando antes de virar código.
- protótipo interativo
- styleguide
- tokens e componentes
visto em Aly+El MagoEnglish OnBoard
Front-end
Interfaces rápidas e fiéis ao design, do protótipo ao código. No El Mago, com Next.js e Tailwind.
- Next.js
- Tailwind CSS
- do Figma ao código
Back-end e produto
Regras de negócio e o back-end que sustenta a interface: do cálculo do pedido ao que o Google precisa ler.
- regras de negócio
- back-end para SEO
- cálculo de pedido
visto em AgroluminaAscenda
Dashboards
Painéis que mostram o que importa para quem opera o produto: saldo, crédito e carga por mês, segmentos e o andamento de cada pedido.
- visualização de dados
- filtros
- segmentações
SEO técnico e performance
CLS, indexação no Google e palavras-chave pensadas para o Google e para assistentes de IA.
- CLS
- indexação no Google
- keywords Google/IA
visto em Agrolumina
Automação e prompt design
Fluxos que tiram trabalho repetitivo do caminho e prompts tratados como código: versionados, testados e com saída previsível.
- fluxos automatizados
- integrações
- prompts versionados
quer automatizar algo? vamos conversar
processo
Como um projeto anda comigo.
Seis etapas, na ordem em que acontecem. Escolha uma para ver o que eu faço nela — e em quais projetos.
Antes da tela, o problema: quem usa, o que precisa resolver e o que o negócio precisa medir.
nos projetos Aly+El MagoAgroluminaEnglish OnBoard
Fluxos no Figma e protótipo interativo. A decisão é testada clicando, não discutida em slide.
nos projetos Aly+El MagoEnglish OnBoard
Design system e styleguide: tokens, componentes e estados. O mesmo vocabulário no Figma e no código.
Front-end e back-end: app, site e painel saindo do mesmo sistema.
nos projetos Aly+El MagoAgroluminaAscenda
SEO técnico: CLS, indexação no Google e palavras-chave pensadas para o Google e para assistentes de IA.
nos projetos Agrolumina
Dashboards para quem toca o produto depois do lançamento.
nos projetos Aly+
sobre
Entre o design e o código.
Sou o João Victor Cruz, o jvcrz. Desenho a interface no Figma, transformo em produto e cuido do que vem depois: performance, SEO, segurança e as automações que mantêm tudo rodando.
Fiz a Aly+ de ponta a ponta — app, site e dashboards —, dirigi o El Mago e a Agrolumina, e uso projetos de estudo, como o Ascenda, para testar ideias antes de levá-las a clientes.
Este site é um exemplo do cuidado: os números deste painel foram medidos agora, no seu navegador.
- CLS layout que pula
- —
- LCP maior elemento visível
- —
- TTFB primeiro byte
- —
- peso transferido
- —
- requisições de terceiros
- —
- Content-Security-Policy
- —
- HSTS
- —
- fonte em uso
- —
contato
Tem um projeto em mente?
Vamos tirar do papel.
O caminho mais direto é o LinkedIn. No Behance está o portfólio visual completo.