- Solo Web Designer
- Information Architect
- User Experience Designer
- User Research
- Site Architecture
- Web development of all pages
- Low-maintenance CMS solution
- Updated brand visuals
Seattle’s boutique solution to staffing and recruiting needed a site as fresh as their service.
When iMatch approached me to redesign their site they stressed that their niche was in technology and finance professionals. Both of these segments are used to clean, modern user experiences that adapt to whatever device is handy.
I worked with various department stakeholders to sketch out user-flows, wireframe each page, and finally design and develop the website. Using a mobile-first approach each page was built to prioritize the most important information into sections that render beautifully across mobile phones, tablets, and desktops, and supporting all browsers
While adding fidelity to the website mockups I realized that the site also needed a refresh to their brand colors and some new custom illustrations they could use throughout their digital and social media channels. I worked on a new palette that complimented their rich red that clients had grown to recognize.
The final stages of this project included the implementation of a light content management system that allowed the client to make simple edits without having to perform large-scale updates typically associated with typical solutions like WordPress and Drupal. The site also incorporates a dynamic Career Portal powered by Bullhorn and PHP.
Section No. 1
Dynamic, Lightweight Hero Image Slider
Section No. 2
Easy-to-Update Job Modules
Section No. 3
Illustrations and Icons
Section No. 4
Friendly Faces, Easy Connections
Section No. 5
Secure Contact Form and Map
To meet the needs for iMatch, I needed to better understand who they were trying to serve. I worked with the Managing Director to break down their typical clients and what industries they came from. iMatch has a personalized approach to recruiting/staffing and the staff prides itself on being able to fill a broad array of talent requests, but ultimately their clients break out into two high-level segments: people who need talent, and talent who want a new job. The bulk of their clients in both of these segments are in the Information Technology and Finance industries. The reps at iMatch were able to describe a few of their recurring clients in great detail, and from that, we were able to put together personas that represented who they were targeting currently and who they wanted to start attracting and servicing through their website. The personas we came up with helped me to identify who I was designing for. I had a better sense of what goals they were trying to accomplish; what state of mind they were in when using the site; and ultimately, what information they need to take the desired action.
I worked iMatch to understand what information the users of the site needed, and also hypothesized on what content would help tell iMatch’s story. After a few rounds of adding top-level sections and then combining some of the more granular breakdowns, we landed on five top-level sections that would ultimately appear as the main navigation throughout the site: Find Work, Find People, Our Process, Our Team, and Contact. Each section led down their respective decision funnels for the user.
Wireframes & Mock-Ups
I developed wireframes to provide clarity on how each page-type would be structured. I used only neutral grays for color to keep all of the stakeholders focused on content, scale, and visual hierarchy knowing that colors would be a consideration for the mock-up and development phases of this project. For navigation, I only included text for items where we had sign-off on verbiage and added placeholder text to give the team a sense of how content would flow on each page.
After a round of edits to the wireframes, we had consensus and I mocked up the key pages that could serve as the templates for all others. These were the Home, Find work, Our Team, and Contact pages.
Drag slider to compare medium and high fidelity mock-ups.
Find Work Page
Our Team Page
The main red from iMatches brand, dubbed “Recruiter Red” need an earthy clay color to give the palette a human element. iMatch is all about human-to-human connection. Their recruiters have a very hands-on approach with their clients, and the various shades and tints of this clay color reinforce the idea that the process will be organic and personalized. Hired Maroon is used on buttons and links to give just enough user feedback when clicking elements throughout the site.
All values measured year-over-year from the previous year’s activity compared to the first year of the new site being launched.