Brightside Educational Partners is a start-up focused on providing peer mentorship and resources for teachers. While working through the branding for Brightside Educational Partners, the website design was simultaneously underway. We combined the research phase into a single phase instead of separating them out, and then to try and save time and budget instead of creating full wireframes in Adobe XD We used prebuilt assets to built a user flow and simple wireframes at the same time.
Moodboard
Wireframes
The wireframes were created in a program called octopus.io which has prebuilt assets to create quick layouts. They were color coded to indicate repeating elements. A lot of the blocks were made to be reusable with the content swapped for different pages.
Final Designs
The final designs came together pretty quickly, we had a lot of elements to pull into the design from the branding, and the client provided a lot of great copy.
Home Page
Custom illustrations were created for the mission and values sections to help those areas stand out a bit stronger. The color choices were intentional to call out specific sections, and even specific text.
Shop Pages
The shop pages were another important component of the site. Not only does Brightside Educational Partners offer peer-to-peer mentorship, they offer resources and curriculum created by teachers for teachers in their shop.
Blog Pages
Blog archive and individual post pages meant to highlight the community aspect of their organization, and highlight their contributors.
The first thing we designed was a landing page to put up for funding events before fully building the design. This allowed us to test the branding and build out some of the reusable elements needed for the rest of the design.
