O grafo de Estilo
Cada ajuste na etapa Estilo é um botão de uma passada: o sombreamento, os traços, as arestas da malha, a limpeza, as cores em que a folha sai. A etapa Estilo é esse grafo: as passadas como caixas com conexões entre elas, cada uma mostrando a imagem que produz e trazendo seus próprios ajustes, então você vê o processamento e não só o resultado. Você pode colocar as passadas em outra ordem, mandar uma por uma máscara ou misturar duas.
A cadeia de imagens, das cores do modelo até a folha pronta, é a explicação do pipeline. O botão do olho as desliga numa máquina lenta.
Você não precisa trabalhar na tela do grafo: escolher um nó mostra os mesmos ajustes no Inspetor à direita, então um controle deslizante está sempre ao alcance. Sem nenhum nó escolhido, o Inspetor mostra o nó Paleta, que traz as cores.
Estilos. Um projeto tem quantos Estilos quiser, cada um com seu nome e um grafo de Estilo próprio, nenhum deles de uma câmera. O que está na tela é o escolhido na lista Estilos ou no seletor Estilo do cabeçalho da janela, desenhando a câmera e a ação do cabeçalho. Novo Estilo, sob a lista, faz uma cópia do mostrado, com o nome dele (Pixel Art 2). O menu de clique direito de uma linha a renomeia, a duplica (Duplicar), a exclui (Excluir NOME…, que pergunta antes: também o primeiro, enquanto restar outro), Salvar kit… (Salvar o Estilo como kit) o grava como kit, com o grafo e a paleta dentro, e Usar kit… (Usar um kit de Estilo) traz para este projeto um salvo de outro. Arraste uma linha para cima ou para baixo para reordenar a lista. Salvos na biblioteca de pipelines, eles aparecem na biblioteca de nós em Meus pipelines; os do próprio projeto ficam em Pipelines, ao lado do nó Pixelizar.
Todo grafo tem sua biblioteca de nós à sua própria esquerda, quando o painel é largo o bastante: os grafos de Cena, ação, Estilo e asset igualmente. Ela lista tudo o que o grafo pode conter, as entradas e as saídas primeiro, depois o resto por grupo, com uma linha sobre o que cada um faz; digite em Localizar para filtrar. Clique num deles para adicioná-lo onde o grafo o coloca, já conectado — ou arraste-o para a tela para colocá-lo onde você soltar.
Um projeto que nunca muda um nó continua sem guardar grafo algum e renderiza exatamente como antes.
O grafo com que você começa
É o próprio pipeline do Pixor, conectado:
Da esquerda para a direita, na ordem em que o trabalho acontece, para que as conexões sigam para a frente e se cruzem o mínimo possível.
-
Câmera é onde o grafo começa: a câmera para a qual este Estilo desenha. Cada câmera que aponta para o Estilo executa o grafo uma vez, do seu próprio lado.
-
Renderização em camadas recebe a câmera: o que ela renderizou da ação neste quadro, antes de qualquer etapa de pixel art, com cada uma das suas oito camadas numa saída própria — albedo, normals, depth, part, material, coverage, key light, shadow. O sombreamento lê normals e shadow, os traços depth, normals e part. É um grupo de átomos: abra-o e ele é a moldura de um nó Renderizar (um quadro em camadas) e oito nós Camada, cada um tirando do quadro a camada escolhida nele. As conexões mostram o que lê o quê, e são reais: conecte um Campo de ruído à shadow de Luz e sombra e a sombra passa a ser esse ruído; sem conexão, uma passada lê a própria renderização da câmera.
-
Paleta é onde as cores do quadro são escolhidas: quantas cores base e faixas de luz, o pontilhado, uma paleta própria, o deslocamento de matiz. Saída não tem nada: ela é o quadro.
-
Luz e sombra transforma a luz num degrau da rampa de cores de cada pixel. É um grupo de átomos que você também tem, nesta ordem: Faixas de luz (a faixa da luz principal em que cada pixel cai, pontilhada nas bordas, retida entre os quadros perto de uma borda), Luz do mundo (lâmpadas, linhas de onda, sombras de nuvens, feixes de luz, espuma da costa), Brilhos, Brilho, Deslocamentos de rampa (e o ciclo de cores), depois Cores de sombreamento, que transforma o sombreamento em cores. A conexão entre eles leva um sombreamento: a rampa de cada pixel e o seu degrau nela.
-
Arte de traço encontra a silhueta, os traços internos e os vincos. Também é um grupo: Silhueta, Arestas (traços internos, vincos, dobras convexas), Limpar traços (fragmentos curtos descartados, cantos e duplicados removidos) e Cores dos traços, com uma conexão lines entre eles.
Os parâmetros de um grupo são os ajustes dos átomos dentro dele. No nó, ou a partir de um script, definir um deles o define em cada átomo interno que o tem — pxr graph set my.pixor --node light-and-shade --set dither=0.5, --node line-work --set min_inner_line=3 — então um grupo que você mesmo monta a partir de átomos é ajustado do mesmo jeito que os que vêm prontos. Dê um clique duplo num grupo (fora do título), ou pressione a seta no título, para abri-lo e ver, ou reconectar, aquilo de que ele é feito.
- Wireframe aparece também quando o visual wireframe está ligado, e vai para a terceira entrada de Combinar. É um grupo de dois átomos: Caminhos das conexões (onde as arestas da malha cruzam o quadro, e se uma atrás da superfície é omitida, pontilhada ou mais escura), depois Cores dos fios.
- Combinar sobrepõe as camadas, decide o que fica sob as conexões e afina os traços uns contra os outros.
- Limpeza remove pixels soltos e suaviza os cantos dos traços. É um grupo de dois átomos: Pixels soltos (sequências de uma cor pequenas demais para manter, e quantas passadas as procuram) e, depois, Suavizar cantos (quais cantos dos traços descem um degrau na rampa).
- Saída é o que o grafo produz: o sprite desta câmera neste momento da ação, que os nós Sprites do grafo de asset depois cortam em listas de sprites. Ela não tem ajustes; as cores ficam na Paleta antes dela.
Esses nós chamam exatamente o mesmo código que o pipeline, então o grafo inicial produz exatamente os pixels que você tinha antes. Os testes golden do próprio Pixor são renderizados das duas formas e comparados, sempre.
Trabalhando nele
Todo grafo funciona do mesmo jeito — os grafos de Cena, ação, Estilo e asset igualmente: a mesma barra, o mesmo menu de clique direito, as mesmas teclas e gestos. Esta tabela vale para todos eles, nos quatro. Cada edição é um passo do histórico (Ctrl+Z a desfaz), inclusive mover um nó; as teclas funcionam enquanto o ponteiro está sobre o grafo.
| Faça | Para |
|---|---|
| Arraste com o botão do meio (ou Alt e o esquerdo) | mover a vista |
| Rolar (ou pinçar) | zoom em torno do ponteiro, de um quarto do tamanho ao dobro, um passo igual ao da Vista 3D e da Vista 2D; Enquadrar e a primeira exibição de um grafo o ajustam |
| Quadro, ou Home | trazer todos os nós para a tela |
| Clique no título de um nó | escolhê-lo: seus ajustes aparecem também no Inspetor, e o meio mostra o que ele produz; onde nós se sobrepõem, o de cima |
| Shift+clique num nó | escolhê-la também, ou soltá-la |
| Arrastar o fundo | uma caixa: cada nó que ela toca é escolhido (Shift mantém os já escolhidos) |
| Arrastar um nó | movê-lo, e cada nó escolhido junto com ele |
| +, ou clique com o botão direito na tela › Adicionar um nó | a lista da biblioteca de nós, por grupo: o que é escolhido entra; pelo clique direito, onde você clicou. Usar kit… (Adicionar um kit como grupo), no topo dela, insere um kit como um grupo |
| Uma linha da biblioteca descendo pela esquerda | clique para adicioná-lo onde o grafo o coloca, já conectado; arraste-o para a tela para colocá-lo onde você soltar |
| Arraste do ponto redondo à direita de um nó até um ponto à esquerda de outro | conectá-los; enquanto você arrasta, cada ponto em que a conexão encaixa fica destacado |
| Soltar uma conexão sobre a tela vazia | um menu dos nós que se encaixam: digite para filtrar, Enter pega o primeiro |
| Arrastar um ponto de entrada para fora | desconectá-la; solte-a em outra entrada para mover a conexão para lá |
| Clique numa conexão e depois em Delete | cortá-la; a conexão sob o ponteiro (ou a escolhida) também mostra um × no meio que a corta com um clique |
| F2, ou um clique duplo no título de um nó | renomeá-lo: seu próprio nome no título (o de um grupo é o nome dele); vazio, volta a se chamar pelo que é |
| Ctrl+D | duplicar os nós escolhidos, abaixo deles, conectados como estão e lendo o que eles leem |
| Ctrl+C, Ctrl+V | copiar os nós escolhidos e colá-los sob o ponteiro — em qualquer grafo do mesmo tipo: outro Estilo, outra ação, outro pipeline de asset, o interior de um grupo. Nós de um tipo de grafo não entram em outro, e a linha de status avisa |
| − (Excluir o nó escolhido), ou Delete | excluir o nó escolhido; o que o lia passa a ler o que ele lia, então uma cadeia continua uma cadeia |
| Grupo, ou Ctrl+G | os nós escolhidos (e o escolhido principal) viram um grupo, aberto |
| A seta à direita do título de um grupo, ou um duplo clique no grupo fora do título | abri-lo no lugar, ou recolhê-lo |
| Salvar kit… | o grupo escolhido como kit, ou — sem grupo escolhido — o grafo inteiro (o título da caixa de diálogo diz qual) |
| Organizar | reorganizar todos os nós, da esquerda para a direita, na ordem em que o trabalho acontece |
| Nota | pôr uma nota ao redor do nó escolhido, ou na vista |
| O olho, ou clique direito › Imagens dos nós | mostrar ou ocultar a imagem que cada nó produz |
| Clicar com o botão direito na tela | todos os acima, com seus atalhos, e o que cada grafo tem de próprio: Mostrar só o que uma predefinição define, Mostrar os ajustes de todos os nós e Voltar ao grafo da predefinição do grafo de Estilo; Voltar a uma cópia do grafo de cena; Voltar a uma folha do grafo de asset |
O que é a imagem de um nó, grafo por grafo: no grafo de Estilo, os pixels que ele produz; no grafo de cena, os objetos que ele repassa, vistos de cima; no grafo de ação, o que a saída do nó faz ao longo de uma passada (abaixo); no grafo de asset, os quadros que uma lista repassa, ou a folha ou o arquivo que ele grava.
No grafo de ação, cada tipo de nó tem a imagem que mais diz sobre ele:
| Nó | Sua imagem |
|---|---|
| Clipe, Quadros-chave, Rotina, Ação | o modelo em quatro momentos igualmente espaçados do que ele toca, da esquerda para a direita — um loop ao longo de um ciclo, o último momento logo antes de recomeçar — todos vistos por uma câmera que abrange todas as poses, do ângulo da câmera exibida |
| Girar, Flutuar, Balançar, Pulsar, Deslizar, Onda, Ruído, Rampa, Tempo da cena | uma curva de cada número que ele realmente muda, do menor ao maior: um Girar, uma rampa; um Flutuar, uma onda; números que mudam igual são uma linha só (os três tamanhos de um Pulsar) |
| Filtros, Aplicar a, Saída, grupos | como o que eles repassam: as poses quando isso move mais de três números (um clipe, um clipe mesclado com um giro, retido de dois em dois), uma curva quando é um movimento só (um Degrau sobre um Girar desenha sua escada) |
As curvas são coloridas por tipo — posições em azul, rotações em âmbar, tamanhos em verde, o resto em rosa —, no máximo seis delas, as que vão mais longe; com o ponteiro sobre a imagem, ela nomeia cada linha e diz quantas outras existem. Poses recorrem a curvas quando o que se move não é parte do modelo (uma câmera, a luz). Um nó que não muda nada — uma Constante, um clipe que não está lá — mostra Sem movimento onde estaria sua imagem. Uma linha atravessando uma curva, ou uma barra sob uma pose, acompanha o tempo na Linha do tempo enquanto ela toca.
As imagens são desenhadas pelo próprio rasterizador de CPU do Pixor, pequenas, numa thread própria, a do nó escolhido primeiro: o grafo nunca espera por elas. Um nó mantém a imagem que tinha até a próxima ficar pronta, então nada pisca; uma edição que não muda o que um nó repassa não o redesenha. Um nó leva cerca de 25 ms com o cavaleiro e 40 ms com o FBX humanoide de teste, então vinte nós são todos desenhados em até um segundo após uma edição.
Notas são caixas atrás dos nós com as suas próprias palavras no topo: para que serve esta parte do grafo, o que tentar a seguir. Digite direto nela. A alça no canto superior esquerdo a move junto com todos os nós dentro dela, então uma nota serve tanto para manter unida uma parte de um grafo grande quanto para explicá-la; o canto inferior direito a redimensiona, e o sinal de menos a remove (os nós ficam). Uma nota não muda nenhum pixel.
Enquanto um controle deslizante de um nó está sendo arrastado, a imagem desse nó é refeita primeiro, depois a do nó escolhido, depois o resto em ordem — então a mudança aparece de imediato onde você está olhando.
Cada tipo de conexão tem sua própria cor, então o que encaixa onde fica visível sem precisar ler: uma camada de cores da paleta, uma máscara, um número por pixel, uma normal, uma rampa, uma paleta, uma câmera, uma renderização, um sombreamento, traços, caminhos de fio e os valores (ligado/desligado, número, palavras). Uma entrada que não tem nada e precisa de algo fica circulada em vermelho, e a linha na parte de baixo diz o que está errado. Uma conexão do tipo errado, e uma que faria o grafo andar em círculo, são recusadas quando você solta.
O que são os nós
A biblioteca e o menu Adicionar um nó os listam nestes grupos:
| Grupo | Nós |
|---|---|
| Entradas | Câmera, Renderizar, Camada (albedo, normais, profundidade, ID de parte, ID de material, cobertura, luz principal ou sombra de uma renderização), Imagem, Luz de preenchimento, Movimento, Pontilhado de superfície, Fase do loop, Rampa da cor, Posição na rampa, os canais de material Metálico, Rugosidade, Emissivo, Oclusão, Transparente, e Pixels da borda (onde as próprias arestas da malha cruzam o quadro na frente de tudo) |
| Passadas | Sombreamento, Traços, Arestas da malha, Combinar, Limpeza, Para a paleta — cada um uma passagem inteira numa caixa |
| Sombreamento | Faixas de luz, Luz do mundo, Brilhos, Brilho, Deslocamentos de rampa, Cores de sombreamento e o acabamento de desenho à mão: Formas, Desfazer faixas, Reflexo, Suavizar faixas, Hachura |
| Traços | Silhueta, Arestas, Limpar traços, Cores dos traços, Bordas de cor, Espessura do traço |
| Wireframe | Caminhos das conexões, Cores dos fios |
| Limpeza | Pixels soltos, Suavizar cantos, Limpar silhueta |
| Cor | Paleta, Cor mais próxima (cada pixel na cor da paleta mais próxima da sua, sem considerar rampas), Descer a rampa, Degrau onde mascarado, Achatar, Pontilhado de paleta, Mapa de rampa, Cores do tile, Movimento subpixel |
| Máscaras | Limiar, Por parte, Por material, Pela orientação, Ruído, Padrão, Pixels sólidos, Não, E, Ou |
| Misturar | Escolher por máscara, Mistura de pontilhado, Camada sobre |
| Matemática | Número, Adicionar, Subtrair, Multiplicar, Dividir, Menor, Maior, Sem sinal, Fração, Número inteiro, Retenção entre, Remapear, Misturar, Degrau em, Degrau suave, Concordância, Comprimento, Como número, Campo de ruído (o ruído que a máscara Ruído limiariza, como número) |
| Espaço | Deslocamento, Desfoque, Inclinação, Crescer, Encolher, Cavidade — cada um diz até que distância ao redor de um pixel ele olha, o que mantém exatas as emendas dos tiles |
| Valores | veja Cada propriedade é uma entrada |
| Grupos | Entrada e Saída, as portas dentro de um grupo |
| Saídas | Saída, CRT (uma imagem para olhar, nunca um sprite) |
Acima deles, a biblioteca lista Pipelines (os Estilos do projeto, e Pixelizar), Meus pipelines e Meus nós.
Uma imagem é uma camada sua: uma textura de papel, um padrão, um céu pintado ou um logotipo, cada pixel com a cor da paleta mais próxima da cor da imagem, nos próprios pixels do sprite a partir de onde é colocada, ou repetida em tiles por todo o quadro. Escolher por máscara a coloca onde você quiser, Camada sobre a põe por cima. A imagem é lida uma vez e guardada no nó, então um visual salvo ou um kit a carrega junto. A partir de um script:
pxr graph add my.pixor --node picture --set file=logo.png --set tile=false # node 8 on a new project
pxr graph add my.pixor --node layer-over --in under=4 --in over=8 # node 9: the logo over the palette's frame
pxr graph wire my.pixor --from 9 --to 5 --slot layer # into the Output
Misturar nunca cria uma cor nova. O Pixor trabalha no espaço de índices de paleta, então uma mistura escolhe um pixel ou o outro; ela nunca funde dois num terceiro que não está na paleta. Mistura de pontilhado dispõe A e B num padrão ordenado, que é como um pixel artist mistura.
Um acabamento feito à mão
Alguns nós fazem o que um pixel artist faz à mão depois que o sombreamento está pronto. Nenhum está no grafo com que você começa; adicione os que quiser. Os que atuam num sombreamento ficam entre Deslocamentos de rampa e Cores de sombreamento (abra o grupo Luz e sombra), na ordem abaixo; os que atuam em traços, entre Arestas e Cores dos traços (abra Arte de traço). Cada padrão que eles aplicam fica na superfície, então se move com o modelo em vez de rastejar sobre ele, e nada do que fazem fica fora da paleta — exceto CRT, de propósito. Os que decidem pelo que está em volta de um pixel ou por onde ele está na superfície (Formas, Reflexo, Hachura, Desfazer faixas) mantêm o que decidiram no quadro anterior onde a superfície não se moveu, então não acrescentam tremulação; um clipe em loop passando por um grafo com um deles dá uma volta primeiro, para que o primeiro quadro siga o último.
| Nó | Conecte | O que ele faz | Ajustes |
|---|---|---|---|
| Formas | sombreamento → sombreamento | Formas de luz e sombra limpas como se fossem desenhadas: uma forma de uma faixa menor que Mínimo assume a faixa da maior parte do que está ao seu redor; depois, cada pixel assume a faixa da maioria dos pixels dentro de Suave dele, o que remove línguas dessa largura e suaviza as bordas. Só pixels da mesma parte e da mesma rampa contam uns para os outros, e uma faixa precisa da maior parte do que está ao redor de um pixel, então uma mancha de uma cor própria fica para Pixels soltos. Um pixel cuja superfície não se moveu e cuja luz é a mesma mantém a faixa que recebeu no quadro anterior. | Mínimo, Suave |
| Desfazer faixas | sombreamento (+ traços) → sombreamento | Uma borda de faixa que corre ao longo da silhueta, da borda de uma parte ou de um traço, a uma distância constante dela — o visual de almofada — é escalonada em um pixel em trechos, como uma mão faria: na metade, dois pixels de cada quatro ao longo dela, contados na superfície para que os degraus se movam com ela. | Dentro de (pixels a partir da borda), Quanto |
| Reflexo | sombreamento (+ máscara, + luz) → sombreamento | Um brilho deliberado em cada parte (a parte da renderização, onde quer que esteja no quadro) onde a máscara está definida, no seu pixel mais claro da faixa de cima, mantido onde estava no quadro anterior quando dois são igualmente claros; Por parte pede mais, cada um pelo menos Afastados dos outros. Sem conexão, a luz é a luz principal. | Tamanho (1 ou 2), Por parte, Afastados, Só o reflexo (os outros brilhos ali descem para a faixa mais alta) |
| Suavizar faixas | sombreamento → sombreamento | Os cantos da escada entre duas faixas suavizados: entre faixas que saltam dois degraus ou mais (sombras projetadas, lâmpadas, brilhos), o canto assume o degrau intermediário; entre faixas vizinhas, com Pontilhado, os cantos numa cor de um xadrez aplicado à superfície assumem a outra faixa — um meio-termo pontilhado, dentro da paleta, que a limpeza deixa em paz. | Ambos os lados, Pontilhado |
| Hachura | sombreamento → camada | As cores do sombreamento, com linhas diagonais, hachura cruzada ou pontos sobre cada faixa abaixo da de cima, mais densos quanto mais escura a faixa, no degrau abaixo ou na cor do traço. Uma faixa hachurada é um padrão, como uma zona de pontilhado: a limpeza deixa em paz os pixels entre os traços. Ela substitui Cores de sombreamento. | Padrão, Na cor do traço |
| Cavidade | (normals, depth) → número | O quanto a superfície se dobra para dentro: acima de 0 num vinco, abaixo de 0 numa crista. Aplique um Limiar e conecte-a a Degrau onde mascarado com −1 para vincos um degrau mais escuros. Sem conexão, ela lê a renderização. | Raio, Salto de profundidade |
| Bordas de cor | (lines, albedo) → lines | Um traço onde a cor pintada muda dentro de uma parte, no lado mais escuro para ter um pixel de largura, colorido como os vincos (então dê a Cores dos traços uma cor de vinco). Ponha-o antes de Limpar traços, que mantém os traços livres de cantos e duplicações. Sem conexão, ele lê as próprias cores do modelo. | Contraste |
| Espessura do traço | traços → traços | A silhueta com dois pixels de espessura no lado oposto à luz, e anéis de contorno de Borda ao redor dela, na cor do traço externo ou, com Cor própria, em Cor (a mais próxima da paleta). Onde um traço interno encontra a silhueta, ele continua com um pixel. | Lado da sombra, Borda, Cor própria, Cor |
| Limpar silhueta | camada → camada | Pontas de um pixel removidas do contorno (não a ponta de uma parte fina), entalhes e buracos de um pixel preenchidos com a cor em volta — e não com a do contorno, onde isso o deixaria com dois pixels de espessura. | Pontas, Entalhes |
| Pontilhado de paleta | camada (+ luz) → camada | A própria cor de superfície de cada pixel, iluminada pelo fator conectado (1 é como está), como o par de cores da paleta cuja mistura chega mais perto dela (o pontilhado de Yliluoma), aplicado pelo limiar da superfície. Os traços ficam; o resto é um pontilhado que a limpeza deixa em paz. | Dispersão do par: mais alto se limita a pares próximos |
| Mapa de rampa | número (+ rampa) → camada | A rampa de um artista lida de uma faixa de imagem: o número de 0 a 1 escolhe ao longo dela, do escuro ao claro. Uma faixa de várias linhas dá a cada rampa uma linha própria. Sem imagem, as próprias faixas da cor. Conecte Luz principal por um Remapear a ele. | Arquivo |
| Cores do tile | camada → camada | O quadro em tiles a partir do canto superior esquerdo, cada um limitado a um certo número de cores, como o NES dispõe tiles de 8 × 8 de 3: as cores mais usadas ficam (um pixel contrariado por três dos seus vizinhos conta como deles, então um pixel de borda do rasterizador não muda a escolha), as demais pegam a mais próxima delas, e um pixel sozinho na sua cor pega a dos vizinhos no tile. | Tile, Cores |
| Movimento subpixel | camada (+ movimento) → camada | Uma parte que se move menos pixels por quadro do que Ainda abaixo (uma respiração, uma oscilação) mostra isso nos pixels de borda: um só parcialmente coberto desce um degrau na rampa, e o pixel vazio em que ela está avançando assume essa cor quando fica um quarto coberto. Em qualquer lugar do grafo: a borda é a da renderização, então funciona também depois de Combinar, com o contorno ficando como está (só mudam os pixels de borda dentro dele). | Ainda abaixo, Degraus |
| CRT | camada → camada | Sua imagem é o quadro numa tela — scanlines, uma máscara de sombra ou a grade de um LCD — alguns pixels de tela por pixel. Essa imagem está fora da paleta, então serve só para olhar e para imagens paradas: a camada segue para o sprite inalterada, e nenhuma folha ou exportação leva a tela. Escolha-o e a Vista 2D mostra a tela, primeiro em passos inteiros; pxr stages MODEL --style KIT --node crt a grava como crt.still.png. Coloque-o por último, antes de Saída. |
Tela, Tamanho |
A partir de um script, como qualquer nó:
pxr graph add my.pixor --node tidy-silhouette --in layer=3 # node 8, after Cleanup
pxr graph wire my.pixor --from 8 --to 4 --slot layer # and into the palette
Reflexo e os outros nós que recebem um sombreamento ficam dentro de Luz e sombra, onde o sombreamento está (fora dele o grupo entrega uma camada pronta): abra o grupo no app e adicione-os ali, ou salve o grupo como kit, edite-o e coloque-o de volta com pxr graph swap --kit.
Cada um tem um caso golden (tests/golden/cases.txt, hand-*): o grafo com que o visual começa e o nó inserido, como um kit de grafo de Estilo que pxr render --style lê.
Cada propriedade é uma entrada
Os ajustes de um nó são as suas propriedades: linhas dentro do nó, cada uma com uma porta à esquerda. Defina uma no nó, ou conecte um valor a ela, e a linha fica acinzentada e mostra o que a conexão traz. Os valores são nós próprios, em Valores na biblioteca: Valor numérico, Ligado/Desligado, Ângulo, Texto, e a matemática sobre eles (Somar valores, Subtrair valores, Multiplicar valores, Dividir valores, Valor menor, Valor maior, Está acima, Oposto, Ambos ligados, Qualquer um ligado, Escolher um valor), cujos operandos também são propriedades. Um Ligado/Desligado conectado a três nós liga ou desliga os três de uma vez.
As propriedades vêm em grupos com nome (o De e o Para de um Remapear, as Cores e o Localizando das Arestas); clique no nome de um grupo para recolhê-lo. Uma conexão para uma propriedade recolhida chega ao nome do grupo.
As propriedades de um grupo são suas entradas de valor. Agrupe nós cujas propriedades são alimentadas por valores, e cada valor vira uma entrada do grupo, com o nome da propriedade em que entra e listada depois das outras entradas do grupo: uma linha na caixa do grupo, definida ali (o que define cada propriedade interna conectada a ela) ou conectada de fora.
Os grupos que as seções de um Estilo definem — Luz e sombra, Arte de traço, Wireframe, Limpeza — são definidos por essas seções e também pelas propriedades dos átomos dentro deles; a Paleta são as cores do quadro, que a seção Cores define.
Uma vez por material, uma vez por parte
Um nó roda uma vez para o quadro inteiro, a menos que você diga o contrário. Escolha um nó e defina Trechos no Inspetor como Uma vez por material ou Uma vez por parte, e ele roda uma vez para cada um, vendo só aquele a cada vez, como se o resto do quadro estivesse vazio; os pedaços são remontados pixel a pixel. O título dele então diz cada material ou cada parte.
É isso que impede um desfoque, um crescimento, um contorno ou uma limpeza de passar de uma parte para a seguinte: um nó Traços executado por parte desenha um traço em volta de cada parte, enquanto o mesmo nó executado uma vez desenha um em volta do modelo inteiro. Um grupo configurado assim executa tudo o que está dentro dele assim. Um nó executado por parte não olha o quadro anterior, então não tem histerese de tremulação.
O mesmo ajuste, na linha de comando ou num arquivo de visual, é o scope do nó: pxr graph set my.pixor --which style --node cleanup --set scope=object (frame, material ou object).
A imagem de um nó como uma camada própria
O sprite é o que o nó de saída recebe, mas a imagem de qualquer nó também pode ser gravada. Escolha o nó e digite um nome em Saída extra no Inspetor: o título passa a dizer layer e o nome, e toda exportação a leva ao lado de lines e flat — uma folha própria com o nome dela na exportação layers (hero_rim.png), e uma camada oculta do .aseprite, que uma nova renderização substitui como as outras camadas do Pixor. Uma luz de contorno, uma máscara que um shader lê, os traços de uma parte: o que quer que um nó produza. Apague o nome e ela deixa de ser uma saída. Ela não pode receber um nome que uma folha já tenha (final, lines, flat, normal, depth, emission e similares) nem o de outra saída extra.
A partir de um script: pxr graph extra my.pixor --node line-work --name rim, e --drop para removê-lo.
Um exemplo: tinta desgastada
Achate o sombreamento e depois escolha entre a versão sombreada e a chapada com uma máscara de ruído, e a superfície parece pintura gasta em manchas:
Light and shade --+---------------+
| +--> Choose --> Combine --> ...
+--> Flatten ---+
Noise ----------------------------+
- Adicione Achatar e conecte Luz e sombra a ele.
- Adicione Ruído; defina o tamanho dele como cerca de 5 pixels.
- Adicione Escolher por máscara: Luz e sombra em A, Achatar em B, Ruído na máscara.
- Arraste a conexão para fora da entrada shading de Combinar e conecte Escolher por máscara no lugar.
Grupos: uma caixa que você pode abrir
Um grupo é um grafo usado como um nó. O Pixor vem com Pixelizar, todo o pipeline acima numa única caixa (na biblioteca, em Pipelines), e os grupos de que é feito o grafo com que você começa: Renderização em camadas, Luz e sombra, Arte de traço, Wireframe e Limpeza — com nomes distintos das passagens Sombreamento e Traços, que fazem numa caixa o que os grupos fazem em etapas. Nenhum é um embutido privilegiado.
Um grupo abre no lugar, em todo grafo. Dê um clique duplo nele fora do título, ou pressione a seta à direita do seu cabeçalho (um grupo é o único nó que tem uma): o próprio grupo vira a moldura do grafo de que é feito. Um grupo dentro de um grupo aberto abre do mesmo jeito, dentro da sua moldura. O cabeçalho atravessa o topo, os parâmetros ficam descendo pela esquerda e, onde estava a imagem, os nós internos são dispostos, no mesmo grafo. As conexões atravessam a moldura só pelos dois lados. O que alimenta o grupo chega às suas entradas, à esquerda, e sai de uma âncora à direita de cada uma, onde ficava a borda da caixa fechada, para os nós internos que a leem. Cada saída é uma âncora na borda direita da moldura, na altura do que a produz lá dentro, e tudo o que lê essa saída é conectado a partir dali. Nada de dentro sai da moldura, e os nós depois dela se afastam para abrir espaço — só na tela: o grafo guarda onde eles estavam. Cada nó interno é editado como qualquer outro: seus ajustes, sua imagem, suas conexões, seu nome; um nó colado ou solto dentro da moldura entra no grupo. A seta, de novo, o recolhe para uma caixa com sua imagem. Quais grupos estão abertos é coisa da janela, não do projeto.
Criando um grupo seu. Escolha os nós que vão nele — arraste uma caixa em volta deles, ou clique neles com Shift; o escolhido também conta — e depois Grupo (ou Ctrl+G): eles viram uma só caixa, com uma entrada para cada conexão que chega e, como saída, o resultado que o resto do grafo lia deles. Ele abre na hora; F2 dá um nome a ele. Salvar kit… na barra guarda o grupo escolhido como um kit seu (Salvar o grupo como kit; a caixa de diálogo de arquivo começa na pasta que a biblioteca lista em Meus nós), e a biblioteca o lista ali, em todo projeto, no grafo do seu tipo; sem nenhum grupo escolhido, ele guarda o grafo inteiro (Salvar o grafo de Estilo como kit). O Salvar kit… de todo grafo significa isso.
Um grupo viaja como kit como qualquer outro visual, e pxr graph flatten look.pixorkit o grava como os nós simples que ele representa, para que ele se leia como uma diferença em vez de uma caixa-preta.
Um visual salvo também é um grupo. + › Usar kit… coloca um que o Salvar kit… de um Estilo ou o pxr graph save gravou no grafo da tela como um único grupo: seu nó Saída vira a saída da caixa, uma camada, para você conectar — sobre o próprio resultado do grafo através de Camada sobre, por exemplo, ou num Escolher por máscara, para que uma parte do modelo ganhe outro visual. Dê um clique duplo para ver e alterar o visual lá dentro.
Com o que você pode construir
Além das passagens, a biblioteca traz os nós pequenos com que um visual é escrito: os nós de entradas, matemática, espaço, máscaras, cor e mistura acima.
Os grupos incluídos — Luz e sombra, Arte de traço, Wireframe e Limpeza — são feitos de átomos que fazem um só trabalho cada, com poucos controles: as faixas de luz, o comprimento mínimo de um traço interno, as próprias arestas do modelo, pixels soltos encontrados pela forma como se ligam. As passadas inteiras que eles substituem continuam na biblioteca, para um grafo que queira uma só caixa. Você ainda pode substituir qualquer um deles pela sua própria cadeia — conecte Luz principal a Remapear, Degrau em e Para a paleta e você escreveu seu próprio sombreamento, ou ponha Pixels da borda como máscara de um Escolher por máscara entre um visual chapado e outro um degrau acima, e você mesmo desenhou o wireframe.
Compartilhando um visual
Salvar kit… e Usar kit… de um Estilo levam um visual de um projeto para outro; o modelo, os clipes e as exportações ficam como estão. Um kit de Estilo leva o grafo também, então “todos os assets do meu jogo combinam” cobre um visual conectado.
Clique com o botão direito na tela › Voltar ao grafo da predefinição descarta o grafo e volta ao pipeline do Pixor. O projeto então não guarda grafo nenhum.
Todo grafo tem a mesma barra: o que ele mostra (o nome de um pipeline, o caminho de volta de uma rotina), depois + (adicionar um nó), − (excluir o escolhido), Quadro, Organizar, Nota, Grupo, Salvar kit… e o olho que mostra ou esconde as imagens dos nós — cada um deles funcionando em todo grafo.
O que ele não faz
- Sem nós de script e sem nós de GPU. Cada nó é uma função fixa das suas entradas, então o mesmo projeto dá os mesmos pixels sempre, hoje e daqui a dez anos (em outra máquina, quase sempre: veja as perguntas frequentes).
- Os nós nunca mudam sem você saber. Um grafo registra em qual versão de cada nó ele foi feito, e o comportamento antigo continua no Pixor sob a versão antiga.
- Não é um editor de imagens genérico. Estas são as etapas próprias do Pixor, tipadas para que só coisas que fazem sentido se conectem. Pintura, filtros e matemática arbitrária são coisa de programa de desenho.
Referência de nós
Cada nó dos quatro grafos, com o que faz, o que recebe e entrega, e cada ajuste com seu intervalo e valor padrão.
Grafo de Estilo
CâmeraRenderizarCamadaImagemLuz de preenchimentoMovimentoPontilhado de superfícieFase do loopRampa da corMetálicoRugosidadeEmissivoOclusãoTransparentePixels da bordaSombreamentoPosição na rampaTraçosFaixas de luzLuz do mundoBrilhosBrilhoDeslocamentos de rampaCores de sombreamentoSilhuetaArestasLimpar traçosPixels soltosCaminhos das conexõesCores dos fiosSuavizar cantosCores dos traçosArestas da malhaCombinarLimpezaPara a paletaPaletaDescer a rampaDegrau onde mascaradoAchatarLimiarPor partePor materialPela orientaçãoRuídoCampo de ruídoCor mais próximaPadrãoPixels sólidosNãoEOuEscolher por máscaraMistura de pontilhadoCamada sobrePintarNúmeroAdicionarSubtrairMultiplicarDividirMenorMaiorSem sinalFraçãoNúmero inteiroRetenção entreRemapearMisturarDegrau emDegrau suaveConcordânciaComprimentoComo númeroDeslocamentoDesfoqueInclinaçãoCrescerEncolherFormasDesfazer faixasReflexoSuavizar faixasHachuraCavidadeBordas de corEspessura do traçoLimpar silhuetaPontilhado de paletaMapa de rampaCores do tileMovimento subpixelCRTSaídaValor numéricoLigado/DesligadoÂnguloTextoSomar valoresSubtrair valoresMultiplicar valoresDividir valoresValor menorValor maiorEstá acimaOpostoAmbos ligadosQualquer um ligadoEscolher um valorRenderização em camadasLuz e sombraArte de traço
Grafo de ação
ClipeQuadros-chaveRotinaAçãoTempo da cenaConstanteOndaRuídoRampaGirarFlutuarBalançarPulsarDeslizarMatemáticaMesclarJuntarSequênciaDeslocamento no tempoVelocidadeRecortarRepetirInverterAtrasoDegrauLimiteRenomearSelecionarInstânciasAplicar aSaídaValor numéricoLigado/DesligadoÂnguloTextoSomar valoresSubtrair valoresMultiplicar valoresDividir valoresValor menorValor maiorEstá acimaOpostoAmbos ligadosQualquer um ligadoEscolher um valor
Grafo de asset
SpritesArquivo de imagemJuntarCamadaIntervalo de quadrosReterEspelharTagOrganizarPosicionarPilhaSobreposiçãoFolhaArquivoJSONArquivo AsepriteSpriteFrames do GodotMapa de normaisMapa de profundidadeMapa de emissãoCamadas de traço e chapadasPaletaGIF por clipeAPNG por clipeVídeo por clipeLight kitCartucho PICO-8RelatórioCamada de sombraVariantes de paletaCamadas de paper dollCamadas de paralaxeArquivo de textoArquivo ZIPTilesetÍconesArquivo de animaçãoJSON do tilesetTileSet do GodotTileset do TiledFolha de grade duplaAutotiles do GameMakerAutotiles do RPG MakerRuleTile do UnityProjeto LDtkVariantes de paleta dos tilesPrévia do mapaValor numéricoLigado/DesligadoÂnguloTextoSomar valoresSubtrair valoresMultiplicar valoresDividir valoresValor menorValor maiorEstá acimaOpostoAmbos ligadosQualquer um ligadoEscolher um valor
Grafo de cena
ImportarObjetoAnelLinhaGradeEspalharOlhar paraVariarReproduzirJuntarVisto porDiferençaUnirMoverEspelharSubdividirDeslocarCampo de alturaChanfroPousar no chãoNa superfícieNos pontosDefinir formaAtributoSelecionarSaídaFormaImagemTextoVolumeLâmpadaEfeitoItemObjeto de cenaMolaTerrenoRaminhosFolhagemÁguaNuvensCéuVentoFeixes de luzHoras do diaBlocosValor numéricoLigado/DesligadoÂnguloTextoSomar valoresSubtrair valoresMultiplicar valoresDividir valoresValor menorValor maiorEstá acimaOpostoAmbos ligadosQualquer um ligadoEscolher um valor
O que esta página descreve está na versão completa; a demo grátis no navegador fica no visual padrão e na folha PNG.
Testar no navegador Obter o Pixor