Shelter Scotland Blog

Research / Product Design
Project Overview

At the end of May 2021 Shelter underwent a transformation in which it sought to embrace the spirit of activism. This accumulated with the launch of a new brand and coincidentally my starting date.

The first project I undertook was the rebranding of the Shelter Scotland Blog to fit in with the new direction in which Shelter was moving forward. The time schedule for this project was extremely tight with about 2-week for both design and build in which I had to learn a new program (Figma) and work within a design system that was new to me.

Aims
  • Create an updated blog design to fit in with the new Shelter brand
  • Learn how to use Figma and work within the new Shelter UI Kit
  • Review and hand-off to developer in time for build before new brand launch. 
Mock-ups in an isometric grid

Discovery

The constraints around going live in time for the new brand launch meant that my discovery process for this project was a lot shorter and more condensed than I would typically like. 

I started by first interviewing some key stakeholders about the function and audience of the blog to understand the product as a whole. Using the information collected from these I went on to create some very low-fi proto personas to help me later scrutinise my design.

I all so conducted some competitor reviews of housing policy blogs and some of the UK's leading charities to help better understand the space in which I was working.

persona card for a housing professional

Development

After defining the main features and what the blog had to deliver I began work on the wireframes. The initial wireframes were rough and tried to capture the flow of a typical user journey based on the 4 Porto-personas created in discovery.

I created screen mock-ups in Figma for the 4 different page types identified. These were the home page, an article page, a specific topic page (e.g. Policy), and the search results page including a version for which no results are found.

mock up of pages in figma

End results and takeaways

The project was completed on time and the new blog design was launched alongside Shelter's new brand. The blog received positive feedback from stakeholders and users, and the design was well received.

One of the key takeaways from this project was the importance of working within tight deadlines. It was a challenge to complete both the design and build of the blog within a two-week timeframe, but by prioritising the most important features and utilising my time effectively, I was able to meet the deadline.

Another takeaway was the value of conducting user research, even in a limited amount of time. By interviewing stakeholders and conducting competitor reviews, I was able to gain a better understanding of the blog's audience and the needs of the users. This helped inform my design decisions and ultimately contributed to the success of the project.

Overall, this project allowed me to learn new skills, such as working with Figma and a new design system, and apply them in a fast-paced environment. It was a challenging but rewarding experience that allowed me to make a tangible impact on Shelter's online presence.