See below for the sketches, sitemaps, wireframes, design revisions during the project development process. I initially prototyped and developed this website on WordPress locally and then transferred data to a web host.
Examples of web pages below:
Ⓒ Irene Yen-Hsuan Shih, 2016
INNOVATING WATER WEBSITE
Live website: innovatingwater.com
My Responsibilities: Art Direction, Website Design & Development, Visual Design, UX & UI (2016)
Innovating Water Website initially launched and had regularly been updated since 2014; however, we would like to redesign the website for these three reasons: to provide better user experience with the latest web technologies and optimization, to deliver more engaging first-hand information, and to communicate with our target audience more directly and closely.
What is Innovating Water? Innovating Water is a sustainable community-based UV-solar water treatment system in schools and health facilities in Kenya. We as a multidisciplinary team have been working with local NGOs since 2012. (Full stories here)
In the last twelve months, we have drilled seven more bore holes, which currently provide safe clean drinking water to many more communities throughout a year! By doing so, people no longer have to travel up to twenty kilometers to collect water from permanent water sources. It benefits everyone from the communities, especially women and children, who are free from the daily water collecting now.
That's a great achievement we'd love to share on our new website. lease visit the website for further information.
Since it is a redesign project, I kept the same color palette and typefaces for brand consistency, but I changed the functionalities, layouts, and grid systems. For instance, there was a "Donate" button in the prior version of the website, but no one used that for
two years. Most of our donors and supporters are senior people, and they just contacted us directly instead of using online donation system. So we opted out that function in 2016.
Another important point is to increase the website speed; for the new design, I used the full page background video (for desktop view), and it's crucial to accelerating. Nobody waits. Speed is to today’s design what ornament was to yesterday’s. So, I used GTmetrix, Google PageSpeed Insights, and Pingdom Website Speed Test, to troubleshoot and optimize the website. Now, the PageSpeed Score is A (96%) - that's a really good number.
Innovating Water Website now presents more first-hand information and the latest progress we are continuously making and contributing for now and then.