Kopanang Website 2016

Kopanang 2016

Kopanang community project is a project that has been running since 2001, to uplift the lives of women on the fringes of society. This is done through offering emotional support and a caring community, an opportunity to earn a basic living through the making embroidered products. Most of the women live in shacks, around Tsakane, a township far from any town or job opportunities, have little formal education, and are affected or infected by HIV/AIDS.
The project is currently undertaking an intensive formation and training initiative, with the aim of the project becoming managed and run by the women.

The aims and focus of the project
This year we will focus on 3 areas, using your design skills to assist the community.
Redesign the website and the design of all marketing material.
Re-look at the physical space of the project.
create new or streamlined products.


Kopanang are looking to have a new improved website that will engage readers to purchase products, donate to specific needs of the project and share the website with friends and colleagues. The new website needs to include the following:
• Display of products in categories with enlarging images. There should also be a section for images of commissions undertaken by the project.
• Ability to purchase products online (This group needs to research different options for purchasing online including the cost implications to the project. This information needs to be presented to the client).
• Staff and/or community members must be able to take, prepare and upload new products into the website easily.
• The story of the project and the community.
• New projects/things happening at the project and funding needs that people can contribute to.
• Be fast to view and interact with
• This group needs to look at all the marketing material and align it to the look and feel of the website design.
• Train members to take and prepare images of products etc for digital marketing.


In order to create something good we first had to research what good was in our field of an NGO’s website design was. Thus we started by looking at the competitors websites, specifically ones that included stores and checkout systems.
We then started to create basic wireframes for the site and collaborate a full style for our design.
We then had to establish our information and condense what was already existing into headings and categories. Once we had that we generated what pages we would need and how we would organize the user navigation. We based our user navigation on ease of finding the user’s target destination, we wanted to eliminate confusion. We collaborated on generating mock ups from our wireframe designs for each of the pages on the website. We then tested our mock up design for ease of navigation and style continuity against what we had seen as good design.

Reliable webhost:
For this we went with a company called Hetzner who are south African based with a broad reputation for reliability.

Payment option:
We decided to use Payfast for their ease of use and availability of payment options with a vast reputation in South Africa.

3rd party shopping cart widget:
For this we used Magento as they are world renowned for their cart widgets.
The site coding started with the landing page as it was the source of our style construct. We created an eye catching and informative landing page with minimal but necessary information for its users. We did this by condensing descriptions for each category on the landing page accompanied with a relative picture next to each.