Siddharth Hariprasad

Live Site

Redesign of the website for the NGO, AfriCompassion.

Overview

Steve Whitehouse from AfriCompassion approached us with a vision to better help the children in Tanzania by building well, building schools and building better lives for children.

To do this effectively, it was paramount to have a website that instilled trust and confidence in the visitors.

This image shows the previous website that they had before we started.

Roles

  • Team Leader
  • User Interface Designer

Deliverables

  • Redesigned functional website on wix
  • Design Files

Project Specifications

  • Analyze the existing website and decide what can be done to improve the User Experience and the User Interface.
  • Come up with colors and fonts to be used for the website that compliment the brand/logo colors
  • Create visually appealing designs for each of the pages.
  • Adhere to the created branding to keep all the pages on the website consistent with one another.
  • Develop an error free and complete website.

Process

The process of redesign started with us analyzing the pre-existing website to gather information and understand what pages needed to be consolidated and what sections needed to be given more importance.

Each person in the team went through various section and made site maps and suggestions as to what needs to be maintained and what can be removed/consolidated.

In the second stage, we moved on to looking for more inspiration and references and worked on coming up with sketches for the redesign. Each person in the team worked on different pages.

Discussions were held to decide on the general theme of the website and components that needed to be designed first, so they can be easily used on the pages.

We decided to work on Figma as it allowed for easy creation of components and reusability and collaborative tools.

I worked on creating a basic design system that could be used by the other designers in the team to design each of the pages they were assigned to.

Using these components each of the designers worked on creating the designs from the sketches. Once the initial pages were ready, I started working on consolidating them to make sure all the pages followed the same theme and had a general flow.

Once the initial pages were consolidates, the developers started developing them, we initial thought of developing on wordpress, but as per the client's request, we switched to wix.

Testing was done in parallel with the development as it was crucial that a smooth function of the website on all platforms and screen sizes was ensured.

Takeaways

The biggest takeaway from this project is the importance of working in teams. It proved to me once again that it makes work a lot more enjoyable and gives rise to new, better and interesting ideas and designs.

I was able to lead a team that was diverse and was able to collaborate with the branding team that worked on creating some other assets we needed. The whole process gave me valuable insights and practical knowledge in leading a team and carry a project to fruition.

Tools Used

figma icon illustrator icon photoshop icon