{"id":54,"date":"2021-10-24T23:52:14","date_gmt":"2021-10-25T06:52:14","guid":{"rendered":"https:\/\/blogs.ubc.ca\/etec540jamesmartin\/?p=54"},"modified":"2021-10-27T02:17:31","modified_gmt":"2021-10-27T09:17:31","slug":"task-7-mode-bending","status":"publish","type":"post","link":"https:\/\/blogs.ubc.ca\/etec540jamesmartin\/2021\/10\/24\/task-7-mode-bending\/","title":{"rendered":"Task 7: Mode-Bending"},"content":{"rendered":"<p><strong>Play on itch.io<\/strong> (may take some time to load; may not work properly for all browsers and devices): <a href=\"https:\/\/etec565sdruids.itch.io\/mode-bending-whats-in-my-bag\"><strong>https:\/\/etec565sdruids.itch.io\/mode-bending-whats-in-my-bag<\/strong><\/a><\/p>\n<p>OR<\/p>\n<p>Download to run on your computer: <a href=\"https:\/\/blogs.ubc.ca\/etec540jamesmartin\/files\/2021\/10\/Archive.zip\"><strong>click here to download<\/strong><\/a><\/p>\n<p>&nbsp;<\/p>\n<p><strong><em>(please note that you will likely need to scroll <span style=\"text-decoration: underline;\">left-right<\/span> and <span style=\"text-decoration: underline;\">up-down<\/span> on your device to access all parts of this multimodal work)<\/em><\/strong><\/p>\n<p>&nbsp;<\/p>\n<p>To begin this project, I started by thinking about the original purpose of the \u201cWhat\u2019s In My Bag\u201d task: presenting the private contents of my bag in order to \u201cimplicitly prompt the viewer to begin to construct a narrative about\u201d me. The original task was entirely visual, with the contents of the photograph taking on the roles of texts to be interpreted by the viewer.<\/p>\n<p>In shifting modes, I wanted to see if I could re-imagine the ideas behind the intent of the original project without relying on the core visual element (and without re-introducing written language text\u2026 trying to convey meaning without any written language was a fun challenge from the previous task that I wanted to explore again here). I decided that I would represent the original images through emoji. To lend further context to each object\/representation, and to redesign the original \u201cglimpse of my private life\u201d aspect, I created audio clips meant to represent a combination of audio \u201csnapshots\u201d of my day and internal monologues made audible. To tie these audio clips to the emoji that represented the objects in my bag, I created an interface using Twine that the user can freely interact with to freely explore each object\/sound combination in any order.<\/p>\n<p>To organize these connections between digital pictographic symbols and audio clips, I introduced another Available Design that also allowed me to lend additional weight to the \u201cglimpse of my private life\u201d aspect of the design: the literacy or \u201cgrammar\u201d of a cartesian plane-style timeline (New London Group, 1996). With the x-axis labelled by time (using emoji that call upon the additional literacy of reading the face of an analogue clock), I was able to represent and chart each item\u2019s use or uses to specific times in the day. In cases where an item is used more than once, this created opportunities for me to connect multiple audio clips for the different instances of each item\u2019s use, creating additional context for the user as they use the representation of these items construct their understanding of who I am.<\/p>\n<p>The presentation of this timeline of emoji in a html file produced in twine invites the user to click on linked elements in the hypertext interface to interact with the \u201ctext\u201d in an order of their own choosing. In this way, the use of Twine and html helps to \u201ccreate patterns of meaning that are more or less predictable in their contexts\u201d (p.22), as the medium inherently suggests the active interactivity of the user that is required to \u201cread\u201d the text, rather than a more passive form of consumption.<\/p>\n<p>The biggest challenge I encountered when working on this task was ensuring that the organization of emoji stayed spatially organized relative to each other so as to not disrupt the precision necessary for the grid-coordinates system, which is important for that element to maintain its meaning. Originally I used pairs of emojis (and colour coding) to construct concepts such as &#8220;wallet&#8221; (credit card + folder) that do not have an obvious representation in the emoji character set, but I soon found that the thin columns that the grid is made from would often force the second character\u00a0 &#8220;wrap&#8221; down to the next line of text, displacing every other symbol in the column below.<\/p>\n<div id=\"attachment_62\" style=\"width: 838px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/blogs.ubc.ca\/etec540jamesmartin\/files\/2021\/10\/Screen-Shot-2021-10-25-at-12.57.14-AM.png\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-62\" class=\"wp-image-62 size-full\" src=\"https:\/\/blogs.ubc.ca\/etec540jamesmartin\/files\/2021\/10\/Screen-Shot-2021-10-25-at-12.57.14-AM.png\" alt=\"\" width=\"828\" height=\"406\" srcset=\"https:\/\/blogs.ubc.ca\/etec540jamesmartin\/files\/2021\/10\/Screen-Shot-2021-10-25-at-12.57.14-AM.png 828w, https:\/\/blogs.ubc.ca\/etec540jamesmartin\/files\/2021\/10\/Screen-Shot-2021-10-25-at-12.57.14-AM-300x147.png 300w, https:\/\/blogs.ubc.ca\/etec540jamesmartin\/files\/2021\/10\/Screen-Shot-2021-10-25-at-12.57.14-AM-768x377.png 768w, https:\/\/blogs.ubc.ca\/etec540jamesmartin\/files\/2021\/10\/Screen-Shot-2021-10-25-at-12.57.14-AM-500x245.png 500w\" sizes=\"auto, (max-width: 828px) 100vw, 828px\" \/><\/a><p id=\"caption-attachment-62\" class=\"wp-caption-text\">A screenshot of an early version of this task while it was in progress. In the 12:30 column, the laptop+charger character pair, dog+poop character pair, and coffee+barrel(mug) character pair are experiencing text wrapping that I did not desire. The black-line emoji seemed to address this issue, but it persisted after later design changes. The black line emoji were retained as they helped to reinforce the grid-like nature that was desired for the visual presentation.<\/p><\/div>\n<p><strong>References<\/strong><\/p>\n<p>The New London Group. (1996). A pedagogy of multiliteracies: Designing social futures. (Links to an external site.) Harvard Educational Review 66(1), 60-92.<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Play on itch.io (may take some time to load; may not work properly for all browsers and devices): https:\/\/etec565sdruids.itch.io\/mode-bending-whats-in-my-bag OR Download to run on your computer: click here to download &nbsp; (please note that you will likely need to scroll left-right and up-down on your device to access all parts of this multimodal work) &nbsp; [&hellip;]<\/p>\n","protected":false},"author":45787,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"gallery","meta":{"footnotes":""},"categories":[4],"tags":[],"class_list":["post-54","post","type-post","status-publish","format-gallery","hentry","category-tasks","post_format-post-format-gallery"],"_links":{"self":[{"href":"https:\/\/blogs.ubc.ca\/etec540jamesmartin\/wp-json\/wp\/v2\/posts\/54","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blogs.ubc.ca\/etec540jamesmartin\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogs.ubc.ca\/etec540jamesmartin\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogs.ubc.ca\/etec540jamesmartin\/wp-json\/wp\/v2\/users\/45787"}],"replies":[{"embeddable":true,"href":"https:\/\/blogs.ubc.ca\/etec540jamesmartin\/wp-json\/wp\/v2\/comments?post=54"}],"version-history":[{"count":6,"href":"https:\/\/blogs.ubc.ca\/etec540jamesmartin\/wp-json\/wp\/v2\/posts\/54\/revisions"}],"predecessor-version":[{"id":64,"href":"https:\/\/blogs.ubc.ca\/etec540jamesmartin\/wp-json\/wp\/v2\/posts\/54\/revisions\/64"}],"wp:attachment":[{"href":"https:\/\/blogs.ubc.ca\/etec540jamesmartin\/wp-json\/wp\/v2\/media?parent=54"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogs.ubc.ca\/etec540jamesmartin\/wp-json\/wp\/v2\/categories?post=54"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogs.ubc.ca\/etec540jamesmartin\/wp-json\/wp\/v2\/tags?post=54"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}