Website Redesign & Social Media
Evergreen School
Role: UX Researcher, UI Designer, Developer, Marketing Team Lead
Tools: Adobe XD, Figma, Photoshop, Illustrator, Miro, Google Forms, Wix
Timeframe: 2022-2023
Overview
Evergreen Independent School was established in 1983 by a group of families looking for an alternative learning environment for their children. In the first year there were seven students in kindergarten and grade one. The school now enrols students from Explorer to grade seven.
Evergreen’s growth has been slow and controlled from its beginning to present day and a commitment to the original philosophy has remained central to the school.
Challenge
To redesign the Evergreen website that takes into account user flows, more intuitive information architecture, and compliments the current branding.
Solution
From research to high-fidelity design, we created a website which compliments Evergreen's vision and the user's needs.
Understand
Research Plan
To learn what the user's goals are when visiting the website.
Methodologies
-
Customer / Society Members Survey
-
Market Research
-
Competitive / Comparative Analysis
Participants
We will circulate a survey to the Evergreen society in order to gather feedback from members who use the site often.
Survey Results
Website Goals
To promote the schools inclusivity / focus on community and families
Accurate representation of the amazing school community
To familiarize incoming parents and children with the school
Advertising and promotion - increase awareness
What's Missing?
Parent testimonials
Shorter write ups or more photos to break up the longer reads
Images of what the different classrooms look like
A parent page to easily find all the resources from the school
Market Research and Competitive / Comparative Research of Competitors
Evergreen’s Competitive Advantage
Although Evergreen is a monthly expense families have to factor in, the school offers a lot of benefits. Public schools have large class sizes and are very structured which doesn't work for all students. The beauty of private schools is the experience can be more tailored to the needs of the individual. Evergreen's class sizes are relatively small. They also have a great student to teacher ratio. They create curriculum around the outdoors, boast a multi-acre property with a forest, garden, and pavilion, and are the most affordable option for private schools in the area.
Website Goals + Behaviour Overview
According to the analytics of the site, the majority of users enter from the Homepage and primarily go to either the Admissions or About Us pages. Unfortunately both of those pages were the least loved. They were heavy on text, without images, and did not take UX into account.
Addressing Mobile
The majority of users are viewing the site on mobile, however the responsive design wasn't addressed at all initially.
Explore
Ideate
Given all of this research, it was now necessary to create a Feature Roadmap.
PRIORITY 1
Identify User Flows
Redesign Nav Bar
New Images
Hero Image Carousel
Redesign Admission Page
Redesign About Us Page
Design for Mobile
Branding
PRIORITY 2
Add Favicon
Redesign All Pages
Restructure Content
Loading: make smoother
Virtual Tour of School Grounds
PRIORITY 3
Create Parent's Resource Page
Create Blog Post Page
Teacher Interviews
Redesign Donate Platform
Information Architecture
Card sorting, competitive analysis, and user flows were all considered when re-organizing the nav bar.
Original Header
Redesigned Header
Too Many Forms
From the surveys, it was determined that the majority of users felt there were too many contact forms on the website. Many users preferred not to use the forms at all, so to clean up the site many of them were removed.
Original Footer
Redesigned Footer
Photoshoot
The PR & Marketing team and I organized a photoshoot with the students who have media consents in order to update the current images on the website and showcase some of the core values / selling points of the school.
Social Media Presence
We established a social media strategy which included a schedule of weekly school events and listed who would be responsible for photos, write-ups, and posting to social media.
Better Signage and Community Advertising
We designed signage for Evergreen that was on par with branding and had a clear message.
We also made a plan to advertise events at the school clearly in high traffic areas. The turn outs with the new advertising strategy have been higher than expected.
Accessibility Audit
I performed an accessibility audit with UsableNet AQA. The estimated A11Y Score of this test was 3011 out of 5000 for the WCAG 2.1 AA ruleset, so obviously some work behind the scenes was necessary.
Materialize
Ultimately the PR & Marketing Team and I redesigned the site to:
-
Create a more enjoyable user experience
-
Increase time spent on website
-
Promote interaction between the school and site users
-
Better help users to reach their goals
Conclusion & Reflection
Working with the Evergreen PR & Marketing Team has been very rewarding. I've taken on new challenges (ie organizing a photoshoot with students), dove deeper into analytics and marketing in real-world scenarios, and helped create branding that the Evergreen community is proud to display.
Being the leader of a team of volunteers, I've had the challenge of managing people's talents and applying them where needed. I coordinate with the PR team, the Strategic Development team, the Administration staff, as well as the school board to work collaboratively and conscientiously in creating future work systems, roles/responsibilities, and a method for success.