Monday, November 1, 2010
And Now The End Is Here And So I Face the Final Curtain
I'd put my game up on here, but I don't know how. I'm sorry internet. I tried.
Choose Your Piece And We'll Start the Game
It took me a little pondering to figure out where exactly to begin with my game, but I figured a background was a good start. Or the conveyor belt part at least. I figured that'd also be a pretty fun place to start because who doesn't like making mean crushing machines? I animated all the parts just with Flash and animation tweens.
I took the long way around with my first attempt (which seems to be a habit for me) and searched a whole bunch of different sites for action script codes to make my game work. It didn't, at all. So instead I went back to this tutorial that I'd found ealier and realised I also needed a jumping clip for Uhrr, so I made this:
And whipped up this nifty little piece of trash as well:
I'm not going to lie. I can't exactly remember what sites are exactly what out of these, but the key ones that I used were:
Here are the rest of the sites I kept links of in case you just want more info on making flash games or different parts of flash games:
After I'd worked out all of those parts, I realised I needed a proper background instead of just a white screen. I went with my original idea for my game, where Uhrr's out exploring and has accidentally activated an acient machine, so I thought he could've been in the jungle-y part of the world, because it makes sense for the machine to be somewhere that's sort of overgrown, so Uhrr didn't notice it at first. I used dark colours to create a shadowy feeling like there's a huge canopy overhead, and also because it has a more doom and gloom feel than if I used grass greens and lighter shades of brown. That makes Uhrr dying not feel like something bad. I also made the leaves slightly transparent to make it feel like there was a greater depth to the forest.
I used the background for my start and game over frames as well, to make sure they didn't feel disconnected from the actual game.
I wanted the start and end screens to have a sort of synical feel, like you know you can't win from the beginning. I like the end frame the best. I think it feels really disappointing because it's so blunt and degrading. And just look at that fullstop. I can hear it mocking me from here.
I took the long way around with my first attempt (which seems to be a habit for me) and searched a whole bunch of different sites for action script codes to make my game work. It didn't, at all. So instead I went back to this tutorial that I'd found ealier and realised I also needed a jumping clip for Uhrr, so I made this:
And whipped up this nifty little piece of trash as well:
I'm not going to lie. I can't exactly remember what sites are exactly what out of these, but the key ones that I used were:
- This and this for sound effects
- This for the way my trash moved across screen
- And this for making sure Uhrr can't actually get off the right side of the conveyor belt, and for making the trash act like a wall and push him towards the grinder
Here are the rest of the sites I kept links of in case you just want more info on making flash games or different parts of flash games:
- http://www.dezinerfolio.com/2008/02/06/20-free-tutorials-to-create-your-own-flash-game/
- http://pelfusion.com/tutorials/35-flash-game-development-tutorials-fla-files/
- http://www.newgrounds.com/portal/view/125248
- http://www.kirupa.com/developer/mx2004/platform_game.htm
- http://www.kirupa.com/forum/showthread.php?t=347547
- http://www.bigresource.com/FLASH-In-depth-side-scroller-tutorial-pvZneJRtCo.html
- http://www.bigresource.com/FLASH-Simple-Tutorial-on-Trajectory--8nJA3WYBTi.html
- http://www.ehow.com/how_6636622_create-advance-flash-game-tutorials.html
- http://www.kongregate.com/labs
- http://flash-r-us.deviantart.com/art/basic-side-scrolling-game-tut-19545486
- http://flashexplained.com/
- http://www.flashadvisor.com/forum/character-jumping-t603.html?s=4b374f8909267711adb66e98e590b826&
- http://www.kirupa.com/developer/actionscript/random.htm
- http://www.kirupa.com/developer/actionscript/random_motion.htm
- http://www.kirupa.com/developer/actionscript/random_motion2.htm
- http://www.wonderhowto.com/how-to-work-with-sound-flash-cs4-262845/view/
- http://www.republicofcode.com/tutorials/flash/litegame/
- http://simplythebest.net/sounds/MP3/sound_effects_MP3/miscellaneous_mp3.html
After I'd worked out all of those parts, I realised I needed a proper background instead of just a white screen. I went with my original idea for my game, where Uhrr's out exploring and has accidentally activated an acient machine, so I thought he could've been in the jungle-y part of the world, because it makes sense for the machine to be somewhere that's sort of overgrown, so Uhrr didn't notice it at first. I used dark colours to create a shadowy feeling like there's a huge canopy overhead, and also because it has a more doom and gloom feel than if I used grass greens and lighter shades of brown. That makes Uhrr dying not feel like something bad. I also made the leaves slightly transparent to make it feel like there was a greater depth to the forest.
I used the background for my start and game over frames as well, to make sure they didn't feel disconnected from the actual game.
I wanted the start and end screens to have a sort of synical feel, like you know you can't win from the beginning. I like the end frame the best. I think it feels really disappointing because it's so blunt and degrading. And just look at that fullstop. I can hear it mocking me from here.
And Then Everything Changed
So my original ideas for the interactive project where basically point and click stuff. Like, click on an object and see how Uhrr reacts/interacts with it.
The first one was in his house, having the viewer click on certain stuff inside and he'd act differently depending on what it was. I liked the idea, but wasn't sure how difficult it'd be, because I was going to have him stop beside every object, rather than constantly returning to the same place and then move again from there, and I thought, "geez, they can click on at least 4 objects from each place," which would've meant 4 different ways of moving to each new place, FROM each place, which is like, 20 or something walk cycles which would've killed me, because it took me long enough for the walk cycle project, and I wasn't sure if I'd be able to do it all 20 times again just for one project. And also I would've added a more 3D effect to this project, which would've meant adding depth and new angles to how he moved. Too much to do in so little time. And making his reactions on top of that.
My second idea was having Uhrr sitting with his favourite objects, and pretty much the same deal as idea one, where you see his reactions to them and how he interacts with them. My sketch is only half-finished and pretty non-descript because I ran out of ideas for what his actually favourite objects should be, and the idea as a whole seemed pretty bland since he hardly moves or anything. And how much can a limbless robot interact with objects that're lying on the ground anyway?
My third idea was more interactive than the second and less difficult than the first. I had Uhrr out collecting items in a part of the junk city that's still pretty much just junk - sort of like the outskirts or and undeveloped area. It was basically a side-on view only, but again, depending on what you clicked on in the little trash pile, Uhrr would react differently to the items - get excited, get disappointed, be neutral. And depending on the object would depend on the height of those emotions.
And then we had out class presentation and heaps of people were like, "I'm making a game," and I was like, "Now I wanna make a game." So I got another idea, which was to make a basic side-scrolling game that's impossible to win. I got the idea from the game Robot Unicorn Attack:
The first one was in his house, having the viewer click on certain stuff inside and he'd act differently depending on what it was. I liked the idea, but wasn't sure how difficult it'd be, because I was going to have him stop beside every object, rather than constantly returning to the same place and then move again from there, and I thought, "geez, they can click on at least 4 objects from each place," which would've meant 4 different ways of moving to each new place, FROM each place, which is like, 20 or something walk cycles which would've killed me, because it took me long enough for the walk cycle project, and I wasn't sure if I'd be able to do it all 20 times again just for one project. And also I would've added a more 3D effect to this project, which would've meant adding depth and new angles to how he moved. Too much to do in so little time. And making his reactions on top of that.
My second idea was having Uhrr sitting with his favourite objects, and pretty much the same deal as idea one, where you see his reactions to them and how he interacts with them. My sketch is only half-finished and pretty non-descript because I ran out of ideas for what his actually favourite objects should be, and the idea as a whole seemed pretty bland since he hardly moves or anything. And how much can a limbless robot interact with objects that're lying on the ground anyway?
My third idea was more interactive than the second and less difficult than the first. I had Uhrr out collecting items in a part of the junk city that's still pretty much just junk - sort of like the outskirts or and undeveloped area. It was basically a side-on view only, but again, depending on what you clicked on in the little trash pile, Uhrr would react differently to the items - get excited, get disappointed, be neutral. And depending on the object would depend on the height of those emotions.
And then we had out class presentation and heaps of people were like, "I'm making a game," and I was like, "Now I wanna make a game." So I got another idea, which was to make a basic side-scrolling game that's impossible to win. I got the idea from the game Robot Unicorn Attack:
Play it. You won't stop. And make sure your speakers are on.
In my version I put Uhrr on a conveyor belt with a big compactor-furnace like thing at one end, because that's the last place Uhrr would ever want to be. On his way to certain doom when he has the most awkward, slowest walk ever. I decided to make it even funner by adding bits of scrap metal that come down the conveyor belt towards Uhrr and push him towards the conveyor belt if he doesn't jump over them.
In my version I put Uhrr on a conveyor belt with a big compactor-furnace like thing at one end, because that's the last place Uhrr would ever want to be. On his way to certain doom when he has the most awkward, slowest walk ever. I decided to make it even funner by adding bits of scrap metal that come down the conveyor belt towards Uhrr and push him towards the conveyor belt if he doesn't jump over them.
Derp derp Walk Cycle derp
So here's my sad little finished walk cycle:
And here's my first attempt, which I almost like better, just 'cause you can see the drag in Uhrr's walk better:
And here's my first attempt, which I almost like better, just 'cause you can see the drag in Uhrr's walk better:
Backgrurrgghgound
Oh dear. So my dislike for and lack of skill in Illustrator may have come through a little too strongly in the background for my walk cycle.
Here are all the parts for it. Background, middleground, foreground, and grassy ground. And the sky, even though it's just a blue box.
So firstly, the sky:
Detailed, I know.
The background, which is mean to be a big old forest:
The middle ground/background of the junk city (note the angles and sharp lines to indicate scrap metal):
The foreground/close part of the city (again, note those crazy lines and angles):
The grass, which I actually kinda like, and which I probably took the most time on 'cause I couldn't figure out how to get it right:
And I don't know if you're ready for this little easter egg, so brace yourselves. The city shadow!:
Oh my gosh what is going on this is so intense!
Here are all the parts for it. Background, middleground, foreground, and grassy ground. And the sky, even though it's just a blue box.
So firstly, the sky:
Detailed, I know.The background, which is mean to be a big old forest:
The middle ground/background of the junk city (note the angles and sharp lines to indicate scrap metal):
The foreground/close part of the city (again, note those crazy lines and angles):
The grass, which I actually kinda like, and which I probably took the most time on 'cause I couldn't figure out how to get it right:
And I don't know if you're ready for this little easter egg, so brace yourselves. The city shadow!:
Oh my gosh what is going on this is so intense!Frame by Frame
Upon starting making the frames for my walk cycle it was pretty clear that it was going to be a lot more than 6 steps. It took me like a thousand frames to get to my original frame 3. And boy did it get messy.
I drew up another rough plan for the steps Uhrr was going to move in. The triangle-y shapes in the corner are Hugh's drawings because he told me to try doing the steps in Illustrator in segments, rather than free transforming them in photoshop, which was the original plan.
Of course I ignored the Illustrator idea to begin with, simply because I prefer photoshop as a program. SHOULD'VE LISTENED! Frame 1 totally went to plan. Uhrr just sitting there, being great:
By frame 8 he was starting to look a little fuzzy around the edges from being poked and prodded and transformed so much, but you know, it was pretty managable I guess - his basic shape was still there, so I could just clean up the lines after:
At frame 11 things were getting pretty ugly. Blurring, distortion, fading lines:
And then there was frame 15, where I finally called it a day and let the photoshop attempt at the walk cycle rest in it's mangled grave. I don't really think I need to explain why:
Then I had this crazy idea. Why not do it in Illustrator! Ohoho. So smart. So here's Uhrr all in the segments I was working with:
And look at frame 8, 11 and 15 in comparison:
And yeahyeah, I know what you're thinking. "Hey buddy, the parts don't even match up on those ones. Nice work, Einstein." Well thanks, but I already knew that. I drew over the lines so they DID match up.
frame 11
frame 15 
Beaudiful.
I drew up another rough plan for the steps Uhrr was going to move in. The triangle-y shapes in the corner are Hugh's drawings because he told me to try doing the steps in Illustrator in segments, rather than free transforming them in photoshop, which was the original plan.
Of course I ignored the Illustrator idea to begin with, simply because I prefer photoshop as a program. SHOULD'VE LISTENED! Frame 1 totally went to plan. Uhrr just sitting there, being great:
By frame 8 he was starting to look a little fuzzy around the edges from being poked and prodded and transformed so much, but you know, it was pretty managable I guess - his basic shape was still there, so I could just clean up the lines after:
At frame 11 things were getting pretty ugly. Blurring, distortion, fading lines:
And then there was frame 15, where I finally called it a day and let the photoshop attempt at the walk cycle rest in it's mangled grave. I don't really think I need to explain why:
Then I had this crazy idea. Why not do it in Illustrator! Ohoho. So smart. So here's Uhrr all in the segments I was working with:
And look at frame 8, 11 and 15 in comparison:
frame 8
frame 11
frame 15
And yeahyeah, I know what you're thinking. "Hey buddy, the parts don't even match up on those ones. Nice work, Einstein." Well thanks, but I already knew that. I drew over the lines so they DID match up.
frame 8
frame 11
frame 15
Beaudiful.Inching Around
So anyway, as great as those videos were, they were of things with legs walking. And as great as legs are, my character doesn't have them. Bummer, I know right?
I've had a pretty strong idea of how I want Uhrr to move, which is basically like a caterpillar, but when you YouTube caterpillars walking, you get stuff like this:
and this:
Which as cute as it looks, isn't how I want Uhrr moving at all.
So I thought long and hard about what those thingies are called that move in that way. And good ol' brain was like, "Hey. Hey. Remember inchworms? And how you thought they were just the American word for caterpillars? Hey. Hey. YouTube them." And so I did. And lo and behold, something up there had put two and two together.
I've had a pretty strong idea of how I want Uhrr to move, which is basically like a caterpillar, but when you YouTube caterpillars walking, you get stuff like this:
and this:
Which as cute as it looks, isn't how I want Uhrr moving at all.
So I thought long and hard about what those thingies are called that move in that way. And good ol' brain was like, "Hey. Hey. Remember inchworms? And how you thought they were just the American word for caterpillars? Hey. Hey. YouTube them." And so I did. And lo and behold, something up there had put two and two together.
Oh it is sooo cute. Also, I don't know if this is mean or not. I think it is, but whatever. That's how inchworm's role, yo. Don't mess with them:
And so finally I could stop acting it out with my finger and being all, "in that caterpillar-y way, you know?" because I actually knew what it was called. And it wasn't a caterpillar.
So here's my original sketch-up of my walk cycle, in far too few steps:
//Note: I should also say, I looked into the character McDuff, from this old ABC show called Johnson and Friends, because she's a concertina, which is pretty much the shape Uhrr is, but upon further research, she just slides along the floor, rather than making any concertina-type movements at all, which was a bit of a let down. Here's a picture of her so you know what I'm talking about. I won't post any videos because they're all just episodes from Johnson and Friends, and are, like I said - useless.
She's the one on the left, if you didn't already figure that out.
And so finally I could stop acting it out with my finger and being all, "in that caterpillar-y way, you know?" because I actually knew what it was called. And it wasn't a caterpillar.
So here's my original sketch-up of my walk cycle, in far too few steps:
//Note: I should also say, I looked into the character McDuff, from this old ABC show called Johnson and Friends, because she's a concertina, which is pretty much the shape Uhrr is, but upon further research, she just slides along the floor, rather than making any concertina-type movements at all, which was a bit of a let down. Here's a picture of her so you know what I'm talking about. I won't post any videos because they're all just episodes from Johnson and Friends, and are, like I said - useless.
She's the one on the left, if you didn't already figure that out.Vebleh!
I take it back! I found the site:
http://www.idleworm.com/how/anm/02w/walk2.shtml
And while we're at it, this one that I forgot about as well:
http://www.mcmxi.com/~jpr/teaching/gph213/walkcycle/walk.html
And this one that's all about stuff with no limbs moving, which is pretty neat:
http://www.archive.org/details/sims_evolved_virtual_creatures_1994
http://www.idleworm.com/how/anm/02w/walk2.shtml
And while we're at it, this one that I forgot about as well:
http://www.mcmxi.com/~jpr/teaching/gph213/walkcycle/walk.html
And this one that's all about stuff with no limbs moving, which is pretty neat:
http://www.archive.org/details/sims_evolved_virtual_creatures_1994
Toobin' Walk Cycles
Spent some time looking up walk cycles on YouTube and how different personalities/moods are shown through how a character walks.
Some less-fluid-more-robotic stuff:
Some less-fluid-more-robotic stuff:
I had a link to a website as well that I was shown, but because I have a great memory, I can't remember it, and because I think ahead, I didn't write it down. I haven't really used the stuff on the site for my work, so I guess it's not really a big deal that I haven't got it, but it was still cool.
Subscribe to:
Posts (Atom)