{"id":74,"date":"2010-07-08T12:52:29","date_gmt":"2010-07-08T20:52:29","guid":{"rendered":"https:\/\/blogs.ubc.ca\/wikigarden\/?p=74"},"modified":"2017-06-20T14:27:00","modified_gmt":"2017-06-20T22:27:00","slug":"wayfinding-on-the-wiki","status":"publish","type":"post","link":"https:\/\/blogs.ubc.ca\/open\/2010\/07\/08\/wayfinding-on-the-wiki\/","title":{"rendered":"Wayfinding on the Wiki"},"content":{"rendered":"<p><a href=\"http:\/\/en.wikipedia.org\/wiki\/Wayfinding\">Wayfinding<\/a>, as  Wikipedia succinctly summarizes it, refers to the user experience of  orientation and choosing a path within the built environment and to the  set of architectural and\/or design elements that aid in that  orientation.  While signage is an important aspect of wayfinding,  wayfinding principles should also be part of the structure of an  environment, whether that environment is informational or physical. A  classic, if not somewhat simplified example of wayfinding in the real  world, is when hospitals colour code their separate wards, so that  pediatrics might have blue walls while neurology has green.  A person  visiting the pediatric ward who turns a corner and finds themselves in a  green hall should intuitively understand that they have gone the wrong  way.<\/p>\n<p>One of the clear issues on the UBC Wiki is that users do not necessarily grasp that there are separate namespaces for different types of content and thus get &#8220;lost&#8221; when adding new pages. To try make this structural division more intuitive, wayfinding tools can be built into the site structure. One easy method is to follow the hospital example and do a slight bit of colour coding. To this end, on the main page of the wiki, I took the text description of the different namespaces and put them into coloured boxes:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-76\" title=\"Screen shot 2010-07-09 at 8.57.44 AM\" src=\"https:\/\/blogs.ubc.ca\/open\/files\/2010\/07\/Screen-shot-2010-07-09-at-8.57.44-AM1.png\" alt=\"\" width=\"520\" height=\"148\" srcset=\"https:\/\/blogs.ubc.ca\/open\/files\/2010\/07\/Screen-shot-2010-07-09-at-8.57.44-AM1.png 576w, https:\/\/blogs.ubc.ca\/open\/files\/2010\/07\/Screen-shot-2010-07-09-at-8.57.44-AM1-300x85.png 300w\" sizes=\"auto, (max-width: 520px) 100vw, 520px\" \/><\/p>\n<p>I then repeated the colours on the homepages for the <a href=\"http:\/\/wiki.ubc.ca\/Course\">Course<\/a> and <a href=\"http:\/\/wiki.ubc.ca\/Documentation\">Documentation<\/a> spaces to reinforce the idea that, just like different wards in the hospital, these are different areas with slightly different purposes.\u00a0 I don&#8217;t think too much colour is necessary, but a little might help users understand the site better.<\/p>\n<p>I&#8217;ve also begun experimenting with how &#8220;signage&#8221; can be used on the wiki.\u00a0 For example, I&#8217;ve begun putting book icons on pages related to <a href=\"http:\/\/wiki.ubc.ca\/UBC_Wiki_Books\">Wiki Books<\/a>.\u00a0 Right now I two different versions &#8211; A small, relatively unobtrusive sign:<\/p>\n<p><a href=\"https:\/\/blogs.ubc.ca\/open\/files\/2010\/07\/Screen-shot-2010-07-09-at-10.18.41-AM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-82\" title=\"Small Book Sign\" src=\"https:\/\/blogs.ubc.ca\/open\/files\/2010\/07\/Screen-shot-2010-07-09-at-10.18.41-AM.png\" alt=\"\" width=\"115\" height=\"112\" \/><\/a><\/p>\n<p>And a larger banner that stretches across the page (reduced in size here to make it fit on the blog):<\/p>\n<p><a href=\"https:\/\/blogs.ubc.ca\/open\/files\/2010\/07\/Screen-shot-2010-07-09-at-10.31.06-AM.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-86\" title=\"BookSignBanner\" src=\"https:\/\/blogs.ubc.ca\/open\/files\/2010\/07\/Screen-shot-2010-07-09-at-10.31.06-AM.png\" alt=\"\" width=\"460\" height=\"57\" \/><\/a><\/p>\n<p>I think that both signs call attention to the book creator and help users find it better than just a link would.\u00a0 It is my hope that by including wayfinding elements into the UBC Wiki, users have a better understanding of both the structure of the wiki and some of its features.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Wayfinding, as Wikipedia succinctly summarizes it, refers to the user experience of orientation and choosing a path within the built environment and to the set of architectural and\/or design elements that aid in that orientation. While signage is an important aspect of wayfinding, wayfinding principles should also be part of the structure of an environment, [&hellip;]<\/p>\n","protected":false},"author":1719,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[92],"tags":[9146,9144,71536,9069,9145,9143],"class_list":["post-74","post","type-post","status-publish","format-standard","hentry","category-wiki","tag-book-creator","tag-colour","tag-coop","tag-namespaces","tag-signage","tag-wayfinding"],"_links":{"self":[{"href":"https:\/\/blogs.ubc.ca\/open\/wp-json\/wp\/v2\/posts\/74","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blogs.ubc.ca\/open\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogs.ubc.ca\/open\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogs.ubc.ca\/open\/wp-json\/wp\/v2\/users\/1719"}],"replies":[{"embeddable":true,"href":"https:\/\/blogs.ubc.ca\/open\/wp-json\/wp\/v2\/comments?post=74"}],"version-history":[{"count":1,"href":"https:\/\/blogs.ubc.ca\/open\/wp-json\/wp\/v2\/posts\/74\/revisions"}],"predecessor-version":[{"id":954,"href":"https:\/\/blogs.ubc.ca\/open\/wp-json\/wp\/v2\/posts\/74\/revisions\/954"}],"wp:attachment":[{"href":"https:\/\/blogs.ubc.ca\/open\/wp-json\/wp\/v2\/media?parent=74"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogs.ubc.ca\/open\/wp-json\/wp\/v2\/categories?post=74"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogs.ubc.ca\/open\/wp-json\/wp\/v2\/tags?post=74"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}