Background
Students On Ice approached Pound & Grain to rebrand their foundation that empowers youth to become advocates for a more sustainable future, through hands on education, expeditions and other initiiatives. Along with the rebrand, they were looking for us to create a new web experience to help them grow their online presence and increase exposure to the variety of programs they offered. Due to some tight timings on the client end, we chose to complete this project in a phased approach, with a 2 week sprint for design and development for each phase based on page priority. I led the website design portion of this project, while working closely with my colleagues as they finalized the branding to ensure a unified vision.
The key challenges the client wanted to address with this redesign were:
Content discovery - The existing site had a large collection of multimedia content, but they were finding that many users were having a hard time finding it.
Sub-brand differentiation - As the foundation grew, they recognized the need to create unique names for various programs and industry offerings, with this redesign they wanted to make them visually stand out from one another as well.
Increase immersion with multimedia - Use of micro-interactions, multimedia and unique interactive experiences to increase immersion for key areas within the site.
Wireframes
The wireframing stage allowed us to further build out solutions to the challenges that surfaced in the discovery stage, while defining a series of reusable content blocks to be built in Wordpress. To help the client visualize the proposed information architecture and content needs, as well as identify all of the content blocks up front, we completed the wireframing process before transitioning to the phased release plan outlined above.
Design
Once we finalized the wireframes and the functional needs for the site, we started to incorporate the branding that was happening in tandem to the web design process to really bring some personality to the site. This included defining a type scale, foundational UI elements into a shared library. This library allowed the development team to begin high level development work, while I was able to bring other designers onto the project quickly.
Once that was complete, we started working through phases of component and page layout designs while completed pages were immediately picked up by the development team.
Outcome
Through a series of phased releases, our team delivered a robust library of components within a custom wordpress theme that would enable the client to scale their website with rich multimedia content and delightful interactions seamlessly. The redesigned experience was well-received by the clients user base, especially the improved navigation and site structure.