Work

Craft

Contact

Back

Overview

Problem

Research

Process

Setback

Design System

Final Designs

Reflection

Mānoa Career Center

Modernizing Job Platform

for the University of Hawai'i 's

Students

Project Overview

Student Employment and Career Exploration (SECE) is the University of Hawai'i's job platform connecting students across all ten UH campuses with on- and off-campus employers. During the summer, I redesigned the student-facing experience as part of the broader Career Hub redesign. The redesign is currently in development.

Project Type

Internship

Contributions

UX Research

UI & Visual Design

Design System

Interaction Design

Timeline

5 months

Tools

Figma

Illustrator

Skip to solution

View employer flow

THE PROBLEM

A Functional Platform Held Back by an Outdated Interface

SECE's student-facing interface shared the same core issue as the employer side — an aging UI that made a functional platform feel harder to use than it needed to be.


To understand where the friction was, I gathered insights through informal student interviews, conversations with student staff, and a heuristic evaluation of the existing platform.

Unable to filter by Departments,

Pay, or Class Standing

Unable to filter by Departments,

Pay, or Class Standing

Student staff flagged this as the most common question they received from new students. Jobs in popular departments like athletics weren't easily discoverable without knowing exactly what to search for.


Some students were frustrated by having to click into a job only to find out it didn't match their eligibility or standing. There was no way to filter these out upfront.

Student staff flagged this as the most common question they received from new students. Jobs in popular departments like athletics weren't easily discoverable without knowing exactly what to search for.


Some students were frustrated by having to click into a job only to find out it didn't match their eligibility or standing. There was no way to filter these out upfront.

Outdated UI

Outdated UI

Students consistently mentioned the interface as feeling old, which affected their confidence in the platform.

Students consistently mentioned the interface as feeling old, which affected their confidence in the platform.

Job match notifications were hidden

Job match notifications were hidden

Students mentioned wanting to be notified when new jobs matching their preferences were posted.


That feature already existed in the platform — but almost no one knew about it.

Students mentioned wanting to be notified when new jobs matching their preferences were posted.


That feature already existed in the platform — but almost no one knew about it.

RESEARCH

Learning from Existing Design

I studied how established job platforms — Indeed, ZipRecruiter, and Handshake — structured their job search experience to identify layout patterns and interactions that job seekers were already familiar with. Since this is a platform directly targeted for students, I also reviewed Handshake.

Pill shaped filters are common as they’re easy to scan and adjust.

Cards are mainly designed the same with crucial information (Position, Pay, Location) listed and tags.

Quick Apply vs Apply on Company Site

Search & Location are grouped

View jobs even without logging in

Bookmark icon for saving jobs

Split modal let’s you look through jobs easily

Tabs

Closed jobs are color coded

Illustrations on empty state

Days since posting are displayed

Easily remove jobs

PROCESS

Planning My Approach

Given the internship timeline, I moved directly into high-fidelity design, iterating as I went.

SETBACKS

Dashboard Iterations

With the lack of an established design system, my first iteration for the job search lacked consistency and failed to meet WGAA requirements.


I also tried implementing a modal that opens with all the filters when you click on the filter button.

However, after showing it to some students, a lot suggested it felt a cluttered especially when you need to scroll down to reach other filters like eligibility or department.

First Iteration

Second Iterations

NEW DESIGN SYSTEM

Rebuilding the Component Library

The student flow uses the same component library built for the employer side.

Final Designs

Final Designs (Before & After)

Search Page

Students couldn't filter by department, pay, or class standing upfront. Filters are present on all pages.

A card-based layout surfaces key details like pay, program, and job type at a glance. Filter chips let students narrow results before clicking into a listing. Split-panel make job detail accessible.

Saved Jobs

Offered little organizational control. Saved jobs couldn't be manually removed

Separate tabs for Saved and Applied give students a clear view of where each job stands. Jobs can now be unsaved at any time with an undo option for safety.

Placements

No visual hierarchy, making it difficult to distinguish active from closed placements at a glance.

A clean table with tabs separates placements by status.

Documents

Documents and forms were mixed together in dense, unstyled tables with no status indicators.

Documents and official files are split into two distinct sections. Tabbed filtering and a color-coded status tag on each file makes states immediately visible.

Reflection

If I had more time & what I would do differenly:

  • Research more: I would have spoken with more students to learn about their pain points.

  • Align with the developer earlier: Knowing which UI framework the developer was most comfortable with from the start would have saved significant time.

  • Start with a UI library: Building from an established component library from day one — with proper documentation and ideally published in Storybook — would have produced a more consistent result and a smoother handoff.

  • Test before shipping: Structured user testing at key points would have validated decisions before handoff rather than leaving open questions after launch.

  • Documenting everything from the start would’ve made writing this case study easier...

© 2024 Aveline Wang

Made with love and black coffee 🖤