~ Mathew Sanders – Professional Freelance Interaction Design & Strategy ~
Home | What people are saying | About Mathew Sanders | Prices | Availability & Contact
SERVICES   Webpage Refresh | Expert Review | Wireframe Design BLOG   Nice Touchpoints Only

Woolworths Website Search Redesign

November 21st, 2009
Yesterday I watched my friend’s mum who wanted to check some prices for products on the Woolworths/Countdown website.
After helping her with the first barrier to browsing the website (which is having to select your suburb so that accurate prices can be displayed) she was confused about where to go to find products.
There are three main pathways to display products, browsing aisles, searching for items, and using the ‘quick list’.
I found the search process particularly frustrating because before seeing a list of matching products, you have to choose a single ’shelf’ that products are categorised by, which seems to me a completely unnecessary step. Why not just show a unique list of all products that match the search term?
So I sat down and spent some time sketching out a few rough ideas then made the created the following concept for a search results page.
This concept hints at a few significant changes from the current design.
Search focused
Search is promoted as the main method of finding products. Instead of navigating down a hierarchy of departments, aisles, and shelf as the current website requires (or any other categorisation), this concept requires people to use keywords to search for matching products.
Dynamic filtering
This may lead to a wider range of items in the search results and so aisle categorisations can then be used as a way to filter search results.
Current order not displayed
The current design shows a side bar with the current order. As the size of the order increases only a portion of the current order is shown at any single time. Instead of trying to fit this onto the current page I’ve opted to having a dedicated page for viewing and modifying the contents of the current order.
Cross sell
An experience that the current website fails to capture from shopping in-store is the ability to be exposed to store specials are you’re browsing the aisles. The current website does include some banner advertising to promote specific products but they are limited. Instead this concept suggests cross-sell by dynamically displaying featured products from nearby product families of the current search result. In the sample concept someone has searched for hummus, but a special for aioli is also shown.
Overall this is only a quick concept, but likely misses some key business or technological challenges or objectives that come with supermarket e-commerce, but it was something that I had some fun with this afternoon, I think that a supermarket website would be a fun project to be involved with!
What are your frustrations with supermarket websites? What ideas would you like to see supermarkets implement online?

Yesterday I watched my friend’s mum who wanted to check some prices for products on the Woolworths/Countdown website.

After helping her with the first barrier to browsing the website (which is having to select your suburb so that accurate prices can be displayed) she was confused about where to go to find products.

There are three main pathways to display products, browsing aisles, searching for items, and using the ‘quick list’.

I found the search process particularly frustrating because before seeing a list of matching products, you have to choose a single ’shelf’ that products are categorised by, which seems to me a completely unnecessary step. Why not just show a unique list of all products that match the search term?

So I sat down and spent some time sketching out a few rough ideas then made the created a concept for a search results page which hints at a few significant changes from the current design…

Download the concept (1 page, PDF, 578 KB) or see some highlights below.

Search focused

Search is promoted as the main method of finding products. Instead of navigating down a hierarchy of departments, aisles, and shelf as the current website requires (or any other categorisation), this concept requires people to use keywords to search for matching products.

Dynamic filtering

This may lead to a wider range of items in the search results and so aisle categorisations can then be used as a way to filter search results.

Current order details not displayed

The current design shows a side bar with the current order. As the size of the order increases only a portion of the current order is shown at any single time. Instead of trying to fit this onto the current page I’ve opted to having a dedicated page for viewing and modifying the contents of the current order.

Cross sell

An experience that the current website fails to capture from shopping in-store is the ability to be exposed to store specials are you’re browsing the aisles. The current website does include some banner advertising to promote specific products but they are limited. Instead this concept suggests cross-sell by dynamically displaying featured products from nearby product families of the current search result. In the sample concept someone has searched for hummus, but a special for aioli is also shown.

Overall this is only a quick concept, but likely misses some key business or technological challenges or objectives that come with supermarket e-commerce, but it was something that I had some fun with this afternoon, I think that a supermarket website would be a fun project to be involved with!

What are your frustrations with supermarket websites? What ideas would you like to see supermarkets implement online?

Tags: , , ,
Posted in Uncategorized | No Comments »

Redesigning Wikipedia #1

September 1st, 2009

A common theme in Wikimania 2009 was concern that participation in Wikipedia is plateaued, or perhaps even decreasing. Andrew Lih gave a great talk that Wikipedia’s early phenomenal growth was probably a ‘catching up’ phase, and now growth will continue at a slower, but steady rate.

Phew!

But even so, it’s recognised that with only a small percentage of people contributing changes, that there could be improvements made to encourage people to edit. Many people are not even aware that Wikipedia *can* be edited. I don’t think that these problems with participation are only interface problems, I think it lies deeper in the culture of how newbie editors are integrated into the Wikipedia community, and the policy and procedure that people encounter when they start to become involved with Wikipedia.

In anycase, I couldn’t help but quickly mock up some wireframes that demonstrate some alternative ideas to the Wikimania article page.

Here is a quick screenshot of a current Wikipedia article page, followed by my wireframe, you can also download a more detailed PDF of the wireframes.

Wikipedia article page design, now & proposed changes…

The banner

One of the first things that Philippe asked me was: are you familiar with our [Wikimedia's] sites? And I replied — sure I use Wikipedia everyday. What completely slipped my mind was that there is actually a family of Wikimedia project websites, with Wikipedia being just one (albeit a very important one).

With this in mind I’ve added a Wikimedia family navigation at the banner of the page that joins the family of sites together and helps promote the range of Wikimedia projects. At this same level is a search field which ideally would be a entry point into a federated search of all Wikimedia project content with filters to help people narrow down results to exactly what they are looking for. (I would loooove to get my teeth into designing those pages!)

Quite a lot of navigation is condensed, opting for mega-menus to show pathways to different special pages on Wikipedia under headings Find Content, Contribute, and Tools.

Those famous tabs

The most contentious change is a move away from the all-familiar, even emblematic read/edit tabs that appear along the top of each page. Instead these have been moved to action boxes on the left side of the page where they are presented with additional context (because what does discuss really mean?) and where a local navigation for sections within the article would also be displayed.

Quick edits

Instead of navigating away to a brand new page (which for many people I image can be quite a shock) a lightbox allows for a quick edit of a section of content. Hopefully this lowers the barrier to editing by making it seem like they are essentially still on a familiar page – and eases people into the process of learning the wiki markup.

Download PDF (2 pages, 604 KB)

Tags: , , ,
Posted in Uncategorized | 2 Comments »

Wikimania 2009 and where have all the intellectuals gone?

September 1st, 2009

Wikimania 2009

Serendipity at it’s best, I went to Wikimania last week. I had no idea it was being held in Buenos Aires this year, but as fortune has it, we’re both in the same city at the same time. Wikipedia is also at a stage of plateaued growth and entering stages of redesign to improve usability & participation, and also strategy development.

As an editor, I’m a Wikipedia novice, I’ve made only a handful of edits in the past few years, and to be honest, I felt like an outsider in an already well established community. However, serendipity working again, I got the chance to meet and talk over lunch and drinks with Philippe Beaudette, newly appointed facilitator of strategic planning at Wikimedia, and I’ve become interested in being more involved in this community, perhaps in areas of strategy, or design, or both.

Something that fascinates me is what appears to be collaboration happening at every level of the organisation. For instance, even in the development of a strategy, participation is open to anyone — anyone that is who can understand the bureaucracy required to be involved. It will be fascinating, hopefully to participate but even as an observer, to see how collaboration works at this level.

The quality of the talks at Wikimania was mixed. There were some great speakers and topics, and some not so great. This is the first international conference I’ve attended, and in New Zealand I’ve only been exposed to a limited number of speakers at local UPA events (which are generally very high quality) and some bigger name speakers like danah boyd and Lou Carbone (both who left lasting impressions) and perhaps I had unrealistic expectations.

Where have all the intellectuals gone?

I’ve been reading Jorge Luis Borges recently, and in a very difficult conversation with Philippe (difficult only because it was the first serious conversation I’d attempted in weeks) I mentioned I was impressed with his brevity, and how he can compress many ideas into a single page of text. Modern culture has us to believe that more is better, and it’s distressing to see our modern thinkers subscribing to this idea.

Some of the talks that I attended felt more like I was having an abstract dictated to me, with the talk ending just when it felt like it should be just starting. Others were great storytellers, and were entertaining, but I didn’t leave feeling like I’d learnt

This isn’t a criticism of Wikimania, but more about how it feels our general intellectual society is moving from seeking enlightenment, to at worst filling up time, to best providing entertainment. I long for a return to the style of Stephen J Gould, Douglas R. Hofstadter, and Borges who may not always be so easy to immediately comprehend, but with some time leave the reader better off.

Tags: ,
Posted in Uncategorized | No Comments »

World Nomads extend the customer experience for travel insurance

August 6th, 2009

I’ve just booked my travel insurance (talk about last minute – I’m leaving 3 days!) and after checking 8 different policies, I’ve ended up choosing World Nomads, who are recommended by Lonely Planet, but also had the cheapest policy of the 8 companies that I got quotes from.

Excluding their insurance product (which is quite interesting in itself because they allow you to extend your policy while you are away) World Nomads are interesting because although their core business is selling Travel Insurance, they are actively extending their how they can support their customers at different stages of their travel adventures.

¡Hola! Free language guides

First off, they produce a range of free iPhone/iPod Touch Language Guides. I’ve downloaded the Spanish Language guide, and a quick look though shows me that I’m definitely expect to be referring to this a number of times throughout my trip – and each time I do, I’ll be reminded of the great service that I’m getting from World Nomad.

Keep in touch with an adventure journal

Secondly, after purchasing the travel insurance, I was encouraged to sign up for a free online adventure journal – allowing me to join and focused network of travel bloggers.

Extending your customer customer experience

Most companies focus on a specific and stage of a customer journey – generally the purchase stage, World Nomad has gone the extra mile and are supporting people through the preperation (by learning a language) and also the actual experience of being on holiday (by both the language guide and also the adventure jounrals).

If you’re working with an organisation — pause for a moment — and think about what stage of your customer’s experience you and your competitors focus on the most, and then think about relevent ways that you can extend the ways you support people in their customer expereince.

Link Love
Twitter: Chris Nobel @WorldNomads
Main website: http://www.worldnomads.com
Language Guides: http://journals.worldnomads.com/language-guides/

p.s. Tower Travel Insurance #Fail
World Nomads wasn’t my first choice – I was going to go with Tower Travel Insurance – except I had a question about the policy and calling their 0800 number I spoke with a friendly representative who passed me onto a colleague to answer my question who — by the way they spoke to me — obviously wasn’t interested in talking to me. If that is how I’m treated as a prospective customer, I’d hate to think how I might be treated if I ever had to make a claim.

Tags: , ,
Posted in Uncategorized | No Comments »

Webpage Makeover for Les Mills Homepage

June 21st, 2009

A Webpage Makeover is one of the services that I offer as a freelance interaction designer that delivers three concept designs of a single chosen webpage.

  • Makeover one focuses on quick wins that can be made by applying best practice conventions while keeping development effort to a minimum.
  • Makeover two looks at what is possible when content and functionality can be added or removed to the page.
  • Makeover three is a blue sky ideation concept which may take extra effort to develop, but is likely to have the strongest positive impact on the webpage’s performance.

As a case study, I’ve just done a mini Webpage Makeover for the Les Mills homepage. It’s a ‘mini makeover’ because instead of doing the three total concepts only the first – quick wins with best practice conventions has been included.

You can download the full case study for the Les Mills Homepage Makeover here (PDF 1.7 MB) or click through for a quick summary and screenshots…
Read the rest of this entry »

Tags: , ,
Posted in Uncategorized | No Comments »
« Older Entries
Newer Entries »
Home | What people are saying | Wireframe Design | Webpage Refresh/Makeover | Website Fitness Plan | Prices | Contact | Blog

This work by Mathew Sanders is licensed under a Creative Commons Attribution-Share Alike 3.0 New Zealand License