Home

Cases

Agency in a Box Platform

Home

Cases

Agency in a Box Platform

Agency in a Box - A job platform that puts job seekers in touch with recruiters

“

Job seekers buy connects to reach recruiters at the companies they want.

Agency in a Box logo

Agency in a Box

Responsive web platform, 2013

Agency in a Box resume page for job seekers with profile tabs, upload and the profile completeness meter
Agency in a Box resume page for job seekers with profile tabs, upload and the profile completeness meter

About the project

Agency in a Box was a US job platform planned as the next version of the Overseas Job Portal, a site for Americans looking for work at home and abroad. It sold job seekers direct contacts with recruiters and hiring managers, and let companies post jobs and review the people who applied. In 2013 we wrote the proto-personas and user stories, wireframed both sides of the product and designed the full UI for desktop, tablet and phone.

Project

Agency in a Box Job Platform

Industry

Recruitment and Jobs

Location

United States

Date

2013

“

Client Request

Agency in a Box asked us to plan and design a job platform where job seekers reach recruiters directly and companies post jobs, on desktop, tablet and phone.

Agency in a Box logo

Agency in a Box

Project proposal, July 2013

Design Pillars

Core UX Principles

Two Sides, One Front Door

Two Sides, One Front Door

Sign-up starts with one choice, company or professional, and each side then gets its own short steps.

Contacts Up Front

Contacts Up Front

Each job card shows how many emails, phone numbers and referrals the network holds for that company.

Always a Next Step

Always a Next Step

A profile meter, a step-by-step resume builder and empty states with one clear button show people what to do next.

“

“

BuiltforjobseekersAgency in a Box logo markandemployers.
Agency in a Box app screens: Agency in a Box job seeker sign-up on a phone, Agency in a Box company sign-up on a phone, Agency in a Box plan choice during sign-up on a phone

User Research

Who the Platform Serves

Job Seekers

Americans aged 18 to 55 and up, in work or not, looking for better pay at home or overseas.

Contractors

People who have worked abroad before, like a former Navy electrician who now takes contracts, and want the next one overseas.

Employers

Business owners who hire full-time, part-time and freelance staff and want more resumes to choose from.

“

“

Fourproto-personasbeforetheAgency in a Box logofirstwireframe.
Agency in a Box user stories for unregistered users

The Challenge

Problem Statement

The Main Goal: Put Job Seekers in Touch With Recruiters

Agency in a Box started from the idea that many overseas jobs are filled through personal contacts, so the contact itself was the product. The platform had to show who a job seeker could reach at each company, sell those contacts through plans and connects, and give employers simple tools to post a job and sort the people who applied.

“

This concept will combine job search, recruiter contacts, downloadable job search reports, and a company database.

Agency in a Box logo

Agency in a Box

Concept document, June 2013

Our Approach

Solution

One Platform, Two Sets of Tools

Proto-personas, user stories, a site flow, 115 wireframe pages and the full UI for the job seeker and employer sides in three screen sizes. It is an example of our Marketplace Product Design work.

01 - Sign-Up and Plans

A choice between company and professional, short sign-up steps and a free plan that starts with three connects.

02 - Job Seeker Tools

Overseas and local job search, a resume builder, saved searches, favorites, an inbox and insider contacts.

03 - Employer Tools

A dashboard, a post a job form with a preview and candidate lists for in review, short listed and rejected.

“

“

EveryscreenatAgency in a Box logo markdesktop,tabletandphonesize.
Agency in a Box contact instructions on a phone with calling tips
Agency in a Box contact instructions on a phone with calling tips
Agency in a Box contact instructions on a phone with calling tips
Agency in a Box employer dashboard before the first job is posted
Agency in a Box employer dashboard before the first job is posted
Agency in a Box employer dashboard before the first job is posted
Agency in a Box app screens: Agency in a Box job details on a phone with candidate tabs for in review, short listed and rejected, Agency in a Box confirmation before closing a job application
Agency in a Box app screens: Agency in a Box job details on a phone with candidate tabs for in review, short listed and rejected, Agency in a Box confirmation before closing a job application

Before & After

The Blueprint & Evolution

Wireframe to Final Screen

We wireframed every screen first, then designed the UI on the same structure.

  • Before: the contact instructions wireframe, August 2013.

  • After: the same screen in the final UI, September 2013.

Agency in a Box employer sign-up in three steps: sign up, company information and payment

Design

Key Features

Insider Contacts

A job seeker can reveal a recruiter’s details and pick phone, email or social, with calling instructions written for the first call.

Agency in a Box contact instructions window: reach the recruiter by phone, email or social

Posting and Hiring

Employers post a job with its category, type, salary, level and start time, preview it, then move each applicant through the hiring stages.

Agency in a Box post a job form with job category, employment type, salary and career level

Design System

Visual Identity

Typography

Lato and PT Sans from the style sheet, set larger on the phone layouts so forms stay easy to fill in.

Color Palette

Slate for headers and menus, teal and orange for actions, green for success and red for deletes and warnings.

Agency in a Box style sheet with button states and drop-down lists

UI Logic

Every button has normal, hover and clicked states, every delete asks for confirmation and every empty list points to the next step.

Agency in a Box saved jobs list with salaries and the profile completeness meter
Agency in a Box saved jobs list with salaries and the profile completeness meter
Agency in a Box app screens: Agency in a Box favorites list on a phone, Agency in a Box empty job matches tab pointing to the bio section
Agency in a Box app screens: Agency in a Box favorites list on a phone, Agency in a Box empty job matches tab pointing to the bio section
Agency in a Box payment information screen on a phone
Agency in a Box payment information screen on a phone

Impact

A Full Design Set for Both Sides

Results for Agency in a Box

By October 2013 Agency in a Box had the user stories, the wireframes and the final UI for the job seeker and employer sides at three screen sizes.

Agency in a Box logo

Agency in a Box

Agency in a Box employer sign-up, company information step

Result

By the Numbers

115 Wireframe Pages

68 for the job seeker side and 47 for the employer side.

3 Screen Sizes

Desktop, tablet and phone layouts for every screen.

4 Proto-Personas

Three job seekers and one employer, written before the wireframes.

Agency in a Box site flow for the job seeker side

Research

Personas, Stories and Flows

Starting From the People

We defined the target audience, wrote four proto-personas and listed user stories for visitors and members, such as searching jobs by industry, career level and salary. A site flow tied the stories to the screens. You can see some of the results below.

Final Showcase

The Agency in a Box Platform

Agency in a Box sign-up window asking if you are a company or a professional
Agency in a Box app screens: Agency in a Box employer dashboard on a phone with a Post a job button, Agency in a Box resume page on a phone, Agency in a Box job details on a phone with candidate tabs for in review, short listed and rejected
Agency in a Box password wireframes at desktop, tablet and phone size
Agency in a Box create an account page with the two sign-up steps
Agency in a Box target audience notes: American professionals aged 18 to 55 and up
Agency in a Box app screens: Agency in a Box confirmation before closing a job application, Agency in a Box contact instructions on a phone with calling tips, Agency in a Box favorites list on a phone
Agency in a Box employer dashboard before the first job is posted
Agency in a Box list of target job seeker groups
Agency in a Box employer sign-up in three steps: sign up, company information and payment
Agency in a Box app screens: Agency in a Box plan choice during sign-up on a phone, Agency in a Box empty job matches tab pointing to the bio section, Agency in a Box payment information screen on a phone
Agency in a Box post a job form with job category, employment type, salary and career level
Agency in a Box contact instructions wireframe from August 2013
Agency in a Box app screens: Agency in a Box company information step on a phone, Agency in a Box employer dashboard on a phone with a Post a job button, Agency in a Box job seeker sign-up on a phone

You can also check

Telenav Rhine product design case study
Telenav Rhine
Visual design for 90 wireframes based on GM Style Guide.
Platinum Shop Website product design case study
Platinum Shop Website
Car and jet rentals, rare plate numbers and luxury goods in one store.
Amplifidor influencer marketing product design case study
Amplifidor
Professional network connecting brands & influencers for campaign & talent management.
IX Office App product design case study
IX Office App
Shared reading rooms, a personal library, news and discussions on two screens.
Easyway Apps product design case study
Easyway Apps
Allen Carr’s stop smoking method as a video course on iPhone and iPad.
StartupNow Brand product design case study
StartupNow Brand
An N and an S tied into one ribbon.
Moktiv mobile app design case study
Moktiv Mobile
TikTok influencer app for song discovery, deals, and automated payments.
Backpacker Deals Website product design case study
Backpacker Deals Website
Deals on tours and activities, from the first search to the bookings calendar.
Telenav Rhine product design case study
Telenav Rhine
Visual design for 90 wireframes based on GM Style Guide.
Platinum Shop Website product design case study
Platinum Shop Website
Car and jet rentals, rare plate numbers and luxury goods in one store.
Amplifidor influencer marketing product design case study
Amplifidor
Professional network connecting brands & influencers for campaign & talent management.
IX Office App product design case study
IX Office App
Shared reading rooms, a personal library, news and discussions on two screens.
Easyway Apps product design case study
Easyway Apps
Allen Carr’s stop smoking method as a video course on iPhone and iPad.
StartupNow Brand product design case study
StartupNow Brand
An N and an S tied into one ribbon.
Moktiv mobile app design case study
Moktiv Mobile
TikTok influencer app for song discovery, deals, and automated payments.
Backpacker Deals Website product design case study
Backpacker Deals Website
Deals on tours and activities, from the first search to the bookings calendar.
Telenav Rhine product design case study
Telenav Rhine
Visual design for 90 wireframes based on GM Style Guide.
Platinum Shop Website product design case study
Platinum Shop Website
Car and jet rentals, rare plate numbers and luxury goods in one store.
Amplifidor influencer marketing product design case study
Amplifidor
Professional network connecting brands & influencers for campaign & talent management.
IX Office App product design case study
IX Office App
Shared reading rooms, a personal library, news and discussions on two screens.
Easyway Apps product design case study
Easyway Apps
Allen Carr’s stop smoking method as a video course on iPhone and iPad.
StartupNow Brand product design case study
StartupNow Brand
An N and an S tied into one ribbon.
Moktiv mobile app design case study
Moktiv Mobile
TikTok influencer app for song discovery, deals, and automated payments.
Backpacker Deals Website product design case study
Backpacker Deals Website
Deals on tours and activities, from the first search to the bookings calendar.
Telenav Rhine product design case study
Telenav Rhine
Visual design for 90 wireframes based on GM Style Guide.
Platinum Shop Website product design case study
Platinum Shop Website
Car and jet rentals, rare plate numbers and luxury goods in one store.
Amplifidor influencer marketing product design case study
Amplifidor
Professional network connecting brands & influencers for campaign & talent management.
IX Office App product design case study
IX Office App
Shared reading rooms, a personal library, news and discussions on two screens.
Easyway Apps product design case study
Easyway Apps
Allen Carr’s stop smoking method as a video course on iPhone and iPad.
StartupNow Brand product design case study
StartupNow Brand
An N and an S tied into one ribbon.
Moktiv mobile app design case study
Moktiv Mobile
TikTok influencer app for song discovery, deals, and automated payments.
Backpacker Deals Website product design case study
Backpacker Deals Website
Deals on tours and activities, from the first search to the bookings calendar.
Telenav Rhine product design case study
Telenav Rhine
Visual design for 90 wireframes based on GM Style Guide.
Platinum Shop Website product design case study
Platinum Shop Website
Car and jet rentals, rare plate numbers and luxury goods in one store.
Amplifidor influencer marketing product design case study
Amplifidor
Professional network connecting brands & influencers for campaign & talent management.
IX Office App product design case study
IX Office App
Shared reading rooms, a personal library, news and discussions on two screens.
Easyway Apps product design case study
Easyway Apps
Allen Carr’s stop smoking method as a video course on iPhone and iPad.
StartupNow Brand product design case study
StartupNow Brand
An N and an S tied into one ribbon.
Moktiv mobile app design case study
Moktiv Mobile
TikTok influencer app for song discovery, deals, and automated payments.
Backpacker Deals Website product design case study
Backpacker Deals Website
Deals on tours and activities, from the first search to the bookings calendar.
Telenav Rhine product design case study
Telenav Rhine
Visual design for 90 wireframes based on GM Style Guide.
Platinum Shop Website product design case study
Platinum Shop Website
Car and jet rentals, rare plate numbers and luxury goods in one store.
Amplifidor influencer marketing product design case study
Amplifidor
Professional network connecting brands & influencers for campaign & talent management.
IX Office App product design case study
IX Office App
Shared reading rooms, a personal library, news and discussions on two screens.
Easyway Apps product design case study
Easyway Apps
Allen Carr’s stop smoking method as a video course on iPhone and iPad.
StartupNow Brand product design case study
StartupNow Brand
An N and an S tied into one ribbon.
Moktiv mobile app design case study
Moktiv Mobile
TikTok influencer app for song discovery, deals, and automated payments.
Backpacker Deals Website product design case study
Backpacker Deals Website
Deals on tours and activities, from the first search to the bookings calendar.
Telenav Rhine product design case study
Telenav Rhine
Visual design for 90 wireframes based on GM Style Guide.
Platinum Shop Website product design case study
Platinum Shop Website
Car and jet rentals, rare plate numbers and luxury goods in one store.
Amplifidor influencer marketing product design case study
Amplifidor
Professional network connecting brands & influencers for campaign & talent management.
IX Office App product design case study
IX Office App
Shared reading rooms, a personal library, news and discussions on two screens.
Easyway Apps product design case study
Easyway Apps
Allen Carr’s stop smoking method as a video course on iPhone and iPad.
StartupNow Brand product design case study
StartupNow Brand
An N and an S tied into one ribbon.
Moktiv mobile app design case study
Moktiv Mobile
TikTok influencer app for song discovery, deals, and automated payments.
Backpacker Deals Website product design case study
Backpacker Deals Website
Deals on tours and activities, from the first search to the bookings calendar.
Telenav Rhine product design case study
Telenav Rhine
Visual design for 90 wireframes based on GM Style Guide.
Platinum Shop Website product design case study
Platinum Shop Website
Car and jet rentals, rare plate numbers and luxury goods in one store.
Amplifidor influencer marketing product design case study
Amplifidor
Professional network connecting brands & influencers for campaign & talent management.
IX Office App product design case study
IX Office App
Shared reading rooms, a personal library, news and discussions on two screens.
Easyway Apps product design case study
Easyway Apps
Allen Carr’s stop smoking method as a video course on iPhone and iPad.
StartupNow Brand product design case study
StartupNow Brand
An N and an S tied into one ribbon.
Moktiv mobile app design case study
Moktiv Mobile
TikTok influencer app for song discovery, deals, and automated payments.
Backpacker Deals Website product design case study
Backpacker Deals Website
Deals on tours and activities, from the first search to the bookings calendar.
Telenav Rhine product design case study
Telenav Rhine
Visual design for 90 wireframes based on GM Style Guide.
Platinum Shop Website product design case study
Platinum Shop Website
Car and jet rentals, rare plate numbers and luxury goods in one store.
Amplifidor influencer marketing product design case study
Amplifidor
Professional network connecting brands & influencers for campaign & talent management.
IX Office App product design case study
IX Office App
Shared reading rooms, a personal library, news and discussions on two screens.
Easyway Apps product design case study
Easyway Apps
Allen Carr’s stop smoking method as a video course on iPhone and iPad.
StartupNow Brand product design case study
StartupNow Brand
An N and an S tied into one ribbon.
Moktiv mobile app design case study
Moktiv Mobile
TikTok influencer app for song discovery, deals, and automated payments.
Backpacker Deals Website product design case study
Backpacker Deals Website
Deals on tours and activities, from the first search to the bookings calendar.