Scroll Down To Watch Video Detail...
if playing games in a 3d world that youdesign yourself and learning basic programming at thesame time sounds like fun to you give agentcubes a try. in this movie i'llshow you how to create a 3d world in agentcubes. draw your owncharacters called agents to populate the world and control their behavior withprogramming rules that you write yourself. you can listen to this whole movie oranytime you're ready pause the movie and create your own game.you can jump to different parts of this movie
by clicking a heading in the table ofcontents to the right of the movie the layout of agentcubes is prettysimple. when you create agents like a frog or a truck theyâ€™ll appear in thislist on the left called the agents list and you'll be able to add them to the 3dworld that you're creating over here in the grid in this blue area.down at the bottom of the screen is the behavior editor. this is where youâ€™ll create the programmingrules that guide your agent's behavior. youâ€™ll start off by making your first agent.i'm going to make a frog agent. iâ€™ll go to the lower toolbar and iâ€™llclick the agent button.
in the window that opens i'll chooseinflatable icon from the first column. that option will allow me to draw my own two-dimensional shape and inflate it intoa three-dimensional shape i'll leave the animals category selectedin the second column. in the third column you could choose a pre-built frog icon but it's way morefun to draw your own inflatable frog iconfrom scratch. to do that i'll leave the default iconthe akako which is a ladybug selected in the thirdcolumn just to start with,
and i go up to the name field and iâ€™ll type frog since i want to make my own frog icon then i click save at the bottom right.now i have an agent named frog in the agents list. it still looks like aladybug here but i'm going to make it look like a frog. iâ€™ll double-click this agent being carefulto click right on the icon not on its name. that opens the agent into the inflatableicon editor. to add more options to this window iâ€™llclick the more tools button
in the center of the window. the area onthe left is the 2d editor where iâ€™ll draw a frog instead of thisladybug. to remove the ladybad from the 2d editor iâ€™ll click the clear button in thecenter of the window. in the toolbar on the left iâ€™ll select the mirror vertically tool, which addsthis blue line in the center of the 2d editor. as i'mdrawing my frog in the 2d editor anything i draw to the left of thisline will be mirrored to the right side of the line. i makesure that the pencil tool is
selected at the top of the toolbar on theleft and i choose a color to draw with by clicking the color well in thetoolbar and selecting a green crayon. i click ok to close the color picker. i draw the left side of the frogshead and body to the left of the blue line. what i drawhere is automatically mirrored on the right side so the frog is symmetrical. i give my frog some front legs and come all the way down to the
bottom and close the outline of thefrog. if you make a mark that you don't want like this you can back up one step at a time bypressing ctrl z on your keyboard. when i've made a complete outline of myfrog iâ€™ll fill it with the green color that's inthe color well by going back to the tool bar and selecting the paint bucket tool andthen clicking inside the outline of the frog. now iâ€™ll create the frogs back legs in adifferent color.
iâ€™ll click on the color well again and thistime iâ€™ll choose a darker green crayon and iâ€™ll clickok. i go back to the toolbar and iâ€™ll click the pencil tool again andi'll use it to draw the frogs left leg which is mirrored on the right side too. again iâ€™ll select the paint bucket tool inthe toolbar and i'll fill the left leg with green and that fills the right leg too. iâ€™llfinish up by giving my frog some eyes. i go back to the color well click thereand iâ€™ll select the white crayon
and click ok. then i go back to thetoolbar and iâ€™ll select the pencil tool againiâ€™ll draw some eyes and iâ€™ll go back to the color well onemore time and select the black crayon and click ok to add some pupils. to change my simple 2d drawing into a 3dfrog i'll inflate him using the plus buttonhere. iâ€™ll click and hold this button as i keep my eye on the preview on theright to watch the frog inflate. to make his legs look more muscular
i'll inflate those even more. to do thati go back to the toolbar and iâ€™ll select the magic wand tool. withthat tool iâ€™ll click on his left leg to select that and then i hold the shift key and clickon the right leg to add that leg to the selection. theni'll go back to the plus button and iâ€™ll click and hold keeping my eye onthe preview on the right to see his legs inflate and to deselectthe legs iâ€™ll press control d on my keyboard. now ifinish creating my frog. to preview how he looks in 3d i'll go tothe toolbar on the right
and iâ€™ll select the rotate camera tool.then iâ€™ll click on the preview area on the right and i'll drag to rotatethe frog and then to save my frog iâ€™ll click thesave button here and the inflatable icon editor closes. back in the agents list my frog now has afrog icon. i'd like to put my frog into the worldthat i'm building so i make sure the frog is selected herein the agents list. i'll go to the upper toolbar and iâ€™ll makesure that the pencil tool is selected there and then i'll go to the world and iâ€™llclick
in the grid where i want the frog to belocated. whenever you make a change to the worldlike this adding deleting or moving an agent youneed to save the world with that change, so i go to the upper toolbar and i clickthe save button there. in the future if i change my mind about something i'vedone to the world i can go to this button, the restore button, and click and thatwill return the world to this state the way it was when last saved. now ihave an agent,
the frog in my world, but i haven't yettold him what to do. for that i need to program the frogsbehavior by writing some programming rules. rules are created here in the behavioreditor. a rule combines conditions and actions.if all the conditions of a rule are true then the actions will run and make thefrog do things. there is the beginning of a rule in my behavior editor: this if then statement. i want to add a condition and an actionto this role
to make the frog move up in the worldwhen i press the up- arrow on my keyboard. the condition will bepressing the up-arrow on my keyboard the action will be that the frog movesup in the world. i'll make sure that the frog agent is selected in the agents list and in the upper toolbar i'm going toselect the black arrow tool. then i'll go to the conditions panel, iâ€™llclick on the scrollbar and use it to scroll down to get to the â€˜keyâ€™ condition here. thewhite label on this condition is the starting value of the condition.
it defines which key to press, the up-arrow key. iâ€™ll click and drag this key condition fromthe conditions panel to the if-part of the rule in thebehavior editor. next iâ€™ll add an action that defines whatthe frog will do when the up-arrow key is pressed: heâ€™llmove up in the world. i go over to the actions panel and iâ€™llselect the first action, the move action, and drag it onto thethen part of the rule in the behavior editor.the white label on the move action is the value for this action. it willdefine the direction in which the frog
will move. i want the frog to move up in the worldso iâ€™ll click this white label and i choosethe up facing arrow as the value of this action. now thefrog will think like this: if the up-arrow is pressed then i moveup in the world. just this simple behavior empowerssomeone who plays your game to control your frog. let's test it to see if it works. iâ€™ll go tothe upper toolbar and iâ€™ll click the green run button.
now to test the rule iâ€™ll press the up-arrowon my keyboard and look the frog moves up each time that i press the up-arrow key. the frog can now go up but can it also go down left and right? no it can only go up. weneed three more rules to program the frog to move down left and right too. before adding thoserules i go back up to the upper toolbar and stop the game by clicking the redstop button and iâ€™ll put the frog back where hestarted in the world by clicking the
reload button in the upper toolbar too. now i go down to the behavior editor and iâ€™llselect the single rule there by clicking in a blank area of the rule.iâ€™ll duplicate this selected rule three times by going down to the lower toolbar andpressing the duplicate button three times. i could have added a brand new rule byclicking the plus rule button on the lower toolbar but since these rules are similar i savedtime by duplicating.
now i'm going to edit these three newrules so each will move the frog in a different direction. iâ€™ll go to the second rule and iâ€™ll click thevalue on the key condition that up-arrow value andiâ€™ll change the value of this condition to down-arrow by pressing the down-arrow on mykeyboard.then i go to the action for that second rule and iâ€™ll change the value on the moveaction to down by clicking the value on that action
and choosing the down facing arrow. the second rule now tells the frogthat if the down arrow is pressed on the keyboard heâ€™ll move down in the world. see if youcan program the third rule to move the frog left if the left-arrowis pressed and the fourth rule to move the frog right if the rightarrow is pressed. when you're done check to see if all therules work. to do that i go back to the upper toolbar and iâ€™ll press the green run-button andnow iâ€™ll press the different arrow keys on my
to see if all the rules work and the frog now moves in all directions. when i'm done testing i go back tothe upper toolbar and iâ€™ll click the red stop button and iâ€™llclick the reload button to reload the world and get the frogback restarted. now add another agent to the world agrotto. the frogs goal will be to reach the grotto and when he does the game will advanceto the next level. i've already showed you how to make an agent and add it to theworld.
as before iâ€™ll click the agent button andthis time i'll choose cube and brick and ancientmayan blocks and give the agent a name grotto and iclick save. with grotto selected in the agents list and the pencil tool selected in theupper toolbar iâ€™ll click a square at the top of the grid to add the grottoto the world and then i'll save the world with that change. now add another rule that will determinewhat happens when the frog reaches his goal, thegrotto. iâ€™ll select the frog in the agents
list and in the behavior editor iâ€™ll click onthe top rule, then i go down and click the plus rulebutton. that creates a new rule under the selected rule. iâ€™ll drag the newrule to the top of the behavior editor. this new rule has to be above the rulesthat move the frog because every agent will test its rulesfrom top to bottom. the first rule that an agent finds inwhich all conditions are true will fire. i want to be sure that therule that i'm making now is the first rule that the frog agentwill test because this rule
can potentially end the game and soit is the most important rule. i add a condition to this rule that if the frog is stacked immediately above the grotto then a sound will play the trara-sound and a dialogue willshow a message you win and the world will reload.
without the reload world action the frogwould remain on the grotto and then the sound would be played and themessage shown over and over in an endless loop. i'm going to test thisrule from the frogs point of view. with the arrow tool iâ€™ll select the frog in the world iâ€™ll click the camera tool to switch to first person view. i use therotate camera tool to orient the frog to a forward positionin the world. i can use the pan tool to move theworld
and the zoom tool to zoom in the world and then iâ€™ll click the run-button. i use the up-arrow key on my keyboard tomove the frog forward and on top of the grotto. when the frog reaches the grotto thislevel of the game is won. iâ€™ll click ok and then i click the stop-button. now you've successfully created a 3dworld, drawn your own 3d shapes and programmedagents behaviors. this means that you've mastered thebasic tools that you could use to create
a game like this one. this is a sophisticated game simulatingtraffic in the city. there are a lot of cool things that you can add toyour own game. you may not finish building it all in one sitting. if you need to stop be sure to submitthe game by clicking the submit-button at the top of the screen. that way youcan come back anytime and finish tricking out your 3dworld. let's kick this game up a notch byadding a road and some tracks to challenge the frog.
i make a new agent for the road startingwith the default inflatable icon. iâ€™ll name it road and iâ€™llclick save. to make this agent look like a road iâ€™lldouble-click it to open it in the inflatable icon editor and iâ€™ll click the clear button. iâ€™ll selectthis tool, the mirror horizontally and vertically tool.to color the road grey i'll choose a grey crayon from the colorwell and then i get the paint bucket and iâ€™llclick in any of the quadrants to fill all four of them with grey.
to mix in yellow lines on the road iâ€™llselect the pencil tool iâ€™ll click in the color well and iâ€™ll selecta yellow crayon and click ok and then i'll start in thecenter and drag out and draw a line out towardthe left edge that line is mirrored in all fourquadrants. to add some dashed lines iâ€™ll select a like grey crayon from the colorwell and then starting in the center iâ€™ll draw acouple of dashed lines and i'll save my hand drawn road agent. to add a three-lanesuperhighway to the world
with the road agent selected in theagents list iâ€™ll select the multi-agent insert tool, iâ€™ll clickhere in the world, iâ€™ll drag down three rows andacross and multiple instances of the road agentcreate this road. now iâ€™ll make another new agent, a truck agent iâ€™ll use an inflatable icon from thevehicles category. there are a couple of trucks to choosefrom here i'll go with this one, iâ€™ll name it truck and iâ€™ll click save
i'll use my truck agent and the penciltool to add multiple trucks on the highway ina random pattern. iâ€™ll click the save-button to save theworld with the highway and trucks that i added. now iâ€™ll program thetrucks to move down the highway. iâ€™ll select one of the trucks in the world,iâ€™ll go to the single empty rule in the behavior editor and iâ€™ll add some conditions so that if thetruck sees to its right
road and it sees that only once every .5 seconds then the truck will move to the right. iâ€™ll test this role byclicking the green run button. all the trucks share this behavior andthey move down the highway to the right. i'll let them run until they all pile upon the right. each truck stops when it no longer sees road to its right.now let's test what will happen if the frog collides with the truck onthe road. to put the trucks back where they started and have them to move down theroad from there
iâ€™ll reload the world. soon after clickingthe reload-button iâ€™ll use the up-arrow key on my keyboard tomove the frog up into the path of one of the trucks onthe road. this truck stops moving just to the leftof the frog. to see why iâ€™ll select the truck with the arrow tool and iâ€™ll take a look at this rule whichguides the behaviour the truck. this condition for this rule seeing roadto the right is no longer true so both the see condition and the rulehave turned red the rule isnâ€™t firing and so the trucksno longer move.
now i'm done testing so iâ€™ll click stop. now what should happen when the truckcollides with the frog? unfortunately the truck will kill the frog and the game will be over. i'm going tomake a new rule for the frog for that behavior. iâ€™ll select the frog in the agents listwith the arrow tool and iâ€™ll go to the behavior editor. the rule i'm about tomake is another important rule that needs to come before the arrow keysthat move the frog. so iâ€™ll select the topmost rule and iâ€™llclick plus rule.
from the frogs point of view this rule will be: if i see to my left a truck then iâ€™ll play a sound klink and stop the simulation and show a message â€œoh no! game overâ€.
to test this collision rule iâ€™llreload the world to start the game from the beginning. iâ€™llclick the green run-button and i'll use the up-arrow key on mykeyboard to move the frog up into the path of a truck. there's a collision and the game is over. iâ€™ll click ok to dismiss this message. the game will be more realistic andchallenging if you set it up to generate highway traffic automatically instead of you manuallyplacing trucks on the highway.
to do that i'm going to create highwaytunnels that generate trucks from the left side of this highway and absorb trucks from the right side ofthe highway. that will keep the trucks coming fromthe left and avoid them piling up on the right. iâ€™ll reload the world. iâ€™ll select the eraser tool and iâ€™ll clickon each truck individually to remove it from the world. iâ€™ll make a new agent for the tunnel.
iâ€™ll name it tunnel and iâ€™ll start with an inflatable icon, iâ€™ll use the default theakako ladybug and click save. to draw your own 3d tunnel double-clickthe tunnel agent to open it in the inflatable icon editor click clear and youâ€™ll see that over here i still have my mirror horizontally andvertically tools selected iâ€™ll click in the color well and i'm goingto select a brown color.
with the paint bucket tool iâ€™ll click inany of the quadrants to fill the entire icon. iâ€™ll go back to the color well and select a black crayon and iâ€™ll select the pencil tool which i'mgoing to use to draw an arc thatâ€™s mirrored on the other side.
with the paint bucket tool iâ€™ll click onone of the arcs to fill them both. i'd like to inflate my tunnel so i go over to the pressure symbols and iâ€™llclick a few times on the plus symbol to make an entrance and exit to my tunnel i'm going to select thosetwo black arcs with the magic wand tool clicking on oneand shift-clicking on the other and then iâ€™ll press delete or backspace onmy keyboard. iâ€™ll select the entire tunnel by pressing control a. i think i want to add some noise tothe tunnel so i drag the noise slider
slightly to the right and i think i wanna deflate a little soiâ€™ll press the minus symbol a few times and then with the camera rotate toolselected iâ€™ll click and drag for a preview of my three-dimensionaltunnel and then iâ€™ll click save. now i want to add three tunnels to each and my highway. with thepencil tool selected iâ€™ll move into the world and iâ€™ll click anddrag three tunnels on the left
and three tunnels on the right and i'llsave my world with those changes. now i want to program the tunnel togenerate cars so with the arrow tool iâ€™ll select one of the tunnels i go to thesingle empty rule in the behavior editor and iâ€™ll add someconditions which from the tunnels point of view willsay if i see to my right a road and that happens only once every .5 seconds, then
generate a new to my right truck. to test this rule i'll click the green run-button. the tunnels on the left are generating trucks but the trucks are getting backed up at thetunnels on the right. to get the trucks off the road so theydon't back up on the right i need to program the trucks to beabsorbed if there's a tunnel to the
so i make a new rule for the truck agent.with the arrow tool iâ€™ll select one of the trucks next to atunnel on the right iâ€™ll select the single rule in the behavioreditor and iâ€™ll make a new rule. iâ€™ll add a condition that says from the trackspoint of view if i see to my right a tunnel then iâ€™ll erase myself.
the trucks start absorbing,generating automatically. i didn't have to click the run-button because i left the game running. if i left the game running like this itwould be unwinnable because the frog could never cross thehighway to get to the grotto and win the game. to solve that problem i could space outthe cars by editing the rule to change thetunnels behavior so that it generates cars less frequently. with the arrow tool iâ€™ll select this tunneland iâ€™ll add another condition
to this behavior for the tunnel, thepercent chance condition. notice that there are now fewer carsbeing generated but they're still too many so i'm going to change the percentchance to something smaller iâ€™ll take 20. then iâ€™ll wait until i see an adjusting trafficpattern to click save to save the world with these changes. now let's play the game. iâ€™ll wait for agood opportunity for the frog to cross the road
and then iâ€™ll press the up-arrow key a fewtimes to get him across the road and to the grotto and i win the game. i'll click ok and now i wanna to try playing the game infirst person view. with the arrow tool i'll select the frog and then iâ€™ll click the camera tool toswitch to first person view. iâ€™ll use the up-arrow key to move the frog right into traffic infront of a truck.
the game fails and i've lost but it wasstill fun. so now you've learned three essentialcomputational thinking patterns: collision: the collision of trucks andfrog, generation: the tunnels creating trucks andabsorption: the tunnels absorbing trucks. with these skills you can buildsophisticated games of your own or you can continue to follow along withme as i add more creatures and objects to this 3ddworld. let's give the frog even more of a challenge: a river that hehas to cross on the way to the grotto.
iâ€™ll make a new agent for the riverstarting with the inflatable icon from the landscape category, the aqua-icon, naming it river and saving it. to add the river to the world i'll usethe multi-agent insert tool to click and drag across the world and then i'll save the world with thesechanges. as the frog crosses the river he could drown so iâ€™ll addthat to the frogâ€™s behavior.
with the arrow tool i'll select the frogin the world and iâ€™ll drag him up just beneath theriver. iâ€™ll select the top rule thatâ€™s in thebehavior editor now and iâ€™ll make a new rule just under that.from the frogâ€™s point of view this rule says: if i'm above the river i'll play a sound whip i'll show a message
â€œi cannot swimâ€ and i'll reload the world. to test this rule i'll click the green run-button in the toolbar and iâ€™ll use the up-arrow keyon my keyboard to move the frog onto the water. the frog has drowned. so i'll click ok and the game isrestarted. i'll click the stop-button. now i want to add some logs
in the river. so i make a new agent iâ€™ll name it log and iâ€™ll start with the default inflatable icon. iâ€™ll double click that in agents list and i'll click clear. with thehorizontally and vertically mirror tool still selected and brown in my colorwell iâ€™ll use the pencil tool
to draw a line straight across. with the paint bucket tool iâ€™ll fill thatwith brown. iâ€™ll choose an orange color and with the pencil tool i'll draw an arc. iâ€™ll use the plus button in the center to inflate the log. i'm actuallygoing to over-inflate it a bit then iâ€™ll select the magic wand tool
and with that iâ€™ll select the brown area.with the camera rotate tool iâ€™m going to rotate the preview so thati can see the log from the side so i have a better idea of how much to deflate itby clicking the minus button and i'm going to add a little bit of noise to the log too than i'll click save. i want the logs to be automaticallygenerated in the world by a bridge just like the trucks were generated bytunnels earlier in the game so i make a bridge agent.
i'll start with the default inflatable icon and then iâ€™ll double-click it in the agents list and clear the 2d editor. i'm still using the horizontally andvertically mirror tool. i'll click in the color well and iâ€™ll select agray color. with the paint bucket tool iâ€™ll fill theicon then iâ€™ll click back in the color well andselect a black color and click ok. with the pencil tool iâ€™ll draw an arc
and iâ€™ll fill the arc with black. iâ€™ll press the plus button to over-inflate theicon then with the rectangle selection tooli make a vertical selection like this in the center. now to get an indent in the top of thebridge i'll use the ceiling slider to push the selected part down. with the magic wand tool iâ€™ll select the black arc, hold the shift key andselect the other black arc
and then iâ€™ll press the delete backspaceon my keyboard to make openings in the bridge. iâ€™ll press control d on by keyboard and theni'll use the camera rotation tool to see how my bridge looks. iâ€™ll press the save-button to save my bridge. iâ€™ll add a couple of bridges to the worldwith the pencil tool here and over here and then i'll save the world
those changes. next iâ€™ll program a bridge toautomatically generate logs. with the arrow tool iâ€™ll select this bridge and iâ€™ll give it the same behavior that i used to make the tunnels generate trucks. from the bridgeâ€™s point of view this rulewill mean: river once every .5 seconds and with a percent chance
of 20 iâ€™ll generate to my right a new log. next iâ€™ll add some rules to the logs so that theymove to the right and are absorbed by the bridge on the right. iâ€™ll select the log agent and i'll build therule that from the logâ€™s point of view, a river once every .5 seconds then
i'll move to my right. and then to absorb the log into thebridge iâ€™ll add another rule: to my right a bridge now i want to test whether the frog could hitcha ride on a floating blog on its way to thegrotto. i could use the up-arrow key on my to move the frog to the edge of theriver but for testing purposes iâ€™ll just use the black arrow key and draghim there. iâ€™ll click the green run-button and i wait fora log to appear on which the frog could hitch a ride.
when i pressed the up-arrow key to movethe frog onto a log the logs slipped out from under the frog,the frog fell into the water and drowned. that isn't the result that i wanted soi'll click okay, that resets the game and i'll click the stopbutton. to fix that iâ€™ll edit the logâ€™s behavior sothat the log can transport a frog. iâ€™ll select the login the agents list. i go to the first rule in the behavioreditor and i replace the move action with transport to the right. now the log should not just
move but also transport along with itany agent that is on top of it. iâ€™ll test this changeby moving the frog with the arrow tool to the edge of the river then iâ€™ll pressthe run-button and iâ€™ll use the up-arrow key on mykeyboard to move the frog right on top of a log. the log did transportthe frog along with it down the but eventually the frog hit the bridge,slipped off the log into the water and drowned. so that's why i need something moreturtles on which the frog can hitch a
ride back to the left before he reaches the bridge. so iâ€™ll clickok and i'll click stop. iâ€™ll make a new agent turtle and iâ€™ll select an icon from the inflatable icon animals category this turtle and then iâ€™ll make another agent an islandthat i'm going to use to generate turtles
for my world. this time i'll go to the landscape category of theinflatable icons and there's an island i can use. with the pencil tool i'll add a coupleof islands here and here and iâ€™ll save the world withthese changes. i want the island on the right togenerate turtles. this behavior will be very similar to the bridge generatinglogs
but in the opposite direction. this timefrom right to left. with the arrow tool iâ€™ll select the islandon the right and then i'll add a rule which from theislandâ€™s point of view will say if i see on my left only once every .5 seconds and with a percent chance of 20 then i generate a new
to my left turtle. the turtles need to move to the left, so iâ€™ll select the turtle in theagents list and give him a rule if i see to my left once every .5 seconds then i transport to the left and i want the turtles to beabsorbed into the island on the left
so iâ€™ll add another rule if i see to my left an island i erase myself now for the part i have been waiting for toplay the game through. iâ€™ll click the green arrow and iâ€™ll use the up-arrow key on my keyboard to move the frog across the highway andthen iâ€™ll use the left-arrow key to move him overto left where is more likely to catch a log like this one iâ€™ll jump him onto a turtle
and then all the way to the grotto and the gameis won. i'll click okay to reload the world and iâ€™ll stopthe game. that was really fun. now finallyto spruce things up a bit i'm going to add some landscaping i name it plants and from the tile and plants category iâ€™ll choose untrimmedhedge and then with the pencil tool iâ€™ll drag some hedge
across all these empty areas and then iâ€™ll come up and save the worldwith those changes. so now we've created a complete game.why you donâ€™t go ahead and try to play the game in first personview by clicking the camera tool to flip it into first person view andsee how you do. thanks so much for working along with methrough this tutorial. youâ€™ve successfully created a 3d game, you'velearned how to make 3d shapes and how to program them. please submityour game so that you can keep working on it
or share it with your friends. to getmore ideas about other games or simulations to build please visitthe scalable game design website at http://scalablegamedesign.cs.colorado.edu