Skip links

ISGC Website

Islamic Society of Greater Chattanooga


Date:
05/22/2018

Overview

Islamic Society of Greater Chattanooga (ISGC) is a non-profit organization registered in the state of Tennessee. ISGC practices and promotes a comprehensive and balanced view of Islam. ISGC strives to foster a nurturing and compassionate community: one that is open and welcoming to all, one that serves humanity and especially their neighbors, one that is intellectually spirited and culturally diverse.

My Role

UI Designer

Platform

Web

Task

Design a new website for Islamic Society of Greater Chattanooga or ISGC to accommodate all the content from the previous website as well as the new content.

Process

I was tasked with designing the new website based on the existing website at that moment, meaning I didn’t have to design the new one from scratch. And since it was only UI design, therefore, the process was simple as stated below:

01 Research

02 Ideate

03 Design

Research

Research was simple because the client brief gave me enough information about what to design, and who to design for. It was to be a simple static website with a few subpages for their services (information about which was provided later), designed for common people of the community. Therefore, I studied the designs of other Islamic centers.

Ideate

Sketches

Afterwards, I took to the white board and starting sketching the concept for the designs. I had to design the website to include the following sections:

  • A Hero with a slider showing Qura’anic verses and their English translations.
  • About Us
  • Services
  • Prayer Timings
  • Events
  • Contact section (with static images of address and email)

Wireframes

I designed wireframes based on the sketches above to get feedback from the client. To my surprise, the client liked and finalized the first design draft without any major changes. Therefore, I proceeded to design a high fidelity mockup based on the wireframe below:

Design

High Fidelity Mockups

The primary color of the major elements of the website had to be green, and background white. The color of text had to be a darker shade of grey instead of black. The finalized hi-fi design was then developed using WordPress. A few other subpages were later added. The entire website was developed within a week and has been up and running ever since. The finalized hi-fi design was then developed using WordPress. A few other subpages were later added. The entire website was developed within a week and has been up and running ever since.

Visit Website

Old Design

New Design