Skills & Tools
Information Architecture, Domain Expert Interviewing, Domain Model, Card Sorting, Tree Testing, Sitemap, User Journey, Wireframe, Usability Testing, Miro, Axure, Optimal Workshop
Project Summary
The challenge for this coursework was to design an information architecture of a web-based environment on household recycling in London. Following a series of domain expert interviews as well as a competitors analysis, a domain model was created. The website's foundation was then built using a sitemap and key usage was illustrated via user journey. Wireframes of key pages were created to demonstrate the site's functionality, which was then used for usability evaluation and development.
Design Process
Time Period: Nov - Dec 2021 (2 months)
The Challenge
I was motivated to design around this topic as I have personally always found recycling confusing, especially on what I can and can't recycle, as well as the recycling service available from home and in different local area. This then inspired me to design a household recycling site that is accessible to Londons and help them avoid any undesired experiences whilst learning about household waste recycling.
Recycling service differs according to the property type and borough you live in. It is undoubted that people are confused and are often incentivised to recycle!
User Research
To grasp a better understanding of the different concepts key to recycling, a total of four informal interviews were conducted with domain experts, this includes
All four interviews largely discussed the different recycling processes for different items and materials, and that recycling services differ between property types and boroughs. It was also emphasised that reducing waste is more effective in lessening environmental impact than recycling.
Domain Model
A domain concept model was created to help envision the information that the website needs to display based on structured classification and relationship. Key concepts and relationships identified from user research were illustrated using nodes and arrows.
Card Sorting
Open card sorting was conducted to enable a better understanding of users’ mental model. Participants were asked to divide 40 cards into groups based on their associations and were asked to give them names.
Results revealed overlapping patterns that heavily resembled the information organisation of comparable sites. For example, most users categorised waste following the typical recycling method: material type. An unorthodox pattern was also found in which numerous users categorised waste according to the room it belonged in i.e. kitchen, bathroom.
Card Sort for Household Waste
Card Sort for IA/ Navigation
Sitemap & Tree Testing
A sitemap was created using a top-down approach. showcasing the site’s functioning and shape. The proposed hierarchy was then evaluated via tree testing to explore and refine menu categories and labels.
In total, five users participated and the results revealed that the proposed global navigation is effective in portraying the diversity of information, enabling efficient findability.
Tree Test Results
Sitemap
User Journey
Once the website's navigation structure was proven usable, a user journey was constructed based on the sitemap that was then used to inspire the construction of wireframes.
Task: You have recently moved into a house at Southwark SE16 7FU and are unsure how the recycling service work in the area. You have some used batteries lying around the house, so you want to find the nearest place that recycles them and drop them off before going at work at 10am tomorrow (Monday, 20th December 2021).
Wireframes
Based on the user journey, wireframes were created to demonstrate functionality. The wireframes were kept at low-fidelity to ensure that the feedback from usability evaluation can be focused on the site's functionality and experience navigating the site. A total of 4 wireframes that best demonstrated the site's information architecture with annotations on design justification and process.
Your Local Recycling Page
Information have been organised using a geographical scheme to enable users access information on recycling services of different boroughs. Since two user groups were found during research, different navigation methods were designed to cater for the differences in knowledge on London boroughs.
Southwark (Borough Profile Page)
This wireframe illustrates the interface of a profile page from the Borough database. Expandable accordion were used to illustrate grouped content to allow users jump directly into content that is relevant to them. A faceted filter was incorporated to allow users to quickly refine database according to task criteria(s).
What Can You Recycle Page
Alphabetic scheme was used as a primary organisation scheme, supplemented by additional dynamic groupings through a faceted filter. Users can also browse and search using keywords, optimise results using sort and identify the validity of search or how long they should spend browsing using the total result number.
Batteries (Item Profile Page)
Item profile is another database interface that follows consistent structure. A call-to-action crosslink was added under 'Where to Recycle' to allow easier navigation for when users want to find the nearest recycling location for searched item.
Evaluation & Development
Finally, usability testing was conducted with three participants that shared similar mentality and goals with user population. Participants performed tasks set out by the user journey using the think-aloud technique in which perception of information shape, effectiveness, learnability as well as user satisfaction were measured. Results confirmed that the site’s structure meets users’ needs and expectation within the domain.
As a result of usability testing, a number of changes were made to the wireframe, for example
• Thumbnails were made smaller to prevent overstimulating and that more grids can be displayed at once.
• Social sharing button was added to database pages as participants expressed interest in sharing.
A more knowledgeable user also proposed that the website should incorporate a blog section so that users could also contribute and share any relevant tips on the domain. This has been regarded as a future improvement as more research and testing is required to work out the organisation of blog content and how it can be merged with existing hierarchal structure.
Project Reflection
All in all, the project was conducted successfully by capturing requirements for, the structural design of and the evaluation of digital information environments from a user perspective. If more time was permitted, wireframes will be created for all pages along with another round of usability testing to assess the design of digital information environments.
