{"assets":[],"author_link":"author\/taro\/","author_name":"Omiya Games","cat":"LD #26","categories":["LD #26"],"comments":[],"epoch":1369428960,"event":"LD26","likes":6,"metadata":{"p_key":"78912","p_author":"Omiya Games","p_authorkey":"0","p_urlkey":"287922","p_title":"How I made the graphics on The Sentient Cube","p_cat":"LD #26","p_event":"LD26","p_time":"1369428960","p_likes":"6","p_comments":"0","p_status":"WAYBACK","us_key":null,"us_name":null,"us_username":null,"event_start":"1366934400","event_key":"16","event_name":"LD26"},"source_url":"2013\/05\/24\/how-i-made-the-graphics-on-the-sentient-cube\/","text":"<p>[<em>Cross-posted from <a href=\"http:\/\/www.omiyagames.com\/2013\/05\/how-i-made-the-graphics-on-the-sentient-cube\/\" target=\"_blank\">Omiya Games<\/a><\/em>]<\/p>\n<p>First, I wanted to congratulate everyone who have participated in this Ludum Dare contest!  Great job!<\/p>\n<p>Although I may have stepped out before the contest ended, I figured I\u2019d talk about how I got the graphics on <a href=\"http:\/\/www.ludumdare.com\/compo\/ludum-dare-26\/?action=preview&amp;uid=20557\">The Sentient Cube<\/a>. \u00a0It was surprisingly quick and simple, although it required a lot of tweaking to get it right. \u00a0In this step-by-step instructions, I explain how I\u2019ve used Unity\u2019s installed scripts to create a stunning toon shading.<\/p>\n<p>Note: this only works with Unity Pro license.<\/p>\n<h2>Step 1: Import stuff<\/h2>\n<p><img alt=\"step1\" class=\"alignnone size-full\" height=\"527\" src=\"http:\/\/www.omiyagames.com\/wp-content\/uploads\/2013\/05\/step1.png\" width=\"497\"\/><\/p>\n<p>In the menu bar, under Assets -&gt; Import Package, you\u2019ll need to import the Image Effects and the Toon Shading.<\/p>\n<h2>Step 2: Camera, Lights, Action<\/h2>\n<p><img alt=\"step2\" class=\"alignnone size-full\" height=\"88\" src=\"http:\/\/www.omiyagames.com\/wp-content\/uploads\/2013\/05\/step2.png\" width=\"236\"\/><\/p>\n<p>Create a cube, camera, and directional light for the scene you\u2019re working on.<\/p>\n<h2>Step 3: Toon material<\/h2>\n<p><img alt=\"step3\" class=\"alignnone size-full\" height=\"237\" src=\"http:\/\/www.omiyagames.com\/wp-content\/uploads\/2013\/05\/step3.png\" width=\"299\"\/><\/p>\n<p>Create a material under the Project pane, with the shader set to \u201cToon\/Lighted,\u201d and the Toon Ramp set to a 1-dimensional image. \u00a0In this case, I created a custom ramp.<\/p>\n<h2>Step 4: Test material<\/h2>\n<p><img alt=\"step4\" class=\"alignnone size-full\" height=\"297\" src=\"http:\/\/www.omiyagames.com\/wp-content\/uploads\/2013\/05\/step4.png\" width=\"287\"\/><\/p>\n<p>Drag-and-drop the new material from the Project pane to the cube in the Scene pane.<\/p>\n<h2>Step 5: Camera effects<\/h2>\n<p><img alt=\"step5\" class=\"alignnone size-full\" height=\"451\" src=\"http:\/\/www.omiyagames.com\/wp-content\/uploads\/2013\/05\/step5.png\" width=\"501\"\/><\/p>\n<p>Add the \u201cEdge Detect Effect\u201d and the \u201cContrast Stretch Effect\u201d components\u00a0<em>in that order<\/em> to the camera. \u00a0The screenshot above was the parameters I\u2019ve used.<\/p>\n<h2>Step 5: Add real-time shadows<\/h2>\n<p><img alt=\"step6\" class=\"alignnone size-full\" height=\"500\" src=\"http:\/\/www.omiyagames.com\/wp-content\/uploads\/2013\/05\/step6.png\" width=\"369\"\/><\/p>\n<p>Change the \u201cShadow Type\u201d under the directional light to \u201cHard Shadows.\u201d \u00a0The screenshot above were the parameters I\u2019ve used.<\/p>\n<h2>Results<\/h2>\n<p>Just add a few more elements with their own materials, and Voil\u00e0!<\/p>\n<p><a href=\"http:\/\/www.omiyagames.com\/wp-content\/uploads\/2013\/05\/exampleGraphics.png\"><img alt=\"exampleGraphics\" class=\"alignnone size-large\" height=\"370\" src=\"http:\/\/www.omiyagames.com\/wp-content\/uploads\/2013\/05\/exampleGraphics-609x403.png\" width=\"550\"\/><\/a><\/p>\n<p>You can download and import the <a href=\"http:\/\/www.omiyagames.com\/games\/thesentientcube\/graphics.unitypackage\">Unity package<\/a> I\u2019ve created with the same scene above.<\/p>\n<p>Tags: <a href=\"http:\/\/ludumdare.com\/compo\/tag\/graphics\/\" rel=\"tag\">graphics<\/a>, <a href=\"http:\/\/ludumdare.com\/compo\/tag\/toon-shading\/\" rel=\"tag\">toon shading<\/a>, <a href=\"http:\/\/ludumdare.com\/compo\/tag\/unity\/\" rel=\"tag\">unity<\/a><\/p>","time":"May 24th, 2013 8:56 pm","title":"How I made the graphics on The Sentient Cube","title_was_empty":false}