Responsive Web
Atlas Redesign
Redesigning College Board’s internal student search experience through creating data-oriented structures.
My Role
Lead Product Designer
Duration
Feb - April 2023
Background
Atlas
Atlas is an internal database of students who registered for the SAT and AP exams, it used by Customer Service employees at the College Board to handle student and institutional requests.
Redesign
During this redesign process, our team focused on redesigning two main features prioritized under our MVP model: Search and Student Profile.
User Base
The primary user base of Atlas are Customer Service Employees at College Board. Users typically navigate through Atlas while being on the phone with students and educators who call in with their account requests.
Overview
Search Prioritization and Grouping
In order to provide an effective search experience to users conducting all types of searches, we used progressive disclosure to display the most commonly used advanced search options, and created groups of the additional search options to help users better sort through and locate their options.
Advanced Search: Top Five Searches
Search Groups for Additional Criteria
Search Results
Student Profile Navigation
We engaged data analytics and card sorting exercises with users to redesign the Information Architecture of the student profile section. We focused on displaying top actions and kept secondary functionalities hidden in the actions dropdown. To accommodate for the first step of Validation, we placed validation fields in the top section of the profile.
Discovery
Past Designs
Search: Advanced Search Hidden
Student Profile: Extensive functionalities hidden in dropdowns
User Research
Our team utilized low-effort research methods including User Interviews, going through existing screen recordings and looking at existing data to understand users pains and needs.
Pain-points
Difficulty accessing and locating advanced search criteria
Main actions are hidden in drop-downs or long pages, finding them becomes a time consuming process when on the phone with students
Current display doesn’t reflect realistic order use
Data Analytics
We collected data from users to on their usage and preferences for two of the features that received the most complaints: Search and Student Profile editing. After identifying the main concern of having too many field options, we decided to engage data analytics to prioritize on what fields we display in our product.
Top Advanced Searches
Top Action Types
Ideation
Redesign Summary
Main Strategy
Re-structure the design and navigation of the existing Atlas site main features, using data analytics and co-design activities with users.
Working with Constraints
Because of the internal nature of this redesign project, we were limited on both time and resources. We took the design strategy of improving the navigation as a high impact and low effort approach.
Metrics
Users spend less time completing student requests, students get help faster.
Users report improved ease of use of current site.
Students report higher levels of satisfaction from the their request calls.
User Flow
After gathering usage information by users, I worked with the team to create a user flow centering main use cases of Atlas. The use cases are sorted by three request types: requests from schools, duplicate account requests from students and other general student requests.
We identified that one of the main steps: Validation, was not reflected in the structure of the current student profile and included the step in our new wireframe designs.
Advance Search Display Options
After talking to our users and mapping out all of our search use cases, we explored two layouts on how to display the two types of searches. With both options, we wanted to improve the ease of use of advanced search to make it easily accessible to our users.
Option 1: Both Searches Available
Option 2: Tabbed Search
We designed Option 1 based off of our initial interviews, where users specifically asked to have two types of searches displayed next to each other. However, we proposed a second option that created a more straight-forward interface.
After showing users with the visualization two options, both our team and our users agreed on pursuing Option 2, as it brings more clarity and visual feedback on the type of search that is being conducted.
Card Sorting Exercise
After identifying the top request types from data analytics and user surveys. We conducted a closed card sorting exercise by identifying top actions we can take out for display from the actions dropdown, and sorted the profile fields into groups by relevance and priority.
Student Profile Wireframes
Profile Card for Validation
We designed to the top section of the student profile page as a card that display basic student information used for validation purposes over the call. The profile card displays fields that users verify from students before moving forward to handling their requests.
Navigation: Top Actions
We upgraded the navigation bar to include more main action types as discovered through data analytics and card sorting exercises.
Section Editing
We broke down profile editing fields into chunks based on relevance. Users will be able to edit information fields based on the section they belong to.
Information Architecture
After conducting card sorting exercises and user interviews, we landed on a structural approach that groups all of our information into three hierarchical levels: Action Type, Primary Actions, and Secondary Dropdown Actions.
