{"id":832,"date":"2014-09-09T01:30:02","date_gmt":"2014-09-09T01:30:02","guid":{"rendered":"http:\/\/www.rbknrbkn.com\/workandprogress\/?p=832"},"modified":"2014-09-10T00:12:40","modified_gmt":"2014-09-10T00:12:40","slug":"online-wayfinding-system-a-beginning","status":"publish","type":"post","link":"https:\/\/www.rbknrbkn.com\/workandprogress\/?p=832","title":{"rendered":"Online Wayfinding System, a beginning"},"content":{"rendered":"<h4>The Problem<\/h4>\n<p>The way we navigate online is complex, and is not as linear as your browser\u2019s \u201cback\u201d button would like you to believe.<\/p>\n<p>I believe that there is a missed opportunity in terms of enabling the user to get a sense of their location in terms of the context of the current browsing session, the content of the current page, and the various sections of the website as a whole.<\/p>\n<p>A typical use case is to search for a term, take a mental note of the relevant search results, choose one to visit at first, follow even more links in there, then go back to the original search results and repeat. Such a messy navigation situation can be improved using the same solution for its real-life counterpart: through the use of a well-designed map.<\/p>\n<h4>The\u00a0Proposed Solution<\/h4>\n<p>The management of a browsing session can be greatly simplified through a map that the user can visually access at all times, representing the current website trail as rooms, grouping of rooms, and so on. The locations and sizes of the rooms can be used to signify further information: the time spent there, the relation of this location to the other contexts of the website\/session, etc. Within each room, information about specific sections in the page can be added as peripheral visual elements.<\/p>\n<p>The utility of such map is two fold: as a navigational aid, as well as a visualization tool for the user\u2019s internet browsing habits.<\/p>\n<h4>The\u00a0User<\/h4>\n<p>The\u00a0user, to me, is one who uses the internet as a tool for information, whether in its academic form or for his or her entertainment.<\/p>\n<p>What I would like the user to feel using this product is clarity, organization, control, and whatever the opposite emotion of overwhelm is called.<\/p>\n<p>The user will be able, I hope, to do the following:<\/p>\n<ol>\n<li>Map their current user location according to the context of the browsing session, the current page, the entirety of the website, and possibly the internet.<\/li>\n<li>Annotate on the map on the various locations as a form of note-taking.<\/li>\n<li>Save sessions as \u201cmaps\u201d to recall and revisit.<\/li>\n<li>Share said maps through social media.<\/li>\n<\/ol>\n<h4>The\u00a0Challenges<\/h4>\n<p>In its essence, this project, to me, is about the difference between a graph and a map. The first is concerned with\u00a0connectivity, and optionally, the intensity of that connectivity, and that is all. What I aim to do is to provide a memorable sense of space and location. To achieve that, a sense of familiarity, distinctiveness, and consistency is what I hope I can achieve.<\/p>\n<p>Another challenge is scale. The number of webpages\u00a0that we visit daily is, I would say, at least 60. To allocate screen space to each, without intelligent abstraction decisions, can\u00a0compromise\u00a0the solution.<\/p>\n<h4>&#8220;Timeline&#8221;<\/h4>\n<p>The schedule that I have in mind is as follows:<\/p>\n<p>Week 1: Planning: defining the problem, start to think about the design considerations as well as the obvious implementations details.<\/p>\n<p>Weeks 2 \u2014 3: Develop a proof of concept Chrome extension that reads user history in the simplest form. This is just to feel assured that it is doable.<\/p>\n<p>Weeks 3 \u2014 4: Mockup, prototypes, paper interaction models. \u00a0Concept user testing.<\/p>\n<p>Weeks 5 \u2014 6: Add a simple visualization ability to the extension.<\/p>\n<p>Weeks 7 \u2014 8: Finalize visual design.<\/p>\n<p>Weeks 9 \u2014 11: Finish implementation. + User testing.<\/p>\n<p>Weeks 12 \u2014 14: User testing. + Finish implementation.<\/p>\n<h4>Goals<\/h4>\n<p>My goals for this project in the context of the Project Development Studio class are as follows:<\/p>\n<ol>\n<li>Develop a working prototype Chrome extension of the features outlined in the previous section as much as possible.<\/li>\n<li>Follow a sound design process that includes considerations for the user experience design.<\/li>\n<li>Learn more about and intelligently apply the sound principles of cartography and wayfinding.<\/li>\n<\/ol>\n<h4>Relevant Research Keywords<\/h4>\n<p>&nbsp;<\/p>\n<figure id=\"attachment_841\" aria-describedby=\"caption-attachment-841\" style=\"width: 150px\" class=\"wp-caption alignleft\"><a href=\"http:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/8514516312_6a72275ac5_z.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"size-thumbnail wp-image-841\" src=\"http:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/8514516312_6a72275ac5_z-150x150.jpg\" alt=\"Subjective mapping \" width=\"150\" height=\"150\" srcset=\"https:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/8514516312_6a72275ac5_z-150x150.jpg 150w, https:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/8514516312_6a72275ac5_z-260x260.jpg 260w\" sizes=\"auto, (max-width: 150px) 100vw, 150px\" \/><\/a><figcaption id=\"caption-attachment-841\" class=\"wp-caption-text\">Subjective mapping<\/figcaption><\/figure>\n<figure id=\"attachment_842\" aria-describedby=\"caption-attachment-842\" style=\"width: 150px\" class=\"wp-caption alignleft\"><a href=\"http:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/2847013324_9af9f449f8_z.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"size-thumbnail wp-image-842\" src=\"http:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/2847013324_9af9f449f8_z-150x150.jpg\" alt=\"Generative, topographical maps\" width=\"150\" height=\"150\" srcset=\"https:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/2847013324_9af9f449f8_z-150x150.jpg 150w, https:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/2847013324_9af9f449f8_z-260x260.jpg 260w\" sizes=\"auto, (max-width: 150px) 100vw, 150px\" \/><\/a><figcaption id=\"caption-attachment-842\" class=\"wp-caption-text\">Generative maps<\/figcaption><\/figure>\n<figure id=\"attachment_845\" aria-describedby=\"caption-attachment-845\" style=\"width: 150px\" class=\"wp-caption alignleft\"><a href=\"http:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/SOM_versus_GSOM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"size-thumbnail wp-image-845\" src=\"http:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/SOM_versus_GSOM-150x150.png\" alt=\"Self-organizing maps (growing)\" width=\"150\" height=\"150\" srcset=\"https:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/SOM_versus_GSOM-150x150.png 150w, https:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/SOM_versus_GSOM-260x260.png 260w\" sizes=\"auto, (max-width: 150px) 100vw, 150px\" \/><\/a><figcaption id=\"caption-attachment-845\" class=\"wp-caption-text\">Self-organizing maps<\/figcaption><\/figure>\n<figure id=\"attachment_846\" aria-describedby=\"caption-attachment-846\" style=\"width: 150px\" class=\"wp-caption alignleft\"><a href=\"http:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/1280px-Simple_Radial_Maze.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"size-thumbnail wp-image-846\" src=\"http:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/1280px-Simple_Radial_Maze-150x150.jpg\" alt=\"Spatial memory\" width=\"150\" height=\"150\" srcset=\"https:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/1280px-Simple_Radial_Maze-150x150.jpg 150w, https:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/1280px-Simple_Radial_Maze-260x260.jpg 260w\" sizes=\"auto, (max-width: 150px) 100vw, 150px\" \/><\/a><figcaption id=\"caption-attachment-846\" class=\"wp-caption-text\">Spatial memory<\/figcaption><\/figure>\n<figure id=\"attachment_847\" aria-describedby=\"caption-attachment-847\" style=\"width: 150px\" class=\"wp-caption alignleft\"><a href=\"http:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/415217872_3f62f6b26f_z.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"size-thumbnail wp-image-847\" src=\"http:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/415217872_3f62f6b26f_z-150x150.jpg\" alt=\"Game level design\" width=\"150\" height=\"150\" srcset=\"https:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/415217872_3f62f6b26f_z-150x150.jpg 150w, https:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/415217872_3f62f6b26f_z-260x260.jpg 260w\" sizes=\"auto, (max-width: 150px) 100vw, 150px\" \/><\/a><figcaption id=\"caption-attachment-847\" class=\"wp-caption-text\">Game level design<\/figcaption><\/figure>\n<figure id=\"attachment_849\" aria-describedby=\"caption-attachment-849\" style=\"width: 150px\" class=\"wp-caption alignleft\"><a href=\"http:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/4153404948_9cc6dbaf2f_z.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"size-thumbnail wp-image-849\" src=\"http:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/4153404948_9cc6dbaf2f_z-150x150.jpg\" alt=\"Wayfinding systems\" width=\"150\" height=\"150\" srcset=\"https:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/4153404948_9cc6dbaf2f_z-150x150.jpg 150w, https:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/4153404948_9cc6dbaf2f_z-260x260.jpg 260w\" sizes=\"auto, (max-width: 150px) 100vw, 150px\" \/><\/a><figcaption id=\"caption-attachment-849\" class=\"wp-caption-text\">Wayfinding systems<\/figcaption><\/figure>\n<figure id=\"attachment_850\" aria-describedby=\"caption-attachment-850\" style=\"width: 150px\" class=\"wp-caption alignleft\"><a href=\"http:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/1941618831_01f1b5935a_z.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"size-thumbnail wp-image-850\" src=\"http:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/1941618831_01f1b5935a_z-150x150.jpg\" alt=\"Urban planning\" width=\"150\" height=\"150\" srcset=\"https:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/1941618831_01f1b5935a_z-150x150.jpg 150w, https:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/1941618831_01f1b5935a_z-260x260.jpg 260w\" sizes=\"auto, (max-width: 150px) 100vw, 150px\" \/><\/a><figcaption id=\"caption-attachment-850\" class=\"wp-caption-text\">Urban planning<\/figcaption><\/figure>\n<figure id=\"attachment_851\" aria-describedby=\"caption-attachment-851\" style=\"width: 150px\" class=\"wp-caption alignleft\"><a href=\"http:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/3851589558_35f8bc1c7f_o.png\"><img loading=\"lazy\" decoding=\"async\" class=\"size-thumbnail wp-image-851\" src=\"http:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/3851589558_35f8bc1c7f_o-150x150.png\" alt=\"Subway map design\" width=\"150\" height=\"150\" srcset=\"https:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/3851589558_35f8bc1c7f_o-150x150.png 150w, https:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/3851589558_35f8bc1c7f_o-260x260.png 260w\" sizes=\"auto, (max-width: 150px) 100vw, 150px\" \/><\/a><figcaption id=\"caption-attachment-851\" class=\"wp-caption-text\">Subway map design<\/figcaption><\/figure>\n<figure id=\"attachment_852\" aria-describedby=\"caption-attachment-852\" style=\"width: 150px\" class=\"wp-caption alignleft\"><a href=\"http:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/4881205863_c0411aa27b_z.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"size-thumbnail wp-image-852\" src=\"http:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/4881205863_c0411aa27b_z-150x150.jpg\" alt=\"Graph theory\" width=\"150\" height=\"150\" srcset=\"https:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/4881205863_c0411aa27b_z-150x150.jpg 150w, https:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/4881205863_c0411aa27b_z-260x260.jpg 260w\" sizes=\"auto, (max-width: 150px) 100vw, 150px\" \/><\/a><figcaption id=\"caption-attachment-852\" class=\"wp-caption-text\">Graph theory<\/figcaption><\/figure>\n<figure id=\"attachment_848\" aria-describedby=\"caption-attachment-848\" style=\"width: 150px\" class=\"wp-caption alignleft\"><a href=\"http:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/6331225797_c659a9230f_z.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"size-thumbnail wp-image-848\" src=\"http:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/6331225797_c659a9230f_z-150x150.jpg\" alt=\"Data visualisation \" width=\"150\" height=\"150\" srcset=\"https:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/6331225797_c659a9230f_z-150x150.jpg 150w, https:\/\/www.rbknrbkn.com\/workandprogress\/wp-content\/uploads\/2014\/09\/6331225797_c659a9230f_z-260x260.jpg 260w\" sizes=\"auto, (max-width: 150px) 100vw, 150px\" \/><\/a><figcaption id=\"caption-attachment-848\" class=\"wp-caption-text\">Data visualisation<\/figcaption><\/figure>\n<p>&nbsp;<\/p>\n<h4><\/h4>\n","protected":false},"excerpt":{"rendered":"<p>The Problem The way we navigate online is complex, and is not as linear as your browser\u2019s \u201cback\u201d button would like you to believe. I believe that there is a missed opportunity in terms of enabling the user to get a sense of their location in terms of the context of the current browsing session, [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":864,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5,27],"tags":[],"class_list":["post-832","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-itp","category-project-development-studio"],"_links":{"self":[{"href":"https:\/\/www.rbknrbkn.com\/workandprogress\/index.php?rest_route=\/wp\/v2\/posts\/832","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.rbknrbkn.com\/workandprogress\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rbknrbkn.com\/workandprogress\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rbknrbkn.com\/workandprogress\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rbknrbkn.com\/workandprogress\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=832"}],"version-history":[{"count":10,"href":"https:\/\/www.rbknrbkn.com\/workandprogress\/index.php?rest_route=\/wp\/v2\/posts\/832\/revisions"}],"predecessor-version":[{"id":894,"href":"https:\/\/www.rbknrbkn.com\/workandprogress\/index.php?rest_route=\/wp\/v2\/posts\/832\/revisions\/894"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.rbknrbkn.com\/workandprogress\/index.php?rest_route=\/wp\/v2\/media\/864"}],"wp:attachment":[{"href":"https:\/\/www.rbknrbkn.com\/workandprogress\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=832"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rbknrbkn.com\/workandprogress\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=832"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rbknrbkn.com\/workandprogress\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=832"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}