{"id":310,"date":"2019-02-26T02:12:38","date_gmt":"2019-02-26T02:12:38","guid":{"rendered":"https:\/\/projects-old.etc.cmu.edu\/hot-metal\/?p=310"},"modified":"2019-03-26T00:05:28","modified_gmt":"2019-03-26T00:05:28","slug":"week-6-dev-blog","status":"publish","type":"post","link":"https:\/\/projects-old.etc.cmu.edu\/hot-metal\/index.php\/2019\/02\/26\/week-6-dev-blog\/","title":{"rendered":"Week 6 Dev Blog"},"content":{"rendered":"\n<p>On Week 6, we continuously work on the linear VR experience. Here are some screenshots for our latest progress:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"500\" src=\"https:\/\/www.etc.cmu.edu\/projects\/hot-metal\/wp-content\/uploads\/2019\/02\/image-4-1024x500.png\" alt=\"\" class=\"wp-image-311\" srcset=\"https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/image-4-1024x500.png 1024w, https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/image-4-300x147.png 300w, https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/image-4-768x375.png 768w, https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/image-4.png 1638w\" sizes=\"(max-width: 767px) 89vw, (max-width: 1000px) 54vw, (max-width: 1071px) 543px, 580px\" \/><figcaption>Step Controller for level management<br><\/figcaption><\/figure><\/div>\n\n\n\n<p>The above picture shows the steep controller we used for level management. We use a stepManager system as the bottom structure to manage the linear level system. We gave every step several parameters, and every step has events to be triggered when the step starts and ends. When a step is created, we also gave them step events for ending and start, and also store each step and their following steps in two dictionaries. Then we leave the AddStep Interface for .json file to store and add levels. For every step, we need a structured method calling the step ID of every single step. Then, we search in .json file for glowing objects and outline objects and use specific functions to provide visual feedback. In the .json file, we store objects with names and split with the comma. Therefore, In Set step function we formalized strings and find objects in the scene through their name and call relative methods. Then we leave interface for both moving to the next step and also calling specific step. In most occasions, when the system receives the event that the guest has finished the current step, we call the function of moving to the next step. In some other occasions, we need the player to recall back to specific steps and looping in several steps until they finish the last requirement. In the loop, we need to call a specific step instead of moving to the next step. When calling the function, we pass the step index as the parameter.<br> We use a stepManager system as the bottom structure to manage the linear level system. We gave every step several parameters, and every step has events to be triggered when the step starts and ends. When a step is created, we also gave them step events for ending and start, and also store each step and their following steps in two dictionaries. Then we leave the AddStep Interface for .json file to store and add levels.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.etc.cmu.edu\/projects\/hot-metal\/wp-content\/uploads\/2019\/02\/image-5-923x1024.png\" alt=\"\" class=\"wp-image-313\" width=\"516\" height=\"572\" srcset=\"https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/image-5-923x1024.png 923w, https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/image-5-270x300.png 270w, https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/image-5-768x852.png 768w, https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/image-5.png 1085w\" sizes=\"(max-width: 516px) 100vw, 516px\" \/><figcaption>Interface of Setting the current step<\/figcaption><\/figure><\/div>\n\n\n\n<p>For every step, we need a structured method calling the step ID of every single step. Then, we search in .json file for glowing objects and outline objects and use specific functions to provide visual feedback. In the .json file, we store objects with names and split with the comma. Therefore, In Set step function we formalized strings and find objects in the scene through their name and call relative methods.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.etc.cmu.edu\/projects\/hot-metal\/wp-content\/uploads\/2019\/02\/image-6-879x1024.png\" alt=\"\" class=\"wp-image-314\" width=\"514\" height=\"598\" srcset=\"https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/image-6-879x1024.png 879w, https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/image-6-257x300.png 257w, https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/image-6-768x895.png 768w, https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/image-6.png 906w\" sizes=\"(max-width: 514px) 100vw, 514px\" \/><figcaption>Set step function implementation<\/figcaption><\/figure><\/div>\n\n\n\n<p>Then we leave interface for both moving to the next step and also calling specific step. In most occasions, when the system receives the event that the guest has finished the current step, we call the function of moving to the next step. In some other occasions, we need the player to recall back to specific steps and looping in several steps until they finish the last requirement. In the loop, we need to call a specific step instead of moving to the next step. When calling the function, we pass the step index as the parameter.<\/p>\n\n\n\n<ul class=\"wp-block-gallery columns-2 is-cropped wp-block-gallery-1 is-layout-flex wp-block-gallery-is-layout-flex\"><li class=\"blocks-gallery-item\"><figure><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/www.etc.cmu.edu\/projects\/hot-metal\/wp-content\/uploads\/2019\/02\/5-1024x576.png\" alt=\"\" data-id=\"315\" data-link=\"https:\/\/www.etc.cmu.edu\/projects\/hot-metal\/?attachment_id=315\" class=\"wp-image-315\" srcset=\"https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/5-1024x576.png 1024w, https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/5-300x169.png 300w, https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/5-768x432.png 768w, https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/5.png 1920w\" sizes=\"(max-width: 767px) 89vw, (max-width: 1000px) 54vw, (max-width: 1071px) 543px, 580px\" \/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img loading=\"lazy\" decoding=\"async\" width=\"1920\" height=\"1080\" src=\"https:\/\/www.etc.cmu.edu\/projects\/hot-metal\/wp-content\/uploads\/2019\/02\/6-1024x576.png\" alt=\"\" data-id=\"316\" data-link=\"https:\/\/www.etc.cmu.edu\/projects\/hot-metal\/?attachment_id=316\" class=\"wp-image-316\" srcset=\"https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/6-1024x576.png 1024w, https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/6-300x169.png 300w, https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/6-768x432.png 768w, https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/6.png 1920w\" sizes=\"(max-width: 767px) 89vw, (max-width: 1000px) 54vw, (max-width: 1071px) 543px, 580px\" \/><\/figure><\/li><\/ul>\n\n\n\n<p>Above is our latest machine model. Before the half, we need to add more details on the outer door and build the right half part which contains the monitor of the machine and the safety knots.<\/p>\n\n\n\n<p>We had a draft UI for the tabletl that the student will hold in their left hand during the VR experience and let&#8217;s take a peek:<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"847\" height=\"474\" src=\"https:\/\/www.etc.cmu.edu\/projects\/hot-metal\/wp-content\/uploads\/2019\/02\/Capture-4.png\" alt=\"\" class=\"wp-image-318\" srcset=\"https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/Capture-4.png 847w, https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/Capture-4-300x168.png 300w, https:\/\/projects-old.etc.cmu.edu\/hot-metal\/wp-content\/uploads\/2019\/02\/Capture-4-768x430.png 768w\" sizes=\"(max-width: 767px) 89vw, (max-width: 1000px) 54vw, (max-width: 1071px) 543px, 580px\" \/><figcaption>Draft UI for Tablet<\/figcaption><\/figure>\n\n\n\n<p>For <g class=\"gr_ gr_32 gr-alert gr_gramm gr_inline_cards gr_disable_anim_appear Grammar only-ins doubleReplace replaceWithoutSep\" id=\"32\" data-gr-id=\"32\">week<\/g> 7, the last week before the half presentation. We have made a priority list of what we are going to do on our prototype:<\/p>\n\n\n\n<p>a.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;The whole interaction experiences including art assets we have. We will use placeholders for the rest.<\/p>\n\n\n\n<p>b.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Instructions implemented in the tablet.<\/p>\n\n\n\n<p>c.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;The tag on each object when the controller hovers over it.<\/p>\n\n\n\n<p>d.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Prioritize visual feedback.<\/p>\n\n\n\n<p>e.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Sound effect.<\/p>\n\n\n\n<p>Our whole team are excited about what we are going to present in the half.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>On Week 6, we continuously work on the linear VR experience. Here are some screenshots for our latest progress: The above picture shows the steep controller we used for level management. We use a stepManager system as the bottom structure to manage the linear level system. We gave every step several parameters, and every step &hellip; <\/p>\n<p class=\"link-more\"><a href=\"https:\/\/projects-old.etc.cmu.edu\/hot-metal\/index.php\/2019\/02\/26\/week-6-dev-blog\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Week 6 Dev Blog&#8221;<\/span><\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[6,4,5],"tags":[],"class_list":["post-310","post","type-post","status-publish","format-standard","hentry","category-art","category-design","category-programming"],"_links":{"self":[{"href":"https:\/\/projects-old.etc.cmu.edu\/hot-metal\/index.php\/wp-json\/wp\/v2\/posts\/310"}],"collection":[{"href":"https:\/\/projects-old.etc.cmu.edu\/hot-metal\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/projects-old.etc.cmu.edu\/hot-metal\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/projects-old.etc.cmu.edu\/hot-metal\/index.php\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/projects-old.etc.cmu.edu\/hot-metal\/index.php\/wp-json\/wp\/v2\/comments?post=310"}],"version-history":[{"count":5,"href":"https:\/\/projects-old.etc.cmu.edu\/hot-metal\/index.php\/wp-json\/wp\/v2\/posts\/310\/revisions"}],"predecessor-version":[{"id":366,"href":"https:\/\/projects-old.etc.cmu.edu\/hot-metal\/index.php\/wp-json\/wp\/v2\/posts\/310\/revisions\/366"}],"wp:attachment":[{"href":"https:\/\/projects-old.etc.cmu.edu\/hot-metal\/index.php\/wp-json\/wp\/v2\/media?parent=310"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/projects-old.etc.cmu.edu\/hot-metal\/index.php\/wp-json\/wp\/v2\/categories?post=310"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/projects-old.etc.cmu.edu\/hot-metal\/index.php\/wp-json\/wp\/v2\/tags?post=310"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}