<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Abstract Sequential &#187; ux</title>
	<atom:link href="http://stephaniehobson.ca/wordpress/tag/ux/feed/" rel="self" type="application/rss+xml" />
	<link>http://stephaniehobson.ca/wordpress</link>
	<description>You make it pretty - I make it work.</description>
	<lastBuildDate>Thu, 03 Jun 2010 18:23:18 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.2</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Bookstore wins a hubbie</title>
		<link>http://stephaniehobson.ca/wordpress/2008/04/16/bookstore-wins-a-hubbie/</link>
		<comments>http://stephaniehobson.ca/wordpress/2008/04/16/bookstore-wins-a-hubbie/#comments</comments>
		<pubDate>Wed, 16 Apr 2008 23:15:10 +0000</pubDate>
		<dc:creator>Stephanie</dc:creator>
				<category><![CDATA[webdesign]]></category>
		<category><![CDATA[accomplishment]]></category>
		<category><![CDATA[bcit]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[excited]]></category>
		<category><![CDATA[uh-oh]]></category>
		<category><![CDATA[ux]]></category>
		<category><![CDATA[web design]]></category>

		<guid isPermaLink="false">http://stephaniehobson.ca/2008/04/16/bookstore-wins-a-hubbie/</guid>
		<description><![CDATA[Almost a year ago now the BCIT Bookstore let Web Services know that the e-commerce application they used to manage their online sales [...]]]></description>
			<content:encoded><![CDATA[<p>Almost a year ago now the <a href="http://bcitbookstore.ca">BCIT Bookstore</a> let Web Services know that the e-commerce application they used to manage their online sales was upgrading and asked if we&#8217;d like to help skin the new site.  The department was pretty busy at the time and my Manager said we didn&#8217;t have time to help out but put them in contact with me so I could direct them to the style guide and technical guidelines.</p>
<p>I had a look at the application and decided we could do better than that so I asked my Manager if I could do some follow up and he said it was okay as long as it didn&#8217;t interfear with my other work.</p>
<p>I met with the Bookstore intending only to talk about the web app but ended up talking about their static store front just as much.  Because of the way their inventory and software work they have not one but three online stores and they have trouble communicating the difference to their customers.  They also felt like some of their most important information, like their return policy, was buried.</p>
<p>Skinning the e-commerce sites was relatively easy.  The new version of the application was set up logically with good CSS tags and lots of includes.  Not only that, the default layout was very easy to transform into the existing template I wanted to mimic.</p>
<div style="float: left; margin-right: 50px">I started off with this:<br />
<a title="Larger version." href="http://www.flickr.com/photos/11418280@N03/1116075730/"><img width="240" height="200" alt="BCIT Bookstore Store - Original" src="http://farm2.static.flickr.com/1179/1116075730_839befe5ce_m.jpg" /></a></div>
<div>And created this:<br />
<a title="Larger version." href="http://www.flickr.com/photos/11418280@N03/1116007176/"><img width="240" height="191" alt="Bookstore Store - New Version" src="http://farm2.static.flickr.com/1419/1116007176_a917fb2c71_m.jpg" /></a></div>
<p style="clear: left; margin-top: 20px">
<p>For the static store front I made some changes to the left navigation based on the most desired pages, created three clear calls to action, placed the catch all action at the bottom of the list instead of the top of the list of options, and separated the two  unrelated messages contained in the single page block on the right.</p>
<div style="float: left; margin-right: 50px">
<a title="Larger version." href="http://www.flickr.com/photos/11418280@N03/1115949204/"><img width="240" height="195" alt="Original BCIT Bookstore" src="http://farm2.static.flickr.com/1049/1115949204_e8209acdf2_m.jpg" /></a></div>
<div><a title="Larger version." href="http://www.flickr.com/photos/11418280@N03/1115948514/"><img width="240" height="204" alt="BCIT Bookstore with some touch ups" src="http://farm2.static.flickr.com/1397/1115948514_49cb7a9b31_m.jpg" /></a></div>
<p>I worked off the side of my desk for a few months on it, meeting with the bookstore a few times, and when I was done they were happy enough with the results to email my manager and thank me in the Campus Update newsletter!</p>
<p>My manger called me into his office to talk about it and I thought, &#8220;Uh-oh, what if he&#8217;s upset I spent so much time working on this?&#8221; But I worried unnecessarily since he proceeded to tell me how it was good interacting design :)</p>
<p>Campus Hub, the third party company who hosts the actual stores liked it so much they&#8217;ve been directing people who want to skin their stores to talk to me for advice, and to top it all off, <a href="http://www.bcit.ca/news/events/event04180800000001.shtml">they awarded the store with a &#8220;Hubbie&#8221; for usability</a>.</p>
]]></content:encoded>
			<wfw:commentRss>http://stephaniehobson.ca/wordpress/2008/04/16/bookstore-wins-a-hubbie/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>No, wait, I wasn&#8217;t done reading that!</title>
		<link>http://stephaniehobson.ca/wordpress/2007/08/12/no-wait-i-wasnt-done-reading-that/</link>
		<comments>http://stephaniehobson.ca/wordpress/2007/08/12/no-wait-i-wasnt-done-reading-that/#comments</comments>
		<pubDate>Sun, 12 Aug 2007 08:23:34 +0000</pubDate>
		<dc:creator>Stephanie</dc:creator>
				<category><![CDATA[webdesign]]></category>
		<category><![CDATA[Google]]></category>
		<category><![CDATA[oops]]></category>
		<category><![CDATA[uh-oh]]></category>
		<category><![CDATA[undo]]></category>
		<category><![CDATA[ux]]></category>

		<guid isPermaLink="false">http://stephaniehobson.ca/2007/08/12/no-wait-i-wasnt-done-reading-that/</guid>
		<description><![CDATA[When I went on vacation a few weeks ago I got a little behind on my RSS feeds.  I&#8217;d manage to whittle [...]]]></description>
			<content:encoded><![CDATA[<p>When I went on vacation a few weeks ago I got a little behind on my RSS feeds.  I&#8217;d manage to whittle it down from almost 200 unread articles to about 40 over the course of the month, while keeping up with all the new articles, and I was feeling pretty good about it when I went to switch my view from new items to all items and hit &#8220;mark all as read&#8221; instead.</p>
<p>Noooooooooooo!</p>
<p>This is an unrecoverable error. There&#8217;s no undo and there&#8217;s no way to mark an article more than a certain number of days (30?) old as unread again even if I open it individually.</p>
<p>A quick visit to the Reader group confirms that I&#8217;m not crazy and I&#8217;m not the only one who has done this.</p>
<p>What gives Google?</p>
]]></content:encoded>
			<wfw:commentRss>http://stephaniehobson.ca/wordpress/2007/08/12/no-wait-i-wasnt-done-reading-that/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Forming form guidelines</title>
		<link>http://stephaniehobson.ca/wordpress/2007/06/04/forming-form-guidelines/</link>
		<comments>http://stephaniehobson.ca/wordpress/2007/06/04/forming-form-guidelines/#comments</comments>
		<pubDate>Tue, 05 Jun 2007 00:36:49 +0000</pubDate>
		<dc:creator>Stephanie</dc:creator>
				<category><![CDATA[webdesign]]></category>
		<category><![CDATA[bcit]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[firefox]]></category>
		<category><![CDATA[guidelines]]></category>
		<category><![CDATA[nervous]]></category>
		<category><![CDATA[ux]]></category>
		<category><![CDATA[web standards]]></category>

		<guid isPermaLink="false">http://stephaniehobson.ca/?p=31</guid>
		<description><![CDATA[Who knew web design could be so&#8230; academic?
Since I got back from @media I&#8217;ve been hard at work on a set of guidelines [...]]]></description>
			<content:encoded><![CDATA[<p>Who knew web design could be so&#8230; academic?</p>
<p>Since I got back from @media I&#8217;ve been hard at work on a set of guidelines which ideally will one day guide the interaction and styling of all forms on the myriad of BCIT web applications though right now will only be applied to anything in the &#8216;public web&#8217; look and feel.  I don&#8217;t think I&#8217;ve done this much research since I finished university.</p>
<p>Here&#8217;s a bit more information on my quibble with FireFox:<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=269908"> the bug report and ensuing argument</a>.  Some one who knows what they&#8217;re doing should probably read the CSS3 proposals to see if this can be avoided in the future.<br />
Also, sadly, I&#8217;m down to my last two chocolates from See&#8217;s in San Francisco.</p>
]]></content:encoded>
			<wfw:commentRss>http://stephaniehobson.ca/wordpress/2007/06/04/forming-form-guidelines/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Web Directions North</title>
		<link>http://stephaniehobson.ca/wordpress/2007/04/04/web-directions-north/</link>
		<comments>http://stephaniehobson.ca/wordpress/2007/04/04/web-directions-north/#comments</comments>
		<pubDate>Wed, 04 Apr 2007 22:11:08 +0000</pubDate>
		<dc:creator>Stephanie</dc:creator>
				<category><![CDATA[webdesign]]></category>
		<category><![CDATA[ajax]]></category>
		<category><![CDATA[bcit]]></category>
		<category><![CDATA[big picture]]></category>
		<category><![CDATA[learning]]></category>
		<category><![CDATA[microformats]]></category>
		<category><![CDATA[ux]]></category>
		<category><![CDATA[WDN]]></category>
		<category><![CDATA[web standards]]></category>
		<category><![CDATA[work]]></category>

		<guid isPermaLink="false">http://stephaniehobson.ca/?p=13</guid>
		<description><![CDATA[I thought I&#8217;d post my summary of Web Directions North that I distributed to the department a month or so after the conference. [...]]]></description>
			<content:encoded><![CDATA[<p>I thought I&#8217;d post my summary of Web Directions North that I distributed to the department a month or so after the conference.  I&#8217;ve been wanting to write a more technical and personal review of it but it&#8217;s pretty clear to me that if I haven&#8217;t done it by now, I&#8217;m not going to get around to doing it :)</p>
<p><span id="more-13"></span>Web Directions North is an international conference for people who work with the web, from project managers to web programmers to web designers. This year it was hosted in Vancouver and a few of us jumped at the opportunity to go and were grateful to have the department&#8217;s support.</p>
<p>The conference covered a good balance of theoretical big thinking ideas and practical hands on code ideas and we were fortunate to come home with both things to work towards in the long run and ideas that could be implemented immediately.</p>
<p>These are a few of the &#8220;big picture&#8221; ideas that stood out to us:</p>
<ul>
<li><strong>User Experience</strong> – It&#8217;s the difference between making a website as popular as the SunDisk Sansa MP3 player and making a website as popular as the iPod. Many of the speakers talked about the ways they integrate user experience design and testing into their work early in the project process and what a huge positive impact it has had on their websites.</li>
<li><strong>Web Standards</strong> – All the presenters were strong advocates of web standards. They also argued against the idea that all a website needs to meet standards is to be well coded. In their eyes a website with standards has <em>high</em> standards – it should also be accessible, backwards compatible, built using the principles of progressive enhancement, semantic, and have good user experience.</li>
<li><strong>Ajax </strong>– There was a lot of discussion about Ajax, what it is, why it has become popular, and where and how to best use it. It was advocated that sites should be built to function perfectly without Ajax and Ajax can be added after to enhance user experience. There were also some user experience issues identified with using Ajax and some solutions proposed.</li>
</ul>
<p>These ideas touch on difference skill sets and the presenters who talked about project management felt that the ideal web team would consist of a mix of individuals with skills that cross the disciplines of development, design, usability, and content. This structure keeps the team nimble, and promotes rapid prototyping for continuous improvement.</p>
<p>It&#8217;s rare that a conference provides information you can act on the next day when you sit back down at you desk but these are ideas we found immediately useful:</p>
<ul>
<li><strong>Microformats </strong>– <a href="http://microformats.org/">Microformats</a> are a standardized way to add CSS to XHTML to code standardized information such as addresses and events so that programs such as address books and calendars can import them with a single click if you have a newer browser or the right plugins. The contacts application (<a href="http://www.bcit.ca/contacts">bcit.ca/contacts</a>) has been rewritten to use microformats and the new version launched March 6<sup>th</sup>!</li>
<li><strong>Mashups</strong> – A mashup is when part of a website is integrated into another website. You might have seen a Google Maps mashup like this one: <a href="http://blogs.bcit.ca/catttrax2/journey/route">http://blogs.bcit.ca/catttrax2/journey/route</a>.  One of the sessions covered what&#8217;s involved in beginning a mashup and now a campus map mashup is on the way!</li>
<li><strong>Progressive Enhancement</strong> – This is a &#8220;big idea&#8221; about how to code and a shift from the old concept of &#8220;graceful degradation&#8221;. The suggestion is that content should be written first and then semantic code, presentation, and behavior should be added on top of it in layers so that the core content is still accessible and intelligible if it is accessed without the presentation and behavior layers. The contacts application was rewritten using the principles of progressive enhancement; check it out with JavaScript or CSS turned off!</li>
</ul>
<p>If you&#8217;re interested in learning more about any of these ideas the presentation summaries and notes are available on the <a href="http://north.webdirections.org/wdn07-resources/">Web Directions North</a> website or you can talk to Brandon, Alan or me :)</p>
]]></content:encoded>
			<wfw:commentRss>http://stephaniehobson.ca/wordpress/2007/04/04/web-directions-north/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
	</channel>
</rss>
