PROJECT TITLE
Foresight Marketing Site
ROLE
Director of Product Design,
Project Lead, UX Architect
TEAM MEMBERS
Ji Y. - Product Designer
Piper L. - Product Designer
Jen L. - Sr. Copywriter
Krystal D. - Visual Designer
PLATFORMS
Web
TIMELINE
MVP Launch: Dec 2021 - Mar 2022
BUSINESS OVERVIEW
Foresight’s marketing site is a critical experience for cross-functional department goals and needs with regards to the company’s mission of expanding throughout the United States to make mental healthcare affordable and accessible.
Of importance for this project would be the ability to manage the site through a robust content management system (CMS) that could hook into our product experience for prospect members.
Additionally the new website would be the central vehicle for the new brand launch to establish Foresight as a national brand that attracts members, providers and talent to Foresight.
This project was complex and high stakes with a short timeframe of 4 months for launch. My experience leading large-scale website strategy, architecture and design allowed me to hit the ground running to initiate this project and see it through to launch.
PROBLEM SPACE: DISCOVERY
The importance of the marketing site, became a constant in my quarterly discussions with cross-functional leaders as their departments depended on the site for various growth-related goals.
1. Cross-functional Needs Assessment
I interviewed key business stakeholders throughout the company to understand their department goals, needs and future plans. Through these conversations, I was able to prioritize a list of business goals that were translated into MVP site requirements.
2. Goal Setting
Key objectives that I compiled included:
• Increase new member conversions across new states and drive users to booking flow
• Increase awareness and promote alent acquisition of providers & clinical operations personnel
• Scalable site platform that can expand for content and navigation for new clinic locations
• Mobile-first experience to meet the majority of site visitors (73%) on smartphones
• Serve mutiple department content and marketing needs through a CMS back-end system
• Technical integrations for live chat, Greenhouse, personalization, email and landing
page campaigns
• Improve content and visual story-telling around services and the organization’s mission
• Build the site on a React codebase to meet engineering standards and allow for
continuous expansion
• Built a preliminary roadmap of MVP features as well as quarterly feature releases for 2022
3. Site Audit
Additionally, I conducted an evaluation of our current site to audit navigation, content, technical integrations, functionality, mobile/responsive viewports and CMS back-end capabilities. Across the board our site failed all checks for the items above with the exception of technical integrations for live chat and Greenhouse.
Additionally the new website would be the central vehicle for the new brand launch to establish Foresight as a national brand that attracts members, providers and talent to Foresight.
4. Technical Research
I conducted research on best-in-class content management system (CMS) platforms like Drupal, WordPress, Webflow enterprise and headless CMS builds to identify if they would meet our technical requirements, business goals, security and expansion.
SOLUTION SPACE
1. Scoping & Project Planning
I compiled all of the above into a project scoping document to use a north star for internal teams, as well as engineering agency partners that I interviewed with the VP of Marketing to determine the best fit for the project.
2. User Personas
The website would be a critical first or second step in the user journies for prospect members and providers that would find our site through mental health affliate sites like Psychology Today or ZocDoc or through a search engine.
Secondary user personas (not shown) are insurance providers, potential partners and investors.
HOW WE WIN
We win when our teams can leverage our new marketing site to improve how we communicate and serve our member and provider communities.
In order for our site to be successful, it should be leveraged as a marketing, product and brand experience that we have full-control over to optimize and upgrade over the course of a multiple year life span to meet the growth of our organization.
PROPOSAL
Build the site as a headless CMS powered by Material UI React components (from the design system) with a back-end integration into the marketing platform. The headless CMS ensures that both our code and content are portable to distribute content to various product and marketing experience with the added bonus that we own the front-end for future changes to a new marketing platform.
HOW WE WIN
We win when our teams can leverage our new marketing site to improve how we communicate and serve our member and provider communities to make quality mental health an everyday care.
In order for our site to be successful, it should be leveraged as a marketing, product and brand experience that we have full-control over to optimize and upgrade over the course of a multiple year life span to meet the growth of our organization.
PROPOSAL
Build the site as a headless CMS powered by Material UI React components (from the design system) with a back-end integration into the marketing platform. The headless CMS ensures that both our code and content are portable to distribute content to various product and marketing experience with the added bonus that we own the front-end for future changes to a new marketing platform.
USER EXPERIENCE DESIGN
My role was to provide the strategy and direction needed to meet user needs, business goals and technical capabilities. Additionally I resourced two of my product designers Piper L. and Ji Y. to ideate, research and execute sitemapping exercises, responsive wireframes and UI designs for mobile, tablet and desktop viewports.
At the heart of the experience to creating this experience were the member and provider user journeys. Both user groups were acquisition targets with all roads leading to call-to-action prompts to book an appointment, contact us for more info or applying for careers for the provider demographic.
We collaborated and coordinated with members of creative/marketing team on content, site mapping as well as our agency partner for all of our technical capabilities and constraints.
USER EXPERIENCE DESIGN
My role was to provide the strategy and direction needed to meet user needs, business goals and technical capabilities. Additionally I resourced two of my product designers Piper L. and Ji Y. to ideate, research and execute sitemapping exercises, responsive wireframes and UI designs for mobile, tablet and desktop viewports.
At the heart of the experience to creating this experience were the member and provider user journeys. Both user groups were acquisition targets with all roads leading to call-to-action prompts to book an appointment, contact us for more info or applying for careers for the provider demographic.
We collaborated and coordinated with members of creative/marketing team on content, site mapping as well as our agency partner for all of our technical capabilities
and constraints.
USER INTERFACE DESIGN
The goals that I established for the UI phase revolved around my key objective of ensuring that our new website direction would universally function cross-platform for upcoming marketing & product experiences. Creating a seamless experience that set the bar high for quality and established Foresight as a tech-forward national brand.
Additional focus areas:
• Designing universal UI components to meet a variety of use cases
• Designing for content visual and copy needs
• Expanding upon our new brand's visual direction
• Optimizing designs for mobile viewports
• Utilizing Material UI design system components for quality & consistency
• Implemented WCAG 2.1 accessibility guidelines for color constrast, typography, spacing & interactions
USER INTERFACE DESIGN
The goals that I established for the UI phase revolved around my key objective of ensuring that our new website direction would universally function cross-platform for upcoming marketing & product experiences. Creating a seamless experience that set the bar high for quality and established Foresight as a tech-forward national brand.
Additional focus areas:
• Designing universal UI components to meet a variety of use cases
• Designing for content visual and copy needs
• Expanding upon our new brand's visual direction
• Optimizing designs for mobile viewports
• Utilizing Material UI design system components for quality & consistency
• Implemented WCAG 2.1 accessibility guidelines for color constrast, typography, spacing & interactions
KEY TAKEAWAYS
•We successfully launched the site to rebrand the entire business to position the company as a tech-forward brand across new markets.
• We had heavy technical constraints and timing limitations. Extremely proud of my team's work, as well as the Marketing Dept.
• If time permitted, I would have added a 2 week sprint for A/B testing to test out different messaging and visuals, as well as variations on UI components. It would have informed our decision-making and solidified our guidelines.
• Additional technical scoping, analysis and research was needed by an internal lead engineer to better understand the constraints and complexities of integrating a headless CMS-backend into a marketing SAAS platform.
© Copyright 2024 Kosta Katehis
© Copyright 2022 Kosta Katehis