[{"data":1,"prerenderedAt":122},["ShallowReactive",2],{"project-pt-metro5p":3},{"id":4,"title":5,"author":6,"body":7,"company":100,"date":101,"description":102,"extension":103,"highlight":104,"meta":105,"navigation":106,"path":107,"priority":108,"role":109,"section":110,"seo":111,"sitemap":112,"stem":113,"tags":114,"thumbnail":37,"year":120,"__hash__":121},"work\u002Fwork\u002Fpt\u002Fmetro5p.md","metro5p","Salguento",{"type":8,"value":9,"toc":92},"minimark",[10,15,19,23,31,41,48,57,61,68,76,80,83],[11,12,14],"h2",{"id":13},"projeto","Projeto",[16,17,18],"p",{},"metro5p é um experimento de arte generativa que recria, em código, obras presentes em estações do Metrô de São Paulo. A aplicação reúne duas releituras interativas e permite alterar dimensões e paletas antes de gerar uma nova composição no navegador.",[11,20,22],{"id":21},"releituras","Releituras",[16,24,25,26,30],{},"L2-BVM parte de ",[27,28,29],"em",{},"Des-Aceleração"," (1991), de Fernando Lemos, presente na estação Brigadeiro. O algoritmo divide o canvas em uma grade regular, separa cada célula em dois triângulos e combina cores aleatórias com gradientes direcionais. A orientação variável das diagonais e as regras que evitam algumas combinações mantêm o ritmo visual da referência sem repetir uma imagem fixa.",[16,32,33,38],{},[34,35],"img",{"alt":36,"src":37},"Composição do experimento L2-BVM.","\u002Fimg\u002Fwork\u002Fmetro5p\u002Fcover-metro5p.png",[27,39,40],{},"Variação gerada a partir de uma grade triangular.",[16,42,43,44,47],{},"L2-BVP interpreta ",[27,45,46],{},"Cores e Formas"," (1991), de Cícero Dias. Uma grade de colunas com larguras ponderadas é subdividida em células de alturas variáveis. Cada área recebe um triângulo ou quadrilátero irregular, enquanto formas nas bordas superior e inferior ajudam a estruturar a composição.",[16,49,50,54],{},[34,51],{"alt":52,"src":53},"Composição do experimento L2-BVP.","\u002Fimg\u002Fwork\u002Fmetro5p\u002Fl2-bvp.png",[27,55,56],{},"Variação construída com células e polígonos irregulares.",[11,58,60],{"id":59},"arquitetura-técnica","Arquitetura técnica",[16,62,63,64,67],{},"O projeto é uma aplicação multipágina estática feita com HTML, CSS e JavaScript, sem framework ou etapa de build. Cada página carrega o p5.js 1.4.1 por CDN e executa seu sketch em ",[27,65,66],{},"instance mode",". Os formulários convertem as cores selecionadas para RGB, removem o canvas anterior e iniciam uma nova renderização com os parâmetros informados.",[16,69,70,71,75],{},"A página inicial funciona como catálogo, enquanto navbar e rodapé são fragmentos HTML compartilhados e carregados com ",[72,73,74],"code",{},"fetch",". Por isso, a execução local requer um servidor HTTP; abrir os arquivos diretamente não garante que esses componentes sejam carregados.",[11,77,79],{"id":78},"escopo","Escopo",[16,81,82],{},"A geração acontece inteiramente no navegador, sem backend ou persistência. O projeto prioriza exploração visual e variação procedural: uma mesma paleta pode produzir composições diferentes a cada execução. A versão atual não inclui testes automatizados nem exportação direta do canvas.",[16,84,85],{},[86,87,91],"a",{":rel":88,":target":89,"href":90},"noreferrer","_blank","https:\u002F\u002Fgithub.com\u002Fsalguento\u002Fmetro5p","GitHub",{"title":93,"searchDepth":94,"depth":94,"links":95},"",2,[96,97,98,99],{"id":13,"depth":94,"text":14},{"id":21,"depth":94,"text":22},{"id":59,"depth":94,"text":60},{"id":78,"depth":94,"text":79},"Autoral","2025-07","Releituras generativas de obras do Metrô de São Paulo com p5.js","md",false,{},true,"\u002Fwork\u002Fpt\u002Fmetro5p","4","Desenvolvedor Criativo","lab",{"title":5,"description":102},{"loc":107},"work\u002Fpt\u002Fmetro5p",[115,116,117,118,119],"JavaScript","p5.js","Canvas","Arte Generativa","HTML\u002FCSS",2025,"9T7UmyJRfgMBSYLQlwf5_EScKLmh9VLuHw4pFgWQ-qU",1785351609893]