Pages

The difference art makes - reskinning Pupey

A while back I saw this game video on facebook. It was a simple action game - the kind you play when you have a moment to spare and want to get annoyed in a flappy bird kind of way. In short - not really the kind of game I am good a playing BUT the kind of game that due to the rather limited amount of artwork is quite quick to reskin. 

 The game was created in construct2 by the talented Alegerian coder Hadjoudj Mohamed who, like most indie authors couldn't find or afford an artist to help with the game. 
The result was a working game with 'coder art' and UX/ UI problems that come with it (e.g. placing the play button away from the easy reach of the fingers, fading the buttons too much with the background, etc.).
I went ahead and took the title screen and altered it. Starting with the game character, working my way through the elements on the title screen and sorting out the UI in the progress. The main elements now are a lot cleaner and more visible. 


With the game character looking a lot like a mix between a bee and a minion the choice of a hexagon as the main design element was easy. The buttons had to stand out more from the background than in the original version. I went with a blue and purple gradient and chose orange as the contrasting opposite for the main buttons. 

The character was simple enough to allow a couple of funny variations.

Note:
I used CorelDraw for the animation process. The combination of multiple pages (that export nicely to layered psd files, which make it easy to export separate png files of the same size) and the use of symbols make it very easy to create the base set of images and alter them for those variations. 


The character has an idle animation, flying up, crashing and a game over animation - all up 22 frames. Once these frames where set up I just needed to alter the symbols once and CorelDraw would update all 22 pages of the animation for me. 






The game is finally out on kongregate:
http://www.kongregate.com/games/Algsoft/pupey_preview


Give it a try!

Chris Hildenbrand

2D game artist, pixelpusher, vector bender, face turner for over thirty years. I worked on more games than I can remember... The most recent release is "Super Crossbar Challenge" for iOS (Android coming soon) with Shattered Box, Fredbear Games and PlayPlayFun.

14 comments:

  1. I am also very bad playing this kind of games. The result is nice and probably, it can find some users in this huge app market.

    ReplyDelete
  2. Looks great! Did you work with him on this reskin together, did he hire you or did you create your own Version?

    ReplyDelete
    Replies
    1. We ended up working on it together... I replaced all the art and he had to put up with me changing some of the original art and UX...

      Delete
  3. Sounds great! What convinced you to work on this together, did you really like the gameplay or where there other factors involved?

    ReplyDelete
    Replies
    1. The coder's attitude makes a big difference. I made a suggestion about the art and did show it with a mockup of what the screen could look like. The coder's reaction was very good and open to suggestions if they meant an improvement...
      I prefer to work with people I enjoy working with and get along well with - it should be about having fun (at least to some extent).

      Delete
  4. I have CorelDraw, and would like to know if you can animate things inside CorelDraw or if you have to export the png files into a separate program to watch and test animations. I know in Adobe Illustrator you can test animations, but I do not know if that option is available inside CorelDraw.

    ReplyDelete
    Replies
    1. Not that I know of. I use the multipe pages and just play through the animation stages there to test the moves from frame to frame. The final test to see how it looks usually happens with an animated sequence in a bitmap tool (e.g. as an exported gif image)

      Delete
  5. great woork ! i like it post thanke you very much chris and im very glad for work with professional art ............ you are the best 2d art in the world..........

    ReplyDelete
  6. Hi Chris :)

    Is there a quick workflow to test out animation in Inkscape by only using free software?

    ReplyDelete
    Replies
    1. I am not familiar with a free animation tool - I know there a few out there but I have never tried them. I usually use the export to bitmap and then create the animation in a bitmap tool (e.g. gimp, kria).

      Synfig looks like a good free option but I have never tried it:
      http://www.synfig.org/cms/

      Delete
  7. would love to see this on My Mobile device!

    ReplyDelete
  8. A game is not as easy to make as it looks. I learned that after taking up animation. I used to bash ugly cartoon shows back then but realized the animation process is never so easy as 123 or abc and this i believe is exactly the same with game development. This game for instance, needs enough knowledge of coding in order to run a very minimalist design IOS or Android game. If this was on Android i would DL it right away. But in case i can, i'd let you know or write about it. You can trust my paper review to be honest and accurate.

    ReplyDelete
  9. Hey, Chris, hope you are great. I am following your tutorials and they are extremely good. My favourities are the video tutorials from the beginning. I like the written tutorials but the video format is just... excellent. It would be great if you continue making more.

    ReplyDelete