Overview
A website redesign for a Colorado-based school, SkyView Academy. The main deliverables included:
• Persona creation
• Journey maps
• Information architecture
• High-fidelity mockups.
• Persona creation
• Journey maps
• Information architecture
• High-fidelity mockups.
ROLE
UX Researcher
UX/UI Designer
UX Researcher
UX/UI Designer
SCOPE
3-week timeframe
Worked directly with three members of Atomic Idea– a creative agency*
*some of the content below does not reflect the final designs shared with the client
Worked directly with three members of Atomic Idea– a creative agency*
*some of the content below does not reflect the final designs shared with the client
Platform
Responsive Website
Tools
Sketch, Overflow
What is SkyView Academy?
Commonly known as SVA, Skyview Academy is a charter school founded in 2004 by a group of parents to create a more challenging and meaningful educational program for their children and the community at large.
A charter school operates via a contract or “charter” between the school’s board and an authorizer, such as the local school district.
A charter school operates via a contract or “charter” between the school’s board and an authorizer, such as the local school district.
“I think that the website needs to be more visually appealing...less content overload, [and to] focus on reflecting the quality of education that SkyView offers so that prospective families can envision themselves at SVA."
- Skyview Academy website user
- Skyview Academy website user
The Challenge
Sky View Academy wanted to address numerous complaints from students, parents, and staff about the state of the current website. Another goal was to increase the number of online enrollments.
Research
User Surveys & remote interviews
I asked a series of open-ended questions to gain qualitative feedback from current staff members, parents, and students. Some questions included
• "What are you looking for when you first arrive on the school's website?"
• "What pages or sections do you visit most often?"
• "Please describe your experience of the current website"?
• "What are you looking for when you first arrive on the school's website?"
• "What pages or sections do you visit most often?"
• "Please describe your experience of the current website"?
Competitive analysis
Identifying similar websites in the education field was another valuable step taken. Alongside UX design principles and website best practices, I determined some initial UX delights and pain points.
Aspen View Academy
Kent Denver School
Colorado Christian University
Delights
• Clear call to actions (for enrollment and different schools specifically)
• Strong visual design elements that fit within each brand
• Strong visual design elements that fit within each brand
pain points
• Overwhelming amount of navigation items
• Not embracing negative space
• Not embracing negative space
Who are the users?
The SkyView board members provided a vague assumption around who the main user groups were. I was able to validate and establish two primary and two secondary personas. This was based on qualitative research above and quantitative data gathered from the content management system admin.
Goals:
• Gain general school information
• Compare info from multiple schools quickly
• Understand parent, child, and school policies
• Communicate with staff to learn more
• Gain general school information
• Compare info from multiple schools quickly
• Understand parent, child, and school policies
• Communicate with staff to learn more
Frustrations:
• Not always sure on what to look for
• Unclear on how to best compare SVA to others
• Inconsistent ways to access some pages of the site
• Wasting time on sections with a lot of content
• Not always sure on what to look for
• Unclear on how to best compare SVA to others
• Inconsistent ways to access some pages of the site
• Wasting time on sections with a lot of content
The peak and end of his journey show that improvement is needed with the hyperlinks section of the navigation.
According to Nielsen Norman Group, these two points are what the human brain remembers most clearly about an experience.
According to Nielsen Norman Group, these two points are what the human brain remembers most clearly about an experience.
I was able to pull a direct quote from a current parent during my research phase.
Goals:
• Quick access to resources such as “My School Bucks”, “Infinite Campus” and grades/homework
• Understand parent, child, and school policies
• Communicate with staff and have access to their biography information
• Quick access to resources such as “My School Bucks”, “Infinite Campus” and grades/homework
• Understand parent, child, and school policies
• Communicate with staff and have access to their biography information
Frustrations:
• Information overload, especially "Parent Resources"
• Unclear ways to access some pages of the site
• Information overload, especially "Parent Resources"
• Unclear ways to access some pages of the site
The peak and end of her journey show that improvement is needed with the COVID-19 announcement and teacher contact sections.
According to Nielsen Norman Group, these two points are what the human brain remembers most clearly about an experience.
According to Nielsen Norman Group, these two points are what the human brain remembers most clearly about an experience.
The two secondary personas and their journeys are also outlined below, showing similar frustrations to Marcus and Lauren. A few new pain points were also discovered such as outdated sports information/pictures and confusing calendar/events listings.
Information Architecture & Card Sorting
Data synthesis
During the initial user survey I sent, I included a list of categories (representing a consolidated navigation list) and a wide variety of sub-categories and asked them to associate the two groups. This was meant to replicate a UX technique called card sorting, to allow for a deeper understanding of the user's mental models.
The "Parent Resources" required the most attention to fulfill the primary persona's needs. Shown below are three iterations:
Highlighted in red are some areas and categories that were iterated upon
The SkyView team provided some navigation requirements – yet I had flexibility in structure – backed by my research
Wireframes
Client & User Feedback
navigation
The "sticky" left-hand navigation in the proposed wireframes was altered due to feedback. This led to the main navigation needing to include more content and the introduction of breadcrumbs.
additional template pages refinement
High Fidelity Mockups
After implementing design changes based on feedback and additional research on web best practices, I moved to high-fidelity mockups. I worked within SkyView Academy's branding guidelines.
Next Steps
• Request analytics report to measure time on page and enrollment
• Provide additional UX/visual design support as templates become finalized with updated content
• Provide additional UX/visual design support as templates become finalized with updated content
