Report Proposing the IA and Navigation for the Wusteman Gadgets

QUESTION

Requirements:

Students are required to submit a report proposing the IA and navigation for the Wusteman Gadgets site plus details of testing.

About the Site Wusteman Gadgets-

The proposed site Wusteman Gadgets would be aiming at the market of “mid-range geeks”: people with a passion for gadgets, but maybe not the ones who think that Ewan McGregor is actually Obi-Wan Kenobi. Also, I don’t really want to focus on specialised electronic gadgets – I realise that that’s the only thing some people think of when you say “gadget”. I’m happy to stock some wacky gadgets to use with smart phones or tablets – but maybe not gaming consoles, cable organisers and that sort of boring stuff. It’s got to be wacky to be on my site. Ok, so here are my plans for stock. They’re a bit vague at the moment and I may expand my range in the future.

• I plan a good range of gadgets for the home, for the office, as gifts.

• I don’t think I will move into the area of kids toys, though a range of kids clothes might be part of a more general clothing section.

Personas -, geeks, their friends and family and the general-but-gadget- friendly public sound like what I would expect to be my main customer groups.

Competitor sites for the proposed website- ThinkGeek.com and Geniegadgets.com

ANSWER

REPORT ON IA NAVIGATION, PROPOSALS & TESTING FOR THE WEBSITE:

WUSTEMAN GADGETS

TABLE OF CONTENTS

1. Executive Summary

2. Labelling Proposals

3. Card Sorting

3.2 Results

3.3 What was learnt from the Card Sorting

4. IA Pattern
5. Navigation Menus & Classification Proposals

1.EXECUTIVE SUMMARY

Significant test results:

• Card Sorting:
  Using 30 cards and 2 participants, we got a total of 14 categories.

After clubbing the redundant categories together, we got 8 different categories, which are:

About the site/Help User account/User specific

Gadgets Gift ideas/Gift categories

Other Special

Kids Decor

Out of the above 8 categories, 7 were present on our site.

The category ‘Decor’ was absent. But the cards placed under this category were given on our website under ‘Home & Office’ and ‘Accessories’.

• Tree Testing:
  Out of our three tasks, one had a success rate of 100% while remaining two had 50% success rates.

We saw that the participants preferred the direct links over clicking on the ‘Shop by category’ or ‘Shop by interest’ options even though that could also lead to their choices after some searching.

• Click Testing:
  All three of our tasks had a 50% success rate.

Key recommendations:

• We keep the labels on our website as proposed in the Table 2.1 as the card sorting did not propose any much needed changes.
• We propose to keep the navigation of the website as proposed in the sitemap in figures 4. to 4.4.
• We use the proposed wireframes as proposed in Section 7.

2. LABELLING PROPOSALS

One of the key components of any website’s information architecture (IA) is an effective nomenclature or labeling system. A label communicates to users what content is about. A label can be used to describe a section of a website. And a label can also convey information scent. The scent of information addresses the following questions¹:

• Where can I go? (clear navigation)
• Where am I now? (orientation)
• Can I tell that I have arrived at my destination? (arrival)
• How can I get to the destination that has my desired content? (route selection)
• Should I click on this link? (content value)

On this website of Wusteman Gadgets, we have the following labels:

LABEL	JUSTIFICATION
Shop by Category	Users can search their item using the category it belongs to.
Clothing	Users can easily find the clothes offered by the website at one page.
T-Shirts	Varieties of tees clubbed under one label, different filters can be applied as needed then.
Kidswear	All varieties of kids clothing clubbed under one label, different filters can be applied as needed then.
Accessories	Accessories clubbed together so that user can easily find their needed item.
Bags & Backpacks	All sorts of storage equipment clubbed under one label, different filters can be applied as needed then.
Home & Office	Gadgets for home or office clubbed together so that user can easily find their needed item.
Toys & Games	For grouping all sorts of games and gadgets associated with children.
Collectibles	Basically for clubbing together small items like antiques, action figures, etc.
Tools, Outdoor & Survival	For clubbing together gadgets and other essentials for camping, hiking, trekking etc.
Electronics & Gadgets	As a label for all the gadgets offered on this site.
Festival Gadgets	For all the festival specific gadgets offered on this site.
Gaming Gadgets	All the gaming oriented gadgets offered on this site together under one label.
Home & Office Gadgets	As a label for all the gadgets for home or office offered on this site.
Music Gadgets	All the music oriented gadgets offered on this site together under one label.
Sports Gadgets	For all the sports specific gadgets offered on this site.
Spy Gadgets	As a label for all the spy and secrecy oriented gadgets offered on this site.
Shop by Interest	Users can search their item using the genre it belongs to.
TV,Movies & Books	For clubbing all the items that TV series, Movies or book nerds would prefer.
Video Games	As a label for all the videos games and gaming gadgets offered on this site.
Gifts	As a menu option so that any user searching for gift options can navigate further through the submenu depending upon their choice.
For He-Geeks	For clubbing gifts generally preferred by male gender.
For She-Geeks	For clubbing gifts generally given to males.
For Kid-Geeks	For clubbing gifts generally given to females.
For Special Occasions	For clubbing occasion specific gifts.
Love stuff	For clubbing gifts generally given to valentines, fiancees or loved ones.
Toys	For clubbing gifts generally given to children.
Other Interests	For various gift options that do not fit under the above labels.
What’s New	Puts all the new products launched together so that they can be easily seen by the user and thus popularised quickly.
What’s Hot	Puts all the trending products together so that they can be easily found by the user.
Gadgets	As an option on the homepage so that all gadgets are placed within one click from a user who doesn’t wish to search through menus or can’t decide which category to go to.
Gifts	As an option on the homepage so that all recommended gifts options are placed within one click from a user who doesn’t wish to search through menus or can’t decide which category to go to.
T-Shirts	As an option on the homepage because T-shirts are one of the top selling items preferred by geeks. Will be placed just one click from a user for quick access.
Home & Office	As an option on the homepage so that all recommended home and gadgets options are placed within one click from a user who doesn’t wish to search through menus or can’t decide which category to go to.
On Sale	Puts all the discount products together so that they can be easily seen by the user and thus cleared from the store quickly.
Search	For searching through specific keywords if users can’t find what they are looking for in the menu options.
Account	Personalised section for a user
Cart	To hold user’s current selection of items to buy.
Help	For putting all the f.a.q. and inquiry details at one place.
About Us	Clubbing information on the e-company owners at one page.

Table 2.1

3.CARD SORTING

Card sorting is a method used to help design or evaluate the information architecture of a site. In a card sorting session, participants organize topics into categories that make sense to them and they may also help you label these groups. Card sorting helps to understand users’ expectations and understanding of our topics. Knowing how your users group information can help you:

• Build the structure for our website.
• Decide what to put on the homepage.
• Label categories and navigation.

For this website, we have used the ‘OptimalSort’ software for card sorting.

3.1 METHOD

Welcome Message:

Image 3.1:Welcome message of ‘OptimalSort’ study

Pre-survey questionnaire:

Image 3.2:Pre-survey question of ‘OptimalSort’ study

Participants screen:

Image 3.3:Participants of ‘OptimalSort’ study

List of tested labels:

1. Accessories 2. Collectibles

3. Tools, Outdoor & Survival 4. Electronics & Gadgets

5. Shop by Interest 6. Other Interests

7. What’s Hot 8. Home & Office

9. Special Occasions 10. Music

11. Toys 12. On Sale

13. Account 14. Help

15. About Us 16. Gifts for Kids

17. Toys & Games 18. TV,Movies & Books

19. Gadgets 20. Sports

21. Love Stuff 22. T-Shirts

23. Video Games 24. Spy Gadgets

25. Gaming Gadgets 26. Shop by Interest

27. For He-geeks 28. Bags & Backpacks

29. Festival 30. Giifts for She-geeks

3.2 RESULTS

(a)Categories:

This view shows the categories that our participants created and the cards they sorted into each category. From our study, following observations and conclusions are obtained:

• Using 30 cards and 2 participants, we got a total of 14 categories.
• After clubbing the redundant categories together, we get 8 different categories, which are:

About the site/Help User account/User specific

Gadgets Gift ideas/Gift categories

Other Special

Kids Decor

• Out of the above 8 categories, 7 are present on our site.
• The category ‘Decor’ is absent. But the cards placed under this category are given on our website under ‘Home & Office’ and ‘Accessories’.

Image 3.4:Categories of ‘OptimalSort’ study(part 1)

Image 3.5:Categories of ‘OptimalSort’ study(part 2)

Image 3.6:Categories of ‘OptimalSort’ study(part 3)

Image 3.7:Categories of ‘OptimalSort’ study(part 4)

Image 3.8:Categories of ‘OptimalSort’ study(part 5)

Image 3.9:Categories of ‘OptimalSort’ study(part 6)

(b)Dendrogram:

Dendrograms help to visualize content groups and the top labels by participants. Through these, we can understand which groups have the strongest agreement. This software uses two different methods to construct the dendrograms:
Actual agreement method:The actual agreement method depicts only absolutely factual relationships. It is also called the skeptical dendrogram.

Best merge method:The best merge method often performs better than the actual agreement method when the study has fewer participants. It makes assumptions about larger clusters based on individual pair relationships.

From the obtained dendrograms, following observations and conclusions are drawn:

• Since we had only 2 participants, the dendrogram constructed using best merge method will be more suited for our analysis.
• We present our results in the following table.

Cards	Categories	% Participant agreement
List of international shipping charges Career @ Wusteman Gadgets Our newsletter	About the site, Help	100
A list of trending T-shirts Christmas specials Discount products	Other, Special	100
Gift ideas for wedding anniversary Cool gift ideas for bibliophiles What to gift to a music lover Gifts for a valentine	Gift ideas	100
Gadgets for pets Brain games for kids DIY/Model kits for children Stationery & Journals Baby gifts Gift ideas for wedding anniversary Cool gift ideas for bibliophiles What to gift to a music lover Gifts for a valentine	Gift categories, Gift ideas	50
Home decor ideas List of gadgets personalised to my interest Cool gadgets Mobile accessories Halloween/Spooky gadgets Desk decor ideas Kitchen & Dining gadgets Virtual reality gadgets	Gadgets	50
Harry Potter gadgets Action figures Anime wall art Science toys Party games Laptop sleeves based on Tolkien universe	Kids	50

Table 3.1

Image 3.10:Dendrogram(Actual agreement method) of ‘OptimalSort’ study

Image 3.11:Dendrogram(Best Merge method) of ‘OptimalSort’ study

(c)Participant-Centric Analysis(PCA):

Participant-Centric Analysis help to quickly see the most popular grouping strategies.It finds the top three most acceptable but substantially different submissions by participants in our card sort as tested against the other participant submissions. Then it shows up to 3 different individual responses that agree most strongly with our other participants. From our study, we have the following observations and conclusions:

• The PCA works best when we have at least 30 responses and when at least one of the suggested responses has a high level of agreement. Since we have only 2 participants, PCA might not serve as the best result for analysis in our case.
• Every participant response is treated as a vote towards the response it supports the most.

Image 3.12:PCA for the card sorting study(part 1)

Image 3.13:PCA for the card sorting study(part 2)

Image 3.14:PCA for the card sorting study(part 3)

3.3 WHAT WAS LEARNT FROM THE CARD SORT

• Our pre-survey question: the division into age groups was made with the thinking that ‘under 15’ group will be more actively separate different types of gadgets while the ‘above 50’ group will club them all together since they are of less interest to them. The remaining two age groups will show more interest in categorising the gifts and gadgets ideas suited to home and office.
• We got a total of 8 categories from the cardsort study, when we used the mentioned 30 labels. Out of these, 7 were present on our site while the eighth one was absent.
• We do not propose to add the new label to our site because the cards added to this label also have a strong disposition towards the categories under which they have been currently placed.

4. IA PATTERN

4.1 Information Architecture

Information Architecture is all about:

1. Organising content or objects.

2. Describing them clearly.

3. Providing ways for people to get to them.

Any website’s information architecture has two main components:

1. Identification and definition of site content and functionality
2. The underlying organization, structure and nomenclature that define the relationships between a site’s content/functionality.

The information architecture (IA) is not part of the on-screen user interface (UI) — rather, IA informs UI. The IA is documented in spreadsheets and diagrams, not in wireframes, comprehensive layouts (known as comps), or prototypes.

4.2 What is a Sitemap?

An IA is usually documented as a sitemap. A sitemap is basically all the content of a website in a diagrammatic or listed form. Primarily, any sitemap has two functions: firstly, to organize a website’s layout; like an outline that shows which links between all the web pages on a site. Next, web crawlers—bots used by browsers to index and organize all of the different websites across the internet—use sitemaps to update their indexes. This means that it makes websites easier to find, easier to search, and easier to use.In a website design project, a sitemap is used to plan the organisation of pages to improve usability in the early planning stages, often before any wireframes or UI Designs are created. Exercises involving card sorting can be used to help determine the ideal sitemap structure. Navigation prototypes can be also be created to test assumptions about the logical layout with users to validate any assumptions.

4.3 Sitemap for ‘Wusteman Gadgets’

Presented below are the screenshots of the conceptual sitemap for the website ‘Wusteman Gadgets’.

A conceptual sitemap usually shows the top-level headings, key pages or sections, and key relationships between pages or sections; though it doesn’t show all the pages that are in the site.The shapes and connectors used are simple, and the diagram does not contain

too much information. The idea behind it is to show the overall shape of a site at a glance, but without the fussy details.

Image 4.1:Sitemap for W.G.

Image 4.2:Sitemap for W.G(horizontal continuation of image 4.1)

Image 4.3:Sitemap for W.G(vertical continuation of image 4.1)

Image 4.4:Sitemap for W.G(vertical continuation of image 4.3) `

5. NAVIGATION MENUS & CLASSIFICATION PROPOSALS

Navigation refers to the methods we design that let people move around information. It includes

navigation bars, hyperlinks, buttons and other clickable things. It also helps to:

• let people browse to the content or functionality they need.

• show the context of the information.

• show what is related and relevant.

• help people find information they didn’t know about.

Given below is a table enlisting the navigation menu items used in W.G. together with classification schemes employed and their corresponding justification.

Navigation Menu Item	Classification Scheme	Justification
Account	Primary navigation	For user personal details.
Shop by Category	Primary navigation. Hierarchical classification.	For a user wanting to navigate categorically.
Shop by Interest	Primary navigation. Hierarchical classification.	For a user who only wants to see interest specific items.
Clothing	Primary navigation. Hierarchical classification.	For keeping all clothing items together.
Electronics & Gadgets	Hierarchical classification.	For all the variety of gadgets together.
Gifts	Primary navigation. Hierarchical classification.	For all the variety of gifts together.