We are working on a project for iPhone and Windows Phone 7 where we'd like to be able to generate tea leaves at the bottom of a cup. It doesn't have to look photo-realistic, and actually cartoon-y is ok.
What sort of techniques should we research to accomplish this? Are there any libraries (preferably in C, but we can translate) that would be helpful?
Here are some samples pulled from a Google Image search
Answer
How I'd probably do it so I could maintain some art control and not potentially spend a long time trying to tweak a procedural method to get it just right...
First, manually create a number of sprites of tea leaf clumps as your art "pool" - not each as an entire cup's worth of tea leaves, but more like a smaller grouping. Say, 20 of them or so?
Then place a random number of them at random coordinates on the "cup" base. Give each a random rotation and scale plus random horizontal and/or vertical mirroring. This ought to create a good result.
This approach will give you the artistic freedom in creating the individual clumps to have the look you want, while allowing for a huge variety of results (assuming sufficient sprites to choose from).
Additionally, with this (and any random method including Perlin noise based), you could actually seed the random number generator at the start of the process with a known seed to make reproducible results. If you save the seed, you are able to exactly recreate the same pattern again by reseeding just before the sequence starts. You could even do fun things like have someone type in their name, turn the letters into a number (sum ASCII, etc.), then use that as the seed as some kind of "this tea leaf pattern customized for YOU!" thing.
Here's some pseudocode for what I mean, if that helps...
var sprites = [...]; // Array of tea leaf sprites
var n_leaves = rand(5)+5; // Random number of leaves from 5-9
for (i=0; i var sprite_index = rand(sprites.length); // Random sprite index
var r = rand(CUP_DIAMETER); // Random radius for point on disk calc
var theta = rand(2*PI); // Random theta (rotation) for point on disk
var sprite_x = sqrt(r) * cos(theta); // Sprite X
var sprite_y = sqrt(r) * sin(theta); // Sprite Y
var sprite_rotation = rand(2*PI); // Sprite rotation
var sprite_scale = rand(1) + 0.5; // Sprite scale from 0.5 to 1.5
var sprite_h_mirror = (rand(1) < 0.5 ? true : false); // If true, mirror horizontally
var sprite_v_mirror = (rand(1) < 0.5 ? true : false); // If true, mirror vertically
draw_sprite(sprite_index, sprite_x, sprite_y, sprite_rotation, sprite_h_mirror, sprite_v_mirror);
}
Check out http://mathworld.wolfram.com/DiskPointPicking.html for a great discussion about how to pick a random point in a disk and why I am using that whole sqrt/sin/cos thing.
No comments:
Post a Comment