Project Overview
PROJECT SUMMARY
This project involved revamping the university's official admissions UX journey to make it more effective and intuitive for students and parents interested in applying to the university.
ABOUT THE UNIVERSITY
Habib University is my alma mater. It is an institution specializing in liberal arts education. Supported by the House of Habib, the university was founded in 2014.
TARGET AUDIENCE
-
Prospective students | Parents
-
Influencers (Peers, Alumni, Counsellors, High School teachers and principals, etc.)
-
Donors
ROLE
UX/UI Designer (Me) | Content Writer
DURATION
Aug 2021 - Dec 2021
THE
PROBLEM
The existing website had numerous issues in terms of user experience, structure, and layout. Both content and design placement required refinement. This led to numerous calls to the school, resulting in missed admission opportunities.
Old Design
CALL TO ACTION BUTTON
NAVIGATION
-
Hard to find and not highlighted properly

COLOUR CONTRAST ISSUES
-
No navigation to help users understand their current location on a website.
-
Side navigation took up space and looked awkward
ORGANIZATION OF INFORMATION
A lot of information was hard to find because of the structure.

User Research
METHODOLOGY - Interviews
-
Duration: 15-20 minutes
-
Location: Habib University
-
5 students
MAIN THEMES AND FINDINGS

1. WEBSITE STRUCTURE AND ORGANIZATION
-
The page lacked clear organization, resulting in difficulty for students to find information.
-
The existing layout did not effectively guide users to the desired information, leading to frustration and decreased engagement.
-
Navigation elements were positioned on the side, which did not align with the desired website structure and branding.
-
Separate sections for students applying through HU TOPS (Habib University’s Talent Outreach, Promotion, and Support Program is designed for students who are enrolled in Pakistan’s Board of Intermediate Education (BIE), Federal Board (FB), and the Aga Khan University Examination Board (AKU-EB) for their Intermediate Education) and regular admissions.

2. VISUAL APPEAL AND BRANDING
-
The aesthetics of the page were subpar and did not reflect the organization's branding and values effectively.
-
Design elements were unattractive, potentially impacting user perception and engagement.
-
The placement of navigation elements detracted from the desired website appearance and brand consistency.

3. USER ENGAGEMENT AND ACCESSIBILITY
-
The call-to-action button was not easily noticeable, reducing its effectiveness in prompting user actions.
-
Color contrast issues were present, posing accessibility challenges and potentially hindering information retrieval.
Mockup - Web
The following includes only the main landing page. This project involved revamping all the user journeys from the first page until the user clicks or taps on 'Apply for Admissions'.
USER ENGAGEMENT & ACCESSIBILITY - MAIN CALL-TO-ACTION
Redesigned and highlighted for easy access
VISUAL APPEAL + BRANDING - NEW FEATURES
Student blogs showcasing their experiences abroad and other adventures.
VISUAL APPEAL & BRANDING - NEW FEATURES
Contact the admission office more easily. This is mostly what I saw on other school websites that was lacking here. They didn't provide information for contacting the admissions office for queries, creating frustration among users.










USER ENGAGEMENT & ACCESSIBILITY -
MAIN CALL-TO-ACTION
WEBSITE STRUCTURE & ORGANIZATION + VISUAL APPEAL & BRANDING - NAVIGATION
Redesigned navigation for all pages to where users expect it, improving user familiarity and providing a seamless browsing experience.
WEBSITE STRUCTURE & ORGANIZATION - IMPORTANT INFORMATION
Included important information such as main application guides, deadlines, and program-specific criteria, on the main page, accompanied by brief descriptions for easy user navigation. This will provide users with some initial information before they delve deeper into their research on what they want to pursue.
USER ENGAGEMENT & ACCESSIBILITY - COLOUR CONTRAST
Ensured everything has good colour contrast for easy viewing by all. This will ensure that users are able to see important information and does not exclude those who have colour blindness.
Redesigned and highlighted for easy access. This will ensure that even if users scroll down to the last sections, the 'Apply for Admissions' button is always accessible to them.
Mobile Responsive
Design
DESIGN CHALLENGE
The design required additional attention due to the discussion surrounding the amount of scrolling within the website. Considering that a significant portion of users accessed the website through their phones, convenience and affordability were key factors to consider. It was acknowledged that not many users in Pakistan might be able to afford a laptop.

DECISION TAKEN
After thoughtful consideration, it was agreed that users would prefer scrolling, aligning with the behaviour seen on social media platforms. This design choice optimizes the user experience, especially for those accessing the website via mobile devices in Pakistan.
Project Learnings
-
Continuous Feedback Loop: Emphasize the importance of maintaining a constant feedback loop with clients throughout the design process. This ensures that their evolving needs and expectations are understood and incorporated into the design effectively.
-
Research-Backed Design Decisions: Reinforce the principle that all design decisions should be backed by thorough research. This ensures that design choices are not arbitrary but are informed by data and insights, ultimately leading to more effective solutions.
-
Comprehensive Understanding of Developmental Capabilities: Stress the significance of designers having a deep understanding of the full range of developmental capabilities and constraints. This knowledge enables designers to create designs that are not only visually appealing but also feasible and efficient to implement.
-
Effective Communication and Negotiation: Acknowledge the importance of effective communication and negotiation skills when facing pushback or resistance to design changes. Clear communication of the rationale behind design decisions and willingness to address concerns can facilitate consensus and progress in the project.
Let's Connect
Open for collaborations or simply a friendly chat!
Reach out to me at gulaysyeda@gmail.com