S+C Partners Website

While freelancing at a small privately owned studio, Collective Experience, S+C Partners approached us for a website refresh. Their site was outdated, cluttered with text, broken on mobile, and wasn’t reaching accessibility standards. Additionally, as research kicked off, bigger issues became apparent such as gaps in branding strategy & vision. The client agreed to re-examine their brand under our guidance. I was brought on to define and strengthen the branding, and then rely on our research to design a new user experience for the refresh.

Our team kicked off by leading discovery workshops with the client, translating the insights into user personas and journey maps. Meeting with the team, I reviewed the insights and pulled out key information. I highlighted S+C’s target audiences, business goals, provided services, active industries, current standing, and competitive advantages. Some disclosable key insights were:

• Key audience: high net-worth clients, entrepreneurs, private corporations
• Primary clientele: construction, manufacturing, and distribution
• Primary services: accounting services such as assurance, tax, advisory, and IT to support financial commitments, minimize tax liabilities, optimize profitability
• Extremely low findability: confusing information architecture (4-6 levels deep), customers couldn’t find information leading to high bounce rates
• Lack of accessibility: small fonts, lack of readability, low colour contrasts, and missing alt tags costed readability
• Not mobile-friendly: broken components were seen on iOS and Android
• Primary services: accounting services such as assurance, tax, advisory, and IT to support financial commitments, minimize tax liabilities, optimize profitability

Next, we had to simplify S+C Partners’ architecture, so we began by laying out a sitemap of its existing hierarchy. The old IA (using Portal, About, Resources, Blog, Careers, and Contact as navigation items) extended 4-6 levels deep with hidden pages inaccessible from the navbar. Considering the topmost priorities of customers’ feedback when visiting the site, I worked on simplifying it all into 5 main key sections: About, Services, Careers, Insights, and Contact.

Our team’s research uncovered some bigger issues, such as gaps in branding strategy and vision. I needed to help fill these in first.

I explored different branding approaches using the firm's primary branding colours through digital experimentation with typography, photography, imagery, and accent elements. After narrowing the best options down into 3 solid approaches, I used mood boards to portray each vision's typography, photography, imagery, and colour treatments which were presented to the client. S+C Partners loved the first approach (see below!), which let me move forward with UX and layout ideation.

With branding gaps filled in, I moved on to thinking about the experience. Using feedback from team critiques as well as reviews with the client, I went through a process of turning lo-fi ideas into hi-fi mockups. I created interactive Invision prototypes of these mockups for user testing and stakeholder reviews. See examples of how feedback influenced the designs below.

Sample mobile screens

Final style guide

As a practice between Collective Experience and our external development agency, I prepared a functional specifications document documenting page types, layout guides, colour guides, colour hex codes, font types, and font specs catering to both mobile and web.

As the development agency sent completed page links, I reviewed the staged pages and inspected alt tags on images and icons, font sizes, leading, tracking, margins, colours, and device responsiveness. I also tinkered with a screen reader to learn how that would digest the page for those who needed assistance. The reviews made sure the website was accessible, responsive, and as accurate to the designs as possible.

Although quantitative metrics from the client could not be disclosed, the successful outcomes were a modern AODA-compliant website with better findability,  readability, accessibility, and branding alignment.

The new design successfully brought the firm a higher conversion of visitors into contacting the firm, indicating successfully lowered bounce rates and an easier time on users when finding services. The firm also remarked that they loved the new branding guidelines that they could happily leverage for all future projects and business collateral.