I’ve been designing for Makerhood on a voluntary basis since autumn last year. Makerhood are a small team working together to open up the creative community in Lambeth. Makerhood support independent artists/craftspeople and local businesses to get them working together. Makerhood are currently working on up updating their responsive site to better reflect the brand proposition and improve the user experience.
Based on feedback from the group which included a discussion with the developer on what we could do with the Drupal template I created some initial designs. These were to be tested by a UX expert who also volunteers her time with the Makerhood group.
- The key changes here were streamlining the navigation and the user log in area
- I created a new cleaner logo and reintroduced the hoodie/bear icon to the main navigation which adds a bit of personality to the brand
- Removed repetitive links and colour conventions
- I made the titles bolder and increased the text size
- Reduced the amount of CTA’s on the top half of the home page to allow users to explore content
User testing and workshops
We used these recommendations as a starting point and we got a UX expert on board to conduct some thorough user testing of my designs. We got together as a group to discuss the results of the user testing and plan the next steps. Here’s a few photos of our post-it frenzy:
What we discovered
From the results of the user testing and the workshop the key findings missing from my designs were that the users didn’t fully understand the Makerhood proposition. They were often confused expecting to be able to purchase goods on show in the galleries. Another area which the users found difficult was the language and not really getting that ‘Makers’ and ‘Creations’ were just another way to say ‘Artists’ and ‘Products’ We decided that the best way to tackle this was to hit users with the answers when the first get to the website.
In addition to this we decided to rework the colour scheme and layout of the items on the homepage to better reflect what the users were expecting to see.
To get the updates to a solid start and to ensure consistency I created some simple guide documents to help the developer rework the new typography and colour schemes:
The final designs
Here are the latest set of designs I worked on. I focussed on:
- more vibrant colours and a consistent colour scheme
- creating events pages which are easier to search
- added functionality to the events page to allow visibility on who is attending events
- clearer profile and product pages with defined exit links
- better use of space on the events page and a map search functionality
- adding ‘more of this’ style content to the bottom of relevant pages
- an interactive carousel on the homepage to showcase content
click images to view in browser
And here the are the designs in action: