GameSalad

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Spriteattack's Art tutorials

1246713

Comments

  • JadarStudiosJadarStudios Posts: 264Member
    Here is my glass photo, its pretty much identical... lol

    image
  • SpriteAttackSpriteAttack Posts: 524Member
    @svn - the simplest way is just to duplicate (Ctrl & d).

    @Alex - I am working with inkscape 0.48 and a simple 'Export Bitmap' and a .png file name gives me a transparent output. If you 'Save' the image and then select PNG you get a 'flattened image' by default.

    @Psychotic - the next tutorial will be about characters and animations as well as customising the style... I will add an adventurer to the list.

    @Jadar - nice one... ;) The grunge texture in the window variation is a free clipart that I keep close for 'dirty jobs'. I added it to the windows with a 20% alpha and set in a Clip. The crack is done using the 'straight lines and bezier curves' tool, duplicated and moved down a little for the yellow highlight and with adjusted alpha.
  • SpriteAttackSpriteAttack Posts: 524Member
    Note:
    A lot of the objects I am covering in my tutorials (like the palm trees above) working from predefined shapes (circle, square, star, etc.) is only one option. The freehand or straight line tool will create identical shapes but require a little more artistic skill.

    For our detailed palm we need two 'more advanced' features of inkscape: Interpolation and Path Effects.

    image

    Varying the fronds, adding to the interpolation and checking some reference images can improve the look of the palms even further.

    I hope even these slightly more advanced features don't pose too much of a problem. Enjoy and stay tuned for more!
  • SpriteAttackSpriteAttack Posts: 524Member
    @cap - I was just playing around with some shapes to form the character for the animation tutorial and he ended up a little like Mario... ;)

    image

    Let's call him Nudio...

    and he can even be animated with little effort...

    image
  • Let's call him Nudio...

    HAHAHAAA thats great !! lol
  • SpriteAttackSpriteAttack Posts: 524Member
    ... and another try... Different style but same workflow... all done using modified circles.

    image

    image
    [Something resembling ingame size]
  • PsychoticStudiosPsychoticStudios Posts: 101Member
    It's Nudio time! LOL
  • MammothMammoth Posts: 640Member
    Great tutorials. Once you get a lot of these you should publish a book.

    www.mammothinteractive.net
  • JadarStudiosJadarStudios Posts: 264Member
    Mammoth said:
    Great tutorials. Once you get a lot of these you should publish a book.

    www.mammothinteractive.net

    Congrats to Mammoth for getting post #100 in this thread... lol

    Mammoth is right, this should be in a book. These tutorials are great!
  • CapCap Posts: 225Member
    SpriteAttack said:
    @cap - I was just playing around with some shapes to form the character for the animation tutorial and he ended up a little like Mario... ;)
    [...]
    Let's call him Nudio...
    and he can even be animated with little effort...
    [...]

    Haha, that's really awesome. You should suggest Nudio to Nintendo. They really struggle when it comes to inventing new game characters, that's why they always have to release games with Mario, Luigi, Kirby or Link. I wonder how games like Nudio Party or Super Nudio Galaxy would look like... ;-)
    I'm looking forward to this tutorial!

    Moreover, there's something I would like to tell you: for about 15 months I search the net regularly for good vector tutorials. During this time I found about 20 that are adequate for my needs, even though they're rather targeted at Illustrator users.
    Your tutorials seem to be a perfect fit for my needs, not only because you're using Inkscape, but also because you're using an art style that I think is really charming. And you cover the basics in a way even beginners understand. I'm glad I have to search the net no more for good vector tutorials... Thank you! :-)
  • JadarStudiosJadarStudios Posts: 264Member
    Cap said:
    Moreover, there's something I would like to tell you: for about 15 months I search the net regularly for good vector tutorials. During this time I found about 20 that are adequate for my needs, even though they're rather targeted at Illustrator users.
    Your tutorials seem to be a perfect fit for my needs, not only because you're using Inkscape, but also because you're using an art style that I think is really charming. And you cover the basics in a way even beginners understand. I'm glad I have to search the net no more for good vector tutorials... Thank you! :-)

    Agreed!
  • SpriteAttackSpriteAttack Posts: 524Member
    Thanks, guys... I am glad I can help... and have some fun at the same time... ;)
  • PsychoticStudiosPsychoticStudios Posts: 101Member
    Cap said:
    Moreover, there's something I would like to tell you: for about 15 months I search the net regularly for good vector tutorials. During this time I found about 20 that are adequate for my needs, even though they're rather targeted at Illustrator users.
    Your tutorials seem to be a perfect fit for my needs, not only because you're using Inkscape, but also because you're using an art style that I think is really charming. And you cover the basics in a way even beginners understand. I'm glad I have to search the net no more for good vector tutorials... Thank you! :-)

    JadarStudios said:
    Agreed!

    I am so with you guys I've been on the hunt for good art tutorials for about a month. When it comes to art I was the kid in class who would probably fail. But since I found these and Inkscapes a free program. I am surprised about what I am able to accomplish. I mean comparing this to my stick figure drawings to this. There is a HUGE difference.

    LOVE THESE TUTORIALS!! Can't wait for more!
  • RumiRumi Posts: 343Member, PRO
    Could you please make one for a woven basket?
  • SpriteAttackSpriteAttack Posts: 524Member
    A final addition to the sunset tutorial:

    Recycling objects
    If you have similar screens to design for your game it makes sense to spend some time on the initial elements and then 'recycle' objects. This way you safe time and create a more consistent look and feel.

    image

    During the beach tutorial I created a stamp border for the illustration. Here is the step-by-step on how to get there.

    image

    Note:
    The reason for ungrouping and combining the circles first lies in the restriction in Inkscape to only do a Union, Difference, Intersection, Exclusion or Division between two objects.
    Tools like CorelDraw can do these with a group or even just several selected objects. Try around around a little see how your vector application handles these very handy commands.
  • GuaveMediaGuaveMedia Posts: 1,262Member, PRO
    Hey,

    I created some buttons at Inkscape and added texture effect on it, but when I say export bitmap, I don't see the button :// just the number I wrote into it ....
    mhmmmm.....

    someone know how to solve that?

    see ya

    www.guavegames.wordpress.com
    www.tranrock.wordpress.com

  • JadarStudiosJadarStudios Posts: 264Member
    Alex0407 said:
    Hey,

    I created some buttons at Inkscape and added texture effect on it, but when I say export bitmap, I don't see the button :// just the number I wrote into it ....
    mhmmmm.....

    someone know how to solve that?

    see ya

    What do you mean? The Export Bitmap window doesn't have a preview window. Do you mean after you export it, and then look at the PNG?
  • GuaveMediaGuaveMedia Posts: 1,262Member, PRO
    After Inkscape exportet the PNG I just say my numbers added in the button, the button itself is just gone away ...

    www.guavegames.wordpress.com
    www.tranrock.wordpress.com

  • SpriteAttackSpriteAttack Posts: 524Member
    @Alex - I am guessing here... but with some of the filters the button object gets bigger / gets transparent border. Make sure you have all the elements selected and the export options set to 'Selection'.
  • JadarStudiosJadarStudios Posts: 264Member
    RKS said:
    I would use "drawing", not selection, but either one should work.

    Well if you have multiple drawings in a file, then selection is easier, so you don't have to crop it later... I can't figure out how to make it not export at 90DPI, cause if I set it at 72, the dimensions change with the DPI.
  • RumiRumi Posts: 343Member, PRO
    Just save it at the needed dimensions and use Deep Blue Ideas "PNG inspector" app to force the dpi's to 72. Thats what I did!
  • FloridaGamesFloridaGames Posts: 328Member
    Whenever i try to interpolate 2 pieces, no mater how many steps i tell it, it only makes 1 new shape, and its not in between the 2 either. its way off to the other side of the page.
  • SpriteAttackSpriteAttack Posts: 524Member
    @FloridaGames - did you convert the two object to paths? Inkscape will only interpolate path objects (no squares, circles, stars, etc.)...
  • JadarStudiosJadarStudios Posts: 264Member
    @SpriteAttack I can't seen to get the palm fronds right, this is one of my attempts. its all big, and not thin like yours. Any tips?

    image

    -Jake
  • MammothMammoth Posts: 640Member
    A really useful one would be character animation.
  • Braydon_SFXBraydon_SFX Posts: 9,012Member, Sous Chef, PRO, Bowlboy Sidekick GameSalad Employee
    @Jadar-
    I don't know if Inkscape can do this, but just transform it, and pull on one of its edges. Like the stem, drag it to the right and that should make it longer, as well as thinner. :-)
    Just a quick fix.
  • ccpccp Posts: 139Member
    Hey man! Thanks so much for the help! I just made this bird using your tutorials to guide. It is an supposed to look like an "Angry Birds" bird.

    image
  • MammothMammoth Posts: 640Member
    @ sprite attack

    There are surprisingly few if any good tutorials on how to create 2D game art on the internet. If you made a website or a blog and constantly updated the graphics you would get a lot of people interested in your website. The format is great as well as content.

    - Start a blog or website
    - Keep making great tutorials
    - Eventually make an ebook

    If you do these things you will be successful.

    Good luck!
  • JadarStudiosJadarStudios Posts: 264Member
    Mammoth said:
    @ sprite attack

    There are surprisingly few if any good tutorials on how to create 2D game art on the internet. If you made a website or a blog and constantly updated the graphics you would get a lot of people interested in your website. The format is great as well as content.

    - Start a blog or website
    - Keep making great tutorials
    - Eventually make an ebook

    If you do these things you will be successful.

    Good luck!

    He did start a blog though, it is one of the earlier posts.

    EDIT:
    SpriteAttack said:
    I decided to run these tutorial on a new blog as well...

    http://2dgameartforprogrammers.blogspot.com/

  • MammothMammoth Posts: 640Member
    JadarStudios said:
    He did start a blog though, it is one of the earlier posts.

    Awesome! Perhaps I should read the entire thread :P

    Again, character animation is always my biggest pitfall. Since I have looked so hard, there isn't a good one that is specific to games. This is a good one.

    http://www.apaganza-art.com/2009/11/testing/

    If you do one you will be the first to make a tutorial on the subject.
Sign In or Register to comment.