AP Student Scores
Project Description
The AP score reporting portal for students needed to undergo a re-platforming redesign to align with College Board technology, to the College Board brand, and improve the user experience of accessing scores in the greater context of their AP experience.
Role
I was the dedicated UX lead of this project and owned the product experience end to end. This included everything from the initial strategy to the design of the user interface details, design support during implementation, and leading user research activities including user testing. I established design schedules, prioritized features, and established a productive relationship with the team and stakeholders built on trust. Toward the latter part of the project also oversaw a junior designer.
Research & Discovery
Research & Analysis
At the beginning of the project I looked to identify problems & opportunities with the existing application. These were identified using a few data sources, including Mouseflow recordings of users on the existing site, user surveys, and known pain points from AP Program & Customer service.
Synthesis & Recommendations
I reviewed these problems & opportunities with the stakeholders to identify both priority & feasibility for the initial redesign, as well as highlighting considerations for the longer term. I created a project brief to outline our goals.
My AP Integration & Info Architecture
One strategic improvement I proposed was to make accessing scores easier for students by integrating with their existing My AP dashboard. This involved not only how scores would be summarized & accessed through the My AP dashboard, but also how the app’s overall architecture could be integrated with My AP & the AP Student sites. This would allow all of the AP information to be centralized, addressing student feedback found in research.
I proposed updates to the information architecture as well as an integration plan with concepts for the dashboard. I organized the related product teams to align on these proposals.
Ideate & Define
Wireframes
Centering on roles of user & their key user needs, I developed initial wireframe flows, then tested the key flows with users.
Since the existing site was not mobile friendly and designing for mobile was a goal of the project, I took a mobile first approach.
User Testing
I worked with our User researcher to recruit AP Students to test the wireframe flows. I developed a testing guide and moderated user tests with the students.
After user testing, I analyzed and consolidated the feedback. I worked with product owners to prioritize and put together an action plan to address it.
Visual Design
Initial Direction Concepts
I created three initial visual design concepts to and presented them to stakeholders to determine a general design direction.
We chose direction B because it conveyed the achievement in taking AP courses, as well as driving home the purpose of the scores for college credit. I also pulled in imagery used for courses from other College Board materials to further unify the branding and distinguish the courses.
Direction Refinement & Iteration
Once the direction was chosen, I continued to iterate and refine the design. I was guided by the use cases to evolve the designs in the following ways:
More emphasis on one course card since students typically take 1-2 courses per year
Emphasis on use of scores for college credit & to celebrate the achievement of taking AP as program objectives
Optimizing the cards for their various breakpoints with an emphasis on mobile
The first refinements of the course cards involved visualizing the score scale, but taking into account stakeholder feedback the design continued to evolve to further emphasize the program message of celebrating the AP achievement in completing challenging AP courses and of using scores for college credit with illustrations & messaging.
Responsive Visual Design & Design System
I designed templates and components for five breakpoints and three mobile variations. This accounted for multiple use cases & content states throughout the year.
AP Student Scores landing page across devices
Design System Guides
In addition to the scores, the score cards accounted for course variations (like subscores) and cases such as projected & cancelled scores. I designed them to serve awards as well, creating a cohesive card based design system. I put together guides to account for all of the variations and breakpoints.
Score Send Flow Design
The other major feature of the scores platform was the flow for students to send their scores to colleges. building upon the improvements proposed in the wireframes & integrating feedback from the user testing, I designed a flow that would work well across all devices.