DID603A multiplatform experience Design

TOPIC: Know your worth ! Job Finder App

STUDENT: Elisa Rossi

TABLE OF CONTENTS

01 Usability Summary

02 Test Plan

03 Recruitment Plan

04 Usability Tasks

10 Site Map

11 Annotated Wireframes

31 High Fidelity Mockups

USABILITY SUMMARY
The app’s mission is to provide
a better job search instrument,
different from the currently existing
ones, better organized, easy to use,
intuitive, and accurate on the
research. The app’s aim is also to
fight against discrimination and unfair
payments, taking care of both sides
(employee and employer).
The research started with the
interview of 5 people of different
nationality and different ages.
Various questions have been asked
to understand the user’s behavior and
habits, along with preferences and
disfavors.
A brief survey has been published in
order to collect more information from
different varieties of people.
The interviews helped to define what
the users were looking for, and
what they did not want to experience.
Defining key findings and
opportunities.
This process highlighted three main
categories of users that defined
three different personas. Used as
subjects of study for the research.
After these important findings, a
prototype has been created to
satisfy the user’s need previously
highlighted by the research,
and to be tested by the persona
segment.
Three people have been invited to
participate in the usability testing, all
of them were returning participants.
Two of them were identified as the
“Mid - Level” persona’s segment
and one as the “Newbie” persona’s
segment.
The following key findings are the
results of the conducted research:
- Overall the test does not shows any
particular issue on the current app
structure and elements.
- In the first task, users have been
asked to find the job openings, the
test conducted showed that the par-
ticipants were lead to press the job
section of the Navigation bar instead
of the search section. This task has
been considered as the most difficult
to achieve.
- The easiest task to achieve is task
number 3, in which participants have
been asked to process the received
job applications, this task has an
average error of zero showing that
was the easiest to complete.
- The average time to complete the
given task is located between
01
3 minutes and 40 seconds for the
longest task to complete to 30
seconds for the quicker one.
These information gives the
following outcomes:
- Without changing the position of the
elements it may be necessary to
clarify the sections of the Navigation
Bar changing their names with more
intuitive ones, such as Job search,
and applied jobs to avoid confusion.
- Change the disposition of the
“position knowledge test” in a way
to creates a more clear path for the
users. Separate the test from the
“Modify ad” page.
- Reduce the number of applicants for
the job position shown in the “scroll”
movement, displaying them as a list
that can be enlarged or reduced.
TEST PLAN
TASK SCRIPT
1. You are tired of your current job
position would you show me how
would you look for new employment
opportunities?
2. You are the owner of a company
and you’d like to create a job opening
to attract candidates would you show
me how would you do?
3. As the owner of a company you
received a good number of candidates
would you show me how would you
process the applications received?
SEGMENT
All - Newbie, Mid Level, Veteran
All - Newbie, Mid Level, Veteran
All - Newbie, Mid Level, Veteran
02
DESIGNED SOLUTION
Login or Sign up as JobSeeker >
Click on the search section of the
Navigation bar > Set filters >
Apply filters button > Explore job
positions
Login or Sign up as Employer >
Click on the Job Ads Section of the
Navigation bar > Click on the
button “Add a New Job” on the upper
right corner of the page > Complete Ad
> Click on publish > Complete Test >
Modify Ad > Publish
Login or Sign up as Employer >
Click on the Job Ads Section on
the Navigation bar > scroll to find the
button “Explore” under the posted job
positions > click Explore > Click on
one of the profile picture of the
applicants > Opens applicant profile
> Click on “Accept application” in the
Nav bar.
or
Login or Sign up as Employer >
Click on the Search section of the Nav
Bar > Click on one of the profile
picture of the applicants > Opens
applicant profile > Click on Accept
application” in the Nav bar.
RECRUITMENT PLAN 03

PARTICIPANT N° DETAILS SESSION NEW / RETURNING

PARTICIPANT

PARTICIPANT N° 1 Andrea Ralletti Thursday 6 August Returning Participant

Age: 27 at 4.00 pm
Nationality: Italian
Location: Strathfield
Employment:
Warehouse Manager,
University Student.
Status: In a relationship

PARTICIPANT N° 2 Warren Duke Friday 7 August Returning Participant

Age: 26 at 5.30 pm
Nationality: Australian
Location: Vaucluse
Employment:
Store Manager
Status: Single

PARTICIPANT N° 3 Alessandro Frusciante Friday 7 August Returning Participant

Age: 29 at 9.30 am
Nationality: Italian
Location: Bondi
Employment: Barista,
Italian tutor
Status: In a relationship
USABILITY TASK N°1 TASK N°1:
You are tired of your current
job position would you show me
how would you look for new
employment opportunities?
PARTICIPANT Andrea Ralletti
Age: 27
Nationality: Italian
QUALITATIVE RESULTS User Sign up as Jobseeker,
inserts the sign up details and press
the sign up button, tries to press on
Job section on the Navbar, but then
successfully press on the search
section, sets filters and click on job
opening, opens the job position and
successfully applies.
User found the task easy to complete.
QUANTITATIVE RESULTS Time to complete task:
1 minute and 30 seconds
Errors: 0
COMPLETION 1 Task Completed
AVERAGE SCORE: 1
SUCCESS CRITERIA:
Login or Sign up as JobSeeker >
Click on the search section of the
Navigation bar > Set filters >
Apply filters button > Explore job positions
Warren Duke
Age: 26
Nationality: Australian
User Sign up as Jobseeker,
inserts the sign up details and press
the sign up button, press on the Job
section of the Navbar and opens it,
after a quick look of the page decides
to come back to the Profile page
pressing the Back to profile voice,
press on settings, and then reviews
and then Back to Profile again, from
there the user decides to press the
search button and finally founds the
job openings and after clicking on
one successfully applies.
User found the task a
bit complicated.
Time to complete task:
1 minute and 15 seconds
Errors: 2, Click on jobs section and
click on reviews section.
1 Task Completed
AVERAGE ERRORS: 1,67 (5/3)
PERSONA SEGMENT: 04
All - Newbie, Mid Level, Veteran
Alessandro Frusciante
Age: 29
Nationality: Italian
User Sign up as Jobseeker,
inserts the sign up details and press
the sign up button, Clicks on reviews
then on jobs, and then on settings,
and finally on search, sets the filters
and opens one of the proposed job
positions and finally applies for it.
User seems confused about the
sections of the Navigation Bar.
Time to complete task:
2 minutes and 15 seconds
Errors: 3, Click on reviews section,
jobs section and settings section.
1 Task Completed
 05

FINDINGS RECOMMENDATIONS

All the users successfully completed The job search can be included in the
the task given. jobs section of the Navigation bar.

The test performed shows that the
users try to find job openings in the
jobs section of the app, imagining to
finds what requested.
This mistake does not prevent users
to complete the task successfully.
Without changing the position of the
elements it may be necessary to
clarify the sections changing their
names with more intuitive ones, such
as Job search, and applied jobs.

The average mistakes score is 1,67

out of 3, which shows the difficulties
encountered by the users.

Overall, the users found this task as

easy to complete and the position of
the elements was intuitive.

The test did not highlight a particu-

lar issue on finding what requested,
however the jobs section results a bit
unclear.
USABILITY TASK N°2 TASK N°2:
You are the owner of a company
and you’d like to create a job
opening to attract candidates
would you show me how would
you do?
PARTICIPANT Andrea Ralletti
Age: 27
Nationality: Italian
QUALITATIVE RESULTS User clicks on the Employer sign up,
inserts the details and press the sign
up button, scrolls on the profile page,
and press on the Job Ads section of
the Navbar, clicks on the “Add a New
Job” button on the top right corner,
set the job openings parameters, and
clicks on the publish button, complete
the test, clicks on the modify ad
button and finally press publish.
User found the task intuitive.
QUANTITATIVE RESULTS Time to complete task:
2 minutes and 10 seconds
Errors: 0
COMPLETION 1 Task Completed
AVERAGE SCORE: 1
SUCCESS CRITERIA:
Login or Sign up as Employer >
Click on the Job Ads Section of the
Navigation bar > Click on the
button “Add a New Job” on the upper
right corner of the page > Complete Ad >
Click on publish > Complete Test > Modify
Ad > Publish
Warren Duke
Age: 26
Nationality: Australian
User clicks on the Employer sign up,
inserts the details and press the sign
up button, Clicks straight away on the
Job Ads section and on the “add a
new job” button, proceeds on filling
up the form with the job information
for the ad, tries to publish the ad and
opens the Position test section where
he tries to complete the test, clicks on
modify ad and finally press the
publish button.
User found the task intuitive.
Time to complete task:
3 minute and 40 seconds
Errors: 0
1 Task Completed
AVERAGE ERRORS: 1 (3/3)
PERSONA SEGMENT: 06
All - Newbie, Mid Level, Veteran
Alessandro Frusciante
Age: 29
Nationality: Italian
User clicks on the Employer sign up,
inserts the details and press the sign
up button, clicks on settings, clicks
on the search section of the Navbar,
then on the reviews section and
finally in the Job Ads section, scrolls
on the page and press the “add a
new job” button, clicks on publish
tries to modify the ad before passing
the test, then press to modify and
finally press on the publish button.
User found the task a bit
complicated
Time to complete task:
2 minutes and 31 seconds
Errors: 3, Click on the settings
section, search and review section.
1 Task Completed
 07

FINDINGS RECOMMENDATIONS

All the users successfully completed Chenge the disposition of the

the task given.
The test performed shows that the
users tend to be intuitive regarding
the position of the button designed to
create new job openings.
One of the participants kept on
pressing different sections inside the
Navigation bar in the attempt to find
what previously asked.
Overall the user finds it intuitive, but
2 out of 3 participants tried to change
the job requirements (salary) on
the same page of the position test
knowledge.
knowledge test in a way to creates the
following path:
Employer profile > Job Ads >
Add new job button > Publish >
Error message if some of the
information are incorrect, from
here you will be able to modify the
Ad without changing page > Press
publish > Position knowledge test > if
successful the job will be posted, if not
it will be necessary to re-take the test.

One of the users suggests separating

the knowledge test from the “modify
advertisement” section.

The task itself has not been perceived

as difficult to complete.
USABILITY TASK N°3 TASK N°3:
As the owner of a company
you received a good number of
candidates would you show me
how would you process the
applications received?
PARTICIPANT Andrea Ralletti
Age: 27
Nationality: Italian
QUALITATIVE RESULTS User login as Employer, Click on the
Job Ads section of the NavBar, scrolls
to read the information and clicks on
the “explore” button, clicks on one of
the applican profile and after scrolling
on the profile accept the application
pressing the accept button.
User found the task particuarly easy
to complete.
QUANTITATIVE RESULTS Time to complete task:
1 minutes and 40 seconds
Errors: 0
COMPLETION 1 Task Completed
AVERAGE SCORE: 1
SUCCESS CRITERIA: 2 designed paths PERSONA SEGMENT: 08
Login or Sign up as Employer > All - Newbie, Mid Level, Veteran
Click on the Job Ads Section on
the Navigation bar > scroll to find the
button “Explore” under the posted job
positions > click Explore > Click on one
of the profile picture of the applicants >
Opens applicant profile > Click on
“Accept application” in the Nav bar.
Login or Sign up as Employer >
Click on the Search section of the Nav Bar
> Click on one of the profile picture of the
applicants > Opens applicant profile >
Click on “Accept application” in the Nav bar.
Warren Duke Alessandro Frusciante
Age: 26 Age: 29
Nationality: Australian Nationality: Italian
User open job ads from the Employer User from the Employer profile clicks
profile, clicks on the “explore” button, on the Search section, click on one
clicks on one of the suggested of the applicants profile and finally
applicants, and after opening the clicks on the accept button.
profile accept the application
pressing on the accept button.
User found the task particuarly easy User found the task particuarly easy
to complete. to complete.
Time to complete task: Time to complete task:
40 seconds 30 seconds
Errors: 0 Errors: 0
1 Task Completed 1 Task Completed
AVERAGE ERRORS: 0

FINDINGS
All the users successfully completed
the task given.
The test performed shows that this
task was particularly easy to
complete.
The average of error for this task is
zero which means that all of the
participants did not have problem on
completing it.
09
RECOMMENDATIONS
Even if this task was considered as
easy to complete there is always a
margin of improvement, for example
is necessary to consider the option of
reducing the number of applicants in
the “scroll” and displaying them as a
list that can be enlarged or reduced.
 SITE MAP 10

SIGN IN / LOGIN

JOBSEEKER EMPLOYER

SEARCH REVIEWS JOBS SETTINGS SEARCH REVIEWS JOB ADS SETTINGS

ANNOTATED WIREFRAMES 11

1.0 SIGN UP 1.1 SIGN UP FORM

1. Logo displayed only in the

1. Sign up and 2. Login Page.
The logo will slide from the top
to the final displayed position.

1. Email field, on tap the alphabet

keyboard will be shown.
2. Tap to open
page 1.1 Sign up Form. 2. Password field, on tap the alphabet
keyboard will be shown. The password
will be visible until fully typed and then
2. As above. will be converted in dots.
3. If selected will import your
information from Behance or LinkedIn.
This process will require authorization
from these websites.

4. On tap will opens 3.0 Employer

Profile or 4.0 Jobseeker Profile
3. Tap to open depending on what previously
page 2.0 Login selected in page 1.0 Sign up.

5. If selected will save the details

previously inserted in the Email and
Password fields.
ANNOTATED WIREFRAMES 12

2.0 LOGIN 2.0 LOGIN FORM

1. If the user is an existing one

the app will automatically display the
correct login form, but with the option
of changing the profile if needed 1. This form will automatically appears
(for example if an Employer owns a on the login page.
Jobseeker profile and vice versa).

2. On tap will opens 3.0 Employer

Profile or 4.0 Jobseeker Profile
depending on what previously
selected in page 2.0 Login.
ANNOTATED WIREFRAMES
3.0 EMPLOYER PROFILE
1. Profile picture, the profile picture
will be inserted using the Edit icon.
(see below).
2. On tap the entire profile will be
visualized in Edit mode.
3. Information relatives to the profile
owner, in this case the company
information such as email / contact
details address etc.
4. On tap the link will bring the user to
the website page, opening a new tab
on the Browser.
13
3.0 EMPLOYER
PROFILE NAVIGATION
1. Notifications are displayed with a
little circle above the section’s icon.
2. On tap opens page 3.4 Employer
Settings
3. On tap opens page 3.3 Employer
Job Ads
4. On tap opens page 3.2 Employer
Reviews
5. On tap opens page 3.1 Employer
Search
All the above-described sections are
accessible either tapping on the icons
or horizontally scrolling (left and right).
6. The navigation’s icons will change
color when the corresponding pages
are opened.
ANNOTATED WIREFRAMES
3.0 EMPLOYER PROFILE
SCROLL 1
1. Profile pictures of the team
members, on tap the profile of the
selected person will opens.
The complete list of members is
visible horizontally scrolling (left and
right).
2. The environment descriptions are
modifiable using the Edit mode.
3. On tap they open the section 3.3
Employer Job Ads.
4. Automatically displayed and always
visible for the owner of the profile and
the users visiting the profile.
14
3.0 EMPLOYER PROFILE
SCROLL 2
1. On tap, the pictures will be
magnified and displayed in full size.
The pictures are visible horizontally
scrolling (left and right).
2. Reminders, the visualization mode
is shown in this screen is the “owner”
of the profile, while the one shown
below is the one visualized by the
visitor of the profile.
The user can select a date and an
hour using the picker, the owner of
the profile will receive a real time
notification visible as beside (left
screen).
ANNOTATED WIREFRAMES 15

3.1 EMPLOYER SEARCH 3.1 EMPLOYER SEARCH

SCROLL 1
1. On tap brings you back to page
3.0 Employer Profile

2. On tap brings you back to page

3.3 Employer Job Ads.

3. Profile pictures of the applicants,

on tap the profile of the selected
person will opens (page 3.3.2.1
applicant profile). The complete list
of members is visible horizontally
scrolling (left and right).
ANNOTATED WIREFRAMES 16

3.2 EMPLOYER REVIEWS 3.2 EMPLOYER REVIEWS

SCROLL 1

1. On tap brings you back to page

3.0 Employer Profile.
ANNOTATED WIREFRAMES 17

3.3 EMPLOYER JOB ADS 3.2 EMPLOYER REVIEWS

1. On tap opens the page 3.3.1 Add SCROLL 1
new job.
In this page all the job openings
availables are displayed.

1. Automatically displayed when

receiving notifications.
2. On tap, opens 3.3.2 Applicants for
the jobs.
ANNOTATED WIREFRAMES 18

3.3.1 ADD NEW JOB 3.3.1 ADD NEW JOB

SCROLL 1

1. Fillable text fields, on tap,

the alphabet keyboard will appear, 1. On tap, this button will send the
the text will be automatically typed word underneath the field text.
suggested while typing. 2. tapping the cross the text’s case will
be deleted.

2. On tap, the button will stay

selected changing from orange to
blue for the selected state. It won’t be
possible to select more than one
button at the time.
ANNOTATED WIREFRAMES 19

3.3.1 ADD NEW JOB 3.3.1.1 ADD A JOB TEST

SCROLL 2

1. Error message automatically

displayed if the information previously
inserted are incorrect.

2. Error icon to notify the user of the

incorrect field.

3. On tap the link will bring the user to

the website page, opening a new tab
on the Browser.

1. On tap, this button will opens

page 3.3.1.1 Add a job test.
ANNOTATED WIREFRAMES 20

3.3.1.1 ADD A JOB TEST 3.3.1.1.1 POP UP

SCROLL 1

1. On tap, the button will stay

selected changing from orange to
blue for the selected state.

1. On tap, will opens page 3.3.1.2

Modify after test where it will possible
to modify the prefilled ad where the
2. On tap, will open a Pop - up information where indicated as
showing the result of the test incorrect.
conducted, if the test is unsuccessful
the user will be forced to re-doing the
test until successful and it won’t be
possible to publish the job ad.
ANNOTATED WIREFRAMES 21

3.3.1.2 MODIFY AD AFTER TEST 3.3.1.2 MODIFY AD AFTER TEST

SCROLL TO THE BOTTOM

1. On tap, will opens page 3.3.1.3

Job Published.
ANNOTATED WIREFRAMES 22

3.3.1.3 JOB PUBLISHED 3.4 EMPLOYER SETTINGS

1. Automatic Feedback message

to notify of the successful operation.

2. On tap, will opens page 3.0 1. Button to enable and disable

Employer Profile. notification.

2. On tap, will opens page 2.0 Login.

ANNOTATED WIREFRAMES 23

3.3.2.1 APPLICANT PROFILE 3.3.2.2 ACCEPT APPLICANT

1. On tap, it will shows the underneath

message.

1. On tap, this button will opens page

3.3.2.2 accept applicant.
ANNOTATED WIREFRAMES 24

3.3.2.1 APPLICANT PROFILE 3.3.2.3 DECLINE APPLICANT

1. On tap, it will shows the underneath

message.

1. On tap, this button will opens page

3.3.2.3 decline applicant.
ANNOTATED WIREFRAMES 25

4.0 JOBSEEKER PROFILE 3.0 JOBSEEKER

PROFILE NAVIGATION

1. On tap opens page 4.4 Jobseeker

Settings

2. On tap opens page 4.3 Job status

3. On tap opens page 4.2 Jobseeker

Reviews
1. Blue background color to
4. On tap opens page 4.1 Jobseeker
distinguish it from the Employer profile
Search

All the above-described sections are

accessible either tapping on the icons
or horizontally scrolling (left and right).
ANNOTATED WIREFRAMES 26

4.1 JOBSEEKER SEARCH 4.1 JOBSEEKER SEARCH

SCROLL 1

1. On tap, the button will stay 1. On tap, it will opens page

selected changing from blue to 4.1.1 Error message.
orange for the selected state. It won’t
be possible to select more than one
button at the time.

2. On tap, the button will show the

job matching the used filters. (see 4.1 2. On tap, it will opens page 4.1.2 Job
Jobseeker Search scroll 1.) selected.
ANNOTATED WIREFRAMES 27

4.1.1 ERROR MESSAGE 4.1.2 JOB SELECTED

1. On tap, it will opens page 4.1.2.2

Job opening Company Profile (below).
The picture of the company will be
displayed in the circle.
1. On tap, it will opens page 4.1.2
Job selected.
ANNOTATED WIREFRAMES 28

4.1.2 JOB SELECTED 4.1.2.1 KNOWLEDGE

TEST MODAL TOP VIEW

1. On tap, it will open the knowledge

test Modal (4.1.2.1), that will appears
from the bottom to the top, with an
animation that will bring the user back
to the top of the page.
ANNOTATED WIREFRAMES 29

4.1.2.1 KNOWLEDGE 4.1.2.3 APPLICATION SUCCESSFUL

TEST MODAL SCROLL

1. On tap, it will shows the underneath

message.
1. On tap, it will open page
Application successful (4.1.2.3)
ANNOTATED WIREFRAMES 29

4.3 JOB STATUS 4.3 JOB STATUS

SCROLL

1. On tap, it will opens the Pop Up

4.3.1 that will appears covering the
entire page with a black transparent
filter.
ANNOTATED WIREFRAMES 30

4.3.1 POP UP Page 4.4 Jobseeker Settings, and

Page 4.2 Jobseeker Reviews, are
designed to be exactly the same as
per page 3.4 Employer
Settings, and page 3.2 Employer
Reviews, with the only differences of
the blue background as per the style
of the Jobseeker Profile.

1. On tap the pop up will disappears.

HIGH FIDELITY MOCKUPS
31
Jobseeker Profile
HIGH FIDELITY MOCKUPS
32
Employer Profile