Competências
Métodos e práticas. Valem em qualquer ferramenta.
- Modelagem de dados
- UX Research
- Prototipação
- Design System
- Motion design
- Levantamento de requisitos
- Documentação de sistemas
Kailane Freires Sousa
Transformandoideias emexperiênciasincríveis.
UI/UX Designer e Desenvolvedora Full Stack focada em criar produtos digitais que conectam design, tecnologia e pessoas.
lanecodes.dev — 2026
Designing experiences.
Developing ideas.
Antes do código, existe a curiosidade.
Olá, eu sou a Lane!
Minha história com tecnologia começou muito antes da minha primeira aplicação web. Ainda no ensino médio, encontrei na robótica um espaço para experimentar, competir, ensinar e descobrir o quanto gosto de transformar ideias em algo real.
Essa curiosidade me levou à graduação em Sistemas de Informação e continua me acompanhando nos estudos em Engenharia Mecânica.
Hoje, atuo como desenvolvedora full stack e UI/UX designer, participando de todas as etapas de um produto digital: da compreensão do problema e do primeiro protótipo até o desenvolvimento, as integrações e o deploy.
Mas minha relação com tecnologia não termina no código. Também gosto de ensinar, participar de eventos, compartilhar experiências e ajudar outras pessoas a descobrirem seus próprios caminhos na área.
Acredito que criar tecnologia é, acima de tudo, encontrar novas maneiras de conectar ideias, pessoas e possibilidades.
Eu desenvolvo produtos, eu projeto experiências e compartilho conhecimento.
Tudo o que um produto digital precisa, numa pessoa só.
Do primeiro rascunho no Figma à API em produção.
lanecodes Landing pages
→ Protótipo · Animações GSAP · SEO técnico
lanecodes Sites e blogs
02Presença digital gerenciável, com blog integrado e responsiva em qualquer tela.
lanecodes Sistemas web conectados a ERPs e CRMs como Sienge e CVCRM.
lanecodes Aplicativos
→ UX mobile · React Native · Publicação
lanecodes UI/UX Design
05Pesquisa, fluxos, protótipos navegáveis e design systems no Figma.
lanecodes Requisitos funcionais e não funcionais, regras de negócio e documentação técnica.
Organização em cada etapa, do zero ao deploy.
Cada projeto passa pelas mesmas etapas, com entregáveis claros no fim de cada uma.
- início / fim
- etapa
- decisão
Início · sua ideia
- 01
Descoberta e requisitos
Entendo o negócio, o público e levanto requisitos funcionais e não funcionais.
- 02
UX e protótipo
Fluxos, wireframes e protótipo navegável no Figma, validados antes do código.
- 03
Documentação
Modelo de dados, arquitetura e contratos de API registrados antes de construir.
- Aprovado?não? voltamos ao protótipo
- 04
Front-end
Interface componentizada, responsiva e animada, fiel ao protótipo.
- 05
Back-end e banco
API, autenticação, integrações e banco de dados modelado para crescer.
- 06
Deploy e evolução
Publicação, monitoramento e melhorias contínuas com o cliente.
Produto no ar
Beyond the screen
A experiência vai além do dispositivo.
- Um design. Infinitas telas. Uma boa experiência não depende do tamanho da tela. Ela se adapta a quem está do outro lado.
- Não é só diminuir. É repensar. Layout, navegação, hierarquia e interação precisam funcionar em cada contexto.
- Do desktop ao mobile. Sem perder a experiência. Interfaces fluidas, acessíveis e pensadas para diferentes dispositivos.
Navegue pelos meus arquivos.
Abra as pastas, liste os arquivos e leia cada projeto como código. Ou vá direto aos destaques.
portfolio.tsxSelecione um arquivo para visualizar
PROJECT DIRECTORY
Projetos de desenvolvimento
Explore os trabalhos e abra um arquivo para conhecer os detalhes.
TERMINAL OUTPUT
$ ls ./projetos
✓ Workspace pronto para explorar
site-institucional-vca.tsxTSX 
Site institucionalSite institucional VCA Construtora
Portal corporativo responsivo, cheio de animações, focado em mostrar a essência da empresa.
vca-rank.tsxTSX 
Sistema webVCA Rank
Plataforma de engajamento corporativo com ranking ao vivo, pontuação, loja interna para troca de pontos e área de quiz.
portal-do-investidor.tsxTSX 
Sistema webPortal do Investidor
Portal para captação de investidores e acionistas, com área logada para acesso a documentos financeiros.
blog-vca.tsxTSX 
BlogBlog VCA
Blog corporativo para informar e integrar todas as sedes da empresa e dar transparência ao cliente.
governando-com-as-pessoas.tsxTSX 
Sistema webGovernando com as Pessoas
Sistema da Prefeitura de Vitória da Conquista em que cada cidadão indica e vota investimentos em obras e serviços para o seu bairro.
rede-axegu.tsxTSX 
Landing pageRede Axêgu
Site de hotelaria com vídeo controlado pelo scroll e preloader de alta performance.
01 / 12
Ver todos os 23 projetos Stack& integrações
UX Research é uma prática; o Figma é a ferramenta. APIs REST são um padrão; CVCRM e Sienge são integrações de verdade. Tudo no mesmo ecossistema, cada coisa no seu lugar.
- Competênciao que eu sei fazer
- Tecnologiacom o que eu construo
- Ferramentaonde eu trabalho
- Padrão de integraçãocomo os sistemas conversam
- Integração específicaconexões reais com plataformas
Tecnologias
Linguagens, frameworks e bibliotecas com que construo.
- Front-end
- Vue.js 3
- Quasar
- React
- Next.js
- TypeScript
- JavaScript
- HTML5
- CSS3
- SCSS
- Tailwind CSS
- Back-end
- Node.js
- NestJS
- Express
- Banco de dados
- PostgreSQL
- Prisma
- Firebase
- Supabase
- Oracle Database
- Mobile
- React Native
- Expo
- Animação
- GSAP
- ScrollTrigger
- Three.js
- Lottie
Integrações
Padrões definem como os sistemas conversam. Integrações específicas são as conexões reais com plataformas de mercado.
SistemaSeu produto
◆ Padrão de integração
- APIs REST
- Autenticação JWT
- OpenAPI
- ⇄ Integração específicaCVCRM APICRM · leads, contratos e webhooks
- ⇄ Integração específicaSienge APIERP · sincronização de dados via REST
Ferramentas
Softwares do dia a dia, do design ao deploy.
- Vite
- Figma
- Photoshop
- Illustrator
- Git
- Docker
Da robótica no ensino médio aos sistemas em produção.
- Nome
- Kailane Sousa
- Cargo
- Designer UI/UX & Desenvolvedora Full-stack
- BR1.2024.0557
Contato
Encontrou este crachá? lanecodes.dev- kailanesousa58@gmail.com
- Vitória da Conquista, BA
Me encontreno palcoe nos bastidores
Palestras, cursos, mentorias e minicursos em eventos de tecnologia. Cada ingresso leva ao relato completo no blog.
Ficar por dentro- Edição encerradaPalestraPalestra para calouros de Sistemas de InformaçãoVer no blog 15.092025lanecodes.dev
- Edição encerradaMentoriaMentoria de equipesVer no blog 20.062025lanecodes.dev
- Edição encerradaMinicursoOficina de Figma — 2ª ediçãoVer no blog 10.102024lanecodes.dev
Manual —2026No
blogCarreira · 1 min de leituraBem-vindos ao lanecodes.devLer agora ↗
blogCarreira · 1 min de leituraBem-vindos ao lanecodes.devLer agora ↗
[ A marca ]
Por que Fireframe?
Fireframe é a união entre arquitetura digital e design de experiência.
Frame é a estrutura: wireframes, sistemas e organização de interface. Fire é a camada que dá vida: interação, movimento, identidade visual e presença.
Não crio apenas telas. Construo interfaces funcionais, performáticas e responsivas que transformam estrutura em experiência real para quem usa.
FireInteração e movimento
FrameArquitetura e estrutura
Experiências responsivas
O que a Fireframe faz?
- UI/UX Design
Pesquisa, prototipagem, design systems e experiências pensadas para quem vai usar.
- Engenharia de software
Interfaces componentizadas e APIs performáticas com Vue, React, Next.js e NestJS.
- Experiências responsivas
Produtos adaptáveis, fluidos e consistentes em qualquer tela e dispositivo.
- Projeto fechadoEscopo, prazo e investimento definidos antes de começar.
- Parceria contínuaHoras mensais para evoluir produto, site ou sistema.
- Contratação PJAberta a oportunidades em times de produto.
Vamos construir algo juntos
Vamos tirarsua ideiado papel?
Resposta pessoal
em até 2 dias úteis