— LAB · OPEN SOURCE & EXPERIÊNCIAS

Coisas que fizemos por nenhuma boa razão.

Open source. Demos a meio. Shaders que demoraram um fim-de-semana. Ferramentas que usamos internamente e nos esquecemos de manter secretas.

— DEMO 01

Orbital Trace

80 pontos num anel a ciclar matiz. Canvas puro, ~30 linhas.

— DEMO 02

Flow Field

Partículas a flutuar por um campo vectorial estilo Perlin. Recomeça ao clicar.

— DEMO 03

Truchet Tiles

Tiles de arco aleatórios compõem texturas em loop infinito.

2026 · GITHUB ↗

Escala de tipografia responsiva com CSS clamp(), sem media queries

Uma escala modular fluida que se redimensiona entre dois viewports com uma única declaração clamp() por título. Escolhe base + razão, copia CSS + config Tailwind.

HTMLCSSclamp()Modular scaleTypography
2026 · GITHUB ↗

Gerador de sistema de cor: um hex, quatro formatos de output

Cola um hex de marca. Obténs uma escala de 11 passos, tokens semânticos, pareamento dark-mode, e output pronto a copiar para CSS, Tailwind, SCSS e Figma Tokens.

HTMLJavaScriptHSLDesign tokensTailwind
2026 · GITHUB ↗

Proxy de imagem PHP com negociação WebP

Um proxy PHP de 30 linhas que vai buscar imagens a um CMS headless, negoceia WebP via header Accept e cacha-as com 30 dias de cache imutável. Tudo num único ficheiro.

PHPcURLWebPCloudflare
2026 · GITHUB ↗

Sistema de capas SVG generativas

A imagem de capa deste card foi renderizada server-side a partir do teu slug. Sem designer, sem upload, sem pipeline de assets. Geometria determinística + tipografia + cache.

PHPSVGcrc32Cache-Control
2026 · GITHUB ↗

i18n em PHP estático à escala do OVH

Uma stack i18n que funciona em hosting partilhado barato onde o QSA do mod_rewrite parte: parsing do URL em PHP + reescritor de links em JS no boot. Sem frameworks, sem build step.

PHPJavaScriptApacheCockpit CMS
2026 · GITHUB ↗

Testador de pipeline de cor de marca

Um pequeno viewer WebGL que mostra uma única cor hero renderizada sob três condições de luz lado a lado. Coloca um hex, vê se sobrevive à manhã nublada de Lisboa.

WebGLThree.jsGLSLVue 3
2026 · GITHUB ↗

Script de auditoria a tours Matterport

Um pequeno script Node que percorre um tour Matterport e sinaliza problemas comuns de qualidade: salas inacessíveis, hotspots em falta, transições partidas. Ferramenta interna que agora entregamos a clientes.

Node.jsMatterport SDKTypeScript
2026

Painel de código ao vivo — o que vês, enquanto lês

O painel "feito enquanto lês" na homepage é código real, a correr. Eis como funciona o canvas ao vivo + token stream — e o que aprendemos a afiná-lo para repaint sub-100ms.

Canvas 2DrequestAnimationFrameJavaScript