NibalAn

Olá, meu nome é Annibal

E esse é meu site.

Veja toda minha história corporativa no meu LinkedIn LinkedIn, me siga no Instagram, dê estrela pros meus repositórios no Github e faça bom uso dos meus Gists.

No Codepen, Eu crio esses mini-projetos pra compartilhar - eles mostram o Resultado, e o código fonte HTML, CSS, Javascript, numa página só.

No meu perfil do Figma, reuse qualquer protótipo ou biblioteca de componentes que eu publiquei, imprima meu Currículo Curriculum e entregue em várias empresas, ou jogue alguns dos Jogos que eu desenvolvi.

pt-BR | en-US |

Portfolio

Layouts:

Site de Vagas (PF - buscar, PJ - contratar), fiz sozinho num freela: app.tryevo.com.br/
Template de Dashboard: flowuxteam-dashboard.surge.sh/
Exemplo de Sidebar com Dashboards (Vue): codepen.io/nibalAn/pen/jxNZpL
Exemplo de Busca Avançada (Vue): codepen.io/nibalAn/pen/JjWLwxE
Protótipo de uma Landing Page (vanilla): codepen.io/nibalAn/pen/XWXJKqe
Protótipo de um App (angular.js) para CFC: codepen.io/nibalAn/pen/ZyRPpP
Protótipo de um App (React) para Treinar Modelos de IA: codepen.io/nibalAn/pen/pqEvLp
Protótipo de um App (Vue) para Mostrar Dados de uma Carteira: codepen.io/nibalAn/pen/odeaxx
Protótipo de um App (React) pra treinar Modelos de IA (v6): amt6.surge.sh/bases

Componentes:

POC Abas com borda diagonal (SCSS + vanilla JS): codepen.io/nibalAn/pen/MRgEyP
POC Abas com sublinhado animado (HTML + SCSS): codepen.io/nibalAn/pen/QZdLRR
Roda de opções interativa (angular.js): annibal.github.io/Wheelzator/event-demo.html
Mini Gráfico (ES5 + SVG) - min,med,max,avg: codepen.io/nibalAn/pen/ExrjGMz (ES5 é aquele JS do explorer 6)
Mini Gráfico (ES5 + SVG) - Area: codepen.io/nibalAn/pen/abRmOPj
Mini Gráfico (ES5 + SVG) - Donut: codepen.io/nibalAn/pen/WNamNdR
Mini Gráfico (ES5 + SVG) - Aranha: codepen.io/nibalAn/pen/YzJWvPJ
Mini Gráfico (ES5 + SVG) - Barras %: codepen.io/nibalAn/pen/ZEqxMGR
Mini Gráfico (ES5 + SVG) - Linhas com Semi-Candlestick: codepen.io/nibalAn/pen/QWZPWVd
Gráfico estilo HUD de Games em Vega: codepen.io/nibalAn/pen/JzLwpE
Gráfico de Heatmap customizado (React + D3): codepen.io/nibalAn/pen/YvGbGN

Loadings:

Loader de 12 pontos (CSS + HTML): codepen.io/nibalAn/pen/NWOEwBM
Loader de Fichas de Poker (CSS + HTML): codepen.io/nibalAn/pen/QWMpGPG
Loader de Fichas de Poker 3D (Three.js): codepen.io/nibalAn/pen/eYRVzxj (tem click)
Loader baseado no conceito do App (SCSS + HTML): codepen.io/nibalAn/pen/aMrOaV (tem click)
Loader Ripples (CSS + HTML): codepen.io/nibalAn/pen/MprZjx

Jogos:

Mix de Plants_vs_Zombies e Dance_Dance_Revolution (o tema da Game Jam era "ritual"): annibal.github.io/ShadowRhythm/index-br.html
Space Invaders com quadradinhos (vanilla JS): codepen.io/nibalAn/pen/PpOJYg
Jogo do Astro (fiz num freela) que tem que responder perguntas educativas pra sair do labirinto: astro-desafia.surge.sh/

Artísticos:

Elevador JS: codepen.io/nibalAn/pen/prWdjq
Meu trampo (na época) em VR: vrzator2.surge.sh/
Uma escultura cinética que eu vi e quis fazer em HTML e CSS: codepen.io/nibalAn/pen/ZexQXw
Mana Manipulator (clique e mexa pra juntar poderzinho, ai solta pra tacar na parede): codepen.io/nibalAn/pen/JMdOwe
Protetor de tela do DVD (as vezes bate certinho na borda): codepen.io/nibalAn/pen/vYpXPLZ (tem controles)
Daruma que eu comprei na daiso e fiz em CSS: codepen.io/nibalAn/pen/PpdEQM
Mouse que eu gostava e fiz em CSS (scroll e mouse move): codepen.io/nibalAn/pen/EvKmpJ
Protetor de tela quadriculado: codepen.io/nibalAn/pen/GWjPmM
Gerador de vitral ou árvore da vida (depende dos inputs): codepen.io/nibalAn/pen/NgqRpK
Bolinhas que se mexem em linha reta mas não parece: codepen.io/nibalAn/pen/KmaVRp
Bingo de frases de call (repara na url que salva o random e o que marcou): codepen.io/nibalAn/pen/OJVEbBG

Figma:

Protótipo de um quiz pra achar o Teste Clínico que é a sua cara: figma.com/.../1238544300704706798
Protótipo de um site de vagas (PF e PJ): figma.com/.../1238534746967447768
Protótipo de um app para nutricionistas criarem uma dieta pro paciente: figma.com/.../1238521098196408502