The designer conducted user research and created personas, journey maps, and problem statements to understand how to design a job search platform for recent graduates. Wireframes and prototypes were developed for both a website and app. Usability studies identified areas for improvement, which were addressed in revised mockups. An accessible, high-fidelity prototype was created, and the designer considered next steps like additional user research and testing.

1. Next Gen Circle Design
Eniola “OJ” Oshiafi

2. The product:
Next Gen Circle is a virtual employment center
supporting recent college graduates to launch their
career journey—through skill-building events, actionable
content, networking opportunities, and, of course, a direct
line to real jobs, internships and employers.
Project overview
Project duration:
February 2023 to April 2023.

3. The problem:
Recent college graduates want a platform
dedicated and tailored to them to assist
them in searching for and applying to early
career roles.
Project overview
The goal:
Design a multi-platform job search service for
Next Gen that allows patrons to filter and
search for jobs that match their skills and track
their applications as well as get career advice.

4. My role:
UX designer designing a website (desktop
and mobile) and app for Next Gen from
conception to delivery.
Project overview
Responsibilities:
Conducting interviews, paper and digital
wireframing, low and high-fidelity
prototyping, conducting usability studies,
accounting for accessibility and iterating on
designs.

5. Understanding
the user
● User research
● Personas
● Problem statements
● User journey maps

6. User research: summary
I conducted interviews and created empathy maps to understand the users I’m designing for
and their needs. A primary user group identified through research was recent college
graduates (less than 12 months) who are actively or were recently searching for jobs.
The user group confirmed initial assumptions about Next Gen: the fact that the website was
not compatible with mobile phones. Research also revealed that there was a desire for a way to
save jobs and see when job postings are going to expire.

7. User research: pain points
Target User
Recent graduates spending
too much time sourcing early
career job postings from
different platforms because
there is no centralized
platform curated specifically
for them.
Features
Not being able to save
jobs and return to it. Also
not being able to see
when job postings will
expire.
Accessibility / IA
Several job search websites
not having a responsive
design to mobile phones
because the company is
aggressively marketing the
app instead but not
everyone has space for a
new app.
1 2 3

8. USER PERSONAS

9. Bibi
Age:
Education:
Hometown:
Family:
Occupation:
21
College Graduate
New York City, NY
Lives with parents
Unemployed
“At this point, job searching has become a 24/7
endeavor so I need to be able to continue where I
stopped on the app when I’m on the go.”
Goals
● To be able to refine his search
according to location and
skills.
● To be able to save job
postings so he can return to
them at a later date.
● To be able to switch from
desktop to app when he’s on
the go.
Frustrations
● No centralized platform
dedicated to early career
folks like him
● Not being able to save job
postings.
● Not being able to see when
job postings will expire.
Bibi is a 21-year-old recent college graduate who had to move in with his
parents after graduating from the New School with a degree in Media and
Communications two months ago. His job search has been long and
brutal. He wants to get a job with a salary he can live on in the city but all
the positions he sees on job sites require several years of experience
which he doesn’t have.

10. PROBLEM STATEMENT
Bibi is a 21-year-old recent college graduate searching for his
first job who a platform dedicated to recent grads like him
looking to launch their careers because they’ve been searching
for a job for two months and need a new strategy.

11. USER JOURNEY MAP

12. Persona: Bibi
Goal: Refine his job search according to location and his skills and save job postings to return to later.
ACTION
Create an account
and profile.
Search preferred
job titles.
Save job postings
and see jobs they
applied to.
Browse
networking
events.
Look through
messages from
employers.
TASK LIST
Tasks
A. Put in name, email,
and password.
B. Put in college, grad
date, major, skills and
interests.
C. Finish setting up
the profile.
Tasks
A. Search by keywords
for preferred job titles.
B. Then refine by
location and any other
preferred filter to see a
more tailored list.
Tasks
A. Save job postings
that they would like to
apply to later.
B. See jobs that have
already been applied
to.
Tasks
A. Go through events
and save those their
interested in.
B. Register for those
they can attend.
Tasks
A. Access messages
from employers through
their inbox.
B. Filter messages
according to read,
unread and replied.
FEELING
ADJECTIVE
User emotions
● Focused
● Excited
User emotions
● Focused
● Anxious
User emotions
● Focused
● Hopeful
User emotions
● Excited
User emotions
● Excited
IMPROVEMENT
OPPORTUNITIES
Area to improve
● Use drop downs for
more popular
schools and majors.
Area to improve
● Save searches on
profile.
Area to improve
● Make process
shorter.
Area to improve
● Opportunity to add
to calendar.
Area to improve
● Be able to pin
conversations to the
top.

13. ● Sitemap
● Paper wireframes
● Digital wireframes
● Low-fidelity prototype
● Usability studies
Starting
the design

14. Sitemap
I used the knowledge
gathered from my user
research to create a sitemap.
My goal here was to make a
solid information architecture
decisions that would improve
overall website navigation. The
structure I chose was
designed to make things easy
and intuitive.

15. Paper wireframes (Website)
Taking the time to draft
iterations of each screen of
the website on paper
ensured that the elements
that made it to the digital
wireframes would be
well-suited to address user
pain points. For the home
page, I prioritized a way to
direct each type of user to
their respective pages:
“employer” and “job
seeker.”

16. Paper wireframes (App)
Taking the time to draft
iterations of each screen
of the website on paper
ensured that the elements
that made it to the digital
wireframes would be
well-suited to address
user pain points. For the
home page, I prioritized a
quick start to creating an
account before moving
on to anything else.

17. The side bar for
easy navigation
that is
screen-reader
friendly.
This menu bar is
easy for navigation
between saved jobs
and applied jobs.
Digital wireframes (Website)
As the initial design phase
continued, I made sure to
base screen designs on
feedback and findings from
user research.

18. Easy navigation was a key
user need to address in the
designs in addition to
equipping the website to
work with assistive
technologies.
Easy access to
navigation
around the
website that’s
screen reader
friendly.
Digital wireframes (Website)

19. The job selection
carousel lets the user
choose a job to see
the full job
description, Seeing
the titles and
summary of several
jobs at once helps
shorten the search
process in the user
journey.
This bottom navbar
(screen reader
frriendly) is easy for
navigation between
different pages on
the platform.
Digital wireframes (App)
Easy navigation was a key
user need to address in the
designs in addition to
equipping the website to
work with assistive
technologies.

20. Low-fidelity Prototype (Website)
Using the completed set
of digital wireframes, I
created a low-fidelity
prototype. The primary
user flow I connected
was creating an
account, searching for a
job and saving them, so
the prototype could be
used in a usability study.
View the Next Gen
Circle Web Design
low-fidelity prototype.

21. Low-fidelity Prototype (App)
Using the completed set
of digital wireframes, I
created a low-fidelity
prototype. The primary
user flow I connected
was creating an
account, searching for a
job and saving them, so
the prototype could be
used in a usability study.
View the Next Gen
Circle App Design
low-fidelity prototype.

22. Usability study: parameters
Study type:
Moderated usability study
Location:
Austin, Texas, United States
Participants:
6 participants
Length:
20-30 minutes

23. Usability study: findings
I conducted two rounds of usability studies. Findings from the first study helped guide the
designs from wireframes to mockups. The second study used a high-fidelity prototype and
revealed what aspects of the mockups needed refining.
Round 1 findings
1
2
Round 2 findings
Users want the saved icon to be
annotated.
Users want to be directly log in to their
account on the home page.
1 Users need a little more negative space to
make things seem less cluttered.
2
Users need a menu bar in addition to
navbar the on the app to navigate better.
3
Users want a way to create a profile
when setting up their account.
Users need a save button on each job card.
4
Users want the “Log Out” button to be
easier to find on the app.
3

24. ● Mockups
● High-fidelity prototype
● Accessibility
Refining
the design

25. Before usability study After usability study
Mockups (App)
Early designs did not include
a menu bar, but after the
usability studies, I added a
hamburger button as part of
the header to reveal a
hidden menu. I also revised
the design to include a
highlight of the current page
location on the navbar to
give the user a clearer way
to tell what page they’re on
when using the app.

26. Before usability study
After usability study
Mockups (App)
The first usability study
revealed a request for a
create profile page during
the account creation
process. So I changed the
requests of the account
setup on the first page and
added another page to
include a place for profile
set up.

27. Before usability study After usability study
Mockups (Website)
Early designs did not include
save buttons on each job
card—only the job
description page—but after
the usability studies, I added
a save button on each job
card.

28. Before usability study After usability study
Mockups (Website)
Early designs did not include
a “Log In” button on the
home page but instead was
directing users to the
“Members” button on the
Menu Bar. After usability
studies, I added a log in
button on the homepage to
reduce the user journey and
increase usability.

29. Key Mockups (Desktop)

30. Key Mockups (Website Mobile)

31. Key Mockups (App)

32. High-Fidelity Prototype
The final high-fidelity prototype presented cleaner user flows for buying movie tickets,
selecting seats and reserving assistive equipment. View the Next Gen Web Design
high-fidelity prototype and the Next Gen App Design high-fidelity prototype.

33. Accessibility considerations
Added accessibility labels
to each of the actionable
items on the website and
annotations for them as
well and simplifying
navigation for screen
readers.
Used accessible color
palettes, fonts, being
mindful of hierarchical
headings: most important
compared to least
important.
1 2 3
Created a responsive
design for mobile devices
which can also be used for
tablets and other
secondary devices as well
as an app.

34. ● Takeaways
● Next steps
Going forward

35. Takeaways
Impact:
The website and app makes users feel like
Next Gen really thinks about how to meet
their needs.
What I learned:
While designing the Next Gen website and
app, I learned that the first ideas are only the
beginning of the process. Usability studies
and peer feedback influenced each iteration
of the site’s designs.

36. Next steps
Conduct another round
of usability studies to
validate whether the pain
points users experienced
have been effectively
addressed.
Conduct more user
research to determine
any new areas of need.
1 2

37. Let’s connect!
Thanks for taking your time to review my work on the Landmark Pet Hospital Web designs! If you would
like to see more or get in touch, my contact information is below.
Email: omoneoshiafi@gmail.com
Website: theenicollection.com