# Programmer needs squash and stretch

This topic is 830 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

## Recommended Posts

Hey all you art people.  I come from the other side.  Programming.  I'm working on a game-a-month challenge and find myself struggling with some art.

I have a platformer, and I want to make my hero, a pumpkin, squash and stretch when it jumps.  I have looked at many tutorials, but have not actually found a tool that works for me (or I didn't understand how to use it).

So far I've played with:

Inkscape

Sprited Pro

Pyxel Edit

Synfig

I'm sure I'll need more art in the coming months, so a good tool recommendation would be wonderful.

Would one of these work, or is there some other workflow for this that I don't know about?

##### Share on other sites

Not sure what the pros here will suggest but my "programmer art" advice would be to start with animating a plain circle such that it squashes and stretches the way you want (various sized ovals with flat bottoms). Then I'd see if I could use some assorted tools to stretch or resize portions of the original pumpkin image that you have (I'm assuming you have an initial sprite you're starting with) into each frame and make manual corrections where there might be obvious seams or distortions. If it doesn't work out too well, maybe you can add some basic shading and colour to the shapes you have in each frame and have a really basic orange looking ball that animates the way you want. If there's time then manually add in details to make it more of a pumpkin or jack-o-lantern look.

Edited by kseh

##### Share on other sites

The way I would do it is use Blender to squash and stretch a sphere, render it as a animation, draw over it and stick it all on one sprite page.

This way you would have a accurate base, while keeping the charm of hand drawn images.

##### Share on other sites

The way I would do it is use Blender to squash and stretch a sphere, render it as a animation, draw over it and stick it all on one sprite page.

This way you would have a accurate base, while keeping the charm of hand drawn images.

I hadn't thought about doing a 3D render.  That may be one way to go.  But isn't Blender a steep learning curve?

##### Share on other sites

In Paint Shop Pro you can select a region and manipulate the selection.

Paint Shop Pro costs, but maybe Paint.NET has enough functionality for you.

##### Share on other sites

Blender is indeed a somewhat steep learning curve, but it is worth it.  I use it a lot, even for 2d sprites, as you can get many styles out of renders.  I saw the previous poster mention you redrawing over rendered spheres to get the hand drawn look.  But I don't remember you mentioning anywhere that you wanted that certain look.  If that is the case, you can also make the colors/textures in Blender, even via simple vertex colors, and then render that, and you wouldn't have to re-draw much of anything.

Yes, it takes time to learn, but it is worht it in the long run.  Remember it is useful for this whole 2d pre-rendering sprites, but also for cinematics, and even 3d modelling if you want to make an actual 3d rendered game too...indeed, very much worth the knowledge.  I'm not artist myself either.  But I can get what I call "acceptable" doing things in 3d, as it is easier to wrap my head around getting the actual shapes with lighting added then trying to shade and dither in traditional or vector 2d software.  See, 3d is less "open to interpretation" in a way, in that you are working in real space.  A sphere is a sphere, and then you add lighting, texture, etc...  but as drawn in 2d, the sphere is likely now a circle(simple right) but then you have to manually shade the lighting, so you have to choose colors, go for bounce lighting if the object is on a surface, pixel out textures(not necesarily pixel by pixel depending on your style), while in 3d most of this is more automatic.  Also, with the 3d path, things take longer to get started, but are easy to modify later.  With sprites, it can often involve total redoing of the work.  Want to change lighting?  In 3d it is easy to change and re-render.  The same applies to animations, camera angle, even materials of the objects, and you can just change the one thing and leave the rest of the work done.  In 2d, it can generally(with exceptions) only be done as a whole.

##### Share on other sites

Blender is indeed a somewhat steep learning curve, but it is worth it.

I recently got this book but haven't worked through it:

Learning Blender: A Hands-On Guide to Creating 3D Animated Characters 1st Edition

by Oliver Villar  (Author)

Maybe I'll spend some time making some 2D renderings.

##### Share on other sites

In Paint Shop Pro you can select a region and manipulate the selection.

Paint Shop Pro costs, but maybe Paint.NET has enough functionality for you.

I just can't justify the cost for Paint.net Photoshop since I won't use if very much, or very well.

Edited by Glass_Knife

##### Share on other sites

I just can't justify the cost since I won't use if very much, or very well.

Paint.NET is free; I don't use it myself, but it's a pretty solid program from what I've seen.

The general impression I get is:

PhotoShop    = Feature full, really expensive
PaintShopPro = 90% of PhotoShop's features, for 10% the cost
Paint.NET    = 90% of PaintShopPro's features, for free.

Paint.NET doesn't have grid-warping out of the box, but free plugins are available that add that functionality.

##### Share on other sites

I just can't justify the cost since I won't use if very much, or very well.

Paint.NET is free; I don't use it myself, but it's a pretty solid program from what I've seen.

The general impression I get is:

PhotoShop    = Feature full, really expensive
PaintShopPro = 90% of PhotoShop's features, for 10% the cost
Paint.NET    = 90% of PaintShopPro's features, for free.

Paint.NET doesn't have grid-warping out of the box, but free plugins are available that add that functionality.

Sorry, I meant Photoshop, not Paint.net.  I'll look at Paint Shop Pro.

##### Share on other sites

GIMP is also a popular free choice.

As far as squash and stretch go- you can get quite a bit of jiggle right in code using easing curves to manipulate scale (or other properties). Though if the thing you are trying to manipulate is something complex like a humanoid image or something, you are probably better off using an image editor to do it.

##### Share on other sites

So far the easiest thing I've found is using Inkscape, which has an interpolation extensions that morphs a single path to a different path.

Then I align them to a grid, save as a *.png, and use Shoebox to split them into separate files.

##### Share on other sites

I hadn't thought about doing a 3D render.  That may be one way to go.  But isn't Blender a steep learning curve?

If you wanted to render a full 3D scene using Blender, you would indeed have a steep learning curve to climb; using Blender for some thing this small won't take months of learning.

Just be warned, the squish and stretch is one of the basic principals and some animators go to amazing lengths for it.

When looking for a tutorial, find some thing simple where the animator isn't using a rig.

If you want you can send me a message and I will walk you through it.

As kburkhart84 said, you could completely texture the model and render the finished product. This will require learning a few more things, however it's easy to learn if you know what it is you want to do.

How easy or hard it is depends on how far you wan't to go.