Portfólio Espacial

Clique aqui para acessar o Portfólio Espacial

Um Manifesto pelo Design que Conecta

Olá, galera! Eu sou Kaike Bastos, designer interativo com 20 anos de trajetória em 2025, movido por tecnologia, criatividade e inovação.

Meu Portfólio Espacial não é apenas uma vitrine de trabalhos, mas um manifesto contra os layouts padronizados que dominam a web.

Inspirado no conceito de “o ponto que conecta a outros pontos”, ele usa códigos gerados por inteligência artificial, JavaScript, Three.js, GSAP e WordPress para criar uma experiência 3D imersiva que desafia o comum e celebra a conexão entre ideias, pessoas e tecnologia.

Acesse agora: https://kaike.com.br/projetosespeciais/portfolio-espacial/

Rompendo com o Padrão: Tecnologia e Criatividade no Centro do Universo

Os layouts padronizados da web são limitados por fórmulas repetitivas. O Portfólio Espacial usa códigos gerados por IA, Three.js e GSAP para criar uma experiência única, com navegação fluida, animações interativas e carregamento eficiente de projetos.

Os dados do portfólio são dinamicamente extraídos do WordPress, garantindo que, sempre que os conteúdos são atualizados no WordPress, o projeto reflete essas mudanças em tempo real, mantendo a experiência sempre atual e relevante.

A Mesmice dos Layouts Atuais: Um Chamado à Mudança

A web atual está saturada de designs previsíveis: menus fixos, grids rígidos, carrosséis sem graça e paletas “seguras” das quais ainda faço parte. Esses layouts são como satélites presos em órbita – funcionais, mas sem explorar o cosmos da criatividade.

Como designer interativo, acredito que a web pode ser um espaço de exploração, emoção e conexão. O Portfólio Espacial é minha resposta a essa monotonia, rompendo com templates genéricos e convidando o usuário a interagir de forma única.

O que é o Portfólio Espacial?

Imagine um globo 3D giratório, onde projetos de marketing digital são peças circulares integradas à esfera, formando um mosaico em um planeta de wireframe.

O portfólio é uma experiência interativa que você pode girar, ampliar e explorar, seja no desktop ou mobile. Clique, arraste ou role: a navegação é fluida, com performance otimizada para dispositivos variados (em breve tentarei usar o acelerômetro).

A Magia do Loading: Uma Dança de Partículas

O loading do Portfólio Espacial não é apenas uma espera – é um espetáculo visual que encapsula o conceito de conexões. Durante 10 segundos, você é levado a uma jornada que combina movimento e tecnologia em uma experiência imersiva.

A experiência começa com uma contagem regressiva de “10 a 0”, simulando o lançamento de um foguete e criando expectativa.

O destaque é a dança das partículas: mil partículas surgem das bordas, convergem ao centro usando a fórmula de Bézier e explodem em ondas, evocando estrelas em movimento com efeitos brilhantes.

O Globo 3D: Peças que Formam um Todo

O coração do portfólio é o globo 3D, onde peças circulares, distribuídas com a proporção áurea, formam um todo coeso.

Com uma experiência interativa, você pode arrastar o globo ou usar gestos no mobile para explorar a esfera com movimentos naturais, além de clicar em uma peça para entrar no modo galeria, com transições suaves que permitem visualizar detalhes de cada projeto.

Partículas Cósmicas: Um Show de Efeitos Avançados

Além do loading, o projeto usa 3.000 partículas para criar efeitos dinâmicos e imersivos.

O primeiro efeito é o cintilar das estrelas, onde partículas no fundo brilham como estrelas distantes, pulsando suavemente com gradientes suaves, criando uma atmosfera cósmica que envolve o usuário em um cenário de espaço profundo.

O segundo efeito, mergulho noturno no oceano, é inspirado em meus mergulhos noturnos de cilindro, onde o mar se assemelha ao espaço sideral; este efeito simula partículas de micro-organismos flutuando em gravidade zero, como estrelas dançando em um vazio etéreo, com movimentos fluidos e orgânicos que evocam a magia do oceano e do cosmos.

A formação dos anéis ocorre em um momento específico, quando o globo 3D está mais afastado da câmera. As partículas, inicialmente brancas, desaceleram, permanecem flutuando por alguns segundos e, em seguida, começam a trocar de cor, adotando tons vibrantes do arco-íris.

Essas partículas coloridas se organizam em três anéis que giram com velocidades variadas, evocando órbitas cósmicas, em um processo lento.

A formação dos anéis persiste até o momento em que o usuário atravessa o globo 3D, quando as partículas deixam de ser coloridas, retornam à sua cor branca inicial e voltam às suas posições originais, reiniciando o ciclo de efeitos.

Desenvolvimento e Tempo de Execução do Projeto

Versão Inicial (Versão Zero)

A primeira versão do Portfólio Espacial, que chamo de “versão zero”, foi desenvolvida em cerca de três meses, durante um curso de JavaScript que realizei em fevereiro de 2025. Essa versão era monolítica, com todos os dados carregados de uma única vez. Como de costume, aplico os conhecimentos adquiridos em cursos a novos projetos, e, inspirado por um documentário sobre o espaço sideral, decidi criar um portfólio que utilizasse fórmulas reais de física de maneira acessível e visualmente impactante, combinando JavaScript e WordPress.

Período de Testes e Observações

A versão 0.1 foi lançada e mantida em execução por dois meses para avaliar o desempenho, especialmente em relação ao hardware. Durante esse período, observei um aumento significativo no número de acessos e no tempo que os usuários passavam navegando no meu portfólio. No entanto, essa versão apresentava desafios: incluía múltiplos efeitos de física, o que gerava um caos visual que não correspondia à estética desejada. Além disso, as imagens dos projetos no globo 3D eram quadradas.

Evolução para a Versão 1.0

A transição da versão 0.1 para a versão 1.0 marcou uma evolução significativa, exigindo pouco mais de um mês com novos ajustes para alinhar o projeto à versão atualmente no ar. O arquivo JavaScript monolítico inicial, com mais de 8.000 linhas, era intimidador para desenvolvedores de diferentes níveis de experiência. Para resolver isso, realizei uma revisão completa do código, adotando o princípio de “menos é mais” e priorizando a simplicidade criativa.

As principais mudanças incluíram:

Simplificação das fórmulas de física, reduzindo a complexidade dos movimentos para criar efeitos visuais mais elegantes e impactantes. Reorganização do código, separando arquivos por tipo de função ou ação, o que melhorou a manutenção e a clareza. Redução do arquivo principal para cerca de 2.000 linhas, com o projeto como um todo totalizando aproximadamente 4.000 linhas de código, com os dados carregados por demanda. Com essas melhorias, os efeitos visuais, baseados em física real, ganharam maior fluidez e apelo estético, alinhando-se à visão original de um portfólio imersivo e acessível.

Quer ver um efeito legal?

Afaste o Globo 3D ao máximo e espere 30 segundos para ver a mudança de uma fórmula de física real para outra. Todas as fórmulas foram ajustadas para retratar a realidade, a plasticidade e a beleza da física com a matemática, visualmente, criando uma transição que reflete a harmonia entre ciência e arte.

Minhas Homenagens

Primeiramente, agradeço a Claudia Dias, minha esposa, por tudo; Maurice Chalom, amigo, professor e sócio, pela paciência e apoio; Alexandre, irmão do Maurice; Marbelo; Rosalba; Thompson; e todos os amigos que me ajudaram nos testes iniciais até chegar aqui.

O Portfólio Espacial é um tributo a visionários e apoiadores que moldaram minha jornada e o mundo de uma forma geral.

A estética do loading presta tributo a Reinhard Marscha Jr. e Ralf Maier da EYE4U, cujo eye4u.com (1998) me inspirou no início da minha carreira como criativo

 https://www.youtube.com/watch?v=eiOI_ecULxg

As partículas do loading seguem a fórmula de Bézier (1959-1960), em homenagem a Paul de Casteljau e Pierre Bézier.

Os anéis inclinados celebram Galileu Galilei, que observou Saturno em 1610.

A proporção áurea, usada para distribuir as peças do globo 3D, reflete sua presença em construções antigas, como as pirâmides egípcias, e foi formalizada por Euclides em Os Elementos, um tratado matemático e geométrico consistindo de 13 livros, escrito pelo matemático grego Euclides em Alexandria por volta de 300 a.C.

As colisões dinâmicas são uma homenagem a Isaac Newton e suas leis do movimento.

A dinâmica das partículas também incorpora a equivalência entre massa e energia, expressa na fórmula E=mc² de Albert Einstein, simbolizando a transformação de energia em movimento visual no projeto.

Por que Isso Importa?

O Portfólio Espacial é um manifesto contra a padronização. Em um mundo de sites genéricos, ele mostra que a web pode ser um espaço de imaginação e criatividade.

Com 20 anos de experiência, criei um portfólio que não só exibe meu trabalho, mas convida você a explorar e se conectar.

Visite o Portfólio Espacial e deixe-se inspirar! Vamos conectar mais pontos juntos!

E o Futuro?

O Portfólio Espacial é um projeto vivo, e pretendo continuar atualizando-o na medida do possível, mantendo-o no ar pelo domínio kaike.com.br, que está ativo desde 2005.

Estou em busca de novos projetos e oportunidades de recolocação no mercado, explorando novas formas de unir tecnologia, criatividade e inovação.

O futuro é um espaço aberto, cheio de possibilidades, e estou ansioso para ver o que vem pela frente.

Vamos juntos conectar ainda mais pontos e criar experiências que inspiram e transformam!

About the Author:


Sorry, the comment form is closed at this time.