Website Design - TimeNorfolk
I was approached by the charity TimeNorfolk to design a new website for their charity in late 2020. TimeNorfolk provides inclusive support across Norfolk for anyone who has been affected by pregnancy loss. They commissioned me to make a completely new website working through a the platform, WiX.
Commercial Website Design has provided a valuable opportunity to develop
my understanding of the perceptions of utility, ease of use, and efficiency relating to virtual design.
https://www.timenorfolk.org.uk/
ROLE :
Website Designer
TIMELINE:
Nov 2020 – April 2021
SKILLS NEEDED/USED:
User Research
Interaction Design
Interactive Prototype
IN COLLABORATION WITH:
Director
Board of Trustees
Project Overview
TimeNorfolk’s brief was to create a fresh, modern website that still kept to their original branding while condensing the large amount of unnecessary content on their original website. They also instructed me to update the original colour palette in order to bring more vibrancy and make it feel more inviting.
The below examples shows the sites homepage prior to the project beginning.
Original Home page prior to design.
Background Research
Before creating the site I had different meetings with the client about their objectives, and noted the other platforms which they liked. This helped me understand what type of design they were looking for.
I did initial research and took inspiration from other modern and uplifting charity websites. For example, Mind and tearfund, both advertise for the same type of user as TimeNorfolk.
'Mind' Home Page
'Tearfund' Home Page
Colour Themes
One of the initial considerations for the project, was to re-think the colour palette running throughout the site. The charity indicated that they wanted the colours of the site to be updated.
Below shows of the new colours of the site and how the logo was updated.
Final Colour Palette
Original Logo Colour Design
Final Logo Colour Update
Design Layout
The following shows the final design layout of the site. It also highlights the key elements of that design and how the content of the original site was condensed to make more sense to the user.
Original layout of the site
3
1
2
4
Final design layout
1). Main Logo updated to reflect a clearer version of TimeNorfolk.
2). Site navigation layout shown below:
SUPPORT - All of the pages linking to how TimeNorfolk can support and help their patients.
STORIES - Designed to illustrate how the charity has helped people in the past.
GET INVOLVED - Showing the different ways people can help and support.
ABOUT US - Information about the charity's history.
4). Slide through gallery showcasing a series of relevant images related to TimeNorfolk.
Content Layout Development
During the mid point of the project there was a transition in management which required a rethink to the layout. It was there for important to embrace a bolder and different structure.
This was initially a challenge but meant the developed into something finished design and closer to the clients brief.
Initial Homepage Design
Final Home Page Design
Style and Structure
During the process of experimenting with the new version of the layout, it became clear how impactful the home structure and colour tones where for setting the tone for the rest of the site.
Interactive and colour filled sections of the home page brought more vibrancy to the site. Illustrations also created more unity between different sections of the site.
1
First section of website Home page. The slide bar is designed to be an easily changeable for future images.
2
Small About section illustrating the brands identity.
3
Testimonies from previous clients.
4
Small section specifically about how TimeNorfolk supports their patients.
5
Small section showing the different parts of the website and what they showcase.
6
Donation and support us bar.
7
News and updates section.
8
Brands linking to the work of Chilcott.
Homepage Example of Layout / Design flow
Final UI
Designing the TimeNorfolk website was an exciting and creatively challenging process. The need to condense information and alter the template took time to think through but was beneficial in learning how to better readjust to unforeseen plans in a project.
