News Feed
Jan
The making of Flock It! graphics17
posted by James Kay
I've always been a fan of and enjoyed making what is called "pixel art", a process where you basically draw every individual pixel by hand in an art package like Adobe Photoshop. This not only gives you a lot of control but also gives a game a distinctive visual style. But it is also very time consuming!
When creating Flock It! I partly used "pixel art" and supplemented that with 3D rendered objects I created in Autodesk Maya. These renders I then brushed up a little in Adobe Photoshop and added black outlines to.
Take this farm house, for example. Here you can see the 3D object I created in Maya. I pre-lit it, a technique where the lighting is baked onto the texture, the image I wrap around the 3D object, so I can keep the global lighting very strong, giving a nice, cartoony feel. Before rendering it I made the camera orthographic; which means it has no perspective at all, as the game is from a top-down view and objects with a perspective would look odd.
I then imported the rendered image in Photoshop where I scaled it to the proper size, adjusted the colours and added a black outline to enhance the cartoony nature of the game. After this it was just a matter of exporting it as a PNG image and using it in our proprietary toolset to use them as props in creating the levels.
The benefit of making props this way is that once I've created a model I can easily reposition it, render it out again and make variations, like I did with the barn. Using a single model I easily created 3 different barn graphics, which would have taken longer had I drawn them by hand from the outset. The different farm buildings created in 3D were also used to make a nicely rendered image of the farm that you can see in the background of the game's menu.
Some other elements, though, were created with pixel-perfect precision from scratch. These include the fences, rocks, grassy backgrounds and, of course, all the sheep which were hand animated for each action they perform, in each direction and for each version of the sheep (woolly, shorn and fat). This took a long time to do, as you can imagine. I did experiment with creating sheep in 3D, renders of which do appear in the background of the main menu, but decided in the end doing it by hand gave a nicer visual style to the whole game.
Other elements of the game, like the graphical user interface (GUI) and the main menu and game title were initially created in Adobe Illustrator, a vector-based art package. The benefit of doing this is that it's far easier to keep colours conform over all the different elements, as you can simply copy fill-gradients and colour sets from previous elements, and it allowed me to scale these elements without loss of quality. Things like the game's title logo would have to be used in other areas too outside the game, like in the official trailer, on the website and on printed marketing materials, so being able to scale it up without loss of quality was important. Had I created it specifically for the iPhone's screen alone in Photoshop it would have looked very blocky and blurry when scaled up for printed materials. On top of that I also really enjoy working in Adobe Illustrator; it gives me a lot of control I feel.
It is not uncommon in video game development to use a large variety of art creation software packages. Some things are best created in Photoshop, some in Illustrator and some in 3D packages and often I will have all three programs open simultaneously, which can put quite a strain on my PC. I really enjoyed making the Flock It! art as I am a big fan of the more cartoony, colourful types of art styles, as opposed to highly detailed and realistic video game art. I also think the subtle mix of pre-rendered art with pixel art works well making the game look both slightly "retro" as well as solid enough for today's discriminating customers.
If you disagree, or have comments or questions, why not email us at info@score-studios.jp. We always enjoy hearing from you!
Comment in our forums ...
When creating Flock It! I partly used "pixel art" and supplemented that with 3D rendered objects I created in Autodesk Maya. These renders I then brushed up a little in Adobe Photoshop and added black outlines to.
Take this farm house, for example. Here you can see the 3D object I created in Maya. I pre-lit it, a technique where the lighting is baked onto the texture, the image I wrap around the 3D object, so I can keep the global lighting very strong, giving a nice, cartoony feel. Before rendering it I made the camera orthographic; which means it has no perspective at all, as the game is from a top-down view and objects with a perspective would look odd.
I then imported the rendered image in Photoshop where I scaled it to the proper size, adjusted the colours and added a black outline to enhance the cartoony nature of the game. After this it was just a matter of exporting it as a PNG image and using it in our proprietary toolset to use them as props in creating the levels.
The benefit of making props this way is that once I've created a model I can easily reposition it, render it out again and make variations, like I did with the barn. Using a single model I easily created 3 different barn graphics, which would have taken longer had I drawn them by hand from the outset. The different farm buildings created in 3D were also used to make a nicely rendered image of the farm that you can see in the background of the game's menu.
Some other elements, though, were created with pixel-perfect precision from scratch. These include the fences, rocks, grassy backgrounds and, of course, all the sheep which were hand animated for each action they perform, in each direction and for each version of the sheep (woolly, shorn and fat). This took a long time to do, as you can imagine. I did experiment with creating sheep in 3D, renders of which do appear in the background of the main menu, but decided in the end doing it by hand gave a nicer visual style to the whole game.
Other elements of the game, like the graphical user interface (GUI) and the main menu and game title were initially created in Adobe Illustrator, a vector-based art package. The benefit of doing this is that it's far easier to keep colours conform over all the different elements, as you can simply copy fill-gradients and colour sets from previous elements, and it allowed me to scale these elements without loss of quality. Things like the game's title logo would have to be used in other areas too outside the game, like in the official trailer, on the website and on printed marketing materials, so being able to scale it up without loss of quality was important. Had I created it specifically for the iPhone's screen alone in Photoshop it would have looked very blocky and blurry when scaled up for printed materials. On top of that I also really enjoy working in Adobe Illustrator; it gives me a lot of control I feel.
It is not uncommon in video game development to use a large variety of art creation software packages. Some things are best created in Photoshop, some in Illustrator and some in 3D packages and often I will have all three programs open simultaneously, which can put quite a strain on my PC. I really enjoyed making the Flock It! art as I am a big fan of the more cartoony, colourful types of art styles, as opposed to highly detailed and realistic video game art. I also think the subtle mix of pre-rendered art with pixel art works well making the game look both slightly "retro" as well as solid enough for today's discriminating customers.
If you disagree, or have comments or questions, why not email us at info@score-studios.jp. We always enjoy hearing from you!
Comment in our forums ...
