next »

[Eluardian]

She'll be fine as long as she doesn't move ever again, right?

[BeautifulGlitch]

This is looking pretty promising! Congratz on that 

[oddcat]

Hi, I like the art of this a lot. The gun mechanics are also a really cool idea. I look forward to seeing more in the future.   

[math crab]

I'm in love. Everything about the game screams mystery. Or perhaps whispers mystery.

[rj]

how in fuck's name are you 19 years old

[JobLeonard]

Wait what? Seriously? That's amazing! I'm especially impressed by your thick skin vs the "internet feedback" you had to suffer through a few pages back!

[FrostyChao]

It's funny, I wasn't personally aware of the outline/no-outline issue because ever since I've seen the game for the first time on twitter, it was already redesigned (including the name and the character). I didn't even know this forum existed.

That being said, I think the whole overhaul was a great upgrade for the game. In a way, I think people get somewhat "attached" to a project and its style, and there is an inevitable shock when lots of things change suddenly, be it for the worst or for the best.

I think pixel perfection (and matching resolutions, scaling, rotations, animations, and whatnot) is indeed a matter of style. A game can derive from pixel art and have pretty impressive looks if the combination is consistent and pleasant, even if not everything is pixel-precise. Games like "Death Road to Canada", "Rabi Ribi", "The Binding of Isaac" come to mind. Some games even have crazier combinations like "Ys Origin" and "Final Fantasy Tactics" (mixing 3d rendering and sprites), and they feel perfectly fine.

The art in your game is gorgeous, the UI is on point and I like that you can do a lot of customizations with your weapon. The mysterious tone of the lore is a nice touch, and I can't wait to see more.

I wish you best luck on the development! 

[Thaumaturge]

Aha, the Nykra devlog!

I'm already familiar with the project via Twitter (I'm @EbornIan there), so I don't have much to add right now; I'm really just popping in to "say hello", having recently joined TIGSource and seeing your devlog pop up. Nevertheless, I feel that I should at the least reiterate that the art and aesthetic remain lovely, and I'm interested to see where the gameplay goes. ^_^

[ENDESGA]

INTRODUCTION

Pixel Art.
The power of pixel art is often underestimated, due to most indie games using it, and the expectations of players for a highly detailed game or piece of art. A lot of people seek help, guides, and tutorials - people including me many years ago.
I've always been an artist and sketcher, but pixelart has become a powerful new obsession of mine.

The thing with pixel art, is that there are many many many (basically an infinite) different styles and ways of drawing things... so this tutorial is to GUIDE you to find your own style - rather than just copying what I've drawn.

I deeply encourage you to push, pursue, and power through all hurdles involved with learning pixel art. If I can do it, so can you!

TOOLS & APPLICATIONS

For NYKRA, I'm currently using Photoshop - but only because I'm used to it.
I highly recommend Aseprite, or GIMP. Pyxel Edit is also pretty good, along with many many others!


SIZE & SCALE

When it comes to pixel art, tiles are incredibly useful. It can be for a game, or even just for a specific style! But not only are tiles useful, they help with scale.

SCALE IS THE MOST IMPORTANT THING.

The reason why scale is important, is because it helps us make sure what we're drawing isn't ridiculously unrealistic! Though saying this, if you're purposely drawing unrealistic things, then scale is up to you!
But for the most part, you're wanting to pick a canvas size that will fit everything you'll need in a piece.

As for tile sizes, refer to this image:

Almost all tiles I have ever drawn are 16x16, due to the fact that it's easy to express enough detail withough having to fill a large space.
You may want to pick a sub-scale ~ telling yourself that you must not draw sprites that are not a multiple of 8, or 4. In my case, all of NYKRA's tiles fit in an 8x8 grid, AND a 16x16 grid. This ensures that what you're drawing is cohesive!

If you're drawing a spritesheet, a good canvas size is 16x the size of your tiles:

8x8      -->    128x128 canvas
12x12   -->   192x192 canvas
16x16   -->   256x256 canvas
24x24   -->   384x384 canvas
32x32   -->   512x512 canvas

PURPOSE

YOU GOTTA BE DRAWING FOR A REASON!
If it be to practice, to draw some game sprites, or even an arty piece, you have to have some sort of "purpose" to what you're drawing. You can draw without purpose, but it's sooOOOooo much easier when you know what you want.
Think:
"I'm gonna draw some bushes for my game"
"I'm gonna practice body shapes"
"I'm gonna play around and find a nice palette"
"I'm gonna explore different ways of drawing stone"

PALETTE

Now, the juicy stuff!
There are a countless number of palettes. COUNTLESS!
"So which one do I choose?!"
Well, I may be able to help you.

Most palettes, like Arne's 16 Palette, the magnificent DawnBringer32 Palette, and the legendary PICO-8 Palette are really good to work with! And though the artists who created them are more experienced than me, I found that the palettes lacked direction towards material use.

"Material use?"

Well I mean the colours are organised and formed around the idea that they work together, to allow you as the artist to paint with materials.

And with that, here is the first of my two palettes. ENDESGA~16  (EDG16):


Hex (left to right colours on top bar):

#e4a672   #b86f50   #743f39   #3f2832   #9e2835   #e53b44   #fb922b   #ffe762  
#63c64d   #327345   #193d3f   #4f6781   #afbfd2   #ffffff   #2ce8f4   #0484d1

In a lot of cases, using the PICO-8, DB32, or ARNE16 would be far more versatile! But I've found for me, when developing NYKRA, that putting the colours in to "materials", you can easily structure different objects.

Speaking of structuring...

PAINTING & CREATING

OKAY! So, in this part, I will show you the 6 basic steps to drawing a sprite.

Have a look, and I'll explain below:

Here we're drawing a quick (like, super quick) sprite of a palm-tree-like plant with very basic forms. One thing that I find easiest, is to use a 2x2 pixel brush. This can make your art look a little more chunky and easier on the eyes!

KEY THINGS:
- Give the light a pleasing direction
- Remember that objects are 3D! Keep depth in mind.
- Try to keep shapes clean.
- Be consistent with form. Don't do tiny 1x1 pixel details on one thing, then none on another!
- Remember that the EDG Palettes are built for materials!

 1. Here we start with our basically random "blob", which we will craft in to the leaves.

 2. This is out first stage of lighting for the leaves. I like to go from the top-left down 45-ish degrees, but you can go from any direction. But you'll find top-left or top-right work best.

 3. This is the second and final stage of lighting for the leaves. Think of volume, and play around with how much highlight there is. The Rule of Thumb is generally that there is a medium amount of mids, a lot of dark, and even more highlights. But this is up to you!

 4. The basic shape of the trunk is put in.

 5. The lighting of the trunk is put in. Now, remember that the leaves have DEPTH. And depth is incredibly important to make your art POP! So there is a shadow coming from the leaves.

 6. Last layer of lighting done, and some extra details.


See, that wasn't so bad!

EDG32

Hex: #be4a2f  #d77643  #ead4aa  #e4a672  #b86f50  #733e39  #3e2731  #a22633  #e43b44  #f77622  #feae34  #fee761  #63c74d  #3e8948  #265c42  #193c3e  #124e89  #0099db  #2ce8f5  #ffffff  #c0cbdc  #8b9bb4  #5a6988  #3a4466  #262b44  #ff0044  #181425  #68386c  #b55088  #f6757a  #e8b796  #c28569


This is the official palette for my project, NYKRA, which by the way is this DevLog right here!  

I hope you decide to try to use this, then once you've got the hang of forms, TRY MAKING YOUR OWN PALETTE!

CHARACTER DESIGN & TECHNIQUES

Due to this tutorial becoming popular on Twitter, I've decided to expand upon it!
So, here are some tips and processes when it comes to drawing characters:

I start off with the tile size (32x32), then decide to make the character slightly taller. I then block out COMPLETELY RANDOM shapes. Yup, I didn't pre draw this guy! This is to prove that you don't always need to have a specific guideline. Draw some blobs, turn them alive!
After that, some lighting and edits are made. And once I decide "This guy is gonna be a lizard-dragon warrior", I finalised his design.
This guy uses the EDG32 palette, and as you can see, it's really easy to block out colours and lighting!

CREATIVE PROCESS

When it comes to turning the blob in to a character design, it take a lot of "hm, does it look good?"
Think about structure, and remember that it's best to find what looks good to you!

For this guy, I originally drew the green blob, which I figured could be turned into a head! So all it takes is a bit of questioning and slight direction, and you're good to go.
Other details like the strap and weapon is purely from the fact that NYKRA has a similar take on character design. Simple shapes, and easy to recognise features.
Put some time aside, and try drawing a character! Maybe even redraw them a few times.
My character Keu took many many attempts to get to a point when she looks perfect to me and that's all you need sometimes!


LINES & CURVES TECHNIQUES

When it comes to drawing lines, it is important to keep mathematics in mind!
Think "multiples of 1, 2, 3, 4, etc."

So as you can see, the lines go 1 across, 2 up, 1 across, 2 up. Simple!
This keeps things clean, so try to avoid messy random lines.
This goes for curves as well. You can generally think to yourself "1,1,1,2,3,5,8,5,3,2,1,1,1", which requires you to draw each pixel by hand! But it looks a million times better than a freehand messy wobble.



To Outline, Or Not To Outline...

YOU CHOOSE!

One thing to avoid though, is just purely outlining the sprite, rather than taking form in to account.
Refer to this:

As you can see, the character looks fine without an outline! But suddenly looks rather terrible when a solid outline is PUT around the character. The third image is taking material and depth in to account - which is the way to go!
And the last image is using darker colours to give even more depth, which can look really amazing when done right!!

OUTLINE COLOUR, and the magical "INK"

Since the EDG16 and EDG32 palettes are high in saturation, it would be a sin to use pure black as an outline.
One of the colours in both palettes is what I call "Ink". This colour binds all of the colours in the palettes, and makes the outlines softer.

DO NOT USE PURE BLACK, PLEASE!

The difference isn't huge, but when you have a darker background, it really makes it nicer!


PALETTE SHIFTING & ROCKS

Here I'll show you how I go about drawing rocks:

REMEMBER: SIMPLICITY IS KEY! Try not to use all 6 of those colours for one rock. Keep it soft and clean!

Rocks are relatively easy to construct. You mostly have to remember that stone is formed by layers and chunks. So draw a good ol' blob, and construct the forms!
Also, as you can see, you can easily shift the palette! Metals like aluminium are brighter, and maybe basalt or steel could be the darker ones!
Easy!


WEAPONS, ITEMS, & TOOL DESIGN

By popular request, I'll tell you about some basics for item design!

One major thing to remember when drawing items, is that it's best to not be too precise. Using a graphics tablet can help with this, but if you don't have one, try to give the items life.
Compare the 3 usual designs on the left, to the ones on the right!

Try to avoid being too simplistic! Most items are inside a small tile size, so make the most of it by including small DETAILS!
A vine holding the head of the Pickaxe? Why not!
Make sure to explore options and designs, because each item is there to show a part of the game. Every pixel counts!

If you're drawing a pickaxe, make it look like it's been used. Give the sword some leather, or make the bread half eaten!
When I draw items, I try to make sure that they pull your eyes in - so use more than 2 materials if possible!




In conclusion, I recommend that you try either the EDG16, or the EDG32 palette for practicing.
It really isn't too hard, but once you have a good few colours, the whole thing forms itself.

So happy pixel arting, and I'll see you in the next one.  

[if you have any questions, contact me on my Twitter or leave a comment here (if you have a TIG account).

Much love, and happy pixels~

-EDG  

[kynanjoel]

this is really useful, thanks!

game looks beautiful 

[11thMuse]

I just wanted to post a little micro-tutorial here to supplement this. For anyone using Aseprite, this technique will allow you to embed the EDG-16 and EDG-32 palettes (or any others for that matter) in Aseprite's palette picker permanently.

1) Save the images containing the two palettes anywhere you like.

2) For both images, do steps 3 - 8:

3) Crop out the palette from the image.

4) Paste the palette into a new Aseprite document.

5) From the palette options button (directly below the "Home" tab), choose the "Create palette from current sprite" option.

6) In the popup dialogue, choose "Create new palette..." option. Define the palette size depending on which image you chose (16 or 32, larger is fine, but smaller is not).

7) Save palette from the palette options. Save it as a .pal file. Where you save it depends on your computer and how you purchased Aseprite. Fundamentally, you're looking for a folder structure like 'Aseprite\data\palettes\'. If you're on Steam, this will be in the 'steamapps\common\' folder. Anyway, save the .pal files into the 'palettes' folder.

8 ) Close and restart Aseprite. Click the palette presets button, et voila!  




  *BONUS ROUND*  

You can also create palettes from scratch, by hand, using RGB colour values (other types of values, such as HEX, maybe also work, but I've never tried it).

To do this, create a text file, and rename it to something like "edg-16", then give it either a .gpl or .pal file extension.

Then, in the order you would like the colours to appear in the palette window, create a new line in the text file for each colour, in the format: RedValue GreenValue BlueValue Name(.gpl only).

So for example, in the db-16 palette, the first entry reads:
20  12  28   Untitled

There is also some header info you need to put into these files. For .gpl file, they should be of the structure:

GIMP Palette              File type (mandatory)
#                         These 4 lines are comments, write whatever you like.
# by Joseph White
# http://www.pico-8.com/
#                         I believe that this # is mandatory for .gpl files as a delimiter of sorts.
  0   0   0   black
 29  43  83   dark_blue
126  37  83   dark_purple
  0 135  81   dark_green
171  82  54   brown
 95  87  79   dark_gray
etc.

EDIT: To clarify, each line which begins with a # will be a comment, and therefore ignored by Aseprite, however, even .gpl files which contain no comments always contain at least one blank line which begins with a #, before the colour definitions begin.

And for .pal, they should look like:

JASC-PAL    File type
0100     I don't know what this does! Don't change it! (possibly alpha channel related)
32     The palette size.
0 0 0
190 74 47
216 118 68
234 212 170
228 166 114
184 111 80
116 63 57
etc.

For both examples, stuff in italics are my comments, not part of the files. Anyway, save those files into the same directory we talked about earlier. They will function in exactly the same way as palettes made from images.

Happy spriting!  

[ENDESGA]

[HoffmanIV]

That's awesome! All the best man!

[strobosaur]

KICKOFF

Nice!! And timed perfectly

I have been meaning to thank you for making the tutorial, and the palette is just great! I just assumed that my inexperience with color theory prevented me from making anything good with i.e. DB or ARNE (which, of course, is still very true ) but you put my thoughts into words perfectly. They are great palettes, but i guess they are just not very well balanced towards what i want to do... Your palette felt better right away, and i felt i always had a colour for what i wanted to do with my sprites or tiles etc as soon as i started using it... I have since tried to tweak the colors even further to my personal taste, but this was a great starting point!

This log is definitely one of my faves ny now - everything about this project is to my taste (except maybe for the split pixels to which im undecided, it looks good on the background bushes and those kinds of things when they are waving slightly, but not so much when it comes to movement and the rotations of the gun... Maybe it will pass

Looking forward to the next update as usual.

[CesarD8]

This is so pretty man And that tutorial is already bookmarked Count me in for your kickstarter.

[ENDESGA]

- Your palette felt better right away, and i felt i always had a colour for what i wanted to do with my sprites or tiles etc as soon as i started using it... -

Thank you so much for the kind words!! :'D <3
I'm happy people are finding use of this palette, since most palettes out there are either mathematically continuous, or are just made to cover a wide range - rather than the ease of use.
I'm glad you like it!


-

This is so pretty man And that tutorial is already bookmarked Count me in for your kickstarter.

Thanks so much! I should probably post more on here. But now that there's WWW.NYKRA.COM it's difficult to keep up with it all.

The Kickstarter is less than 5 weeks away, and I'm so excited to show you all more <3

[Zizka]

I like the way you're handling your KS campaign. Very slick and professional.

How much are you going for?

[ENDESGA]

I like the way you're handling your KS campaign. Very slick and professional.

How much are you going for?

Thanks! $27k might be the goal, and if my calculations are correct, it should cover everything

[ENDESGA]

THE NYKRA KICKSTARTER IS LIVE!

[JobLeonard]

THE NYKRA KICKSTARTER IS LIVE!

Good luck!