The site is dedicated to education, so resources needed to be a main focus. Resources needed to be separated by education level: elementary school, middle school, and high school. We also needed to organize the information by segment so users could easily navigate and locate the resources they were looking for.
Our developers created a functional grouping system on the back end to group and display resources on the front end. They created a custom tagging system to display each video depending on which level of education was most applicable.
After our developers came up with a system to classify and tag each part of the site on the back end, our design team created a tiling system for easy reference on the front end. Colored tiles appear under each video resource so that users can choose which level they want to access it in: elementary, middle, or high school.
Users can also easily navigate the site by clicking on the appropriate grade level in the lessons drop down menu. Each page provides access to all available information for that grade level in one place.
The Vaccine Makers team also wanted to relate the site to the CHOP organization as a whole. The site lacked cohesion with the rest of CHOP’s digital branding. With a style guide already established, Zivtech’s design team determined how the existing concepts would best fit in with the new Vaccine Makers site. This part of the project required alignment of font styles, call to action button formats, color schemes, and content organization style.
The Vaccine Makers team wanted visitors to be aware that the site closely related to the information already offered on CHOP’s main site. This would now be evident through the use repetitive elements, such as the same drop down menu style for content organization.
The project resulted in a new site that is easy to navigate for all user segments. Teachers can find lesson plans and videos to help reinforce topics, resulting in better education around vaccine science.
Tell us about your project