Let’s use intelligent matching, web video, and honest communication to help at-risk youths connect to employers and services.
NewOptions@Work is a pilot program sponsored by The W.K. Kellogg Foundation, designed to connect at-risk youths in Baltimore and Washington D.C. to employers and service organizations. These youths are highly motivated and have real-world skills, but they don't “look good on paper" and don't necessarily know how to jump-start their careers. NewOptions@Work helps these youths identify and express their talents in ways that align to employment, and it provides tools for employers to share richer job/workplace details and reduce the typically high turnover in entry-level positions.
Faced with New Options' goals, gravitytank developed a working prototype that captured a youth's “needs for success” profile – their comprehensive skills, interests, and achievements. We utilized matching technology to respond with “good, better, best” job matches for a youth's skills and to highlight service programs that could bring better jobs within reach. Youths could browse and map job listings that were enriched with peer videos and summaries of responsibilities, expectations, career paths, and wages. An employer or service provider can use the prototype to browse and map the profiles of promising matched youth candidates, which compiled and organized each youth's skills, interests, and achievements. The showcase of each youth profile was a brief web video that introduced their plain-spoken goals and ambitions like a résumé never could.
gravitytank · 2010
Creative direction: Chris Conley · Design: Kariya Moritsugu, Antonio Garcia, Andrew Day · Information architecture: Andrew Day · Engineering: Tom Sublewski, Seth Mabbott, Andrew Day, Abby Nielsen
Discovery and exploration
Visual design with working prototypeDiscovery exercises
The three constituencies completed a circuit: at-risk youths looking for jobs that match their skills, employers needing to fill entry-level jobs with qualified talent, and service organizations providing assistance to youths with gaps in their skills. Using Kellogg Foundation research, we created mini-persona “snapshots” for each audience to clarify personal motivations and system goals, and our concise creative brief established fundamental ideas and tone. Sketches of the “ecosystem” identified each group's flows and features, and finally, a spectrum of appropriate visuals and interaction patterns demonstrated our direction and helped solicit input from the client.
Interaction exploration
Our foremost opportunity – one that went untapped in typical job-finding sites – was completing this circuit among the audiences: We could simultaneously support youths with skill-matched jobs and gap-bridging services, provide employers with clarity in their qualified candidates, and connect service providers to a pool of motivated youths. We presented youths with results for “here's how this current job could lead to these specific future opportunities.” (With a fully developed matching engine, we could offer results for “if I make skill/lifestyle improvements, what better jobs could I see?”)
We kept the interactions, visual design, and language simple and parallel among audiences. The prototype minimized visual noise and navigation churn by presenting additional tools and content only when needed, and it gracefully enhanced content without hard interruptions, using jQuery and Ajax.
High-level sitemap, showing the parallels among the youth, employer, and service-provider paths.
Employer's dashboard shows a set of matching youths for each job listing. Hovering on a youth tile provides a fuller snapshot and tools to engage a youth.
View of "what if" panel, allowing youths to see what other jobs could potentially be within reach with changes to their skillsets. Descoped due to constraints on a third-party matching engine.
Visual design with working prototype
Top of pageWe designed the visual system and screen-level elements alongside an ExpressionEngine prototype, which helped validate assumptions and led to more clearly defined ideas. Design and development consisted of a five-person team that shared a common workspace, daily stand-ups, and short iterative cycles. Youths and service providers at Living Classrooms in Baltimore offered frequent input on the maturing prototype, keeping us immersed in the realities of our three constituencies.
The team learned from meeting with youths at Living Classrooms in Baltimore, that they were most interested in a personalized, trustworthy site for finding jobs. The site didn't need to visually posture or feel “street,” they said, it just needed to be “YouTube simple” and work for them.
A youth's public profile clearly outlines his/her motivation, goals, skills, and achievements. A short introductory video and endorsements add a trustworthy human touch unlike any résumé.
Youths told us they didn't understand what to expect at a job or where it could lead, so our job profile offers this informal and helpful context up front. For each job listing, we proposed filming a youth who had worked in that exact role, who could provide a brief, trustworthy assessment of its opportunities and challenges. We clearly display “ladder up” opportunities and wages for the near and long term, to show that this job isn't an endless committment but a bridge to future opportnities.
A youth's dashboard shows matching jobs, distinguished as “good, better, best,” using an third-party matching algorithm. Services that align to any gaps in skills appear below.
Hovering over a job shows additional detail and context-appropriate tools.
The employer's dashboard displays a set of youths with skills that likely match a specific job listing.
Youth map, plotting skills-relevent jobs and services related to his or her skills.
Brand-level landing page
Youth-experience sign in, sign up page