MyLiaison
Product Design • Website DesignCLIENT
MyLiaison - A platform for students to explore programs of colleges and universities and discover valuable resources. Liaison International, LLCSCOPE OF WORK
- UI/UX
- Design System
- Product Design
- Website Design
TEAM
- Project owned by Concentrical, LLC.
- Worked in a team of 3 UX designers.
ABOUT
Background
MyLiaison is a groundbreaking website designed to connect prospective undergraduate and graduate students with their ideal educational and career paths.
The website’s unique features include high-value articles, detailed profiles of educational institutions, and lead generation for affiliated programs. Students will be able to explore content and programs of interest, save their profile information, and click a link bringing them to the application(s) of their choice.
The copy above is taken from this article.
Constraints:
- Tight deadline
- Features and objectives not clearly defined
- Brand guidelines weren’t finalized
Overview
MyLiaison platform consists of 3 main modules:
- School Directory
- Article Directory
- User Profile
Flows UX team mostly focused on:
- Search and browse schools and articles
- Create account and complete profile
Main UX objectives:
- Landing page – Provide social proof since it’s a new product on the market. Lead users to search and browse school profiles.
- School Profile page – Provide clear and concise information students actually need. Lead users to main CTA – Apply or Create Account.
PRODUCT DESIGN
Filter
Filtering search results is one of the platform’s most essential functions. It was critical to create an easy to use filter for users. We tried to employ the most user-friendly choices while maintaining accessibility.
Both grad and college filters use four different filter item types. Three of them are expandable and share the same heading, whereas one is not expandable and is simply a checkbox.
School Profile
We conducted competitor research to determine how we may improve the display of student-relevant information. Because most competitors use the same database as MyLiaison, the design and usability of these pages were critical in distinguishing themselves and keeping users engaged.
- The type of school and association with liaison are indicated by the tags and badges at the top of the page.
- Sticky navigation on the left provides overview of the content and easy navigation.
- In certain areas, such as the Quick Facts section at the top, the boxes indicate the most significant information, which is shown prominently.
- To make the statistics easier to read and more aesthetically pleasant, infographics were created.
User Profile Flows
We devoted a lot of time to designing fluid workflows for both the platform’s account creation process and any further user journeys inside the user profile pages.
Due to the constraints of needing to gather a large amount of information from users, it was a challenge to organize all of the necessary questions into logical sections and to create input fields that were simple to navigate.
Create account and Complete profile flows.
DESIGN SYSTEM
Colors
A challenging color scheme was handed over to us by the client. To make the palette easier to work with, we introduced just a few neutral colors to it.
School Profile Components
School profile cards, infographics and tables.
Resources Components
Some of the components created for blog pages.
Main Navigation
Input Fields
One of the most challenging components we had to create.