Student Employment and Career Exploration (SECE)
Employer Flow Redesign
At a Glance
SECE is the University of Hawaiʻi’s job platform connecting students across all campuses with on- and off-campus employers. It plays a vital role in helping students secure their first jobs and internships, often shaping the foundation of their careers.
In this project I was tasked to redesign the entire website which has around 10–15 pages and even introduce a new landing page for the site. But in this case study, I am going to talk only about the employer flows.
Tools
Figma
Problem
SECE’s interface is outdated and does not reflect the University of Hawaiʻi’s branding. Employers face friction from long, cluttered forms, unclear distinctions between jobs and internships, and ambiguous status labels such as Hold or Under Review. The dashboard offers minimal information compared to established platforms like LinkedIn or Indeed, leaving employers with little insight into their postings. In addition, the splash page feels dated, and the login/sign-up process creates unnecessary barriers for new users.
Splash page is outdated and does not reflect the branding of University of Hawaii
The old login relied on segmented options with poor hierarchy and outdated design, creating unnecessary clicks.
The outdated dashboard offered limited functionality and unclear options, leaving employers uncertain about posting internships or linking to external applications.
Our Vision
We set out with three core goals:
Modernize the platform: Refresh the UI to create a more intuitive and efficient hiring experience.
Establish a cohesive identity: Align the design with the University of Hawaiʻi’s brand to build trust and reflect the platform’s importance.
Streamline employer workflows: Simplify job posting and reduce friction in forms and navigation.
Increase transparency: Provide clear job status updates and a dedicated splash page for guidance.
Rapid Prototyping
Due to budget/time constraints I created multiple mid-fidelity mockups and iterated from there. After showing the first version to the my managers and stakeholders, they came to the agreement that the website needed to use more of UH’s color.
Version 1
After receiving the feedback, I changed the color palette to reflect UH’s branding more as well as polished most pages and their components.
Version 2
Setbacks
This is where I reached my first couple of setbacks. First of all, I didn’t utilize a UI library before building out most of the pages which made the design process slow at times. This would also impact the development phase. Second, some of the color did not meet WGAA accessibility. As a result, I furthered iterated the design to meet accessibility standards and utilize more components from a UI library but still reflect UH branding.
Version 3
Handoff
In order to make the development easier, I annotated each flow and added their components next to each frame so the developer did not have to spend time trying to find each component.
Final Designs
