Coroflot Redesign

As part of the Core77 family, Coroflot is committed to providing the space and opportunity for creative professionals and hiring companies to find each other. I joined the Core77 team mid-2016 with one of my main objectives being a refresh of the current Coroflot site, which was last updated in 2012 by Area 17.

The Collected Works designed our fresh new logo, branding, and assisted in developing a new color system for the site. I've been working closely with Matthew Giuggio, a senior front-end developer here at Core77, creating a new responsive visual system and user experience for Coroflot. 

Website

Problem

Coroflot.com was long overdue for a redesign seeing as it had not been refreshed since 2012. The dated aesthetic of the previous iteration felt cramped and visually overstimulating in a space where we want the designers’ work to take center stage.

Our second challenge was to design the new site to be fully responsive, which the previous design was not. This is of utmost importance in today’s 'mobile first' landscape.

before_and_after@2x

Goals

Redesigning the site to have a clean and contemporary feel will greatly enhance our users' experience, engagement, and project presentation while simultaneously attracting new talent to the site who may have previously posted their work on our competitor’s sites.  And judging from past experience, elevating our talent equates to elevating the number of posts on the job board as well.

Ever an advocate for our users and firmly believing it would increase job postings, I got our product development team on board with the redesign, committing the time and resources to this project beginning fall of 2017.

Wireframes 1 – 4v2@2x

Strategy + Design

Since an entire site redesign is quite an undertaking for a relatively small product team, we broke the site down into layers in order to tackle one at a time. After numerous paper and low-fidelity mockups, I created these medium-fidelity wireframes to frame the structure for the top level pages.

This system is made of various card designs for jobs, talent, and projects, and has expanded margins throughout, giving the site some breathing room visually. I used only the lightest greys and white for the main spaces so the site would feel uplifting compared to our current dark and top-heavy site. This also allows the site’s presence to fade into the background and allow the designers’ work to shine.

coroflot redesign palette + typography@2x
coroflot redesign card styles5@2x
prosearch_desktop_v4

Here is our recent Pro Search product with new captivating hero image and updated font, Campton. Now mobile-friendly, browsing and messaging job candidates is a breeze.

designjobs_v4

I created the background image on the design jobs pages to add a bit of motion and depth to the page which is super informative but previously relatively drab. All buttons and tags are a fresh mint color that feels active and encouraging.

jobdetails_v3

I designed each top-level page to have a large hero image showcasing users’ work which is randomized on page load. I did this in order to feature our talent in a new bold way and create a sense of community and belonging.

I changed site’s layout from a mixed grid and masonry layout to solely a grid layout throughout to create a sense of visual order that was lacking in the past.

projects_7

Users and clients alike can now browse portfolio projects on mobile and easily follow, like, or comment on their peers' projects. Clicking on an image within a project now brings you to a slideshow mode which can be used for presentations or interviews.

project-details-7

The user portfolio page is a pet project within a project for me. One of our goals at Coroflot is to increase user engagement and I believe helping users share their work in the best light is key.

The old portfolio page felt very cramped and the navigation was confusing for our users. I expanded the top hero zone completely and put all of the user's information within a central tab system used throughout the site. This defaults to the project tab and is followed by an 'about', 'followers', and 'following' tab. When logged in as a user there is also a 'favorites' tab where you can easily browse projects you've liked previously.

portfolio_v3

Result

With this expansive project, I'm aiming to create a holistic and mobile-friendly user experience throughout the site by cutting out the excess and elegantly displaying user projects and job postings alike. This redesign project is a work in progress. We’re on track to release the first iteration this spring.

Next on our list is reimagining the project upload flow and simplifying client payment processes.

Pattern & Shape

Pattern & Shape

Pattern & Shape