Product designer

ThiagoGeorge

I design it.
Then I build it.Eu desenho.
E eu mesmo desenvolvo.

UX/UI and front-end for websites, online stores and real-time 3D experiences.UX/UI e front-end para sites, lojas online e experiências 3D em tempo real.

Open to roles in Portugal and Brazil, on-site or remoteAberto a vagas em Portugal e no Brasil, presencial ou remoto

Selected workProjetos selecionados

  1. 01INDUXENWebGL / Three.js / Company siteWebGL / Three.js / Site de empresaCase studyEstudo de caso
  2. 02The Air Draws ItWebGL / Shaders / GPU particlesWebGL / Shaders / Partículas na GPUCase studyEstudo de caso
  3. 03Anatomy of a StrideWebGL / Three.js / GLSL / Product pageWebGL / Three.js / GLSL / Página de produtoCase studyEstudo de caso

Case studies for INDUXEN and The Air Draws It are on the way. The live versions are open now.Os estudos de caso da INDUXEN e de The Air Draws It estão a caminho. As versões ao vivo já estão abertas.

AboutSobre

Designer by trade. Developer by origin.Designer de profissão. Desenvolvedor de origem.

I'm a product designer with 5+ years of experience and a developer by origin. I work on online stores, web platforms and full 3D experiences. I've led a design team, built a web platform from zero, used by customers and by internal consultants, and worked side by side with engineers.

I handle the full UX/UI: research, discovery, prototyping and testing. And instead of handing the design over to developers, I now build the site myself, in JavaScript and Three.js, with AI as my partner. What used to take a whole team, I deliver on my own.

Sou product designer com mais de 5 anos de experiência e desenvolvedor de origem. Trabalho com lojas online, plataformas web e experiências 3D completas. Já liderei uma equipe de design, construí uma plataforma web do zero, usada por clientes e por consultores internos, e trabalhei lado a lado com engenheiros.

Cuido de todo o UX/UI: pesquisa, discovery, prototipação e testes. E, em vez de passar o design para desenvolvedores, agora eu mesmo desenvolvo o site, em JavaScript e Three.js, com a IA como parceira. O que antes exigia uma equipe inteira, hoje entrego sozinho.

Design

  • UX/UI
  • ResearchPesquisa
  • Discovery
  • PrototypingPrototipação
  • TestingTestes
  • Team leadLiderança

BuildDesenvolvimento

  • JavaScript
  • Three.js
  • GLSL
  • HTML/CSS
  • C#

Education, courses and certificatesFormação, cursos e certificados

EducationFormação

  • IT TechnicianTécnico em Tecnologia da Informação2018–2020Universidade Adventista de São Paulo
  • English, intensive courseInglês, curso intensivo2024–now2024–atualEd School

LanguagesIdiomas

  • PortuguesePortuguêsNativeNativo
  • EnglishInglêsIntermediate, studyingIntermediário, cursando

CoursesCursos

  • Design SprintENAP
  • Design ThinkingENAP
  • UX DesignENAP
  • Product DesignerSaturn
  • FigmaCursae
  • Introduction to DesignIntrodução ao DesignAwari
ContactContato

Let's talk.Vamos conversar.

Based in Brazil. Open to roles in Portugal and Brazil, on-site or remote.No Brasil. Aberto a vagas em Portugal e no Brasil, presencial ou remoto.

All workTodos os projetos

03 · Case studyEstudo de caso

Anatomy of aStride

A product page for a running shoe where the 3D model is the store. You take the shoe apart, look at each material up close, then build your own.Uma página de produto de tênis de corrida em que o modelo 3D é a própria loja. Você desmonta o tênis, vê cada material de perto e depois monta o seu.

Open the live demoAbrir a demo ao vivo
RolePapel
Design and developmentDesign e desenvolvimento
YearAno
2026
TypeTipo
Concept, fictional brand MAROConceito, marca fictícia MARO
LanguagesIdiomas
English, PortugueseInglês, português
The opening frame: the word fills with warm light in about three seconds while a band of light crosses the shoe.A abertura: a palavra se preenche de luz quente em cerca de três segundos enquanto uma faixa de luz cruza o tênis.
The problemO problema

You can't touch a shoe online.Não dá para tocar um tênis pela tela.

On most stores, a running shoe is a row of photos. You can't feel the mesh, see the foam or understand what each layer does, so the price has nothing to stand on.Na maioria das lojas, um tênis de corrida é uma fileira de fotos. Não dá para sentir a malha, ver a espuma ou entender o que cada camada faz, e o preço fica sem argumento.

The brief I set: make the structure and the materials visible, and let the 3D lead straight into the purchase, on desktop and on the phone.O desafio que defini: mostrar a estrutura e os materiais e fazer o 3D levar direto à compra, no computador e no celular.

My roleMeu papel

From concept to code.Do conceito ao código.

I did the whole thing: concept, art direction, UX/UI, 3D integration and front-end development, then testing in two languages and five screen sizes. AI worked as my partner during the build.Fiz tudo: conceito, direção de arte, UX/UI, integração do 3D e desenvolvimento front-end, e depois os testes em dois idiomas e cinco tamanhos de tela. A IA foi minha parceira na construção.

  • ConceptConceito
  • Art directionDireção de arte
  • UX/UI
  • 3D integrationIntegração 3D
  • Front-end
  • TestingTestes
Key decisionsDecisões

Five choices that shaped it.Cinco escolhas que definiram o projeto.

  1. 1

    Two directions before any codeDuas direções antes de qualquer código

    I designed the opening in two directions, a dark studio and a light gallery, and chose one before building the rest. The dark studio won: warm key light, a cold rim light behind the shoe, and a heavy condensed word for the shoe to stand in front of.Desenhei a abertura em duas direções, um estúdio escuro e uma galeria clara, e escolhi uma antes de construir o resto. Ganhou o estúdio escuro: luz principal quente, luz de recorte fria atrás do tênis e uma palavra condensada e pesada para o tênis ficar na frente.

    A · Night labChosenEscolhida
    B · GalleryDroppedDescartada
  2. 2

    An exploded view that frames itselfUma vista explodida que se enquadra sozinha

    As you scroll, the shoe separates into six parts. The camera measures each part on screen and fits the whole stack between the header, the text and the index, so it holds up on a 360 px phone and on a wide desktop.Ao rolar, o tênis se separa em seis peças. A câmera mede cada peça na tela e encaixa a pilha inteira entre o cabeçalho, o texto e o índice, então funciona num celular de 360 px e num desktop largo.

  3. 3

    Focus with light, not transparencyFoco com luz, não com transparência

    Fading the other parts out looked like a rendering bug. Instead, the parts out of focus drop into a desaturated shadow, done in a shader, so the active part reads first and the shoe still feels solid.Deixar as outras peças transparentes parecia defeito de renderização. Em vez disso, as peças fora de foco caem numa sombra dessaturada, feita em shader, e a peça ativa aparece primeiro sem o tênis perder o volume.

  4. 4

    Each material gets its own lightCada material com a sua luz

    Three close-ups, each lit for what it needs to show: raking light on the mesh, top light on the laces, side light on the foam. On desktop the light follows the cursor, so you can look at the grain yourself.Três closes, cada um iluminado para o que precisa mostrar: luz rasante na malha, luz de cima nos cadarços, luz lateral na espuma. No desktop a luz segue o cursor, e você mesmo explora a textura.

  5. 5

    The configurator ends in the bagO configurador termina na sacola

    Ready-made colourways, colour per part, size and price in one column next to the shoe. Each colour change sends a sweep of light across the model, so the change is felt, not just seen. The bag is a keyboard-friendly dialog. It's a demo store: nothing is sold.Combinações prontas, cor por peça, tamanho e preço numa coluna ao lado do tênis. Cada troca de cor passa uma faixa de luz pelo modelo, para a mudança ser sentida e não só vista. A sacola é um diálogo que funciona pelo teclado. É uma loja de demonstração: nada é vendido.

On the phoneNo celular

The same story, one hand.A mesma história, com uma mão.

On the phone the layout is rebuilt rather than shrunk: part numbers become a row of buttons, the configurator puts sizes before the colour tabs, and you rotate the shoe by dragging.No celular o layout é refeito, não só reduzido: os números das peças viram uma fileira de botões, o configurador traz os tamanhos antes das abas de cor e o tênis gira com o dedo.

OpeningAbertura
Anatomy, part 3Anatomia, peça 3
ConfiguratorConfigurador
EngineeringEngenharia

Under the hood.Por dentro.

  • The modelO modeloAn open-licence shoe model, split into six named parts from its connected meshes so it could come apart. The original brand mark was removed from the texture.Um modelo de tênis de licença aberta, dividido em seis peças nomeadas a partir das malhas conectadas para poder ser desmontado. A marca original foi removida da textura.
  • File weightPeso do arquivoThe model went from 7.2 MB to 2.9 MB by removing unused data and converting the textures to WebP, with no visible change.O modelo caiu de 7,2 MB para 2,9 MB com a remoção de dados sem uso e a conversão das texturas para WebP, sem mudança visível.
  • ShadersRecolouring, the shadow focus and the light sweep are written in GLSL and injected into the standard Three.js material.A troca de cor, o foco por sombra e a faixa de luz são escritos em GLSL e injetados no material padrão do Three.js.
  • AccessibilityAcessibilidadeTabs with arrow keys, the 3D viewer exposed as a slider, a bag dialog that keeps focus inside, reduced-motion support and separate hints for touch and mouse.Abas com setas do teclado, o visualizador 3D exposto como controle deslizante, sacola em diálogo que mantém o foco, suporte a movimento reduzido e dicas diferentes para toque e mouse.

Built withFeito com

  • JavaScript
  • Three.js
  • GLSL
  • HTML/CSS
  • glTF
  • WebP
ResultResultado

One scene, from first look to bag.Uma cena, do primeiro olhar à sacola.

A working product page in English and Portuguese, tested at five screen sizes from 360 to 1440 px, with no console errors and no sideways scroll. The 3D does the selling: every section is the same shoe, seen for a different reason.Uma página de produto funcionando em inglês e português, testada em cinco tamanhos de tela de 360 a 1440 px, sem erros no console e sem rolagem lateral. O 3D faz a venda: cada seção é o mesmo tênis, visto por um motivo diferente.

Next step: serve the model as a compressed binary file and load it on demand, with an image in its place while it loads.Próximo passo: servir o modelo como arquivo binário comprimido e carregá-lo sob demanda, com uma imagem no lugar enquanto carrega.

3D model: Warrior running shoe by kunyong_Chen (Sketchfab), CC BY 4.0, modified. MARO is a fictional brand; price and specs are illustrative.Modelo 3D: Warrior running shoe, de kunyong_Chen (Sketchfab), CC BY 4.0, modificado. MARO é uma marca fictícia; preço e especificações são ilustrativos.

All workTodos os projetos

01 · Case studyEstudo de caso

INDUXEN

A website for an industrial maintenance company that tells one service call in 3D: an electric motor stops, gets inspected, repaired, tested and goes back to work as you scroll.Um site para uma empresa de manutenção industrial que conta um atendimento em 3D: um motor elétrico para, é inspecionado, consertado, testado e volta a funcionar enquanto você rola a página.

Open the live siteAbrir o site ao vivo
RolePapel
Design and developmentDesign e desenvolvimento
YearAno
2026
TypeTipo
Company website, industrial servicesSite de empresa, serviços industriais
LanguagesIdiomas
Portuguese, EnglishPortuguês, inglês
The opening: the motor is running, and the status at the top says so. Scroll and it stops.A abertura: o motor está funcionando, e o status no topo mostra isso. Ao rolar, ele para.
The problemO problema

Maintenance is invisible until it fails.Manutenção é invisível até a máquina parar.

The buyer is a plant or maintenance manager. What they see is a stopped machine and, later, an invoice. Most industrial service sites answer with a list of services in jargon, which doesn't show how the work is done or why it can be trusted.Quem contrata é o gestor da fábrica ou da manutenção. O que ele vê é uma máquina parada e, depois, uma nota fiscal. A maioria dos sites de serviços industriais responde com uma lista de serviços em linguagem técnica, que não mostra como o trabalho é feito nem por que dá para confiar.

There was a second constraint: the company had no documented jobs yet, so no client logos, numbers or testimonials could be used. The brief I set: show how the team works, in the order it happens, without inventing proof.Havia uma segunda restrição: a empresa ainda não tinha trabalhos documentados, então não dava para usar logos de clientes, números nem depoimentos. O desafio que defini: mostrar como a equipe trabalha, na ordem em que acontece, sem inventar provas.

My roleMeu papel

Concept, brand, site.Conceito, marca, site.

Concept and storytelling, art direction, UX/UI and copy, the 3D scene and the front-end, plus rebuilding the logo as a clean vector from a small image. AI worked as my partner during the build.Conceito e narrativa, direção de arte, UX/UI e textos, a cena 3D e o front-end, além de redesenhar a logo em vetor limpo a partir de uma imagem pequena. A IA foi minha parceira na construção.

  • ConceptConceito
  • Art directionDireção de arte
  • UX/UI
  • CopyTextos
  • 3D sceneCena 3D
  • Front-end
  • Logo vectorLogo em vetor
Key decisionsDecisões

Five choices that shaped it.Cinco escolhas que definiram o projeto.

  1. 1

    One service call instead of a list of servicesUm atendimento em vez de uma lista de serviços

    My first version gave each motor part one service. It was clear but static. I replaced it with a story in eight steps: running, unplanned stop, inspection, diagnosis, repair, test, improvement and back to work. The five services appear as links at the step where they belong.Na primeira versão, cada peça do motor representava um serviço. Era claro, mas estático. Troquei por uma história em oito etapas: funcionando, parada não planejada, inspeção, diagnóstico, reparo, teste, melhoria e volta ao trabalho. Os cinco serviços aparecem como links na etapa a que pertencem.

  2. 2

    The view changes with the jobA vista muda conforme o trabalho

    The motor is shown the way a technician would look at it: thermal camera to find the heat, X-ray to find the cause, a technical drawing for the improvement plan. The view switches by itself as you scroll, with an orange sweep, and the heat scale is marked as illustrative.O motor aparece do jeito que um técnico olharia: câmera térmica para achar o calor, raio-X para achar a causa, desenho técnico para o plano de melhoria. A vista muda sozinha com a rolagem, com uma varredura laranja, e a escala de calor é marcada como ilustrativa.

    ThermalTérmicaInspectionInspeção
    Technical drawingDesenho técnicoImprovementMelhoria
  3. 3

    The cause is shown before the fixA causa aparece antes do conserto

    In the diagnosis step the motor comes apart in X-ray view and a label marks the worn rear bearing. That picture carries the company's position: confirm the cause before replacing any part.Na etapa de diagnóstico o motor se separa em raio-X e uma etiqueta marca o rolamento traseiro desgastado. Essa imagem carrega o posicionamento da empresa: confirmar a causa antes de trocar qualquer peça.

  4. 4

    Services you can browse, not scroll pastServiços para explorar, não para passar reto

    After the story, the five services sit in tabs, each with an image of the motor in that situation and what the work includes. The tabs advance on their own, pause on hover or focus, stop when you click and work with the arrow keys.Depois da história, os cinco serviços ficam em abas, cada uma com uma imagem do motor naquela situação e o que o trabalho inclui. As abas avançam sozinhas, pausam com o mouse ou o foco, param no clique e funcionam com as setas do teclado.

  5. 5

    A contact form that explains firstUm contato que explica antes

    Instead of a blank form: say what is happening with the equipment, get a short plain-language explanation with the right service already selected, and leave with a message ready to send. The contact details sit on a motor nameplate.Em vez de um formulário em branco: você conta o que está acontecendo com o equipamento, recebe uma explicação curta em linguagem simples com o serviço certo já marcado e sai com uma mensagem pronta para enviar. Os contatos ficam numa placa de identificação de motor.

On the phoneNo celular

Motor on top, story below.Motor em cima, história embaixo.

On the phone the motor moves to the top half and the text to the bottom, each step gets a shorter line, and the scene renders at a lower resolution so the scroll stays smooth.No celular o motor vai para a metade de cima e o texto para a de baixo, cada etapa ganha uma frase mais curta e a cena é desenhada em resolução menor para a rolagem continuar fluida.

OpeningAbertura
InspectionInspeção
RepairReparo
EngineeringEngenharia

Under the hood.Por dentro.

  • The motorO motorBuilt in code from simple shapes, with every part named so it can be separated, highlighted or swapped for a licensed model later.Construído em código a partir de formas simples, com cada peça nomeada para poder ser separada, destacada ou trocada por um modelo licenciado depois.
  • Inspection viewsVistas de inspeçãoThe thermal view is a GLSL shader with a heat ramp and a hot spot; X-ray and the technical drawing swap the materials for edges and wireframes.A vista térmica é um shader GLSL com escala de calor e ponto quente; o raio-X e o desenho técnico trocam os materiais por arestas e malha de linhas.
  • A layering bug, measuredUm bug de camadas, medidoParts of the page were drawn over the fixed header and blocked its clicks. A test that checks what sits on top of each header point found it in 9 of 100 scroll positions; after moving the header out of the 3D stage, 0.Partes da página eram desenhadas por cima do cabeçalho fixo e bloqueavam os cliques. Um teste que verifica o que está por cima de cada ponto do cabeçalho achou o problema em 9 de 100 posições de rolagem; depois de tirar o cabeçalho do palco 3D, 0.
  • RobustnessRobustezLower resolution on phones, labels computed only when visible, recovery when the browser drops the 3D context, keyboard tabs and reduced-motion support.Resolução menor no celular, etiquetas calculadas só quando visíveis, recuperação quando o navegador derruba o contexto 3D, abas pelo teclado e suporte a movimento reduzido.

Built withFeito com

  • JavaScript
  • Three.js
  • GLSL
  • HTML/CSS
  • SVG
ResultResultado

A service you can follow.Um serviço que dá para acompanhar.

A company site in Portuguese and English where the visitor follows a repair from the stop to the restart before reading a single service name. It was tested on desktop and phone sizes, and every illustrative part is labelled as such.Um site de empresa em português e inglês em que o visitante acompanha um conserto da parada até a volta ao trabalho antes de ler o nome de qualquer serviço. Foi testado em tamanhos de computador e de celular, e tudo o que é ilustrativo está identificado.

What I cut: a manifesto with words lighting up on scroll and a separate questions section. Both slowed the story down. Small monospaced labels went too: they looked generic, so the whole site uses one typeface, Archivo.O que eu cortei: um manifesto com palavras acendendo na rolagem e uma seção separada de perguntas. Os dois atrasavam a história. Os rótulos pequenos em fonte monoespaçada também saíram: pareciam genéricos, e o site inteiro passou a usar uma família só, a Archivo.

Next step: replace the code-built motor with a detailed licensed model, and add real jobs as the company documents them.Próximo passo: trocar o motor feito em código por um modelo detalhado e licenciado, e incluir trabalhos reais conforme a empresa for documentando.

All workTodos os projetos

02 · Case studyEstudo de caso

The AirDraws It

A real-time wind tunnel in the browser. There is no car model: the car appears only because thousands of streamlines have to go around it.Um túnel de vento em tempo real no navegador. Não existe modelo de carro: o carro aparece só porque milhares de linhas de ar precisam contorná-lo.

Open the live demoAbrir a demo ao vivo
RolePapel
Design and developmentDesign e desenvolvimento
YearAno
2026
TypeTipo
Experimental, real-time GPU studyExperimental, estudo em tempo real na GPU
LanguagesIdiomas
English, PortugueseInglês, português
The opening: the title is made of the same lines as the wind, pulsing in sync with the tunnel.A abertura: o título é feito das mesmas linhas do vento e pulsa junto com o túnel.
The ideaA ideia

Make the invisible do the drawing.Fazer o invisível desenhar.

Air is invisible, and that is the challenge. Instead of modelling a car and adding wind around it, I wanted the wind to be the only thing you see, and the car to be the shape it leaves behind.O ar é invisível, e esse é o desafio. Em vez de modelar um carro e colocar vento em volta, eu queria que o vento fosse a única coisa visível e que o carro fosse a forma que ele deixa.

The brief I set: a piece that shows shader and GPU skills, reads like a real wind-tunnel test and stays honest about what it is.O desafio que defini: uma peça que mostre domínio de shaders e GPU, pareça um teste real de túnel de vento e seja honesta sobre o que é.

My roleMeu papel

Concept to shader.Do conceito ao shader.

Concept, art direction, the car shape, the GLSL shaders, interaction and front-end, plus the English and Portuguese copy. AI worked as my partner during the build.Conceito, direção de arte, a forma do carro, os shaders GLSL, a interação e o front-end, além dos textos em inglês e português. A IA foi minha parceira na construção.

  • ConceptConceito
  • Art directionDireção de arte
  • GLSL
  • InteractionInteração
  • Front-end
Key decisionsDecisões

Five choices that shaped it.Cinco escolhas que definiram o projeto.

  1. 1

    A body you almost can't seeUma carroceria quase invisível

    I tested a backlit version and dropped it: the light became the subject. The final body is almost black and lit only at grazing angles, so it hides the air behind it and leaves a thin outline. The silhouette comes from light and flow.Testei uma versão em contraluz e descartei: a luz virava o assunto. A carroceria final é quase preta e só recebe luz em ângulos rasantes, então esconde o ar atrás dela e deixa um contorno fino. A silhueta vem da luz e do fluxo.

  2. 2

    Colour that means somethingCor com significado

    The first versions were white and felt flat. Colour came back with a job: blue where the air is held back, grey where it flows freely, amber where it speeds up over the roof. A legend under the text explains it in one line.As primeiras versões eram brancas e pareciam sem vida. A cor voltou com uma função: azul onde o ar é freado, cinza onde ele flui livre, âmbar onde acelera sobre o teto. Uma legenda embaixo do texto explica em uma linha.

  3. 3

    A probe you can point at the airUma sonda para apontar no ar

    On desktop, a dot follows the cursor and reads the local speed, like "1.12 × U∞ · accelerating". It uses the same math that bends the lines, so the reading matches what you see: slower at the nose, faster over the roof, slower again in the wake.No desktop, um ponto segue o cursor e mostra a velocidade naquele lugar, como "1,12 × U∞ · acelerando". Ele usa a mesma matemática que curva as linhas, então a leitura bate com o que se vê: mais lento na frente, mais rápido sobre o teto, lento de novo na esteira.

  4. 4

    A shape worth believingUma forma que convence

    The car went through six versions. The early ones were too round and didn't read as a car. The final one is a tall GT: long hood, cabin set back, high shoulder over the rear wheels, mixing curves with straight lines. A smoothed copy of the profile steers the air, so the lines start rising before the nose and never kink.O carro passou por seis versões. As primeiras eram redondas demais e não pareciam um carro. A final é um GT alto: capô longo, cabine recuada, ombro alto sobre as rodas traseiras, misturando curvas e retas. Uma cópia suavizada do perfil guia o ar, então as linhas começam a subir antes da frente e nunca quebram.

  5. 5

    Your turn to run the testSua vez de fazer o teste

    The last chapter hands over the controls: drag to turn the car into the wind, change the speed from 60 to 250 km/h and switch between colour and mono. It works with the arrow keys too.O último capítulo passa o controle para você: arraste para virar o carro contra o vento, mude a velocidade de 60 a 250 km/h e alterne entre cor e monocromático. Também funciona com as setas do teclado.

On the phoneNo celular

The tunnel in your hand.O túnel na sua mão.

On the phone the car sits above the text, the probe is hidden because there is no cursor, and you turn the car with your finger.No celular o carro fica acima do texto, a sonda é escondida porque não há cursor e você vira o carro com o dedo.

OpeningAbertura
VelocityVelocidade
Your turnSua vez
EngineeringEngenharia

Under the hood.Por dentro.

  • One draw callUma chamada de desenhoAll the air is a single grid of continuous lines. The vertex shader moves every point around the body each frame; the fragment shader runs pulses of light along them to show direction and speed.Todo o ar é uma única grade de linhas contínuas. O vertex shader move cada ponto em volta da carroceria a cada quadro; o fragment shader passa pulsos de luz por elas para mostrar direção e velocidade.
  • A car made of mathUm carro feito de matemáticaThe body is two volumes built from a handful of control points, not a downloaded model. The edge light is a Fresnel term in the shader.A carroceria são dois volumes construídos com alguns pontos de controle, não um modelo baixado. A luz de contorno é um termo de Fresnel no shader.
  • PerformanceDesempenhoIf the frame rate drops below 38 fps, fewer lines are drawn; above 55 they come back. The camera is driven by the scroll instead of free orbit, so every frame is composed.Se a taxa de quadros cai abaixo de 38 fps, menos linhas são desenhadas; acima de 55 elas voltam. A câmera é guiada pela rolagem em vez de girar livre, então cada quadro é composto.
  • Honest labellingRótulo honestoThe page says it plainly: this is an illustrative visualization, not a CFD solver. It doesn't compute real pressure or drag, and the car is a generic shape.A página diz claramente: é uma visualização ilustrativa, não um simulador de CFD. Não calcula pressão nem arrasto reais, e o carro é uma forma genérica.

Built withFeito com

  • JavaScript
  • Three.js
  • GLSL
  • HTML/CSS
ResultResultado

Air you can read.Um ar que dá para ler.

An experimental piece that runs live in the browser, on desktop and phone, in English and Portuguese. You learn where a car speeds the air up and where it loses energy without a single chart.Uma peça experimental que roda ao vivo no navegador, no computador e no celular, em inglês e português. Você entende onde um carro acelera o ar e onde perde energia sem nenhum gráfico.

What I cut: the backlit body, the first car and the first wind, which looked unreal. The wind speeds were also kept between 60 and 250 km/h so the numbers stay believable.O que eu cortei: a carroceria em contraluz, o primeiro carro e o primeiro vento, que pareciam irreais. As velocidades também ficaram entre 60 e 250 km/h para os números continuarem críveis.