Case Study in UI Redesign — Coco Canary Consulting

I was assigned the project of redesigning the home page of Coco Canary Consulting LLC, an evaluation and communications firm that aims to improve social justice for businesses in the Saint Paul, Minnesota area.

The website’s primary focus is to educate the user about Coco Canary’s services and benefits, and to guide the user toward the consultation process. However, it falls short in both content and UI design when presenting users with easily understandable information.

In this one week agile sprint, I aimed to address these issues and create a site in Figma that was a better reflection of Coco Canary’s brand.

Content Audit

The home page header and hero image felt vague and impersonal

The list of service benefits was confusing and did not include any visuals

The home page was text-dense. It was hard to skim this information as a casual user.

Coco Canary’s original website felt impersonal and generally not memorable or helpful for the user. I aimed to include the following 7 principles in the redesign, prioritizing simplicity, engaging visuals and skimmable information.

Goals for the redesign of this site

Initial Ideas

I aimed to keep it brief, bold and informative. My initial idea included a large hero image that set the tone for the page, with a consultation button. I wanted the user to be able to quickly glance at the page and understand what services are offered.

I also wanted the tone of the site to read more clean and modern. The images should be inviting to a new user and create a welcoming environment.

Coco Canary focuses on inspiring inclusion, supporting social justice, and promoting racial equality. I wanted to emphasize these points through visual hierarchy, images, and actionable points.

Wireframing

Focal Points

  • Clear, simple global navigation bar
  • Call to action that is immediately visible
  • Featured clients
  • Newsletter
  • About our services section
  • More photos

Wireframe

The basic layout should be simple and emphasize Coco Canary’s core values and services offered.

Working in Figma

Inclusion and racial justice were key points that the site seemed to emphasize, but did not make clear enough. I wanted to showcase important service topics and create a welcoming, simple layout for users.

  • Clear global nav bar with bold buttons
  • Hero image features a warm, inviting environment. Showcases diverse women as clients and as a service provider, in line with business model
  • Quick, simple explanation of services
  • Call to action
  • Display of clients
  • Newsletter showcases participation in community and events to sign up for
  • Landmarked footer with socials

Feedback

Following this first draft, I received feedback from about 30 people on what features were beneficial, what stood out, and what should be changed. From my first draft, I decided to pivot in the order of information. I included some quick information highlighted at the top to set the tone of the site, and included a client testimonial quote.

Additionally, I found that introducing another color to the site theme would assist in visual hierarchy and contrast.

Final Thoughts

I loved working for Coco Canary Consulting because of the services they offer. Making approachable and personable consulting for social justice is important for all businesses, and I had fun creating a revision for this great business. Going forward, I would like to format my site for mobile, and work on interactions.

Thank you for reading!

UX Designer, Illustrator from Atlanta, Georgia

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store