Future Stories

Visit site: futurestories.life

As this project had to be undertaken at speed, a much reduced discovery phase was required. Thankfully, as this project was intended to be used only in the Knowsley area the audience was already well known to both The Young Foundation and Knowsley Council. During our discovery phase the team at The Young Foundation and the council acted as a proxy for the actual audience.

To begin with I created a series of wireframes for the project. This included all of the pages that people would need to visit to view other users stories, and most importantly the page that they would need to use to upload their own story. These wireframes were then used to test the overall concept, and to check for any gaps in the user journey.

From this testing we learnt and adapted several things about the story upload form. Firstly, we realised that although there was three specific story ‘types’ that could be uploaded (text and image, video, audio) it was likely that all users would want to be given the option to upload an image of themselves. We chose to include the image upload option on every version of the form, regardless of the type. We also realised that many of these images were likely to be selfies, taken in portrait mode on a mobile. This meant that the final site design needed to cope with both landscape and portrait images elegantly. This was achieved through generating a new landscape image if a portrait image was uploaded that included the original portrait image in the centre, and a blurred and enlarged version of the original image to fill out the space.

Secondly we realised that some users were likely to struggle with ideas for stories, or would need prompting to get started. We played around with including prompts on the form itself, but it was decided that this made the form too crowded and harder to understand.

Instead we decided that an ‘idea generator’ could be a good way to entice people to think about their experiences. This would need to be contained on a separate page, so that it did not distract from the upload form. The design for this generator is based on a traditional slot machine, with three wheels that turn and provide different ideas for stories. The slot machine style interface is both familiar and novel, and allows people to see several ideas at once, all whilst being able to generate more ideas with the click of a button.

Lastly, it became clear from testing that The Young Foundation would need some way to vet the stories prior to them going live on the site. To do this, a custom workflow needed to be created in the WordPress admin, where stories that are uploaded are first saved as drafts before a Young Foundation staff member checks over the story and adds any tags that are required before setting the story to public.

Each post has two different taxonomies available, public and private. The public taxonomies are the ‘perspective’ (if the story is looking forwards out of lockdown, or looking back at life in lockdown) and post tags. These taxonomies are used in the front end of the site to help people filter the stories, so that they can read only those which are of interest to them.

The private taxonomies are used by the team at The Young Foundation to sort the stories for research purposes, and not available to view or filter publicly.

Sites that are primarily made up of user generated content present a unique design challenge. They need to both maximise and serve the content, but cannot be too reliant on it, as there is no guarantees of what kind or quality the content will be. 

To combat this I decided to build the designs around a set of hand drawn illustrations of people. These illustrations needed to show a wide variety of different genders, races and religions as it was important to The Young Foundation that the site represent the diverse nature of Knowsley itself.

Whilst this was a very specific project, intended for a very specific audience, The Young Foundation requested that the design not be too Knowsley specific as they are in discussions with other councils in the UK about rolling out a similar system for them. I decided on a colour palette that complimented The Young Foundations own brand colours, as they would be the only constant across the different possible implementations. For fonts I utilised two free fonts from the Google Fonts library (Poppins and Kumbh Sans), as this would keep costs down if the site needed to be reused.

Overall the project has been a success, with over 50 stories from local people available to read online, and more being added each week.