London Green

London Green

London council budgets have experienced severe cuts to maintenance and improvements of public spaces has been paired back to a bare-bones service.

Concerned about personal safety, air quality, well-being and continued access to and enjoyment of public spaces residents are organising themselves to improve their areas.

Lady planting from mobility scooter

My role

I worked individually in the role of Information Architect designing a new information-rich website.

The challenge

My challenge was to design the information architecture for a site over the period of about eight weeks. The project is our entire work for City University’s Information Architecture course. As a part of the course we had set tasks and deliverables.

Discovery

Our first task was to interview at least two domain experts or people with first-hand knowledge and experience of our chosen subject area. I first attended a communal gardening morning in south London where I spent around hour picking up rubbish. From this I was able to secure an interview with someone involved with council friends groups. Friends groups advocate for parks and communal spaces like greens and squares. They usually have regular events which can include maintenance and leisure activities. I also interviewed someone who started up a residential friends group. Their focus is improving the immediate local surroundings so picking up litter, plantings on their street and community activities.

Our first deliverable was a domain model. This helps us understand the domain, its concepts and terminology and the links between them. My domain model went through several iterations.

My domain model and other deliverables were created in Omnigraffle.

London Green domain model

Using these concepts I came up with some possible content and a sitemap. To get feedback on labels and content groupings I created an open card sort inviting participants to categorise possible content. I used Optimal Workshop to carry out online card sorts. The full results are available on their site.

This left me confident about most of the labels and also made me aware of content with possibly ambiguous information scent.

Design

I refined my sitemap further before presenting it during our Information Architecture showcase. There my documents were reviewed by a professional Information Architect. I had placed the group pages – the primary landing page for visitors – under council pages which were accessible via the homepage. The group pages were buried. I updated the site architecture so the community groups were accessible via the homepage. Another piece of feedback was my site was thin on content so I added additional relevant content such as how to raise funds for your group and functionality for listing and accepting donations such as seeds, plants and tools.

London Green sitemap

Next, I created a user flow showing how someone would book onto a gardening event near their home. This document also went through several iterations as I improved the way I communicated how a user may flow through the site.

London Green user flow

In preparation for testing the site with end users I wireframed key pages within the user flow and site.

London Green wireframe of event page
London Green wireframe community group page
London Green browse events wireframe
London Green homepage wireframe

Evaluation

Lastly I tested my wireframes with two participants. Both were gardeners, however only one was currently involved in community groups.

With each participant I tested the website for ease of booking onto an event and I checked the meaning of many of the labels and icons on the pages.

I was pleasantly surprised to find users could book onto events and most of the content behind the button names matched their mental models. I came away with several findings:

  • The navigation bar at the top of the site had not been shaded dark grey so participants struggled to find those buttons.
  • The “how to” label was too vague. I had struggled to label this content and had mixed results with the card sort as well.
  • Lastly, the buttons on the event page were not positioned or labeled as participants expected. RSVP seemed to be too formal for the site.

Urban snail