PRoject


“Codence = business intelligence and data integrity for growth. FileMaker software developer Codence (formerly New Millennium) came to 9thWonder looking for a new name, brand identity and responsive website to show how they craft both reliable software and tailored custom solutions that marry deep accounting roots with FileMaker expertise.” Their goal for this site was to be optimized for search that would drive traffic and conversions.

Challenge


As lead designer, I took charge of the overall project. I juggled a variety of roles including a brand and website redesign. A significant challenge was seamlessly integrating both their product and services into a single cohesive site.
My objective was to elevate client understanding while simultaneously pushing the envelope in terms of competitors' websites. My responsibilities encompassed responsive web design, logo creation, illustrative elements, UI/UX interactions, and collateral development.

 
Codence_Macbook_HomepageMockup.png
 

Messaging Guide


 
 
 

01


After meeting with the client, I created a logo and messaging guide for Codence. This ensured their brand accurately represented their business and appealed to their target audience. Establishing a design system early on helped streamline the process.

02


Following that, I established brand colors, fonts, and a design system using Sketch. My next task was to design the homepage. Upon approval, I developed interior, responsive, and interactive guidelines. We presented the designs to the client using InVision, allowing them to provide feedback and suggest changes directly on the design.

 
 
 

03


After receiving approval on all responsive designs, we transferred them to the development team through Zeplin and InVision. I provided breakpoints and our style sheet from InVision to assist with assets such as fonts, colors, iconography, and images. To animate interactions, I utilized After Effects and Timeline by Anima, a Sketch plugin.

04


Upon delivering the final designs via a blueprint, we obtained feedback from the client and transitioned to development. The development team performed a midpoint quality assurance (QA) check, scrutinizing breakpoints, fonts, colors, and the overall website structure. Subsequently, we conducted a final QA, during which I meticulously reviewed the entire website using the marker tool for QA purposes over a span of two weeks.

 

Interior pages for codence


Below are the initial interior page designs crafted in Sketch. Upon completion, I utilized the Craft plugin with InVision to generate a prototype. This allowed clients to interact with the design, experiencing hover states, drop-down navigation, and page links firsthand.

 
Codence Iphone Mock Comp.png
CodenceWeb-1.jpg
CodenceWeb-2.jpg
Codence_DesktopInterior_Mockup.png
 

Other branded graphics

 

Codence_Process_Graphic.png
 

Business Cards


Social media assets


SocialMedia.png

Results


The new brand identity and website launched in February of 2019. 

The CEO, Scott Love, reported “I’m so proud to give someone my business card and know they are going to visit a great website. You took us from atrocious to best in class.

Results:

  • Website Traffic up 127% 

  • 62% more users 

Organic traffic trending up every month since launch