I made The Mana World logotype in 2005. During 4 years I learned a lot. Recently I couldn’t find even high quality version of it. I decided to mess around with original logo design. It’s still vector concept of logo. I thought about 3D render with some nice effects like glass-like orb in middle. Bump mapping on carvings, etc. We could made even animated version for loadings or other purposes.
First of all. I made this tutorial in November 2008, but somehow I forgot to publish.
In April I described how to design outlines for pixelart purposes. Today I decide to show how to break “square” outlook of tiles. So we will challenge an almost inmposible shape – spiral tower. Moreover that spiral construction will be tilable and allows us to build the tower with unlimited height.
Tools:
– Inkscape (www.inkscape.org)
– GIMP (www.gimp.org)
1. Lets try to draw “gear” in Inkscape. We will use for that [polygon] tool.
2. Duplicate our gear-shaped object, and rotate it.
3. Convert it to perspective view by changing height to 70%
4. Now add colour (I think white is best choice) to each “gear” and move it like this:
5. Now all we need is just correction of distribution. We do that because we want our tower to be vertically tilable. Remember that 32×32 grid is very helpful. Notice that I mirrored whole shape, because right side of it was darker – and now it will be easier to manage correct light and shadow effects.
6. It’s done. Shape on the right is our base tile. And who said that was an “impossible shape”?
If you got any questions, just ask in comments.
Yet again. One more time… Never-ending story.
Studenckie Spotkania Kabaretowe – part VI :P
There is no such thing like “artistic value” in this case. I just need to host it for a while, sorry!
Just a quick and rough design. I managed to use only black and white colour, with nice grunge climate, but unfortunately bands manager had a different opinion. “It happens” ~all the time ~
Rust and metal textures comes from: Stock Exchange (www.sxc.hu)
In march I decided to abandon Concrete Walls tileset. It had some limitations because of the size of bricks. I’m not developing this tileset any more. It reached version 0.1.13. I started new tile project instead. Block walls can be used as city walls, prison, castle, and many more. Quality and tiling capabilities are better than in the previous tileset. Initially, this tileset will be used as base of city walls in port town. It’s also signed as OpenTile.Org. Actually, I was thinking about that kind of open project for GPLish games. If anyone is willing to help with that kind of project, please contact me via mail. Otherwise tilesets will be only hosted here.
Just take a look. Any feedback will be appreciated.
Gates are on schedule :)
If you are interested in old concrete tileset, you may find it here:
ENJOY! :)
I’ve decided to make my first pixelart tutorial. Long time ago (aprox. 3 years) I drew well. It’s out of perspective and it does not look not as good as it supposed to. Now I will try to correct some of the mistakes, showing you at the same time how to use reference capabilities of Inkscape and GIMP.
Tools we need:
Something is wrong with this well… Let’s try to describe potential mistakes:
Well graphics is located on data/graphics/tiles/desert_x2.png. Let’s take a look.
As you can see we got 64x64px. This could be a potential problem. However we aim to not brake existing maps. So we ought use this space. Also to make our new well a bit more 3D’ish I’ve decided to make the rope part at a different angle.
Now is the time for showing Inkscape’s vector capabilities.
File -> Document Properties
Width: 64px
Height: 64px
Now draw a circle 54x54px with 1px outline. And make direct TOP planar view of our well. You should have something similar to this:
Now let’s rotate our well. Angle? How about 30 degrees? You will see the purpose of this action later. Now we’ve got:
So what now? Now we select all, and change the units on the toolbar (from px to %), make sure that you have unlocked the aspect ratio (small lock between W and H values), and type 70% into H (height). Looks odd, don’t you think? But consider that this is how circles should look in the TMW’s perspective view.
Now is the time to show how we could make it to look like a 3D object. We simply have to duplicate the blacks rings, place them above and connect with lines. Operation is similar to the EXTRUDE operation used in the 3D editiors. The results of the operation:
Because of the space limitation we might have to reduce the height of the well, but now let’s concentrate on the wooden part with rope. Green rectangle stand for the outer box. Red squares are side pillars. Lets extrude them.
Zoom 400%. Take a look at this. Yellow shape with green bevels is our container for the wooden construction. Finally red pillars could be also thinner. If you are going to ask where will we put crank – notice we’ve got space on both sides of well. We could align our well to one side – doubling the space. So that is not a problem. So let’s concentrate now on the wooden construction. It has to be rounded. So we must put circle in correct perspective on either side part of container, and then simply connect nodes. Sounds easy.
Accomplished design should looks more less like the one on the bottom. Don’t forget to change the black outlines into gray – it allows us to recolour them much easier. Now we should export our well in scale 1:1. This is the end of the design phase. Time to pixel!
Final product of DESIGN PHASE:
Many people start from this step. Without doing the analysis, without the concept art and the design drawings/sketches. Of course they can. But I can’t. I like when the objects in the game are well pixelated, with the corect palette, perspective. That’s the reason why I showed you 2 previous steps. certainly, all of you have seen many pixelart tutorials. However I never seen someone who would design a base for a pixelart in Inkscape. At least you should try :)
Let’s look one more time on the old well and compare it to the new shape:
Do you see what I was talking about?
Next we will add some details to our design sketch.
Now, it is time for some textures.
Some other details, like wooden pillars:
wooden rope construction and some highlights:
Shading and some finishing touches on the brick surface:
Correct placing (I moved it to the left). Adding a crank and background, shadows and shadings. And it’s done:
All we need to do now is edit desert_x2.png. I see some minor mistakes – especially on the main well shadow, but it could be improved before committing into SVN.
I’ve decided to correct the shadow… Now is a bit better.
Now it’s done. Lets take a look how it now looks in game.
Now you can see that the cactus and the well are in the same perspective, the box is a bit off. Maybe next time we will draw some boxes!
Thanks for your patience. As you can see it isn’t as hard as it looks. I hope you’ve enjoyed this tutorial.
Or maybe not… :P Here is the version without the background.
Oh WELL…
Mansion of Thoughts 