GameSalad

Spriteattack's Art tutorials

1235713

Comments

  • JadarStudiosJadarStudios Posts: 264Member
    Mammoth said:
    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.

    That one is really nice. But one specifically for games/Gamesalad is even better!
  • Benjamin_m5Benjamin_m5 Posts: 646Member
    JadarStudios said:
    That one is really nice. But one specifically for games/Gamesalad is even better!

    Yes...It would be very nice to make a tutorial in inkscape or gimp about how to make animations (step by step)!!!

    That would be very very nice Sprite Attack!!!

    Cheers
  • SpriteAttackSpriteAttack Posts: 524Member
    Thanks, guys... I will make more and the animation tutorial is in the works... [it might take a little while due to travel time - heading back from Europe to Australia]...
  • JadarStudiosJadarStudios Posts: 264Member
    SpriteAttack said:
    Thanks, guys... I will make more and the animation tutorial is in the works... [it might take a little while due to travel time - heading back from Europe to Australia]...

    Can't wait! Thanks for your time!
  • FINNBOGGFINNBOGG Posts: 1,808Member, PRO
    OHHH CAN YOU PLEASE MAKE VIDEOS OF THESE AND TALK US THROUGH!!!!!!!!!!!!!

    Would gladly pay to watch.
  • SlickZeroSlickZero Houston, TexasPosts: 2,870Member, Sous Chef
    ccp said:
    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

    Dude, that's pretty sweet.

    Awesome tutorials, Sprite. They've helped me get past an art issue I was having with a platform design. GameSalad is lucky to have people like you guys in the community that are so willing to help other people the way y'all do. Thank you.

    I have no friends. I'm a loser that makes video games all day. Will you be my friend?

  • JadarStudiosJadarStudios Posts: 264Member
    I did this one quick this morning,

    image

    I really like how CCP did his too!
  • ccpccp Posts: 139Member
    @SlickZero
    Thanks man... I just now changed him to sad ...

    @JadarStudios
    Nice job!

    @Me!
    Here is another one I did ... He's an evil master bird ... lol

    image
  • JadarStudiosJadarStudios Posts: 264Member
    @CoffeeChuggers: Haha, nice watermark! How did you get your stroke to be thick, then thin?

    @SpriteAttack: I can't seem to get the font Helvetica working in Inkscape, when I click it, then start typeing, it goes back to Sans. Or I highlight my text, then click Helvetica, it stays Helvetica, but it doesn't change the look of the text. Does it work for you? Any suggestions?

    -Jake
  • ccpccp Posts: 139Member
    @JadarStudios
    I don't use any stroke ... I turn it off

    Well ... here is an additional yellow bird.

    image

    And here is the bunch!

    image
  • JohnPapiomitisJohnPapiomitis Posts: 6,256Member
    some awesome stuff being made from the tutorials! just keep in mind not to go crazy posting you art in here though, it just makes it harder to find the tutorials in this thread
  • ccpccp Posts: 139Member
    Oh i'm sorry ... I can take it all down if you want.
  • JohnPapiomitisJohnPapiomitis Posts: 6,256Member
    ccp said:
    Oh i'm sorry ... I can take it all down if you want.

    no no leave it its cool to see what people are doing with the tutorials, and im sure spriteattack would love to see as well. Just giving the heads up so it doesnt get crazy and hard to navigate

    cheers
  • JadarStudiosJadarStudios Posts: 264Member
    ccp said:
    @JadarStudios
    I don't use any stroke ... I turn it off

    Then how do you have a black outline?
  • icanmakeicanmake Posts: 466Member
    JadarStudios said:
    Then how do you have a black outline?

    he might just offset the path then color it black
  • JadarStudiosJadarStudios Posts: 264Member
    icanmake said:
    he might just offset the path then color it black

    oh ya, lol... make a duplicate, send to back, and make it bigger...
  • ccpccp Posts: 139Member
    JadarStudios said:
    oh ya, lol... make a duplicate, send to back, and make it bigger...

    Yeah ... that's what I did ...
  • SpinningnutmegSpinningnutmeg Posts: 107Member
    Here is a bear that I drew with mostly circles. Thanks SOO much SpriteAttack! These are great tutorials!

    My Circle Bear
  • UtopianGamesUtopianGames Posts: 5,677Member
    Loving the art guys!

    Darren.

    image
  • SpriteAttackSpriteAttack Posts: 524Member
    It's great to see some nice work... Top job guys! Here's the next lot:

    Creating a game character

    Let's get started on a simple 2D character. There are a lot of resources and tutorial out there on character creation and animation - most of which written by and for artists and animators. I will try and break in down to simple elements and easy to follow steps.

    Note:
    Some of the techniques used in this tutorial have been covered in earlier post. They should help you working your way through this a little bit more complex tutorial.

    image

    image

    image

    It's time to start getting creative. Building a character from scratch we start with the head and create the body and limbs before assembling the elements into the final figure.

    Note:
    When working from a sketch, scribble or concept drawing it's helpful to import the bitmap image into a new layer at the bottom of your stack and work on top (Layer/ Add Layer or SHIFT+CTRL+N). Bring up the Layers (SHIFT+CTRL+N), select the sketch layer and import the bitmap. Lock the layer and select the work layer (e.g. Layer 1).

    image

    image

    In order to make it easier to animate the character later grouping elements and assigning better pivot points is really helpful. Rather than turn an object like an arm at it's centre it makes more sense to turn it at the shoulder. In order to do that, select objects that 'belong' together and move the pivot points.

    image

    This concludes the creation process. Now it's time to go in and play with the shapes, create some variations and make the most of the objects we have created so far.

    image

    image

    Enjoy!
  • JadarStudiosJadarStudios Posts: 264Member
    SWEET! Thanks!
  • Benjamin_m5Benjamin_m5 Posts: 646Member
    Wow, nice animations tutorials...will try that as soon as possible and will post it here :)
  • crapscraps Posts: 353Member
    Here is my very first AI attempt. Thanks for the inspiration.

    Image and video hosting by TinyPic
  • SpriteAttackSpriteAttack Posts: 524Member
    I just played around with more circles and a different approach to the eyes from the first tutorial... as well as using the bezier curves and straight line tool for some simple shapes.

    image

    image

    As always - I hope you enjoy this tutorial and I hope you have more fun with vectors...
  • Braydon_SFXBraydon_SFX Posts: 9,008Member, Sous Chef, PRO, Bowlboy Sidekick GameSalad Employee
    Hey SpriteAttack - Great stuff. :-)
    Keep at it.
  • WellenArtsWellenArts Posts: 1Member
    Great tuts!!
  • SpriteAttackSpriteAttack Posts: 524Member
    Taking the last post a little further this tutorial will feature a basic face by using mainly circles (again), some more advanced straight line tool and the node modifier.

    image

    image

    With the inital setup done it's time to play with the shapes and try out some variations.

    image

    image

    I hope you enjoyed this addition and it gave you some ideas how to have fun with vectors.
  • SpriteAttackSpriteAttack Posts: 524Member
    Cracking up...

    Here's a quick post on how to create the crack in the office window tutorial. It's basically a quick use of the straight line and bezier curve tool and some moving around of nodes.

    image

    Note:

    Combining the spiky shapes (Path/ Union) cleans it up a little bit more - as you won't see the overlaps. Keep in mind to combine two objects at a time in inkscape.

    I hope this quick tutorial explains the creation of the crack well enough.
  • beefy_clyrobeefy_clyro Posts: 5,390Member
    Hey Sprite. Any chance of showing how some of these could be done using 'Inkpad' on the iPad?
Sign In or Register to comment.