Designed and built features for an interactive job search map.

Overview
My role was to design, develop, deploy, and A/B test features from zero to one for a responsive web app. There were also features where, I collaborated with other engineers and designers. We worked on both the design and development part of the process. The tech stack used was Next.js, Typescript, and Tailwind CSS. My contribution led to increases in engagement and revenue.
Features
Here are some of the impactful features that I designed and implemented. If you would like to see more features or learn more about them, feel free to shoot me an email.
0 Result State
This feature introduced a 0 result state, where users could go to different slug pages to view more jobs. Also added a contact capture form for live support, where we would help users find jobs in real time. This led to an increase in job applications and time spent on the website.

Map/List View
This feature introduced the ability to switch from list view to map view and vice versa on mobile. It also included the ability to view employer cards and job descriptions on the map.




Feedback Prompt
This feature introduced a feedback prompt when the thumbs down button gets clicked. We used it to collect user feedback on employers and their listed jobs. This helped us figure out which employers and jobs to prioritize.

Filters & Job Card
This feature updated filters and decoupled the employer card from the job card. Adding filters led to more interactions with our website, as well as staying longer for users. The job card decouple led to more job applications.

Employer Filters & Job Description
This feature added employer filters in the list of jobs. This helped with organizing jobs by employers since we got rid of the employer card. There was also an update for job descriptions to include better section summaries. We used AI to summarize the long job descriptions into concise sections.

Mobile Search & Filters
This feature introduced mobile search and filters. It improved the mobile search and filter experience. This led to more searches and filter interactions on mobile devices.




Component System
I worked on the building blocks for a design system. It was something we needed so anyone can drag and drop their ideas into Figma without a designer.

Reflection
There was a lot of features that made it to implementation. But, not all got a full release because it either got scrapped or didn't perform well in the A/B tests.
Here are the key takeaways while working on this product:
- The plan and roadmap is always adapting. New and existing features can get delayed to a later release date. Continue to communicate and stay updated with what's happening.
- Designs fail and that is okay. There is no such thing as a perfect solution, things can and will break during testing. Don't see it as a failure, but rather a lesson for the future.
- Change takes time. Be persistent and continue building rapport. Never stop advocating for the user. But understand that the business side of things can slow things down.
On This Page