Contador de Amor
Experiência Interativa Front-end
Um projeto especial desenvolvido para capturar memórias e contabilizar o tempo exato de um relacionamento. Muito além de uma página estática, é uma aplicação Single Page focada em manipulação de DOM, animações CSS e design responsivo.
O Propósito
O objetivo era criar um presente digital memorável e personalizado para o Dia dos Namorados. Mais do que apenas exibir fotos, a ideia era construir um ambiente imersivo que conectasse imagens interativas, uma trilha sonora dedicada (via Spotify) e um contador cronológico preciso, criando um verdadeiro "álbum de memórias vivo".
A Execução Técnica
Para garantir máxima fluidez e carregamento instantâneo, decidi não utilizar frameworks pesados ou bibliotecas de terceiros (como Swiper.js para o carrossel). Toda a interatividade, o cálculo preciso de tempo e a mecânica de slider foram construídos do zero utilizando Vanilla JavaScript e manipulação direta do DOM.
Destaques de Engenharia Front-end
Algoritmo de Tempo Real
Desenvolvimento de uma lógica em JS para calcular com precisão a diferença entre a data de início do relacionamento (Setembro de 2021) e o momento exato do acesso, atualizando dinamicamente anos, meses, dias, horas, minutos e segundos a cada 1000ms.
Carrossel Vanilla JS
Criação de um slider de fotos interativo (estilo Polaroid) feito do zero. Implementei suporte a navegação por teclado (setas), cliques e sistema de "Swipe" para telas touch em dispositivos móveis.
Animações e Easter Eggs
Utilização de animações CSS (keyframes) para criar um fundo flutuante dinâmico e injeção de elementos no DOM para criar o "efeito de corações" ao dar duplo clique (Double-click event) em qualquer lugar da tela.