Introdução

É sempre bom ver pessoas com força de vontade pra começar a 'spritear', mas muitos desistem no começo. Não é um trabalho fácil e a perspectiva em 45° (usada nos clientes Cip) deixa tudo ainda mais complicado.
Desde que comecei a jogar Tibia, minha maior expectativa nos updates era os sprites novos! Como é bom visitar um lugar novo, com itens novos, criaturas novas, enfim, com sprites novos. Enquanto no mundo Open-Tibia pouco se vê de novidades com relação a sprites. Talvez pela dificuldade de criá-los.
Quando comecei a 'spritear', percebi a dificuldade de visualizar o sprite in-game. Tinha que compilá-lo em um programa editor do arquivo SPR pra poder ver o resultado. Então nasceu a necessidade de criar um programa que pudesse ver em tempo real, que pudesse criar um cenário completo, que pudesse ver como ficaria os itens animados, que pudesse ver o resultado dos efeitos das magias, etc.

O TibiaCanvas ainda é um projeto em desenvolvimento, mas acredito que já dá pra fazer muita coisa legal com ele.

(TibiaCanvas - Exemplo de cenário criado com sprites editados)

Esse é o primeiro tutorial de alguns que pretendo fazer sobre o programa e sobre as melhores práticas de edição.

Alguns sprites que fiz quando iniciei a ideia do programa:
http://www.xtibia.com/forum/topic/192437-sprites-edmignari/

Baixe uma versão Beta do programa:
http://www.xtibia.com/forum/topic/189324-sprite-editor/


Ferramentas:

- Move
Modo Game

• Clique com o esquerdo do mouse para mover o personagem.
• Clique e arraste um item para movê-lo entre tiles.

Modo Imagem

• Clique e arraste para mover uma camada.

- Pencil
Modo Game

• Clique e/ou arraste o mouse sobre a tela do jogo para adicionar itens ao mapa.

Modo Imagem

• Clique e/ou arraste o mouse sobre uma camada para pintar à mão livre com traços.

- Eraser
Modo Game

• Clique e/ou arraste o mouse sobre a tela do jogo para remover itens do mapa.

Modo Imagem

• Clique e/ou arraste o mouse sobre uma camada para apagar pixels.

- Eyedropper
Modo Game

• Clique sobre a tela do jogo para copiar uma cor para a switch principal.

Modo Imagem

• Clique sobre a imagem para copiar uma cor para a switch principal.
• Segure Ctrl e clique sobre a imagem para definir a paleta de cores com as tonalidades da imagem ou marque a opção set switches.

- Bucket
Modo Game

Modo Imagem

• Preenche áreas coloridas semelhantes com a cor do switch principal.

- Zoom
Modo Game

• Amplia e reduz a visualização da tela do jogo.

Modo Imagem

• Amplia e reduz a visualização de uma imagem.

- Magic Wand
Modo Game

• Exibe o efeito mágico e o míssil selecionados.

- Tile
Modo Game

• Seleciona uma tile no mapa.

Os itens contidos na tile serão exibidos na widget Tile.

Clique com o direito para exibir as opções.

Edit: Abre o item no modo edição de imagem.
Paint-Brush: Seleciona o item como pincel.
Remove: Remove o item da tile.


Paleta de cores:

• Clique na switch principal para abrir a janela Color Picker.
• Clique nas switches menores para trocar uma cor com a switch principal ou segure Ctrl para apenas copiar a cor para a switch principal.
• Arraste uma switch sobre as outras para copiar uma cor.
• Segure Crtl com ferramenta Eyedropper para definir a paleta de cores com as tonalidades da imagem ou marque a opção set switches da ferramenta Eyedropper.

Algumas teclas de atalho:

M - Ferramenta Move
B - Ferramenta Pencil
E - Ferramenta Eraser
I - Ferramenta Eyedropper
G - Ferramenta Bucket
Z - Ferramenta Zoom
W - Ferramenta Magic Wand
T - Ferramenta Tile
F2 - Zoom - Tamanho original
F3 - Zoom - Ajustar à tela
F4 - Zoom - Preencher tela
Ctrl+Scroll - Zoom
Ctrl++ - Mais Zoom
Crtl+- - Menos Zoom
Ctrl+F1 - Abre a aba Game
Ctrl+F2 - Abre a aba Items
Ctrl+F3 - Abre a aba Outfits
Ctrl+F4 - Abre a aba Magic Effects
Ctrl+F5 - Abre a aba Missiles
Ctrl+F6 - Abre a aba Layers
Ctrl+F7 - Abre a aba History
Ctrl+F8 - Abre a aba Project
Ctrl+F9 - Abre a aba Tile
Ctrl+F10 - Abre a aba Colorize
Ctrl+F11 - Abre a aba Goto Position
Ctrl+Z - Desfazer uma ação.
Ctrl+Y - Refazer uma ação.
Ctrl+V - Cola uma imagem da área de transferência me uma nova camada (Apenas no modo edição de sprite).
Ctrl+P - Exibe as divisões de textura em uma imagem (Apenas no modo edição de sprite).
Ctrl+D - Exibe linhas diagonais em 45° (Apenas no modo edição de sprite).
Ctrl+G - Exibe uma grade mostrando as separações entre tiles (Apenas no modo game).
Page Up - Vai para o piso de cima no mapa.
Page Down - Vai para o piso de baixo no mapa.

Criando um novo projeto:

1- Vá ao menu Project>New Project
2 - Na janela New Project, defina um nome para o projeto. Escolha o local onde o projeto deve ser salvo ou deixe o local selecionado por padrão.


Até mais.

edmignari@xtibia.com

Gostei da utilidade de visualizar as sprite in-game, bem interessante o programa... Vai ajudar bastante gente nova que não sabe spritear muito bem.

muito mas muito bom!!

Vital acho que ta na area errada acho que deveria ser tutoriais aprovados ^^.

Parabens otimo tuto

Na verdade, existe uma regra que diz:

O Tutorial postado ficará no mínimo 3 dias e no máximo 7 dias na seção. Isso ocorrerá para se manter um padrão no número de tópicos na seção e para que os usuários comentem a aprovação ou reprovação do mesmo.

Poxa, brilhante ideia de programa.

Deve ter dado um trabalho bom pra fazer, adorei.

Pergunta: quais versões que roda? tentei uma aqui e não foi...

Pergunta: quais versões que roda? tentei uma aqui e não foi...

8.60, 8.70, 9.50, 9.51, 9.52, 9.53, 9.54, 9.60, 9.61, 9.62, 9.63, 9.70, 9.80, 9.83, e 9.86

Qual versão vc tentou?

Se vc encontrar um bug ou se tem alguma sugestão, deixa lá no tópico do editor. Eu agradeço.

Abraço.

Tutorial aprovado!

Tem como importar sprites maiores doque 32x32 direto ?

pode passar um SPR 8.6 ae? O meu bugou e n da pra dar compile. Quero testar In-Game como fica.

pode passar um SPR 8.6 ae? O meu bugou e n da pra dar compile. Quero testar In-Game como fica.

Baixa pelo site do RME:

http://remeresmapeditor.com/marklar.php?clients

Lembrando que eu postei um atualização pro programa. Agora abre a partir da versão 8.10.

http://www.xtibia.com/forum/topic/189324-sprite-editor/page-5#entry1577603

Tem como importar sprites maiores doque 32x32 direto ?

Tem. Quando vc for criar um grafico, pode importar uma imagem maior que 32x32, mas tem que ter as mesmas dimensões da imagem toda ou de cada textura.

exemplo:

Importando uma imagem inteira 128x96

Importando uma textura 64x64

Mt bom mesmo man ! virei seu fã esse programa é FODA

Só não entendi muito bem aquela parte de Texture na criação de um item, tem como explicar ?

Só não entendi muito bem aquela parte de Texture na criação de um item, tem como explicar ?

ArtcFox, uma textura seria a combinação dos sprites(32x32) pra formar um gráfico. O programa usa sprite sheet com várias texturas pra formar um item animado, por exemplo.

Sprites(32x32) ---> Texture --->Sprite Sheet ---> Graphic

Pretendo fazer um tutorial sobre isso.