[Pixel Art] Aula de Introdução: Pixeís

Aula de Introdução: Pixeís

Nome: Pixel Art- Aula de Introdução: Pixeís
Autor: Ritton
Dificuldade: Iniciante
Ferramentas: MS Paint
Descrição: Introdução aos Pixeís e desvendando os mistérios dos mapas de bits.

Introdução

Quando pensamos em Pixel Art, logo lembramos de Pixel, que muitos chamam de quadradinhos. Bom, Píxeis são elementos que podem ser atribuídos cores que formam em conjunto um mapa de bits. Um conjunto de milhares de Píxeis compõe uma imagem inteira, sendo que é o menor ponto que compõe as imagens digitais. Os mesmos possuem três grupos de tonalidade em um monitor colorido: vermelho, verde e azul (RGB).





Ok, agora você ficou confuso. Tudo bem, não precisamos entender o que é um Bit para podermos fazer Pixels. Encare eles como um valor mínimo que quando adicionado a mais valores, retorna a um resultado. Resumindo, é uma conta matemática que retorna um valor após ser somado.

Requerimentos

Não existe mistérios em trabalhar com Píxeis. Eles assumem o papel de formas geométricas, mas nesse caso só possui a forma de pequenos quadrados. Nem por causa disso as possibilidades são limitadas. Qualquer um pode não concordar, mas qualquer objeto possui uma forma geométrica. Um exemplo é uma caixa de som que possui um formato retangular ou quadrado. A Geometria diz que:

Geometria escreveu:As formas geométricas aparecem em todo o universo, na natureza e nas obras humanas, independente da cultura ou da crença de cada povo.

Bom, para começarmos a desvendar os Píxeis e saber como utilizá-los é simples. Os requerimentos são:

Noção de Cores
Noção do Significado de Pixel
Noção de Figuras Geométricas

Noção de Cores: É importante saber com qual cor deve e como se trabalhar. Não se pode ignorar os valores naturais dados aos objetos reais.

Noção do Significado de Pixel: É necessário entender o que são e o que podem fazer. Muitos encaram como simples quadradinhos, mas o potencial deles em conjunto causa horrores. Eis as imagens digitais!

Noção de Figuras Geométricas: Tudo tem um formato geométrico e é importante saber localizá-lo. Através disso que podemos criar as imagens em Pixel Art. com facilidade.

Para você que não sabe por onde começar, leia esses artigos:

Noção de Cores

Noção de Pixel

Desenho Geométrico

Noção de Geometria

Você pode achar que não é necessário, mas é importantíssimo aprender tudo isso. Após adquirir todos esses conhecimentos, vamos começar a trabalhar com os Píxeis e desvendar seus mistérios.

Desvendando os Pixeís

Como eu havia dito, não existe mistérios em trabalhar com Pixeís. Ok, vamos começar montando um simples quadrado. Abra o velho Microsoft Paint que está mofando em seu Computador. Antes de mais nada, estamos trabalhando com um quadrado então suas propriedades não podem ser ignoradas.




O quadrado é um paralelogramo, pois os seus lados são paralelos dois a dois.

O quadrado é um losango, pois os seus lados possuem as mesmas medidas e as diagonais são perpendiculares.

O quadrado é um retângulo, pois seus vértices formam ângulos de 90º e as diagonais possuem as mesmas medidas.

Uma figura geométrica é denominada quadrado quando possui quatro lados iguais e os quatro ângulos retos.

Pronto, relembramos os conceitos! Ok, agora sabemos isso e vamos montar o quadrado. No MS Paint, para um quadrado adquirir esses valores é necessário terem a mesma medida em relação a altura e largura. Então vamos definir um tamanho padrão que será: 32x32, ou seja, 32 pixeís de largura e 32 pixeís de altura.

Spoiler:

Em seguida, escolha uma cor. Eu usarei vermelho. É importante ter lido o artigo de Noção de Cores para saber como utilizá-las. Bom, vamos pegar essa cor em deixá-la um pouquinho escura. Ok, feito isso definimos a cor da borda.

Spoiler:

Pronto, vamos facilitar nosso trabalho, então escolha a ferramenta de construção de linha. Escolha a linha que possui a definição de 1 Pixel. Após definir, trace as linhas nas bordas.

Spoiler:

Pronto, você pode ver apenas um quadrado pintado, mas saiba que as linhas da borda são píxeis. Experimente utilizar Píxeis de formas variada para atingir diversos resultados. Assim podemos ter uma noção de espaço de cada Pixel. Com base nesse valor de espaço que um contém, podemos fazer uma imagem.

o certo não seria isometrico ao invés de geométrico?
pixel art geométrico é diferente.
Isometria é mais pixel art.
Geometria em pixel art fica bom mas em design fica melhor.

Qual o intuito desse tutorial?
Explicar o básico?
é pq eu vi as imagens no final do tópico pensei que você já ia mostrar como fazer os pa

gostei mt e para os iniciantes ( como eu)ajudara mt!
parabens continue assim

Ah, finalmente alguém tomou coragem de fazer um tutorial sobre pixel art. Não deixe ele morrer!

PS: Não acho que sejam "Pixeís", mas sim "Pixels" mesmo. A palavra é pra ser em inglês: Não existe tradução.

Sua aula ficou muito boa cara, espero as próximas aulas, aliais vou até criar uma aulas de Pixel-art também se eu tiver prazo, porque to ocupado com o Escapando do labirinto 2 xD

@Need90: O intuito é preparar o leitor para aprender a fazer sprites. Eu estou com um aprendiz e ele me pediu para lhe ensinar a fazer sprites em Pixel Art. Bom, como eu havia dito no tutorial, a vida nos propõe que aprendamos para fazer. Se o spriter não ter essas noções básicas, ele não alavanca.

O certo seria geométrico, pois estamos lidando com imagens em 2 dimensões. Por exemplo, um quadrado de 32x32 é uma figura geométrica e os Píxeis são feitos de pequenos quadradinhos de bits que podem ser atribuídas várias cores. O isométrico vem do Pixel Art.

Eu decidi deixar para ensinar nas próximas aulas, para não misturar conceitos. Na próxima trabalharemos com sombreamento e luminosidade que podem ser aplicadas a sprite utilizando a tonalidade de cores.

@ daniel_garrido:

Espero que tenha gostado da aula. Em breve eu montarei a próxima aula. Quando eu sentir que minha missão foi um sucesso, eu pararei, caso contrário, é aulas e mais aulas!

@ Davidchococat:

Obrigado cara! Agradeço ao meu aprendiz por ter me feito ganhar prazer por fazer tutoriais sobre o assunto! De acordo com o Wikipedia, Pixel tem um plural que é Píxeis. Basta apenas ler o artigo "Noção do Significado de Píxel" para entender.

@Mundo Game Maker:

Agradeço pelo comentário! Pixel Arte é algo que me fascina, então sempre estou trabalhando com ela.

Aguardem a próxima aula!

Off: Será que existe a chance de algum moderador ou administrador avaliar a tutorial?

Muito bom tutorial Ritton!

Embora eu já seja experiente em Pixel Art, eu sempre dou uma olhadinha em tutoriais do tipo

Esperando as próximas aulas!

Opa, é uma honra receber comentários do leitores! Faço essas aulas para ajudar quem está se dedicando. Apesar da qualidade dos meus trabalhos serem inferiores ao de muitos membros, sempre valorizo o que faço e guardo para mim até que atinja uma boa qualidade para ser postada ao público.

Espero fazer esse feito na próxima aula, mas demorará um pouquinho porque estou fazendo formulando minha primeira IA para um projeto pequeno. Acredito que consegui formulá-la na minha cabeça, mas terei que comprovar nos códigos.

Obrigado pelo comentário! Sinto-me honrado em ajudar pessoas interessadas, nem que seja para acrescentar alguma informação a mais.

Até mais!

EDIT: Eu esqueci que antes do tutorial de iluminação, devo ensinar algumas coisas básicas para o aluno. Portanto na próxima aula trabalharemos com cores.

mano seja franco q q isso? vc quer nos ensinar a mexe no paint? isso nunca foi pixel art, no youtube explica exatamente oq é, como fazer e como dar o efeito 3d e o cara quer nos ensinar a fazer um cubo tudo bem q tem q começar do começo mais vc forçou demais

joovictor escreveu:mano seja franco q q isso? vc quer nos ensinar a mexe no paint? isso nunca foi pixel art, no youtube explica exatamente oq é, como fazer e como dar o efeito 3d e o cara quer nos ensinar a fazer um cubo tudo bem q tem q começar do começo mais vc forçou demais

Acontece que tem gente que simplesmente não consegue entender o que é um pixel. Não sei se você compreendeu, mas essa foi a primeira aula. Acha mesmo que ele já ia ensinar a fazer coisas magnificas logo no começo?

Muitos aqui precisam ter uma noção básica do que é pixel art, e é isso que o tutorial quis mostrar. E se você entende tanto assim de pixel art, então faça suas próprias aulas, ao invés de criticar as dos outros. Com certeza seu comentário não ajuda de forma alguma o autor.

@joovictor:

joovictor escreveu:mano seja franco q q isso? vc quer nos ensinar a mexe no paint? isso nunca foi pixel art, no youtube explica exatamente oq é, como fazer e como dar o efeito 3d e o cara quer nos ensinar a fazer um cubo tudo bem q tem q começar do começo mais vc forçou demais

Eu não estou acreditando numa resposta dessa. Tem gente que precisa começar do inicio. Tudo bem que é algo básico para VOCÊ, mas se não começar do inicio, não tem como alavancar no futuro. Desculpe ser chato, mas você veio realmente só para postar isso, peço que não visite mais tópico.

OBS: Algum moderador poderia retirar o comentário do cara Ele flodou e não acrescentou nada para mim e nem sequer ajudou em alguma coisa.

@JV Justino: Obrigado pelo apoio. Felizmente tem pessoas como você que sabem valorizar o trabalho dos outros, que passam cerca de 1 hora preparando um tutorial para receber alguma crítica construtiva. Agradeço a você e a todos os outros leitores que gostaram do tutorial.

Até mais!

Ritton escreveu:@joovictor:

joovictor escreveu:mano seja franco q q isso? vc quer nos ensinar a mexe no paint? isso nunca foi pixel art, no youtube explica exatamente oq é, como fazer e como dar o efeito 3d e o cara quer nos ensinar a fazer um cubo tudo bem q tem q começar do começo mais vc forçou demais

Eu não estou acreditando numa resposta dessa. Tem gente que precisa começar do inicio. Tudo bem que é algo básico para VOCÊ, mas se não começar do inicio, não tem como alavancar no futuro. Desculpe ser chato, mas você veio realmente só para postar isso, peço que não visite mais tópico.

OBS: Algum moderador poderia retirar o comentário do cara Ele flodou e não acrescentou nada para mim e nem sequer ajudou em alguma coisa.

@JV Justino: Obrigado pelo apoio. Felizmente tem pessoas como você que sabem valorizar o trabalho dos outros, que passam cerca de 1 hora preparando um tutorial para receber alguma crítica construtiva. Agradeço a você e a todos os outros leitores que gostaram do tutorial.

Até mais!

verdade realmente vc tem razão eu fui mto ingenuo axando q este tutorial seria realmente de como criar e como modelar sprites no paint mas pelo jeito do seu cubo ai em cima vc tem toda razão :/ enquanto ao tv justino provavelmente calhou ja q foi agora q ele aprendeu a abrir o paint

Primeiro, entenda uma coisa: o que vem de baixo não me atinge. E com este tipo de comentário você já se rebaixou ao extremo.

Agora, quando eu aprendi a usar o Paint, é um problema meu, e isso não interessa a alguém que nem me conhece, e muito menos quando quiser usar isso contra mim.

Se você não sabe respeitar os outros usuários do fórum, seu lugar não é aqui. Eu pelo menos uso meu conhecimento para ajudar os outros, e não para ficar desmerecendo outras pessoas. Aliás, já que você entende tanto de Pixel Art, porque eu nunca vi nenhum trabalho seu aqui no fórum?

Bom, agora vou voltar a fazer o que me interessa, ao invés de ficar me igualando a certas pessoinhas ignorantes.

JV Justino escreveu:Primeiro, entenda uma coisa: o que vem de baixo não me atinge.

Senta em um formigueiro pra ver se não atinge kkkk. zoa jv

@Tópic
Vlw Ritton, eu não tinha entendido, pensei que já ia começar desenhando, quando você acha que sai as primeiras de pixel art?

Estou precisando fazer aqueles blocos, por isso estava precisando de um tutorial do tipo.
Outra coisa : Como você posta a aula 2 antes da aula 1? kkkkkk


E se quiser ajuda eu mecho um pouco com p.a 3d e com sombreamento, qualquer coisa fale comigo via MP.

Joovictor, se você não tem nada de útil pra dizer, e prefere ficar pegando sprites da Internet, achando que o Paint é só mais um programinha pra criança fazer rabisco, guarde seus comentários pra você e deixe o tópico do amigo receber comentários e críticas realmente úteis! Por que a próxima inutilidade que você vinher falar aqui pode ter certeza que vai ser excluída.

@Tópico:
Eu gostei da introdução. Tá bem explicada mesmo a questão dos pixels, não 100% mas tá. Uma boa dica pra quem quer aprender pixel art, é começar usando cores de 4 bits (paleta de 16 cores) e ir subindo aos poucos, 8 bits (paleta 256 cores), e por aí vai. Sempre dando um jeito de fazer o que se quer, por exemplo:

Esse sprite eu fiz só usando 4 cores de uma paleta de cores 4 bits. Notem como foi feito o brilho, as sombras, etc. Foi baseado num sprite de um amigo no MSN, eu quis melhorá-lo.

Lucas Lunar escreveu:Joovictor, se você não tem nada de útil pra dizer, e prefere ficar pegando sprites da Internet, achando que o Paint é só mais um programinha pra criança fazer rabisco, guarde seus comentários pra você e deixe o tópico do amigo receber comentários e críticas realmente úteis! Por que a próxima inutilidade que você vinher falar aqui pode ter certeza que vai ser excluída.

@Tópico:
Eu gostei da introdução. Tá bem explicada mesmo a questão dos pixels, não 100% mas tá. Uma boa dica pra quem quer aprender pixel art, é começar usando cores de 4 bits (paleta de 16 cores) e ir subindo aos poucos, 8 bits (paleta 256 cores), e por aí vai. Sempre dando um jeito de fazer o que se quer, por exemplo:

Esse sprite eu fiz só usando 4 cores de uma paleta de cores 4 bits. Notem como foi feito o brilho, as sombras, etc. Foi baseado num sprite de um amigo no MSN, eu quis melhorá-lo.

Olha oq é uma verdadeira sprite desenhada por um expert






antes de falar de mim me supere mais pelo jeito da sua sprite vai ser complicado kkk

@Need 90: Como eu estou montando uma apostila com meu tutoriais sobre o assunto para ver se ajuda um amigo, não demorará muito não. Pretendo na próxima aula, já começar trabalhando utilizando a dica do meu amigo Lucas Lunar, ou seja, começando com paleta de 16 cores e assim por diante.

Sobre a ordem, eu realmente esqueci que tinha que ter postado a outra. Como aquela é apenas uma aula de introdução, principalmente mostrando a Interface do Paint, acabou não alterando em nada. É mais uma espécie de aula extra mesmo.

Ainda vai demorar um pouco para fazermos sprites mesmo. Depois da próxima aula, terei que abranger mas um assunto que é essencial: A Geometria. Depois disso é começar a fazer sprites e mais sprites. Entro em contato com você caso eu necessitar de ajuda, ok?

@Lucas Lunar: Muito obrigado pelo comentário. Como você disse, não é 100% a explicação, mas já se tem uma ideia. Eu li seus tutoriais e a propósito, são ótimo e me ajudaram bastante! Aula seguinte vou começar a trabalhar com cores, tentando ensinar como usá-la dependendo do ambiente e é claro, trabalhar com as famosas paleta de cores.

Até mais!

@joovictor

Ola joovictor,já que se acha melhor que todos, vá embora daqui,ora pois ninguém precisa de exibidos para mostrarem que já aprenderam e sim daqueles que procuram ajudar ou ser ajudados.Pessoas do seu nível são repugnantes e apenas querem aparecer .Va procurar algo mais construtivo para vossa excelência.

.E uma dica para tu : Leia minha assinatura e procure ver se aprende algo com minha dica.

@Topico
Grande Ritton,sempre inovando com belos tutoriais.Meus parabéns pelo tudo (deu até vontade de usar o paint hoje ) !
Este tutorial ajudou muito,não só eu,como muitos membros ;)

antes de falar de mim me supere mais pelo jeito da sua sprite vai ser complicado kk

Antes de falar de você, lhe superar? Inputz... Eu não gosto de me gabar, por que eu prefiro que as outras pessoas opinem sobre mim, não eu. E eu não vivo pra superar os outros, e sim à mim mesmo. E não foi você quem fez esses sprites.

E outra: aquilo que eu mostrei foi um exemplo de sprite feito para refletir a época em que se tinha uma grande limitação de Hardware. Não um exemplo 24 bits.

E tive uma ideia melhor: não vou excluir seus posts, vou tirar warn mesmo por floodar em tópico alheio e tratar os outros com desrespeito.

Ritton, não ligue para esses tipos de crítica, você tá ajudando muita gente iniciante.