Role
User Experience
& User Interface Design
Client
(Manager) Amber Caldwell
Project Length
1 month
BRIEF.
Add a Feature To An Existing Site
Yard Art House
Yard Art House is a multifunctional space based in a town house, set up to nurture and source the imaginations of local people. They host residencies, exhibitions, and events. The space can be used to as a hiring space for businesses and the local community. Their mission is to use art to shape and improve relations within the community. I approached the company to perform a case study.
Exterior Information
Interior Information
Brief:
-
Identify pain points of current website
-
Design and add a feature that would improve customer usability
Input from Owners:
-
Access to backend of website
-
Current/previous Yard clients/users to take part in a survey or interview
-
Client interview and meetings to figure out working strategy
RESEARCH.
Ask question to define the problem
Client Meeting
To start the project, I spoke with one of the Managers at Yard to understand the business better and get her viewpoint on the issues with the site. It was important that I understand what the client wanted to achieve within the time frame. My questions helped me get a better understanding of the clients pain points with the site which helped inform my brief.
Yard Aims
-
Gain understanding of which parts of the website are working and which could use improvement. With a view to having a custom built website in the future.
-
Explore or better utilise parameters of Wix account currently hosting the site.
Main Client Concerns
1. Better booking system which allowed for each room to be booked separately in combination with other rooms/spaces.
2. Calendar of events so people can find and see 'What is on' at Yard.
Competitive Research
I executed competitive research to see what similar businesses were doing well. I could not find one with exactly the same 'make-up' as Yard. Below are some of the comparable art and multi-use space websites that I looked into. I noted in my research, Yard is different in that it focuses on art through community networking and provides use of the space to the community on a weekly basis for free.
(Note: Some of the points outlined below may be outdated as some of the sites have since been updated. However the observations are true at the time of my original research)
Slideshow of comparable multi-use spaces in UK
1/5
Art from the Heart
Website: https://www.artfromheart.co.uk
What they do: ART from HEART CIC is a London based Organization that Curates, Organizes and Manages multidisciplinary group Art Exhibitions and Events focusing on contemporary issues and advocating Socio-Cultural causes.
Pros: • Great about page • Services are clearly defined • Testimonials are on every page
Cons: • Services have a CTA button that does not work • Overall feel a little sterile.
EMPATHY.
Gaining understanding
Findings
BOOKING:
-
The booking form was understood perfectly by the user.
-
Majority of Users however, did not know what they were getting when booking . For example users noted that there were no images of the spaces, no specifications or a list of past events so they would know their project was suitable for the space.
-
Some users wanted to know response times and dates the rooms were available before booking
OTHER OBSERVATIONS:
-
Generally users navigated the 'What's On' page well however, 2 participants commented that some information was missing such as where in the building particular events were being held. 2 participants also got confused between the tab names 'What's at Yard' and 'What's On'.
-
The users did not request a calendar of events like the Client had expected. Some participants advised they would just sign up to the newsletter to get the most up to date information delivered to their inbox.
USER FEEDBACK ON OTHER CURRENT TABS:
Please see below a score on the effectiveness of the other tabs based on the Users experience of the website. The 'effectiveness' is measured by the Users understanding and navigation of the pages during the interviews.
Proto Persona
Following the interviews I created a proto persona. Based on interviews and client discussions, the main personality was entrepreneurial, social and always on the go, juggling different projects.
KINDLY NOTE
The client made some changes to the website at this point due to modifications to the business.
The new site did not include floor plans or detailed information of the spaces. With this in mind and due to the timeframe, I focused on the data from the original site but provided my ideal solutions in-keeping with the new site design.
My aim was to provide information on the space to so User's that had only ever viewed the space virtually, felt more comfortable making a booking and knew what they were getting when they booked.
SOLUTIONS.
Solutions and ideations
Current Site
Following my findings and considering time constraints I decided to focus on what I believe would have the biggest impact to the website, which was introducing Users virtually to the space.
The current site can be found at: https://www.yardarthouse.co/
Below is a direct quote from a User explaining their impression (of the original site). When asked about other features they may have used on another site, they advised a Past Events page is what they tend to look at if thinking of hiring a space.
Quote from Interviewee
“If they have very diverse events, seeing what they have hosted previously gives you a better feel for the space. It’s important to see what type of people usually go there, so that you know if you would attract the right crowd. It also gives you a feeling of the atmosphere you can create and the things you can do with the space.
Unfortunately I cannot see the versatility of the space from what was presented. Seeing previous events, you may think ok this is not what they usually do but they have had this type of event before so it shows they may be open to a lot of things... and maybe open to one of my projects for example “
Design Inspiration
As Yard is inspired by artist I decided to take my inspiration from the graphic maps of the museum of London; most notably the Natural history museum map. The map is instructive but also feels invitingly interactive. The 3d view of the space invites the viewer on a path of discovery and a clever use of colour separates the spaces.
Map of Natural History Museum
I created an intro video from the floor plans provided by the client using Adobe Illustrator and After Effects. This way people that visit the website can get a better idea of the layout and the flexible use of the space. As Yard is on a much smaller scale I was able to be more elaborate in my details than the map from the Natural History Museum.
Isometric Intro Video
My Page Designs
THE SPACE
I used isometric illustrations of each floor to present the space to visitors with key information listed at the side with details of what each space had to offer.
SUMMARY.
Findings & Next Steps
FINDINGS
To be honest the largest issue with the project is that there was not enough time to test, address and solve all of the issues. The client also made changes due to business restructuring before a solution could be fully expressed in design form for the original website, which moved the goal post of some of the original requests/goals. None-the-less I believe I created some good solutions for the Users original pain points. With more time, the next steps would be to discuss them with the client and test their effectiveness.
However I achieved the following:
-
Provide more detailed description of hiring spaces through information and illustration in order to better encourage and support the booking process
NEXT STEPS WOULD BE:
-
Obtain client approval and feedback for the designs
-
Test, test, test. Create a prototype from the newly designed pages and have participants interact with it. It would be good to have new participants but also a couple of participants who have been interviewed before, to capture feedback on the changes the client has already made to the site.
-
I have been researching booking add-ons for Wix that will help the client, so the next step would be to discuss these options (and prices) with the client then start testing the booking systems on a trial basis.