{"id":411,"date":"2021-10-07T10:05:34","date_gmt":"2021-10-07T17:05:34","guid":{"rendered":"https:\/\/blogs.ubc.ca\/alvesetec540\/?p=411"},"modified":"2021-10-10T20:13:54","modified_gmt":"2021-10-11T03:13:54","slug":"task-5-twine-task","status":"publish","type":"post","link":"https:\/\/blogs.ubc.ca\/alvesetec540\/2021\/10\/07\/task-5-twine-task\/","title":{"rendered":"Task #5 Twine Task"},"content":{"rendered":"<h4><span style=\"text-decoration: underline;\"><strong>Twine:\u00a0<\/strong><\/span><\/h4>\n<p>Ok, I hope this works! Both links (I included two hoping that one will work) should open a new page where you will have to open the .zip file with the game, &#8220;The Missing Sock.&#8221;<\/p>\n<p><a href=\"https:\/\/blogs.ubc.ca\/alvesetec540\/2021\/10\/07\/task-5-twine-task\/the-missing-sock-7\/\" rel=\"attachment wp-att-481\">The Missing Sock<\/a><\/p>\n<blockquote class=\"wp-embedded-content\" data-secret=\"c01KvaBPKO\"><p><a href=\"https:\/\/blogs.ubc.ca\/alvesetec540\/2021\/10\/07\/task-5-twine-task\/the-missing-sock-7\/\">The Missing Sock<\/a><\/p><\/blockquote>\n<p><iframe loading=\"lazy\" class=\"wp-embedded-content\" sandbox=\"allow-scripts\" security=\"restricted\" style=\"position: absolute; clip: rect(1px, 1px, 1px, 1px);\" title=\"&#8220;The Missing Sock&#8221; &#8212; Mandy Alves + ETEC 540\" src=\"https:\/\/blogs.ubc.ca\/alvesetec540\/2021\/10\/07\/task-5-twine-task\/the-missing-sock-7\/embed\/#?secret=c01KvaBPKO\" data-secret=\"c01KvaBPKO\" width=\"600\" height=\"338\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\"><\/iframe><\/p>\n<h6 style=\"text-align: center;\"><strong><em>I want to preface by saying: this was the most &#8216;tech&#8217; thing I&#8217;ve ever done. Ever.<\/em><\/strong><\/h6>\n<h4><span style=\"text-decoration: underline;\"><strong>The End Product<\/strong><\/span><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-427 size-large\" src=\"https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/sock-map--1024x613.jpg\" alt=\"\" width=\"700\" height=\"419\" srcset=\"https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/sock-map--1024x613.jpg 1024w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/sock-map--300x180.jpg 300w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/sock-map--768x460.jpg 768w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/sock-map--1536x920.jpg 1536w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/sock-map--2048x1226.jpg 2048w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/sock-map--1140x683.jpg 1140w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/sock-map--552x330.jpg 552w\" sizes=\"auto, (max-width: 700px) 100vw, 700px\" \/><\/h4>\n<h4><span style=\"text-decoration: underline;\"><strong>The Journey\u00a0 <\/strong><\/span><\/h4>\n<p>Bolter&#8217;s (2001) discussion in &#8216;&#8221;Hypertext and Remediation of Print&#8221; spoke to the exact route I took during this process. I figured, to avoid being inundated with hypertext, I would just be &#8220;Romantic&#8221; (p.33) and go for it, basically work quickly so <strong>&#8220;the medium wouldn&#8217;t fail my thoughts&#8221;<\/strong> (p.33). I am this person, a jumble of ideas. I always encourage students to mock up\/pre-write their ideas and here, I should have followed my own advice. But Bolter (2001) is correct, and I will comment on this below, &#8220;the hierarchy (in the form of paragraphs, sections, and chapters) is an attempt to impose order on verbal ideas [&#8230;]&#8221; (p.33). Although I was worried the hypertext<img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-462 alignright\" src=\"https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/title-1-300x300.jpg\" alt=\"\" width=\"300\" height=\"300\" srcset=\"https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/title-1-300x300.jpg 300w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/title-1-150x150.jpg 150w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/title-1.jpg 398w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/> was going to somehow limit my story, in many ways it <strong>actually allowed it to flourish<\/strong>. The hypertext supported &#8216;<strong>more&#8217; associations, ones that I may have left out, and would not consider in writing.<\/strong><\/p>\n<h4><span style=\"text-decoration: underline;\"><strong>The Challenge<\/strong><\/span><\/h4>\n<p>I was<strong> dead set on<\/strong> adding images to this <strong>Twine<\/strong>. So I perused Google for <strong>tutorials, Reddit posts, YouTube videos, e<\/strong>tc.<\/p>\n<p>The first <a href=\"http:\/\/www.adamhammond.com\/twineguide\/\">tutorial<\/a> led me to believe that I needed to <strong>house the images<\/strong> on my computer in a file that contained both my <strong>HTML link to the story and a subfolder for images<\/strong>. If I didn&#8217;t do that, I <strong>would have to rely on images<\/strong> on the web. I didn&#8217;t really like that idea as <strong>I wouldn&#8217;t be citing them,<\/strong> so I decided to use pictures on my computer.<\/p>\n<p>Well, <strong>no matter how<\/strong> closely I<strong> watch the tutorial and followed the steps, I always got this:<\/strong><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-454 size-large\" src=\"https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/wrong1-scaled-e1633883135931-1024x865.jpg\" alt=\"\" width=\"700\" height=\"591\" srcset=\"https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/wrong1-scaled-e1633883135931-1024x865.jpg 1024w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/wrong1-scaled-e1633883135931-300x254.jpg 300w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/wrong1-scaled-e1633883135931-768x649.jpg 768w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/wrong1-scaled-e1633883135931-1140x964.jpg 1140w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/wrong1-scaled-e1633883135931-552x467.jpg 552w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/wrong1-scaled-e1633883135931.jpg 1363w\" sizes=\"auto, (max-width: 700px) 100vw, 700px\" \/><\/p>\n<p>Back to the<strong> drawing board.<\/strong> I found ANOTHER <a href=\"https:\/\/www.youtube.com\/watch?v=DRETz9wnOkk\">tutorial<\/a> by John Fry (2017) and this time, I was able to figure it out. Yes, <strong>I can use my own pictures, but I would have to upload them to my Google Drive<\/strong> and then use <a href=\"https:\/\/postimages.org\/\">postimages.com<\/a> to create a<strong> direct link for the photos<\/strong>. Once I did this and applied the <strong>proper code from the previous tutorial: &lt;img src=&#8230;. <\/strong>I FINALLY figured it out. <strong>(It took half a day, sad-but true).<\/strong><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-457 size-large aligncenter\" src=\"https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/postmedia1-scaled-e1633883401744-1024x653.jpg\" alt=\"\" width=\"700\" height=\"446\" srcset=\"https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/postmedia1-scaled-e1633883401744-1024x653.jpg 1024w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/postmedia1-scaled-e1633883401744-300x191.jpg 300w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/postmedia1-scaled-e1633883401744-768x490.jpg 768w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/postmedia1-scaled-e1633883401744-1536x980.jpg 1536w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/postmedia1-scaled-e1633883401744-2048x1307.jpg 2048w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/postmedia1-scaled-e1633883401744-1140x728.jpg 1140w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/postmedia1-scaled-e1633883401744-552x352.jpg 552w\" sizes=\"auto, (max-width: 700px) 100vw, 700px\" \/>\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0<img loading=\"lazy\" decoding=\"async\" class=\"wp-image-458 size-large aligncenter\" src=\"https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/right1-scaled-e1633883610692-992x1024.jpg\" alt=\"\" width=\"700\" height=\"723\" srcset=\"https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/right1-scaled-e1633883610692-992x1024.jpg 992w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/right1-scaled-e1633883610692-291x300.jpg 291w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/right1-scaled-e1633883610692-768x793.jpg 768w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/right1-scaled-e1633883610692-1140x1177.jpg 1140w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/right1-scaled-e1633883610692-552x570.jpg 552w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/right1-scaled-e1633883610692.jpg 1382w\" sizes=\"auto, (max-width: 700px) 100vw, 700px\" \/><\/p>\n<p><span style=\"text-decoration: underline;\"><strong>The Afterthought<\/strong><\/span><\/p>\n<p>Ok, so AFTER I completed the Twine, I had to go through it <strong>564746974 times<\/strong>. Why? because I <strong>didn&#8217;t proofread, check the paths, count the boxes, etc.<\/strong> I was also<strong> fearful I was going to lose the Twine<\/strong> even though I downloaded the desktop version. I was immediately drawn back to <strong>paper and pen<\/strong>, the trusty medium, to go over the whole thing. But then <b>I also took video of me going through the Twine as to\u00a0document<\/b> in another way (Also copying and pasting the story into Word). In other words, I ended up <strong>mocking up my story AFTER production.\u00a0<\/strong>I think Twine was so foreign to me that I wanted to rely on mediums <strong>I &#8216;trusted&#8217;.<\/strong><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-large wp-image-433 aligncenter\" src=\"https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/sock-3-1024x768.jpg\" alt=\"\" width=\"700\" height=\"525\" srcset=\"https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/sock-3-1024x768.jpg 1024w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/sock-3-300x225.jpg 300w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/sock-3-768x576.jpg 768w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/sock-3-1536x1152.jpg 1536w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/sock-3-1140x855.jpg 1140w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/sock-3-552x414.jpg 552w, https:\/\/blogs.ubc.ca\/alvesetec540\/files\/2021\/10\/sock-3.jpg 2016w\" sizes=\"auto, (max-width: 700px) 100vw, 700px\" \/><\/p>\n<p><span style=\"text-decoration: underline;\"><strong>Big Picture: Connection to Pedagogy and Constructivism\u00a0<\/strong><\/span><\/p>\n<p>Twine is interesting\u00a0 as it allows you to mimic the classic <strong>&#8220;choose your own adventure.&#8221;<\/strong>Now that I think about it, I think <strong>those books are so popular because the readers are given authority<\/strong> <strong>in a medium, (books)<\/strong> <strong>that are SO structured.<\/strong><\/p>\n<p>I teach Social Justice 12 and we recently had a Town Hall debate on Fracking in Northern BC. The town was imaginary,\u00a0 but the &#8220;perspectives&#8221; (Indigenous citizens, residents of the town, small business owners, environmentalists, etc) were real. Although this was a great activity, and <b>let everyone &#8216;hear&#8217; the perspectives&#8217; of others, using Twine would have been an amazing alternative.<\/b><\/p>\n<p><strong><span style=\"text-decoration: underline;\">Why<\/span>?<\/strong> Well, Twine makes &#8216;you&#8217; exist in <strong>a place and time<\/strong>&#8211; <strong>so you<\/strong> <strong><span style=\"text-decoration: underline;\">own<\/span> your own perspective<\/strong>. Yet, you also live vicariously through the associations, giving you insight and <strong>authority to the decisions that lay in front of these peoples<\/strong>. Bolter (2001) extends this point, &#8220;In following hypertextual links, the reader becomes conscious of the form or medium itself &#8221; (p.43). In essence, this &#8216;text&#8217; contains less bias, and become more objective.<\/p>\n<p>Englebart&#8217;s\u00a0 (1963) paper also made me connect <strong>hypertext to the learning theory, constructivism<\/strong>. Here he makes the point that &#8220;the human mind neither l<strong>earns nor acts by large leaps, but by steps organized or structured so that each one depends upon previous steps&#8221;<\/strong> (p.1). Therefore, hypertext &#8211; and the means of &#8216;making&#8217; story and learning do align with how I think learners construct knowledge. They do &#8216;add&#8217; to their constructs, similar to associations in twine and hypertext.<\/p>\n<p><strong>I&#8217;m excited to try using this next year!\u00a0<\/strong><\/p>\n<p><strong>References<\/strong><\/p>\n<p>Bolter, J. D. (2001). <em>Writing space: computers, hypertext, and the remediation of print<\/em>. New York, NY: Routledge.<\/p>\n<p>Englebart, D. (1963). &#8220;A conceptual framework for the augmentation of man&#8217;s intellect.&#8221;\u00a0 <em>Vistas in information handling, Volume I: The augmentation of man&#8217;s intellect by machine<\/em>. Washington, DC: Spartan Books.<\/p>\n<p>Fry, J. (2017, March 27).\u00a0<em> Twine- adding pictures\u00a0\u00a0<\/em>[Video]. YouTube. https:\/\/www.youtube.com\/watch?v=DRETz9wnOkk<\/p>\n<p>Hammond, A. (2018, March 24). <em>Adding images and music to your twine 2.1 game (SugarCube 2) <\/em>[Video]. YouTube. https:\/\/www.youtube.com\/watch?v=N_CRN9mLbUs<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p class=\"post-excerpt\">Twine:\u00a0 Ok, I hope this works! Both links (I included two hoping that one will work) should open a new&#8230;<\/p>\n","protected":false},"author":85698,"featured_media":412,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-411","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/blogs.ubc.ca\/alvesetec540\/wp-json\/wp\/v2\/posts\/411","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blogs.ubc.ca\/alvesetec540\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogs.ubc.ca\/alvesetec540\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogs.ubc.ca\/alvesetec540\/wp-json\/wp\/v2\/users\/85698"}],"replies":[{"embeddable":true,"href":"https:\/\/blogs.ubc.ca\/alvesetec540\/wp-json\/wp\/v2\/comments?post=411"}],"version-history":[{"count":34,"href":"https:\/\/blogs.ubc.ca\/alvesetec540\/wp-json\/wp\/v2\/posts\/411\/revisions"}],"predecessor-version":[{"id":485,"href":"https:\/\/blogs.ubc.ca\/alvesetec540\/wp-json\/wp\/v2\/posts\/411\/revisions\/485"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blogs.ubc.ca\/alvesetec540\/wp-json\/wp\/v2\/media\/412"}],"wp:attachment":[{"href":"https:\/\/blogs.ubc.ca\/alvesetec540\/wp-json\/wp\/v2\/media?parent=411"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogs.ubc.ca\/alvesetec540\/wp-json\/wp\/v2\/categories?post=411"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogs.ubc.ca\/alvesetec540\/wp-json\/wp\/v2\/tags?post=411"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}