TransferTrack

Navigate college transfers effortlessly

Every DeAnza College student wants to transfer to a top UC. However, the path there is confusing and convoluted. TransferTrack makes a simple and user-friendly education plan using articulation agreements.

Designathon

De Anza Hacks

ROLE

UX Designer

EXPERTISE

Education

Duration

November 2023

Timeline

All design work was completed in under 24 hours

Team

1x UX Designer, 3x Developers

Background

In order to transfer from one college to another, students must meet a series of major requirements, depending on each college. Essentially, each school has different requirements, even for the same major. Assist.org, is every transfer student's best friend. It provides you with a PDF articulation agreement between your community college and a UC or CSU, which shows recommended classes for each major. DegreeWorks is used at some colleges to show graduation status.

The Problem

Transfer students struggle with complex, inefficient tools like Assist.org and DegreeWorks, which lack easy comparison features for multiple universities, making course planning overwhelming.

Current degree planning tools
The Solution

A user-friendly web application that allows students to compare multiple schools, choose classes, and create an education plan.

A user-friendly web application that allows students to compare multiple schools, choose classes, and create an education plan.

A user-friendly web application that allows students to compare multiple schools, choose classes, and create an education plan.

The Process

User Research

To learn more about the challenges faced by transfer students, I conducted a quick survey of 85 students on campus. This survey might not be entirely accurate due to sampling bias, since the students weren't randomly chosen. Nonetheless, it was clear that there was a demand for this application.

Low-Fidelity Paper Prototyping

My first step was to consult the developers on the feasibility of the project within our tight time frame. Paper prototypes provided us with a tangible starting point to gauge the project's technical viability and gave us clarity in moving forward.

Wireframing

With the green light from my developers, I proceeded to design low-fidelity wireframes. This foundational step ensured developers could start their work promptly, with a clear vision and a solid roadmap to follow.

Branding

Our color scheme, featuring UC's blue and yellow, conveyed the platform's educational context. We added a touch of purple for creativity, catering to our younger user base. The UI was meticulously crafted to be sleek, modern, and minimalistic, ensuring a smooth user experience.

My Takeaways

Figma components are powerful

I learned advanced Figma features like hover states, dropdowns, and interactive elements to closely resemble the final product. Using style libraries and well-structured components with variants made the design process more efficient and scalable.

Always check with developers for technical viability

Collaboration with developers was key. I worked closely with them to ensure the designs were technically feasible within the hackathon’s time constraints, allowing us to move quickly while maintaining quality.

Make useful things

After we presented, one of the judges told us that he was a transfer student years ago, and he wished a website like this existed back then. Fulfilling user needs was incredibly satisfying.

Let's chat at vyomi.seth@gmail.com

© 2024 – Made with care by Vyomi Seth

Let's chat at vyomi.seth@gmail.com

© 2024 – Made with care by Vyomi Seth

Let's chat at vyomi.seth@gmail.com

© 2024 – Made with care by Vyomi Seth