Tutoriais Gimp – “Web 2.0″ Badge

Web 2.0 Badge - Made on Gimp

Mais um tutorial, fruto da minha incessante luta para com o Gimp, e que desta vez descreve como fazer um daqueles “web 2.0 badges”, tão na moda, cheios de gradientes e sombras. Como resultado final, deverão ter algo parecido com a imagem acima, senão, como já li algures, comprem um tractorzito e dediquem-se à agricultura.

  • Passo 1 – criar uma imagem nova, com fundo transparente (opções avançadas – preencher com transparência), com alguns 200x200px.
  • Passo 2 – vão a “Filtro – Renderizar – Gfig”. No painel que se abre, escolhem a opção “criar estrela”, na barra superior. Definem alguns 26/28 lados, no contorno clicam em navegar, escolhem a largura 5×5 e definem a cor para branco.
  • Passo 3 – com o cursor no centro da janela, arrastam até terem o tamanho desejado, mas de modo a deixarem alguma margem de todos os lados. Isto vai criar uma estrela estranhíssima. Depois, seleccionam, na barra superior, a ferramenta “Mover um ponto único”, e de seguida clicam num quadradinho que se encontra para o centro da estrela e arrastam para fora, até conseguirem umas “pontas” mais uniformes, pequeninas, como as da imagem acima.A estrutura está criada.
  • Passo 4 – com a ferramenta “Magic Wand” seleccionam o interior da estrela, depois vão a “Selecção – Expand” e escolhem 3px. Depois, “Selecção – Enevoar” e metem o valor 10.
  • Passo 5 – escolhem uma cor para o 1º plano e outra para cor de fundo (eu escolhi um cinzento escuro e preto, respectivamente). Seleccionam a ferramenta “Gradient Tool”, verificam se têm as opções “Forma – Linear” e “Gradiente – Frente para fundo” e aplicam o gradiente na selecção feita no apsso anterior. Vão fazendo várias tentativas até chegarem a uma solução do vosso agrado.
  • Passo 6 – verifiquem se têm a camada GFig seleccionada, e vão a “Filter – Shadows – Sombra projectada”. Aqui insiram os valores que vos apeteça. É uma questão de experimentar vários valores, até ficarem contentes com o resultado.
  • Último passo (finalmente!) – escolham a ferramenta de texto e insiram e formatem o texto que vos apeteça, e está o trabalho concluído. Guardem como .png, por causa das transparências e das sombras.
  • Fácil, hu? Nem por isso … Pelo menos para lá chegar. Enquanto os developers do Gimp continuarem a ser casmurros e não incluirem a porcaria dos “Blending Opcions”, como no nosso amigo photoshop, temos que nos desenvencilhar assim.

    Agora venham-me para aqui dizer que o Gimp é limitado e que não dá para fazer “aquela cena que se faz no Photoshop!!!” que eu digo-vos como é :mad:

    Ps: eu estou a usar a versão GimpShop 2.2.11. Aviso desde já que a versão 2.3.10, que publicitei aqui há tempos, está cheia de bugs, e quando se meche mais a sério naquilo é só mensagens de erro a saltar para o ecrã. Devido a isso, tive que fazer um “downgrade” da versão.
    Se os caminhos para os menus que eu descrevi não forem os mesmos para vocês, e se não os conseguirem encontrar, é favor pedir ajuda nos comentários, que é para isso que aquilo serve.

    Ps2: é o meu primeiro post depois da minha inclusão no P*. Agora já sou famoso :wink:

    7 Comentarios

    1. Mário Lopes // October 8th, 2006
      Mozilla Firefox 1.5.0.7 Windows XP

      Pior que isso só mesmo a não existência de cores CMYK. Esperemos que a mudança esteja para breve.. nem que seja com um fork :-)

    2. Cláudio Franco // October 8th, 2006
      Mozilla Firefox 1.5.0.7 Ubuntu Linux

      Este tipo de tutorias fazem uma tremenda falta.

      Sim, ok, o GIMP não tem “tudo” o que o Photoshop tem… mas deve ter tudo o que 90% das pessoas utilizam.
      Podem é estar em locais diferentes e com opções diferentes.

      Voltamos ao mesmo problema da transição Windows para OSX/Linux… comodismo.

      Bom tutorial, vai me dar jeito ;)

      Ah e bem-vindo :)

    3. Boss // October 8th, 2006
      Opera 9.02 Linux

      Obrigado …

      Quanto às cores CMYK, já são pedidas à tanto tempo, que deve ser mais uma birra dos developers …

      E o problema do Gimp, a meu ver, é não se saber como fazer as coisas. A potencialidade está lá. Só não é convenientemente aproveitada. O Photoshop tem o “apoio” de milhares de páginas com tutoriais, para tudo e mais alguma coisa. No Gimp,ou tens muita sorte e encontras algum tutorial meio perdido por este mundo, ou tens que andar a experimentar comandos e funções, a ver no que dá :)

    4. Duarte Diogo // October 9th, 2006
      Mozilla Firefox 1.5.0.7 Ubuntu Linux

      Viva! É sempre bom conhecer mais alguém a tentar “puxar” pessoal para o outro lado (leia-se “software livre”) e a acabar com a mania que o Photoshop é tudo, mesmo que a cópia que usam seja ilegal :)
      Continua!

    5. Boss // October 9th, 2006
      Opera 9.02 Linux

      Obrigado. Não custa nada :)

    6. Pedro Oliveira // October 10th, 2006
      Mozilla Firefox 1.5.0.7 Ubuntu Linux

      Está muito bom o tuturial! Já experimentei e é bastante fácil! Obrigado!

    7. Boss // October 10th, 2006
      Opera 9.02 Linux

      De nada ;. Obrigado eu …