NULEEP – Freddy Chen

Nuleep

Improving landing page conversion & mobile engagement

Product Designer | Research Lead

Nuleep is a career growth platform for the modern job-seeker. The platform emphasizes value-matching and helping job-seekers find the right fit in their employers.

Over the course of three weeks, our team performed a heuristic analysis, designed wireframes, and conducted usability testing.

Working towards Nuleep’s goal of improving conversion and engagement, we delivered two revised landing pages and a fully functioning mobile app prototype.

Team Members

Freddy Chen | Xin Ma | Bennett Jobling

Tools

Figma | Sketch | Miro | Google Suite

Discover | Competitive Analysis

Setting the stage

As anticipated, the job search engine landscape is fairly mature – and relatively full-featured as a result.

Considering the chicken and egg problem inherent to marketplaces, we conducted a competitive analysis to look for opportunities to build an invested and sustainable userbase.

Define | User Interviews x Affinity Mapping

Understanding our users

As members of the target audience, it was critical for us to interview a variety of other users to prevent any implicit biases from our own job-seeking experiences impacting our design choices. Some of our key takeaways were:

Define | Personas

Our users in a nutshell

David Gomez

21 | Senior at USC | Software Engineer

Scenario

With graduation close at hand, David knows he wants to stay in Los Angeles, but isn’t exactly sure what companies he wants to work for. He knows he wants somewhere with good pay with a bit of startup culture.

Needs

Having easily accessible career guidance and resources. Being able to conveniently apply to the most compatible jobs with his skillset.

Emily Sinclair

30 | Digital Copywriter at HBO

Scenario

Escaping the ad agency world to work in entertainment, Emily enjoys copywriting, but has been frustrated by her growth prospects. She has started to look out for other jobs and companies with better work-life balance.

Needs

Some structured format for career development. Emily has blazed her own trail up until now, but would definitely appreciate some trusted and experienced guidance.

Define | Problem x Solution

Bringing it all together

Problem Statement

Job seekers need a way to discover employers that align with their values to find career fulfillment while developing their professional experience.

Solution Statement

We believe that by improving Nuleep’s information hierarchy to prioritize employer values, benefits, and culture, job-seekers will be able to find the job-hunting process more personalized and less frustrating.

Design | Early Usability Testing

Testing the current site and app

During usability testing of Nuleep’s current landing page, a significant majority of testers were confused about what the primary call-to-action on the page was.

50% of testers were unclear if they could search for jobs on the website, an expectation based on their existing job-seeking activity primarily taking place on a desktop/laptop vs mobile.

To maintain design direction and team alignment, we came to an agreement with Nuleep that for now, the website would serve exclusively as a landing page to convert users to download the app.

With Nuleep’s team being so small, the mobile app wasn’t fully built out at the time. However, none of our testers discovered that they could swipe left and right on the homepage to browse jobs.

The usage of emojis contributed to a less professional appearance and lowered tester confidence in the validity of the app. There was also a confusing hierarchy of profile buttons on the job posting screen and it was unclear if each served a different function.

Design | Sketches x Wireframes

Prioritizing features and information

To increase the feeling of personalization, we put recommended jobs (based on value matching against a user’s profile) near the top of the home screen.

The current app also had no menus or visible sections for values, benefits, or culture so we experimented with placement on different job listing screens.

Moving into mid-fidelity wireframes, we worked on improving recognition of the icons in the bottom navigation bar.

We also moved the benefits and culture information to different tabs so that users could digest the job listing section by section without being overwhelmed.

Design | Color x Branding

Building visual cohesion and patterns

Nuleep’s existing color palette had a total of 11 colors. As a result, it was difficult to create any sort of visual hierarchy and communicate information to users about what was important and what was not.

We anchored our new palette around Nuleep’s green, a color already prominently featured in the logo, website, and Nuleep’s social media. Keeping accessibility and contrast in mind, we selected yellow as the main accent and built from there.

Deliver | Web Mockup

Final landing pages

Deliver | App Mockup

Selected hero screens

Deliver | Style Guides

Locking in a visual framework

Next Steps

The future of Nuleep

From a product perspective, there are a number of different functionalities we would like the Nuleep team to consider moving forward:

Unified Icon Language

A uniform icon set will help create a visual language for users.

Social Components

Once Nuleep acquires enough users for a closed or open beta, friends lists and other messaging features will help facilitate referrals and networking.

Career Resources

We built in a feature for users to schedule sessions with career coaches within the app and believe Nuleep should continue to lean into this as the product grows. Career guidance will help solidify Nuleep’s competitive advantage and product identity in an already crowded marketplace.

Thanks for reading! Need help solving a design problem of your own?

View Next

Navigation