Como desenhar pixel art em grandes formatos. Pixel art: melhores trabalhos e ilustradores

Pixel Art ou gráficos de pixel são pintura digital, que é criado em editores raster por pixel. Pixel é o menor elemento gráfico de uma imagem. Em outras palavras, este é o ponto. E todos os desenhos de pixels consistem em inúmeros acúmulos de pontos, que ficam um pouco irregulares, como se fossem mal desenhados. Mas esta é a beleza de tais pinturas.

Um pouco de história

Quais programas você pode usar para criar pixel art moderno?

Existem muitos editores raster gratuitos. Mas geralmente chamado de Microsoft Paint e Adobe Photoshop. É verdade que o Paint é considerado uma ferramenta menos conveniente para criar pixel art do que o Adobe Photoshop. Por que? Neste programa:
é muito difícil conseguir uniformidade e simetria das imagens;
ao salvá-los no formato jpg, ocorre grave distorção de cores;
É difícil desenhar sombras e realces.
Por isso, procuram dar preferência ao Adobe Photoshop. Este programa tem muito mais recursos de trabalho do que o Paint. Isso permite que você desenhe não personagens individuais com designs simples, mas imagens inteiras. Além disso, o pixel art em si é mais fácil e rápido de editar aqui. Sim, e você pode transferir transições de cores no Adobe Photoshop de maneira suave e natural.

Como evitar dobras em Pixel Art

Pixel art é uma coleção de pixels que são "pontos" quadrados ou retangulares. Quando uma imagem é desenhada a partir desses “pontos”, ela se torna angular e a suavidade das linhas desaparece. Por um lado, isso é cartão de visitas Pixel Art, mas por outro lado, quero mais suavidade, o que tornará a imagem elegante e atraente para o usuário. Este problema na linguagem dos pixel artistas eles são chamados de kinks ou “jaggies”.
Jaggies são peças que dão um aspecto recortado a qualquer linha. Eles geralmente são descartados por um dos seguintes métodos:
aumentar o segmento de linha dispersa em 2, 3 ou mais pixels de comprimento;
reduza o comprimento dos próprios pixels na área proeminente;
construir uma nova seção de linha a partir de vários pixels únicos;
adicione pixels únicos à área com um intervalo entre “pontos” mais longos, etc.
Para eliminar adequadamente as torções, é preciso lembrar a regra principal: o comprimento dos elementos de uma linha curva deve diminuir ou aumentar gradativamente. Você também precisa lembrar que mudar um segmento de linha em dois ou mais pixels de altura leva à destruição da suavidade.
Portanto, é necessária prática constante de desenho. E como o mais simples e ajuda visual Para ajudar a evitar dobras, você pode usar um conjunto de linhas retas inclinadas.

Como obter sombra em Pixel Art

Outro ponto importante na pixel art, este é o seu volume. Isso, como em outras opções gráficas, é obtido por meio de realces e sombras. Para criar uma sombra em pixel art você precisará de uma transição suave do tom claro para o escuro ou de uma cor para outra. Para obter esse efeito, a tecnologia de mistura é frequentemente usada - dithering. Ou seja, na fronteira de duas cores elas se misturam em um padrão xadrez. Este método surgiu num contexto de escassez de flores. Ao misturar duas cores em um padrão xadrez, foi possível obter uma terceira, que não estava na paleta.
No entanto, depois que a paleta se expandiu significativamente, a tecnologia de pontilhamento ainda permaneceu em demanda. Mas você precisa lembrar que uma transição de um pixel de uma cor para outra não parece boa. Acontece apenas um pente. É por isso
a zona mínima de mesclagem deve ter pelo menos dois pixels. E quanto mais ampla for essa transição, melhor.
Além disso, ao criar uma sombra:
É importante determinar em que ângulo e de que lado a luz incidirá sobre o objeto. Isso tornará o desenho “vivo” e também ajudará você a entender onde desenhar a sombra. Por exemplo, se a luz vier da direita, as áreas de sombra estarão localizadas à esquerda, etc.;
você precisa usar cores muito mais escuras que as básicas. Aqueles. a sombra deve ser representada com cores mais escuras que a própria área sombreada. Por exemplo, se um objeto for vermelho, sua sombra será bordô ou marrom escuro;
não se esqueça da sombra parcial. Para isso, é selecionada uma tonalidade que fica entre a cor base e a cor da sombra na paleta. Essa tonalidade é colocada entre camadas dessas duas cores. Como resultado, é criado o efeito de uma transição suave de uma área escura para uma área mais clara.

Como obter destaques em pixel art

Um realce, como uma sombra, dá volume aos objetos que estão sendo desenhados. Está sempre do lado onde a luz incide. Mas se o objeto pretende ter uma superfície brilhante, por exemplo, uma xícara de porcelana, uma espada de aço, etc., então também será necessário um destaque em uma área sombreada.
Para criar um destaque na área onde incide a luz, é necessário levar uma tinta que seja bem mais clara que a principal. Só não seja zeloso com o brilho deste local - pode não ficar natural. Muitas vezes, o destaque é representado em branco sem transições. Isso não acontece na natureza. E o objeto parecerá plano.
Para criar um destaque na lateral da sombra, você precisará de uma cor mais clara do que aquela com a qual a própria sombra é aplicada. E neste caso também é necessária uma transição suave, que pode ser conseguida usando vários tons ao mesmo tempo.
Para perceber tudo isso, é claro, você precisa de prática. E é melhor começar com objetos simples.

Arte de pixel(escrito sem hífen) ou gráficos de pixels- direção arte digital, que consiste em criar imagens ao nível do pixel (ou seja, a menor unidade lógica que compõe uma imagem). Nem todas as imagens raster são pixel art, embora todas consistam em pixels. Por que? Porque, em última análise, o conceito de pixel art abrange não tanto o resultado, mas o processo de criação de uma ilustração. Pixel por pixel e pronto. Se você pegar foto digital, reduza-o bastante (para que os pixels fiquem visíveis) e afirme que você o desenhou do zero - isso será uma verdadeira falsificação. Embora provavelmente haja simplórios ingênuos que irão elogiá-lo por seu trabalho meticuloso.

Atualmente não se sabe exatamente quando essa técnica se originou; as raízes se perderam em algum lugar no início da década de 1970. Porém, a técnica de compor imagens a partir de pequenos elementos remonta a formas de arte muito mais antigas, como mosaicos, ponto cruz, tecelagem de tapetes e perolização. A própria frase “pixel art” como definição de pixel art foi usada pela primeira vez em um artigo de Adele Goldberg e Robert Flegal na revista Communications of the ACM (dezembro de 1982).

A aplicação mais ampla da pixel art foi nos jogos de computador, o que não surpreende - possibilitou a criação de imagens que não necessitavam de recursos e pareciam realmente lindas (ao mesmo tempo, demoravam muito do artista e exigiam certos habilidades e, portanto, exigia bons salários). Em flor, Ponto mais alto em desenvolvimento são oficialmente chamados de videogames em consoles de 2ª e 3ª geração (início dos anos 1990). Maiores progressos na tecnologia, o surgimento das primeiras cores de 8 bits e depois do True Color, o desenvolvimento de gráficos tridimensionais - tudo isso com o tempo empurrou a pixel art para segundo plano e terceiro lugar, e então começou a parecer que o fim da pixel art havia chegado.

Curiosamente, foi o Sr. Progresso Científico e Tecnológico quem empurrou os gráficos de pixel para as últimas posições em meados dos anos 90, e mais tarde os devolveu ao jogo - apresentando ao mundo os dispositivos móveis na forma de telefones celulares e PDAs. Afinal, não importa o quão útil um dispositivo moderno possa ser, você e eu sabemos que se você não puder pelo menos jogar paciência nele, ele não terá valor. Bem, onde há uma tela de baixa resolução, há pixel art. Como se costuma dizer, bem-vindo de volta.

É claro que vários elementos retrógrados tiveram seu papel no retorno dos gráficos pixelados, adorando sentir saudades dos bons e velhos jogos infantis, dizendo: “Eh, eles não fazem mais isso”; estetas que podem apreciar a beleza da pixel art e desenvolvedores independentes que não percebem as belezas gráficas modernas (e às vezes, embora raramente, simplesmente não sabem como implementá-las em seus próprios projetos), é por isso que esculpem pixel art. Mas ainda não vamos desconsiderar projetos puramente comerciais - aplicativos para dispositivos móveis, publicidade e web design. Portanto, agora a pixel art, como dizem, é difundida em círculos estreitos e ganhou uma espécie de status de arte “não para todos”. E isto apesar do fato de que para homem comumé extremamente acessível, pois para trabalhar nesta técnica basta ter em mãos um computador e um editor gráfico simples! (a habilidade de desenhar, aliás, também não vai doer) Chega de palavras, vamos direto ao ponto!

2. Ferramentas.

O que você precisa para criar pixel art? Como disse acima, basta um computador e qualquer editor gráfico capaz de trabalhar no nível de pixel. Você pode desenhar em qualquer lugar, até no Game Boy, até no Nintendo DS, até no Microsoft Paint (outra coisa é que desenhar neste último é extremamente inconveniente). Há uma grande variedade de editores raster, muitos deles gratuitos e bastante funcionais, para que cada um possa decidir por si mesmo o software.

Eu desenho no Adobe Photoshop porque é conveniente e porque já faço isso há muito tempo. Não vou mentir e dizer, resmungando minha dentadura, que “lembro que o Photoshop ainda era muito pequeno, estava em um Macintosh e tinha o número 1.0”. Mas lembro-me do Photoshop 4.0 (e também do Mac). Portanto, para mim a questão da escolha nunca foi uma questão. E, portanto, não, não, mas darei recomendações sobre o Photoshop, especialmente onde seus recursos ajudarão a simplificar significativamente a criatividade.

Então, você precisa de qualquer editor gráfico que permita desenhar com uma ferramenta de um pixel quadrado (também existem pixels não quadrados, por exemplo, redondos, mas eles este momento não interessado). Se o seu editor suportar qualquer conjunto de cores, ótimo. Se também permitir salvar arquivos, ótimo. Seria bom se ele soubesse trabalhar com camadas, porque ao trabalhar em uma imagem bastante complexa é mais conveniente organizar seus elementos em diferentes camadas, mas em geral isso é uma questão de hábito e conveniência.

Podemos começar? Você provavelmente está esperando por uma lista de algumas técnicas secretas, recomendações que vão te ensinar como desenhar pixel art? Mas a verdade é que, em geral, não existe nada parecido. A única maneira de aprender a desenhar pixel art é desenhá-lo você mesmo, experimente, experimente, não tenha medo e experimente. Sinta-se à vontade para repetir o trabalho de outras pessoas, não tenha medo de parecer pouco original (só não faça passar o trabalho de outra pessoa como se fosse seu, hehe). Analise cuidadosa e cuidadosamente as obras de mestres (não meus) e desenhe, desenhe, desenhe. Vários links úteis esperam por você no final do artigo.

3. Princípios gerais.

E ainda existem vários princípios gerais, o que não vai doer saber. Na verdade são poucos, chamo-os de “princípios” e não de leis, porque são mais de carácter recomendatório. No final, se você conseguir desenhar uma pixel art brilhante ignorando todas as regras - quem se importa com elas?

O princípio mais básico pode ser formulado da seguinte forma: a unidade mínima de uma imagem é um pixel e, se possível, todos os elementos da composição devem ser proporcionais a ele. Deixe-me explicar: tudo que você desenha consiste em pixels, e o pixel deve ser legível em tudo. Isso não significa que a imagem não possa conter nenhum elemento, por exemplo, 2x2 pixels ou 3x3. Mas ainda é preferível construir uma imagem a partir de pixels individuais.

O traço e geralmente todas as linhas do desenho devem ter a espessura de um pixel (com raras exceções).

Não estou dizendo de forma alguma que isso esteja errado. Mas ainda não é muito bonito. E para deixar lindo, vamos lembrar mais uma regra: desenhe sem dobras, arredonde suavemente. Existem dobras - fragmentos que se rompem ordem geral, eles dão às linhas uma aparência irregular e irregular (no ambiente de pixel artist de língua inglesa, eles são chamados de jaggies):

As fraturas privam o desenho de sua suavidade e beleza naturais. E se os fragmentos 3, 4 e 5 são óbvios e podem ser facilmente corrigidos, com os outros a situação é mais complicada - aí se quebra o comprimento de uma única peça da corrente, pareceria um pouco, mas o pouco é perceptível. É preciso um pouco de prática para aprender a ver esses lugares e evitá-los. A dobra 1 é eliminada da linha porque é um único pixel - enquanto na área onde foi inserida a linha consiste em segmentos de 2 pixels. Para me livrar disso, suavizei a entrada da curva na curva, alongando o segmento superior para 3 pixels, e redesenhei toda a linha em segmentos de 2 pixels. As quebras 2 e 6 são idênticas entre si - já são fragmentos de 2 pixels de comprimento em áreas construídas por pixels únicos.

Um conjunto elementar de exemplos de linhas retas inclinadas, que podem ser encontrados em quase todos os manuais de pixel art (o meu não é exceção), ajudará você a evitar tais problemas ao desenhar:

Como você pode ver, uma linha reta é composta por segmentos do mesmo comprimento, deslocados em um pixel à medida que é desenhada - somente assim o efeito de linearidade é alcançado. Os métodos de construção mais comuns são com comprimentos de segmento de 1, 2 e 4 pixels (existem outros, mas as opções apresentadas devem ser suficientes para implementar quase qualquer ideia artística). Destes três, o mais popular pode ser chamado com segurança de comprimento de segmento de 2 pixels: desenhe um segmento, mova a caneta 1 pixel, desenhe outro segmento, mova a caneta 1 pixel, desenhe outro segmento:

Não é difícil, certo? Tudo que você precisa é de um hábito. A capacidade de desenhar linhas retas inclinadas em incrementos de 2 pixels ajudará na isometria, por isso veremos isso com mais detalhes na próxima vez. Em geral, linhas retas são ótimas - mas apenas até que surja a tarefa de desenhar algo milagroso. Aqui precisamos de curvas e muitas curvas diferentes. E levamos em consideração uma regra simples para arredondar linhas curvas: o comprimento dos elementos da curva deve diminuir/aumentar gradualmente.

A saída da reta para o arredondamento é feita de forma suave, indiquei o comprimento de cada segmento: 5 pixels, 3, 2, 2, 1, 1, novamente 2 (já vertical), 3, 5 e assim por diante. Seu caso não necessariamente usará a mesma sequência, tudo depende da suavidade que for necessária. Outro exemplo de arredondamento:

Mais uma vez, evitamos dobras que estragam tanto a imagem. Se quiser conferir o material que aprendeu, aqui tenho um skin para Winamp desenhado por um autor desconhecido, um espaço em branco:

Existem erros grosseiros no desenho e simplesmente arredondamentos malsucedidos, e existem torções - tente corrigir a imagem com base no que você já sabe. Isso é tudo que tenho com as linhas, sugiro que você desenhe um pouco. E não se deixe confundir pela simplicidade dos exemplos, você só aprende a desenhar desenhando – até as coisas mais simples.

4.1. Desenhe uma garrafa de água viva.

1. A forma do objeto, você não precisa usar cores por enquanto.

2. Líquido vermelho.

3. Mude a cor do vidro para azul, adicione áreas sombreadas dentro da bolha e uma área clara na superfície pretendida do líquido.

4. Adicione destaques brancos à bolha e uma sombra de 1 pixel de largura vermelho escuro nas áreas de líquido adjacentes às paredes da bolha. Parece muito bom, hein?

5. Da mesma forma, desenhamos uma garrafa com um líquido azul - aqui a mesma cor do vidro, mais três tons de azul para o líquido.

4.2. Desenhando uma melancia.

Vamos desenhar um círculo e um semicírculo - será uma melancia e uma fatia recortada.

2. Vamos marcar o recorte na própria melancia, e na fatia – a borda entre a casca e a polpa.

3. Preenchimento. Cores da paleta, verde médio é a cor da casca, vermelho médio é a cor da polpa.

4. Marquemos a área de transição da crosta para a polpa.

5. Listras claras na melancia (finalmente parece ela mesma). E claro – sementes! Se você cruzar uma melancia com baratas, elas irão rastejar sozinhas.

6. Nós trazemos isso à mente. Usamos uma cor rosa pálido para indicar os destaques acima das sementes na seção e, ao dispor os pixels em um padrão xadrez, obtemos alguma aparência de volume do segmento recortado (o método é chamado de pontilhamento, mais sobre isso mais tarde ). Usamos um tom vermelho escuro para indicar as áreas sombreadas na seção da melancia, e um tom verde escuro (novamente, pixels em um padrão xadrez) para dar volume à própria melancia.

5. Pontilhamento.

Dithering, ou mesclagem, é uma técnica de mistura de pixels em duas áreas adjacentes de cores diferentes de uma forma definitivamente ordenada (nem sempre). A maneira mais simples, comum e eficaz é alternar pixels em um padrão xadrez:

A técnica nasceu graças a (ou melhor, apesar de) limitações técnicas - em plataformas com paletas limitadas, o dithering permitia, ao misturar pixels de duas cores diferentes, obter uma terceira que não estava na paleta:

Agora, numa era de possibilidades técnicas ilimitadas, muitos dizem que a necessidade de hesitação desapareceu por si só. Porém, seu uso adequado pode conferir ao seu trabalho um estilo retrô característico, reconhecível por todos os fãs de videogames antigos. Pessoalmente, gosto de usar pontilhamento. Não sou muito bom nisso, mas ainda adoro.

Mais duas opções de pontilhamento:

O que você precisa saber sobre pontilhamento para poder usá-lo. A largura mínima da zona de mesclagem deve ser de pelo menos 2 pixels (aquelas linhas quadriculadas). Mais é possível. É melhor não fazer menos.

Abaixo está um exemplo de pontilhamento malsucedido. Apesar do fato de que uma técnica semelhante pode ser frequentemente encontrada em sprites de videogames, você precisa estar ciente de que a tela da televisão suavizou significativamente a imagem, e tal pente, mesmo em movimento, não era visível a olho nu:

Bem, chega de teoria. Sugiro que você pratique um pouco mais.

Pixel art pode ser desenhado em qualquer programa para trabalhar com gráficos raster, é uma questão de preferência pessoal e experiência (além de capacidade financeira, é claro). Algumas pessoas usam o Paint mais simples, eu faço no Photoshop - porque, em primeiro lugar, já trabalho nele há muito tempo e, em segundo lugar, me sinto mais confortável lá. Assim que decidi experimentar o Paint.NET gratuito, não gostei - é como um carro: se você reconhecer um carro estrangeiro com transmissão automática, é improvável que entre em um Zaporozhets. Meu empregador me fornece software licenciado, então minha consciência está tranquila diante da corporação Adobe... Embora eles cobrem preços inimagináveis por seus programas e queimem no inferno por isso.

1. Preparação para o trabalho.

Crie um novo documento com qualquer configuração (deixe a largura ser 60 e a altura 100 pixels). A principal ferramenta de um pixel artist é um lápis ( Ferramenta Lápis, chamado pela tecla de atalho B). Se o pincel (e o ícone do pincel) estiver habilitado na barra de ferramentas, passe o mouse sobre ele, clique e segure LMB– aparecerá um pequeno menu suspenso no qual você deve selecionar um lápis. Defina o tamanho da caneta para 1 pixel (no painel superior à esquerda há um menu suspenso Escovar):