{"id":256,"date":"2019-02-27T18:16:22","date_gmt":"2019-02-27T18:16:22","guid":{"rendered":"https:\/\/projects-old.etc.cmu.edu\/ako\/?p=256"},"modified":"2019-03-06T23:24:49","modified_gmt":"2019-03-06T23:24:49","slug":"week-6-getting-things-together","status":"publish","type":"post","link":"https:\/\/projects-old.etc.cmu.edu\/ako\/index.php\/2019\/02\/27\/week-6-getting-things-together\/","title":{"rendered":"Week 6: Getting Things Together"},"content":{"rendered":"\n<p>The next few weeks for our team is going to involve merging all our current work. Over the past weeks, we had finalized on our tech and art designs. Everyone in our team had been working on their bit separately till now.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Making Ako interesting<\/h2>\n\n\n\n<p>We had decided that Ako would be having a personality that makes him stand apart from a regular automated robotic assistants. This meant that he should be able to do things that would excite the players and would also have characteristics that makes him approachable and easy to interact with. To be more precise,<em> to add something that would make players want to interact with him<\/em>.<\/p>\n\n\n\n<p>Therefore, our artist came up with a couple of props and costumes that we can use.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"751\" height=\"1024\" src=\"https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Ako-tshirt-751x1024.jpg\" alt=\"\" class=\"wp-image-261\" srcset=\"https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Ako-tshirt-751x1024.jpg 751w, https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Ako-tshirt-220x300.jpg 220w, https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Ako-tshirt-768x1047.jpg 768w, https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Ako-tshirt-1024x1397.jpg 1024w, https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Ako-tshirt-792x1080.jpg 792w, https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Ako-tshirt.jpg 1833w\" sizes=\"(max-width: 751px) 100vw, 751px\" \/><figcaption>Ako who loves burgers<\/figcaption><\/figure>\n\n\n\n<p><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"751\" height=\"1024\" src=\"https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/ako-suit-751x1024.jpg\" alt=\"\" class=\"wp-image-262\" srcset=\"https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/ako-suit-751x1024.jpg 751w, https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/ako-suit-220x300.jpg 220w, https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/ako-suit-768x1047.jpg 768w, https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/ako-suit-1024x1397.jpg 1024w, https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/ako-suit-792x1080.jpg 792w, https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/ako-suit.jpg 1833w\" sizes=\"(max-width: 751px) 100vw, 751px\" \/><figcaption>Ako who is a Magician<\/figcaption><\/figure>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"alignleft\"><img loading=\"lazy\" decoding=\"async\" width=\"228\" height=\"427\" src=\"https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/ako-clothes.png\" alt=\"\" class=\"wp-image-263\" srcset=\"https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/ako-clothes.png 228w, https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/ako-clothes-160x300.png 160w\" sizes=\"(max-width: 228px) 100vw, 228px\" \/><figcaption>A basic Ako model with different kinds of clothing<\/figcaption><\/figure><\/div>\n\n\n\n<p>This gave us a lot of options to choose from and think about what kind of fun things Ako can do if he takes up these roles.<\/p>\n\n\n\n<p>We considered these designs and ended up choosing the Ako who loves burgers. Ako in our world would be a regular teenager who loves to eat but is also a super Set game fanatic and knows it inside out. He is also learning to perform tricks that he likes to show now and then.<\/p>\n\n\n\n<p>Finally, we decided that we would combine the Hippo and his clothing into one model as it proved to be more convenient and predictable to rig.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Testing the features of DialogFlow<\/h2>\n\n\n\n<p>If you remember from last week&#8217;s project architecture there was a decision tree component which drives the state machine of the game. This <em>decision tree was the integral merging component that would bring together the game logic, AR, speech input and outputs.<\/em><br><br>Therefore, we spent some time to make careful decisions on how this would be implemented. This was important because this <em>component routes the flow of the game and should be robust and dynamic. It should also be easy to modify and update as and when more elements are being added to the project.<\/em><br><br>Basically, the role of this component can be summarized in the following diagram:<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"926\" height=\"451\" src=\"https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Decision-Tree.jpg\" alt=\"\" class=\"wp-image-264\" srcset=\"https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Decision-Tree.jpg 926w, https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Decision-Tree-300x146.jpg 300w, https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Decision-Tree-768x374.jpg 768w\" sizes=\"(max-width: 926px) 100vw, 926px\" \/><\/figure>\n\n\n\n<p>After some research, we concluded that this can be managed by the <g class=\"gr_ gr_16 gr-alert gr_spell gr_inline_cards gr_run_anim ContextualSpelling ins-del multiReplace\" id=\"16\" data-gr-id=\"16\">DialogFlow<\/g> service.<br><br><g class=\"gr_ gr_17 gr-alert gr_spell gr_inline_cards gr_disable_anim_appear ContextualSpelling ins-del multiReplace\" id=\"17\" data-gr-id=\"17\">DialogFlow<\/g> is driven by something called <em><strong>Intents. <\/strong><\/em>Intents are inputs to the <g class=\"gr_ gr_18 gr-alert gr_spell gr_inline_cards gr_disable_anim_appear ContextualSpelling ins-del multiReplace\" id=\"18\" data-gr-id=\"18\">DialogFlow<\/g> which are mapped to the questions that could be asked by the player. <br><br>DialogFlow also maintains states through Contexts. Contexts are attached to Intents and <g class=\"gr_ gr_476 gr-alert gr_gramm gr_inline_cards gr_disable_anim_appear Grammar multiReplace\" id=\"476\" data-gr-id=\"476\">is<\/g> executed when an Intent is active. These Contexts can also be passed as an input to another Context if it contains information or data that is required by another state.<br>Each context also gives out a response which is passed on to the Unity game engine.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"620\" height=\"545\" src=\"https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Dialogflow.png\" alt=\"\" class=\"wp-image-266\" srcset=\"https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Dialogflow.png 620w, https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Dialogflow-300x264.png 300w\" sizes=\"(max-width: 620px) 100vw, 620px\" \/><\/figure>\n\n\n\n<p>For example,<br><em>INTENT:<\/em><br>Input Question =&gt; &#8220;Is this a Set?&#8221; &#8220;Can you check if this is a Set?&#8221; &#8220;Is this correct?&#8221;<br>Identify intent from this question =&gt; Intent 1 or Intent 2?<br><br><em>CONTEXT<\/em>:<br>Choose the context from the Intent selected =&gt; State 1 or State 2?<br><br><em>RESPONSE<\/em>:<br>Output the corresponding response.<br><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">State Machine Logic<\/h2>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"603\" height=\"316\" src=\"https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Unity-logic.jpg\" alt=\"\" class=\"wp-image-268\" srcset=\"https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Unity-logic.jpg 603w, https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Unity-logic-300x157.jpg 300w\" sizes=\"(max-width: 603px) 100vw, 603px\" \/><\/figure>\n\n\n\n<p>It is necessary to have a state machine logic in our experience. The game states are driven by the responses from the output from the dialog flow. Therefore, it made sense to use the <g class=\"gr_ gr_5 gr-alert gr_spell gr_inline_cards gr_run_anim ContextualSpelling ins-del multiReplace\" id=\"5\" data-gr-id=\"5\">dialogflow<\/g> service itself as a state machine.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Brainstorming Visual User Experience<\/h2>\n\n\n\n<p>From our Quarters Feedback we wanted to add more visuals to the experience. We also were figuring out to finish the final phases of our tech integration. The team wanted to have a clear view of what the user experience would be like to design the interface.<br><br>Therefore, prototyped some UI elements that we could use in our project. Here is an example of Ako teaching to identify Set:<br><\/p>\n\n\n\n<figure class=\"wp-block-image is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Ako-Tutorial-Phase-Feature.jpg\" alt=\"\" class=\"wp-image-290\" width=\"697\" height=\"392\" srcset=\"https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Ako-Tutorial-Phase-Feature.jpg 960w, https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Ako-Tutorial-Phase-Feature-300x169.jpg 300w, https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Ako-Tutorial-Phase-Feature-768x432.jpg 768w\" sizes=\"(max-width: 697px) 100vw, 697px\" \/><figcaption>Ako showing features<\/figcaption><\/figure>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"960\" height=\"540\" src=\"https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Ako-Feature-1-1.jpg\" alt=\"\" class=\"wp-image-291\" srcset=\"https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Ako-Feature-1-1.jpg 960w, https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Ako-Feature-1-1-300x169.jpg 300w, https:\/\/projects-old.etc.cmu.edu\/ako\/wp-content\/uploads\/2019\/03\/Ako-Feature-1-1-768x432.jpg 768w\" sizes=\"(max-width: 960px) 100vw, 960px\" \/><figcaption>Rule explanation feature<\/figcaption><\/figure>\n\n\n\n<p>Next week, we plan to test Dialogflow to use as our state machine to combine the AR game states and Ako&#8217;s speech response.<\/p>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>The next few weeks for our team is going to involve merging all our current work. Over the past weeks, we had finalized on our tech and art designs. Everyone in our team had been working on their bit separately till now. Making Ako interesting We had decided that Ako would be having a personality&hellip; <br \/> <a class=\"read-more\" href=\"https:\/\/projects-old.etc.cmu.edu\/ako\/index.php\/2019\/02\/27\/week-6-getting-things-together\/\">Read more<\/a><\/p>\n","protected":false},"author":2,"featured_media":275,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-256","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/projects-old.etc.cmu.edu\/ako\/index.php\/wp-json\/wp\/v2\/posts\/256"}],"collection":[{"href":"https:\/\/projects-old.etc.cmu.edu\/ako\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/projects-old.etc.cmu.edu\/ako\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/projects-old.etc.cmu.edu\/ako\/index.php\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/projects-old.etc.cmu.edu\/ako\/index.php\/wp-json\/wp\/v2\/comments?post=256"}],"version-history":[{"count":9,"href":"https:\/\/projects-old.etc.cmu.edu\/ako\/index.php\/wp-json\/wp\/v2\/posts\/256\/revisions"}],"predecessor-version":[{"id":293,"href":"https:\/\/projects-old.etc.cmu.edu\/ako\/index.php\/wp-json\/wp\/v2\/posts\/256\/revisions\/293"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/projects-old.etc.cmu.edu\/ako\/index.php\/wp-json\/wp\/v2\/media\/275"}],"wp:attachment":[{"href":"https:\/\/projects-old.etc.cmu.edu\/ako\/index.php\/wp-json\/wp\/v2\/media?parent=256"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/projects-old.etc.cmu.edu\/ako\/index.php\/wp-json\/wp\/v2\/categories?post=256"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/projects-old.etc.cmu.edu\/ako\/index.php\/wp-json\/wp\/v2\/tags?post=256"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}