Tutorial Light Lyca

    Compartilhe
    avatar
    Lycanimus
    Novato
    Novato

    Mensagens : 14
    Créditos : 11

    Tutorial Light Lyca

    Mensagem por Lycanimus em Sab Jul 08, 2017 7:43 pm

    Introdução 
    Fala galera da Aldeia, aqui é o Lycanimus, e hoje vou estar ensinando a vocês o meu tutorial de
    Iluminação via Parallax Mapping, ultimamente eu percebi que muitas pessoas tem dificuldades em fazer
    uma boa iluminação e também definir qual o nível de sombreamento adequado para o seu mapa, com esse
    tutorial espero tirar muitas dúvidas e ajudar muitos mappers a refinarem os seus trabalhos, bom, então vamos lá!


    Requisitos
    - Gimp ou Photoshop (Eu utilizei o Gimp no tutorial).
    - Saber utilizar os editores acima para fazer seus mapas via Parallax.
     

    Iniciando
    Para esse tutorial eu vou utilizar uma parte de um dos meus mapas já prontos, apenas sem o efeito de luz e sombra, que é o que nós vamos fazer passo a passo aqui.
    A parte do mapa que eu estarei utilizando então é esse:


    Note que nessa parte do mapa há 3 pontos de luz das tochas, portanto são em cima desses pontos que nós vamos trabalhar.

     

    Ajustando o nível de Sombreamento - Primeiro Passo
    Já com o Gimp aberto e após ter finalizado o seu mapa com todas as camadas, crie uma camada acima de todas as outras e nomeie ela para Sombra, como na imagem a seguir:



    Após criar a camada Sombra, vá no seu Pincel e selecione o Hardness 050 que é um dos pinceis padrão do Gimp, como na imagem a seguir:



    Agora aumente o tamanho do pincel para 100000 só para pegar a tela inteira e lembre-se de estar na camada Sombra, como na imagem:



    Agora com o pincel selecionado coloque ele bem no centro da tela e dê 1 clique apenas, isso vai fazer com que ele pinte a tela toda de preto, ual heim! "Mas Lyca não era mais fácil pintar com o balde de tinta?" Sim era, mas isso é para você já ir se acostumando a usar os pinceis e saber localizar eles pelo nome, pois ainda vamos trabalhar bastante com eles.

    Ok, se você fez tudo certo até agora a sua tela deve estar toda preta, como na imagem:



    Agora com a sua tela assim, vá na camada Sombra e diminua a opacidade para algo em torno de 25 a 40, nessa parte é que você vai definir o nível de sombreamento do seu mapa, o ideal é você deixar entre 25 a 40 no máximo, evite ultrapassar disso, pois se não você vai ter problemas com o seu mapa, tanto para enxerga-lo, como para quando formos criar a iluminação, no meu mapa eu deixei em 30, e ficou assim:



    Pronto, você definiu o quão escuro o seu mapa vai ser, agora você precisa ver de onde vem a luz do seu mapa, no meu por exemplo, a luz vem das 3 tochas, portanto eu preciso tirar a sombra ao redor das tochas, pois é ai que vamos criar a iluminação mais para frente e não queremos que seja escuro não é mesmo?
    Para isso eu vou selecionar a Borracha e o pincel Hardeness 050 e vou diminuir a opacidade dele para 50 e o tamanho deixe em torno de 110 +-, como na imagem:



    Agora com o pincel vá nos pontos de luz do seu mapa e na camada Sombra e comece a apagar a sombra em volta dos pontos de luz do seu mapa, no meu caso nas tochas, ficando como nas imagens a seguir:

    Antes  de passar a Borracha



    Depois de passar a Borracha



    Assim finalizamos a parte de sombreamento do mapa e podemos dar finalmente inicio a iluminação!
     


    Criando a Iluminação - Segundo Passo 
    Vamos dar início a iluminação agora, para isso, crie uma nova camada, acima da camada Sombra e nomeie ela para Luz 1, como na imagem a seguir:



    Vá agora no seus pinceis e selecione o pincel Hardeness 075, como na imagem:



    Com o pincel, mude a cor dele para uma cor amarela ou alaranjada, ou se quiser coloque a mesma cor que eu utilizei como na imagem:



    Mude agora o tamanho do seu pincel de forma que cubra grande parte em volta do seu ponto de luz do seu mapa, no meu caso eu deixei o pincel no tamanho 150, como na imagem:



    Agora com o pincel, pinte por cima e em volta de todo o seu ponto de luz, ou seja, todo o lugar que você quer que a luz chegue, mas não exagere no tamanho do raio que você quer que a luz alcance, tente deixar como no exemplo da imagem a seguir:



    E pronto, está feito a sua iluminação, é só jogar no projeto agora!  "Lyca, você está louco?"...haha  Calma, muita calma, você deve estar se perguntando mas que P@&% é essa não é mesmo?  Mas vamos continuar então, vá na camada de Luz 1 e la em cima onde tem modo, mude de normal para Sobrepor, como na imagem a seguir:



    Com isso acho que vai dar uma "pequena diferença" na sua iluminação:



    Após achar que o Lyca não está mais louco, vamos continuar, pois ainda não acabou..hehe  Agora você deve pegar a borracha novamente e o pincel Hardeness 050, mude a opacidade para 30 e o tamanho deixei o padrão que é 51 mesmo, como na imagem:



    Com a borracha você vai remover o "excesso" de iluminação e os pontos onde a luz não consegue chegar, como trabalhamos no 2D, você deve ter uma noção básica de perspectiva, e saber "enxergar" o mapa de outros ângulos, isso vai ajudar nessa parte, mas não é nada complicado, veja a imagem e repare nos pontos que eu removi a luz, onde provavelmente ela não chegaria.



    Após corrigir esses pontos, lembrando novamente que para o seu mapa vai ser diferente, e você deve "enxergar" isso, vamos criar agora um foco de luz maior bem no centro de onde a luz está sendo emitida, ou seja, no meu caso bem no centro das tochas, para isso eu vou criar uma nova camada e nomeá-la de Luz 2, como na imagem a seguir:



    Nessa nova camada você vai repetir o mesmo processo que fizemos para a Luz 1, para isso selecione o pincel Hardeness 075, diminua seu tamanho do mesmo tamanho ou menor que o seu objeto de luz, no meu caso são as tochas, para isso eu vou diminuir o pincel um pouco menor que ela, no caso deixei o tamanho em 35, como na imagem:



    E agora vou pintar em cima das tochas do mapa, bem no centro delas, não abrangendo muito espaço, pois lembre-se o que queremos criar agora é o foco mais forte da luz, de onde ela está saindo, então pintando ficaria igual na imagem a seguir:



    Ok, agora nós vamos selecionar a camada Luz 2 e abrir o modo dela, e mudar para mesclar grãos e deixar a opacidade da camada em torno de 35, se você fizer isso a imagem vai ficar assim:



    Com isso estamos quase acabando a nossa iluminação, falta apenas ajustar a matiz de cores de acordo com o ambiente do seu mapa, para isso selecione a camada Luz 1 e vá em Cores>Matiz-Saturação, como na imagem a seguir:



    E ajuste a Matiz, a Saturação e Luminosidade da sua luz, no meu caso eu quero uma luz um pouco mais alaranjada, pois são tochas, então vou ajustar a matiz para essa cor e aumentar a saturação e a luminosidade dela, lembrando que estamos trabalhando com a Luz 1, para a Luz 2, faça a mesma coisa, porém aumente um pouco mais a saturação e a luminosidade do que a Luz 1, para deixar o centro com uma luz mais forte, segue a imagem de exemplo:



    E com isso a nossa iluminação está pronta finalmente, sei que parece bem trabalhoso, mas se seguir esses passos e treinarem não tem segredo, para jogarem no projeto, vocês devem apenas combinar as camadas das luzes com a dos tiles em baixo, e na camada acima do herói apenas deixe uma luz com opacidade bem baixa só para ficar por cima quando ele passar, o que vai dar a impressão de ser a mesma luz.
     


    Bônus
    Caso queiram fazer uma luz Branca, é só seguirem esse mesmo passo, porém na hora de mudar a Matiz, vocês devem apenas aumentar no máximo a luminosidade e diminuir toda a saturação, faça isso para as duas camadas de Luz que aprendemos, fazendo isso, você vai deixar igual essa imagem que é a continuação do mesmo mapa:





    Resultado Final em Jogo
    Agora é só "enfeitar" o seu mapa com efeitos que queira adicionar, mudar a cor pelo próprio maker, adicionar efeitos de chuvas ou fogs e seu mapa vai ficar perfeito!

    Espero que tenham gostado do tutorial galera e que tenham aprendido bastante também, lembrando que isso é só o modo que eu utilizo no meu mapeamento, mas há muitos outros, eu apenas consigo bons resultados com esse, qualquer dúvida que tiverem é só me falar!

    Segue agora o mesmo mapa Finalizado:



    Abraços do Lyca!
     


    Última edição por Lycanimus em Sab Jul 08, 2017 8:59 pm, editado 11 vez(es)
    avatar
    Kies~
    Moderador Local
    Moderador Local

    Mensagens : 876
    Créditos : 100

    Re: Tutorial Light Lyca

    Mensagem por Kies~ em Sab Jul 08, 2017 8:06 pm

    Muito obrigado por trazer até nos esse belíssimo sistema, continue assim meu jovem, +1 cred
    avatar
    Profane ~
    Moderador Global
    Moderador Global

    Mensagens : 529
    Créditos : 97

    Re: Tutorial Light Lyca

    Mensagem por Profane ~ em Sab Jul 08, 2017 8:12 pm

    Naisu, creio que com toda certeza o Grimgard irá receber bons retornos desse tutorial >< < 3


    _________________
    Poucas pessoas podem fazer uma vida dentro de seus sonhos, eu não sou um deles, devo então sofrer esta realidade?
    avatar
    Lycanimus
    Novato
    Novato

    Mensagens : 14
    Créditos : 11

    Re: Tutorial Light Lyca

    Mensagem por Lycanimus em Sab Jul 08, 2017 8:19 pm

    Kies~ - Muito obrigado, fico contente em contribuir com a comunidade maker, abraços!

    Profane~ - Muito obrigado, espero ajudar muitos mappers a refinarem os seus trabalhos! Very Happy

    Obs - Ainda estou arrumando as resoluções das imagens que no tópico ficou um pouco cortada!

    Abraços do Lyca!


    _________________
    Fazer mapas é uma arte, faça como se fosse o seu último.


    avatar
    GallighanMaker
    Desenvolvedor
    Desenvolvedor

    Medalhas :
    Mensagens : 714
    Créditos : 72

    Re: Tutorial Light Lyca

    Mensagem por GallighanMaker em Seg Jul 10, 2017 9:25 am

    Muito bom Lyca, 


    Esse estilo de mapeamento é extraordinário e tenho certeza pra galera mapper vai gostar pois ver um tutorial novo nesse gênero é algo raro, estava faltando isso aqui na aldeia.


    _________________
    @IndieDB @Steam Concept
    --
    avatar
    Lycanimus
    Novato
    Novato

    Mensagens : 14
    Créditos : 11

    Re: Tutorial Light Lyca

    Mensagem por Lycanimus em Ter Jul 11, 2017 1:34 am

    GallighanMaker - Muito obrigado, realmente eu não vejo muitos tutoriais nesse gênero, o que é uma pena, mas fico contente em contribuir com esse aqui na Aldeia, em breve espero trazer mais alguns!

    Abraços do Lyca!


    _________________
    Fazer mapas é uma arte, faça como se fosse o seu último.


    avatar
    xSonart
    Colaborador
    Colaborador

    Medalhas :
    Mensagens : 181
    Créditos : 30

    Re: Tutorial Light Lyca

    Mensagem por xSonart em Qui Ago 03, 2017 9:17 pm

    Boa @Lycanimus muito foda o tutorial.
    avatar
    eluedes
    Novato
    Novato

    Mensagens : 5
    Créditos : 0

    Re: Tutorial Light Lyca

    Mensagem por eluedes em Qui Ago 03, 2017 11:16 pm

    gostei :3
    vou adquirir esse aprendizado
    avatar
    Mundator
    Ocasional
    Ocasional

    Mensagens : 231
    Créditos : 17

    Re: Tutorial Light Lyca

    Mensagem por Mundator em Seg Ago 07, 2017 7:45 am

    Esse cara é fera


    _________________
    YOU ARE DEAD ? MUNDATOR
    avatar
    Lycanimus
    Novato
    Novato

    Mensagens : 14
    Créditos : 11

    Re: Tutorial Light Lyca

    Mensagem por Lycanimus em Seg Ago 07, 2017 10:07 pm

    xSonart - Muito obrigado!  

    eluedes - Obrigado, fico contente que vá seguir o tutorial, qualquer dúvida é só falar!

    Mundator - Muito obrigado!  


    Abraços do Lyca!


    _________________
    Fazer mapas é uma arte, faça como se fosse o seu último.



      Data/hora atual: Qui Ago 17, 2017 6:34 am