{"id":1252,"date":"2006-12-08T17:07:42","date_gmt":"2006-12-08T16:07:42","guid":{"rendered":"http:\/\/conclave.open.ac.uk\/guycarberry\/?p=138"},"modified":"2006-12-08T17:07:42","modified_gmt":"2006-12-08T16:07:42","slug":"my-stuff-design-progress","status":"publish","type":"post","link":"https:\/\/guycarberry.co.uk\/guyweb\/2006\/12\/08\/my-stuff-design-progress\/","title":{"rendered":"My Stuff &#8211; design progress"},"content":{"rendered":"<p><img decoding=\"async\" id=\"image137\" src=\"https:\/\/guycarberry.co.uk\/guyweb\/wp-content\/uploads\/2006\/12\/kuler.jpg\" alt=\"kuler\" \/><\/p>\n<p>Imagining that sometime soon the OU web colour pallette might be revised, improved and made more accessible, I&#8217;ve been playing with colour schemes using Adobe&#8217;s fantastic <a href=\"http:\/\/kuler.adobe.com\/\">Kuler web app<\/a>. Here I can select an OU brand colour and generate sympathic colours schemes from it. I then use a little artistic license to get semi-accessible colours to use in the design.<\/p>\n<p>Aside form the colour issues, I&#8217;ve also been working on the user experience a bit more. We&#8217;ve had the reports back from the focus group sessions and I&#8217;ve been using the information contain within to influence the direction of My Stuff.<\/p>\n<p><img decoding=\"async\" id=\"image139\" src=\"https:\/\/guycarberry.co.uk\/guyweb\/wp-content\/uploads\/2006\/12\/mystuff-orange.jpg\" alt=\"orange\" \/><\/p>\n<p>1 &#8211; This topbar colour scheme is simply not accessible. There&#8217;s not enough contrast between the foreground and background color. It&#8217;s a shame because the user group really like it. Partly becuase it&#8217;s so not like the Moodle sites they&#8217;ve seen and also because it&#8217;s  a nice warm colour. The second issue with this topbar is that the &#8216;new&#8217; button is confusing. Some people thought that it was a contextual button but it&#8217;s not. It takes you to the &#8216;new&#8217; screen full of options. So we&#8217;re getting rid of it.<\/p>\n<p>2 &#8211; As the screens become more obvious, there can be little need for contextual help in such a prominent way. This bar is therefore being rethought.<\/p>\n<p>3 &#8211; We have a graphic to replace the stock image now.<\/p>\n<p>4 &#8211; The guided tour is not prominent enough. We need to make it more of a feature for new users whilst subduing it more for regular users. We therefore need at least two realisations of the states of the homepage.<\/p>\n<p>5 &#8211; The meaning of these boxes needs re-evaluating. Plus &#8211; how do we scale this? There&#8217;s potential for many things like these to exist and if so, what effect will they have on the design?<\/p>\n<p>6 &#8211; These terms we found to be confusing and perhaps a bit of overkill for the homepage.<\/p>\n<p>Here are a few screens of todays progress with a little explanation.<\/p>\n<p><img decoding=\"async\" id=\"image136\" src=\"https:\/\/guycarberry.co.uk\/guyweb\/wp-content\/uploads\/2006\/12\/closeup-01.jpg\" alt=\"1\" \/><\/p>\n<p>The old homepage didnt really have any indication of recent activity. It was in my original wireframe but we removed it. I&#8217;ve put it back as i think that it could be a very useful way of getting to stuff you did recently without necessarily needing to have tagged it up. I guess using the old method you could have clicked the &#8216;uncategorised&#8217; tag, but this way you get to it directly from the homepage.<\/p>\n<p><img decoding=\"async\" id=\"image135\" src=\"https:\/\/guycarberry.co.uk\/guyweb\/wp-content\/uploads\/2006\/12\/closeup-02.jpg\" alt=\"2\" \/><\/p>\n<p>Add Stuff (formerly &#8216;New&#8217;) is made more prominent on the home so that we can quickly click an obvious button to get cracking with new stuff. The box metaphor is retained but we now have a graphic instead of a stock photo.<\/p>\n<p><img decoding=\"async\" id=\"image133\" src=\"https:\/\/guycarberry.co.uk\/guyweb\/wp-content\/uploads\/2006\/12\/closeup-03.jpg\" alt=\"3\" \/><\/p>\n<p>This is the footer &#8211; giving quick access on every page to My Stuff in various places.<\/p>\n<p><img decoding=\"async\" id=\"image132\" src=\"https:\/\/guycarberry.co.uk\/guyweb\/wp-content\/uploads\/2006\/12\/closeup-04.jpg\" alt=\"4\" \/><\/p>\n<p>Other stuff is a temporary label. Here we can get to our contacts and add new stuff from every page. The entire footer design is not developed enough yet &#8211; just sketches of ideas.<\/p>\n<p><img decoding=\"async\" id=\"image131\" src=\"https:\/\/guycarberry.co.uk\/guyweb\/wp-content\/uploads\/2006\/12\/closeup-05.jpg\" alt=\"5\" \/><\/p>\n<p>Kuler suggested this green. Looks ok i think. Not one I&#8217;d have chosen myself though!<\/p>\n<p><img decoding=\"async\" id=\"image130\" src=\"https:\/\/guycarberry.co.uk\/guyweb\/wp-content\/uploads\/2006\/12\/closeup-06.jpg\" alt=\"6\" \/><\/p>\n<p>When we visit the &#8216;new stuff&#8217; screen we get a simple quick form to add something non-specific, tag it up and even attach some files. The right hand column shown here allows us to get to more specific new stuff like CVs and whatnot.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/guycarberry.co.uk\/guyweb\/wp-content\/uploads\/2006\/12\/closeup-07.jpg\" alt=\"7\" \/><\/p>\n<p>The ever present tags. Rachel spoke to the user group today who were very positive about the predictive text method of adding tags.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/guycarberry.co.uk\/guyweb\/wp-content\/uploads\/2006\/12\/closeup-08.jpg\" alt=\"8\" \/><\/p>\n<p><img decoding=\"async\" id=\"image127\" src=\"https:\/\/guycarberry.co.uk\/guyweb\/wp-content\/uploads\/2006\/12\/closeup-09.jpg\" alt=\"9\" \/><\/p>\n<p>Contacts and sharing are a big task but im enjoying playing with a few ideas. This is the screen where you get to add contacts, assign them to groups and even add groups too. The idea is that some groups are non-negotiable. Like tutor groups &#8211; they would appear here and you&#8217;d not be able to delete or change them.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Imagining that sometime soon the OU web colour pallette might be revised, improved and made more accessible, I&#8217;ve been playing with colour schemes using Adobe&#8217;s fantastic Kuler web app. Here I can select an OU brand colour and generate sympathic colours schemes from it. I then use a little artistic license to get semi-accessible colours [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2,3],"tags":[4,19,31,83,87],"class_list":["post-1252","post","type-post","status-publish","format-standard","hentry","category-life","category-work","tag-accessibility","tag-eportfolio","tag-graphical-user-interface","tag-user-experience","tag-web-design"],"_links":{"self":[{"href":"https:\/\/guycarberry.co.uk\/guyweb\/wp-json\/wp\/v2\/posts\/1252"}],"collection":[{"href":"https:\/\/guycarberry.co.uk\/guyweb\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/guycarberry.co.uk\/guyweb\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/guycarberry.co.uk\/guyweb\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/guycarberry.co.uk\/guyweb\/wp-json\/wp\/v2\/comments?post=1252"}],"version-history":[{"count":0,"href":"https:\/\/guycarberry.co.uk\/guyweb\/wp-json\/wp\/v2\/posts\/1252\/revisions"}],"wp:attachment":[{"href":"https:\/\/guycarberry.co.uk\/guyweb\/wp-json\/wp\/v2\/media?parent=1252"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/guycarberry.co.uk\/guyweb\/wp-json\/wp\/v2\/categories?post=1252"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/guycarberry.co.uk\/guyweb\/wp-json\/wp\/v2\/tags?post=1252"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}