<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>mclelun &#187; Art and Design</title>
	<atom:link href="http://www.mclelun.com/blog/category/art-and-design/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.mclelun.com/blog</link>
	<description>I am a colorblind multimedia designer + developer</description>
	<lastBuildDate>Tue, 31 Jan 2012 14:36:42 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>Mahjong Memory Game</title>
		<link>http://www.mclelun.com/blog/2012/01/mahjong-memory-game/</link>
		<comments>http://www.mclelun.com/blog/2012/01/mahjong-memory-game/#comments</comments>
		<pubDate>Sun, 29 Jan 2012 06:59:32 +0000</pubDate>
		<dc:creator>mclelun</dc:creator>
				<category><![CDATA[Art and Design]]></category>
		<category><![CDATA[Scripting and Coding]]></category>
		<category><![CDATA[ActionScript3]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[Game]]></category>
		<category><![CDATA[Pixel]]></category>

		<guid isPermaLink="false">http://www.mclelun.com/blog/?p=245</guid>
		<description><![CDATA[I have an idea to develop this memory game after watching a variety show on TV few weeks ago. It is a simple game, where you click on the numbers in ascending order. Game Art As it is Chinese New Year right now, I decide to develop this game with new year festive theme, and [...]]]></description>
			<content:encoded><![CDATA[<p>I have an idea to develop this memory game after watching a variety show on TV few weeks ago. It is a simple game, where you click on the numbers in ascending order.</p>
<p><span id="more-245"></span></p>
<h3>Game Art</h3>
<p>As it is Chinese New Year right now, I decide to develop this game with new year festive theme, and using Mahjong as the puzzle tiles. If you are not familiar with Mahjong, you can use to the image below as a quick reference.</p>
<p><img src="http://www.mclelun.com/img/blog/120129_memnum_02.gif" alt="mah jong" /></p>
<p>The Mahjong tile pattern was originally draw by Jerry Crimson Mann. But I need a 3D rotating Mahjong tile for my game, so I quickly model a low poly Mahjong in Blender and render the rotation sequence. Then, some final touch up was done in Photoshop to give it a pixel art feel.</p>
<p><img src="http://www.mclelun.com/img/blog/120129_memnum_03.gif" alt="mah jong" /></p>
<h3>Play The Game</h3>
<p>A sequence of numbers will be shown for a brief seconds. Remember it and click them in ascending order. You can play “<a href="http://www.mclelun.com/labs/#as3memnum" title="Mahjong Memory Game" target="_blank">Mahjong Memory Game</a>” in my labs page.</p>
<p><a href="http://www.mclelun.com/labs/#as3memnum" title="Mahjong Memory Game" target="_blank"><img src="http://www.mclelun.com/img/blog/120129_memnum_01.gif" alt="mahjong memory game" /></a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.mclelun.com/blog/2012/01/mahjong-memory-game/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Blender Cycles Render</title>
		<link>http://www.mclelun.com/blog/2011/11/blender-cycles-render/</link>
		<comments>http://www.mclelun.com/blog/2011/11/blender-cycles-render/#comments</comments>
		<pubDate>Sun, 27 Nov 2011 11:15:25 +0000</pubDate>
		<dc:creator>mclelun</dc:creator>
				<category><![CDATA[Art and Design]]></category>
		<category><![CDATA[3D]]></category>
		<category><![CDATA[Blender3D]]></category>

		<guid isPermaLink="false">http://www.mclelun.com/blog/?p=240</guid>
		<description><![CDATA[Blender is working on a new unbias GPU render engine, &#8220;Cycles&#8221; and its beta is available for download now. So, I grab a copy and did a few render test Yesterday. The first test I did was a scene with glass of milk and a plate of egg. I also use SSS (subsurface scattering) to [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://www.blender.org/" title="Blender" target="_blank">Blender </a>is working on a new unbias GPU render engine, &#8220;Cycles&#8221; and its beta is available for <a href="http://download.blender.org/release/Blender2.61/" title="Blender" target="_blank">download </a>now. So, I grab a copy and did a few render test Yesterday.</p>
<p><span id="more-240"></span></p>
<p><img src="http://fc06.deviantart.net/fs70/i/2011/330/9/9/egg_and_milk_by_mclelun-d4hc7tg.jpg" alt="cycles" /></p>
<p><img src="http://www.mclelun.com/img/blog/111127_cycles_01.jpg" alt="cycles" /></p>
<p>The first test I did was a scene with glass of milk and a plate of egg. I also use SSS (subsurface scattering) to render the milk and egg material in another layer. Then, comp both SSS and Cycles renders together.</p>
<p><img src="http://fc03.deviantart.net/fs71/i/2011/330/1/9/beer_by_mclelun-d4hd4kt.jpg" alt="cycles" /></p>
<p>The second test render was more easy to do. The beer is comp with a SSS render layer as well. Both test I did is still missing a few things I want to add, but I happy with it so far.</p>
<p><img src="http://fc05.deviantart.net/fs71/i/2011/337/8/a/cookie_by_mclelun-d4i07g4.jpg" alt="cycles" /></p>
<p>That character and vespa are low poly model I did for a Unity3D game, which I abandon quite some time ago. Cookie/biscuit is just a normal photo texture.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.mclelun.com/blog/2011/11/blender-cycles-render/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Painterly Background for Animation</title>
		<link>http://www.mclelun.com/blog/2011/10/painterly-background-for-animation/</link>
		<comments>http://www.mclelun.com/blog/2011/10/painterly-background-for-animation/#comments</comments>
		<pubDate>Mon, 17 Oct 2011 08:30:20 +0000</pubDate>
		<dc:creator>mclelun</dc:creator>
				<category><![CDATA[Art and Design]]></category>
		<category><![CDATA[AfterEffects]]></category>
		<category><![CDATA[Animation]]></category>
		<category><![CDATA[Coloring]]></category>
		<category><![CDATA[Illustration]]></category>

		<guid isPermaLink="false">http://www.mclelun.com/blog/?p=232</guid>
		<description><![CDATA[I am working on a sizzle reel for an animation and it is currently on pre-production stage. In this animation, our team will be using 3D for characters and 2D for background. The main reason we choose 2D for background is to save production time through cutting down the time spend on modelling and texturing [...]]]></description>
			<content:encoded><![CDATA[<p>I am working on a sizzle reel for an animation and it is currently on pre-production stage. In this animation, our team will be using 3D for characters and 2D for background. The main reason we choose 2D for background is to save production time through cutting down the time spend on modelling and texturing 3D environment. But this is not a simple task as my experience on painting are not that great either.</p>
<p><span id="more-232"></span></p>
<p>I have look into a few animations on how their 2D environment is done. Most notably Makoto Shinkai&#8217;s amazing work. According to &#8220;The Making of 5 Centimeters Per Second&#8221; booklet from the DVD, Makoto Shinkai&#8217;s team actually went around to take photo and paint on top of it with color scheme pick by Makoto Shinkai himself.</p>
<p>I had done a few test using similar method to see how the background art will look like. Some look good, some look bad.</p>
<p><img src="http://www.mclelun.com/img/blog/111017_bg_01.jpg" alt="Street Light" /><br />
The first test I did is not that bad. I also added a subtle outline on the street light to give it a more anime feel. The street light and sky were also separate in different layers, so it can be animate easily later.</p>
<p><img src="http://www.mclelun.com/img/blog/111017_bg_02.jpg" alt="KL Sentral" /><br />
I went a bit adventurous on the second painting by changing the color scheme. It didn&#8217;t end up that great as it seem too monotone and weird.</p>
<p><img src="http://www.mclelun.com/img/blog/111017_bg_03.jpg" alt="Plaza Damas" /><br />
For the third test, I just color pick the original colors from the photo and paint over it. Then, replaced the dark sky from the photo with a nice sunset color. In my view, this definitely look better than if I would pick my own color. </p>
<p>Overall, I think my painting is still lack of some details. And I need to find a way to blend the 3D characters into the 2D environment later. I had done more paintings and composite them into a video. Enjoy.</p>
<p><center><iframe src="http://player.vimeo.com/video/30499245?title=0&amp;byline=0&amp;portrait=0" width="640" height="360" frameborder="0" webkitAllowFullScreen allowFullScreen></iframe></center></p>
]]></content:encoded>
			<wfw:commentRss>http://www.mclelun.com/blog/2011/10/painterly-background-for-animation/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Happy Birthday</title>
		<link>http://www.mclelun.com/blog/2011/10/happy-birthday/</link>
		<comments>http://www.mclelun.com/blog/2011/10/happy-birthday/#comments</comments>
		<pubDate>Sat, 08 Oct 2011 12:27:04 +0000</pubDate>
		<dc:creator>mclelun</dc:creator>
				<category><![CDATA[Art and Design]]></category>
		<category><![CDATA[Comic]]></category>

		<guid isPermaLink="false">http://www.mclelun.com/blog/?p=227</guid>
		<description><![CDATA[Finally, I complete this short comic which I always want to draw. A total of 3 days was spend on doing this manga style comic. The idea might not be very original, I think some of you might even talk about this topic before. Something about online/social media friends vs real life friends. Note Read [...]]]></description>
			<content:encoded><![CDATA[<p>Finally, I complete this short comic which I always want to draw. A total of 3 days was spend on doing this manga style comic. The idea might not be very original, I think some of you might even talk about this topic before. Something about online/social media friends vs real life friends.</p>
<p><span id="more-227"></span></p>
<h3>Note</h3>
<p>Read from LEFT to RIGHT.</p>
<p><img src="http://fc09.deviantart.net/fs71/f/2011/281/9/b/happy_birthday_by_mclelun-d4c61ln.jpg" alt="Happy Birthday" /></p>
<h3>Behind The Scene</h3>
<p>I admit I cheat a lot in this work. 3D renders and photos were use for some of the background. Some reference pose from other manga to help my drawings.</p>
<p>Some of the items in this comic were model in Blender3D and render with edge outline. Then, I import the render into Photoshop to trace over manually. I did this so the drawings will be in a better/more accurate perspective. I am thinking if I spend more time on texturing and tweaking the render settings, I could just use the render straight in final artwork without needing to trace again.</p>
<p><img src="http://www.mclelun.com/img/blog/111008_bday_01.jpg" alt="33 render comic" /></p>
<p>Some backgrounds were adjust from photos. The photos are changed into grayscale mode, then image levels/curve are adjust slightly. If you are wondering how to do that &#8220;dotted&#8221; pattern thing (halftone). It is done by converting grayscale image into bitmap mode. In Photoshop, go to <strong>Image > Mode > Bitmap</strong>.</p>
<p><img src="http://www.mclelun.com/img/blog/111008_bday_02.jpg" alt="photo manipulation comic" /></p>
<p>Sekian, Terima Kasih.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.mclelun.com/blog/2011/10/happy-birthday/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Eddy and the Galaxy Whale</title>
		<link>http://www.mclelun.com/blog/2011/09/eddy-and-the-galaxy-whale/</link>
		<comments>http://www.mclelun.com/blog/2011/09/eddy-and-the-galaxy-whale/#comments</comments>
		<pubDate>Sun, 11 Sep 2011 15:53:07 +0000</pubDate>
		<dc:creator>mclelun</dc:creator>
				<category><![CDATA[Art and Design]]></category>
		<category><![CDATA[3D]]></category>
		<category><![CDATA[AfterEffects]]></category>
		<category><![CDATA[Animation]]></category>
		<category><![CDATA[Blender3D]]></category>

		<guid isPermaLink="false">http://www.mclelun.com/blog/?p=224</guid>
		<description><![CDATA[I worked on another animation proposal project few months ago after the failure of Mesinaut during IPCC 2010. Didn&#8217;t manage to blog about this as life getting a bit chaotic and mess up. As usual, my main task on this project were compositing and editing. 3D modeling and animation were handle by 2 other team [...]]]></description>
			<content:encoded><![CDATA[<p>I worked on another animation proposal project few months ago after the failure of <a href="http://www.mclelun.com/blog/2010/07/mesinaut/" title="Mesinaut" target="_blank">Mesinaut </a>during IPCC 2010. Didn&#8217;t manage to blog about this as life getting a bit chaotic and mess up. As usual, my main task on this project were compositing and editing. 3D modeling and animation were handle by 2 other team members.<br />
<span id="more-224"></span></p>
<h3>Introduction</h3>
<p>This project was meant to be a TV series animation proposal, so there will be some unpolish area as we were rushing this out. A brief intro about this animation can be read at <a href="http://aidigv.blogspot.com/2011/07/eddy-and-galaxy-whale.html" target="_blank">Aidi&#8217;s blog</a>.</p>
<blockquote><p>The story follows the adventures of a boy and a space whale as they visit the many amusing planets of another galaxy.</p></blockquote>
<h3>Concept Art</h3>
<p>Below are some of the early concept art I quickly done. Another piece of concept art can be view at my deviantart page, <a href="http://mclelun.deviantart.com/art/Whale-Galaxy-202505297" title="Whale Galaxy" target="_blank">Whale Galaxy</a>.</p>
<p><img src="http://www.mclelun.com/img/blog/110911_gwhale_01.jpg" alt="Galaxy Whale Concept" /></p>
<h3>3D Model and Animation</h3>
<p>My contribution on 3D modeling and animation was minimal in this project. I only model the flower robot, Tulip and some random items using Blender which later to be import and rig in 3DSMax using CATMotion.</p>
<p><img src="http://www.mclelun.com/img/blog/110911_gwhale_02.jpg" alt="Tulip 3D" /><br />
<img src="http://www.mclelun.com/img/blog/110911_gwhale_03.jpg" alt="Book 3D" /></p>
<h3>Compositing</h3>
<p>My main task on this project was compositing. Below are some of the before and after comparison shots.</p>
<p><img src="http://www.mclelun.com/img/blog/110911_gwhale_04.jpg" alt="Before and After Effects" /></p>
<p>Probably a video of before and after will show better what I really did.<br />
<center><iframe width="560" height="345" src="http://www.youtube.com/embed/yHNPGz5JeVA" frameborder="0" allowfullscreen></iframe></center></p>
<h3>The Animation</h3>
<p>Below is the youtube link for the animation. Hope you enjoy it. Comments are always welcome.<br />
<center><iframe width="560" height="345" src="http://www.youtube.com/embed/DPQKen0tkXQ" frameborder="0" allowfullscreen></iframe></center></p>
]]></content:encoded>
			<wfw:commentRss>http://www.mclelun.com/blog/2011/09/eddy-and-the-galaxy-whale/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

