NAFS

  • Status: Live
  • Link: NAFS
  • Collaborators: Daniel Moy

NAFS is an organisation based in the UK, supporting socially isolated women and people from BAME communities improve their health and wellbeing. I volunteered to build their website and rebrand their organisation.

  • WordPress
  • Illustrator
  • Photoshop
  • #f2d1c9
  • #68a692
  • #d95970

I first connected with Nadera – the founder of NAFS, after signing up as a volunteer with Furlonteer. They passed my details to Nadera and we began working together to design a site that would cater to the organisation’s needs.

Branding

Nadera expressed a desire to rebrand NAFS and needed help creating assets for flyers, social media posts and presentations. Before we could begin designing a website, we needed to identify the brand first.

Logo design

NAFS were previously operating with a logo and some flyers that they wanted to update. This outlined a good opportunity to define a consistent brand for NAFS that they could be identified by across all of their online platforms and in their flyer designs.

This was my first round of designs for NAFS’ rebrand.

In my first round of designs, I created a logo that uses the silhouette of a lotus flower as the focal point. This was something that Nadera had identified as something that she would like to incorporate into the new logo during our first call about the project.

I used the colours from their existing logo to create a subtle but complimentary colour palette to represent the organisation. Similarly, I wanted to define the typefaces that should be used across the website.

Our second round of designs for NAFS’ logo.

Nadera was very happy with the initial designs but expressed a love for isometric patterns. She sent me an example of a pattern that she felt would look nice around the lotus flower. I was able to simplify this pattern to a point where we both felt it looked reflective of the brand that we were trying to create. I also liked the idea of having this pattern interchangeable with some of the colours from our colour palette so that it gives us more flexibility in our future web and flyer designs.

Flyer Design

Nadera’s main tasks involved running exercise classes and wellbeing sessions for her group members. She was using an array of flyers to promote these that she had created but she wanted some guidance on how we could improve these.

These are three of the original posters that NAFS had been using to promote their classes.

Using the brand guideline that we had created (see above), I was able to use Canva to create some new flyer templates that would take advantage of the new logos and brand assets that I had created.

These are three new posters that were created using design elements from the NAFS brand as a template.

Website

Upon hearing the requirements for this project, I felt that WordPress ticked all the boxes. It would also give me an opportunity to learn about developing themes for the Gutenberg editor – something I had not had much experience with yet.

I started designing the home page for mobile device sizes before expanding the design to support the width of a desktop viewport.

The website needed to notify users of the upcoming events that NAFS were hosting. This is a key focal point of the home page.

Events can be managed from the backend and enable you to store venue and organiser details for quicker creation of future events.

Testimonials are an important part of NAFS as they highlight the great work that Nadera does from people that have benefited from Nadera’s services.

There are plenty of testimonials available to read on this site so I split this section into its own post type in the backend. You are then able to view all testimonials on a designated archive page.

The about and latest post section of the home page.

The latest post section of the home page will pull in the latest post that has been uploaded to the blog. The blog was another key feature that Nadera was interested in having for her website.

Contributors

During this project, Furlonteer – the organisation that connected me with NAFS, launched a sister company called Studenteer. Their aim was to connect students with mentors who are enrolled with a project from the Furlonteer scheme. I was asked to be a pilot mentor for the scheme and worked on building the website with Daniel Moy – a school student headed for University in a few months time.

During this project, I was able to help bring Daniel up to speed with version control workflows using Git and I gave him an overview of web design principles such as mobile design and desktop design. During our time working on the project, we had regular calls and often took part in pair programming sessions so that I could help Daniel learn more about the code that he was writing.

Daniel’s contributions are very much appreciated and added to the project’s success.


© Ian Holden 2020

“We can get better, because we’re not dead yet.” – Frank Turner