Streamlining Pre-Sales Operations with a Centralized Web Hub

Spectrum's Community Solutions Department, a key player in residential broadband services, needed a greenfield solution to unify its pre-sales costing and design processes. The existing workflow relied on disparate spreadsheets and tools, leading to inefficiencies, manual errors, and high operational costs. Our team was tasked with building a centralized web hub that integrated various platforms, reducing manual work and saving Spectrum time and resources.

COmpany:

Spectrum (Charter Communications)

Industry:

Telecom & Mass Media

Project name

Operations Systems Integrations (OSI)

Timeframe

NOV 2022 - APR 2023

Stack:

Figma

Figma

Lucidchart

Lucidchart

Gitlab

Gitlab

Major pain points

Disparate systems

The Community Solutions department uses several disconnected software programs to complete their work.


High Salesforce cost

The company is paying for a huge number of subscriptions to Salesforce, many of which are rarely used.


Drowning in forms

The current workflow includes a 56 page “Post-sale Process Document” which is very inefficient.


Copy-paste waste

According to executives, the current process of taking an opportunity from Salesforce and creating Jira tickets requires about “20 minutes of copy-pasting” to complete.

Results and Team Feedback

Results

Team Feedback

Results
Driving Operational Efficiency and Cost Savings

The redesigned web hub at Spectrum led to measurable improvements across training, operations, and employee productivity. With streamlined workflows and an intuitive interface, teams were able to reduce manual tasks, save time, and lower costs across multiple departments.

$5k+/mo

Spectrum has reduced training costs by $5,000 per month, thanks to the intuitive design and user-friendly interface of the new web hub.

$12k+/mo

Spectrum is now saving $12,000 per month in operational costs due to the streamlined processes and reduced manual work.

$15k+/mo

The new web hub has saved Spectrum employees over 500 hours per month, translating to a cost saving of $15,000 per month in labor.

Results and Team Feedback

Results

Team Feedback

Results
Driving Operational Efficiency and Cost Savings

The redesigned web hub at Spectrum led to measurable improvements across training, operations, and employee productivity. With streamlined workflows and an intuitive interface, teams were able to reduce manual tasks, save time, and lower costs across multiple departments.

$5k+/mo

Spectrum has reduced training costs by $5,000 per month, thanks to the intuitive design and user-friendly interface of the new web hub.

$12k+/mo

Spectrum is now saving $12,000 per month in operational costs due to the streamlined processes and reduced manual work.

$15k+/mo

The new web hub has saved Spectrum employees over 500 hours per month, translating to a cost saving of $15,000 per month in labor.

The company
What is Spectrum?

Spectrum is the consumer brand of Charter Communications, a major American telecommunications and mass media company. Spectrum offers many services, including high-speed internet, cable television, home phone, and mobile services.

The company
What is Spectrum?

Spectrum is the consumer brand of Charter Communications, a major American telecommunications and mass media company. Spectrum offers many services, including high-speed internet, cable television, home phone, and mobile services.

Problem

Solution

Role & Team

Summary

Problem
Disconnected Teams and Tools

Community Solutions’ pre-sales costing and design phases currently rely on a patchwork of disparate spreadsheets and tools. This fragmented approach necessitates manual data entry, complex logic maintenance, and adherence to business rules across multiple sources of truth. Additionally, minor updates require manual adjustments to various sheets. Unfortunately, these spreadsheets lack security and are not conducive to reporting. Moreover, the disjointed platforms lead to significant downtime as Salespeople wait for Engineers’ reviews and vice versa. Furthermore, stakeholders hold underutilized Salesforce subscriptions, resulting in wasteful spending.

Problem

Solution

Role & Team

Summary

Problem
Disconnected Teams and Tools

Community Solutions’ pre-sales costing and design phases currently rely on a patchwork of disparate spreadsheets and tools. This fragmented approach necessitates manual data entry, complex logic maintenance, and adherence to business rules across multiple sources of truth. Additionally, minor updates require manual adjustments to various sheets. Unfortunately, these spreadsheets lack security and are not conducive to reporting. Moreover, the disjointed platforms lead to significant downtime as Salespeople wait for Engineers’ reviews and vice versa. Furthermore, stakeholders hold underutilized Salesforce subscriptions, resulting in wasteful spending.

Details on the Dept.
Community Solutions: Connecting Communities

The Community Solutions team at Spectrum plays a vital role in enhancing connectivity within multi-family housing environments. Our responsibilities encompass a diverse range of residential spaces, including: • Student Living • Senior Living • Neighborhood Clubhouses • RV Parks, Marinas We categorize our projects based on the existing infrastructure: Brownfield Projects: These involve existing structures. Greenfield Projects: These pertain to buildings yet to be constructed.

Details on the Dept.
Community Solutions: Connecting Communities

The Community Solutions team at Spectrum plays a vital role in enhancing connectivity within multi-family housing environments. Our responsibilities encompass a diverse range of residential spaces, including: • Student Living • Senior Living • Neighborhood Clubhouses • RV Parks, Marinas We categorize our projects based on the existing infrastructure: Brownfield Projects: These involve existing structures. Greenfield Projects: These pertain to buildings yet to be constructed.

Goals
Efficiency and Cost Reduction

The team workflow is highly dependent on outside software like Salesforce, Jira, and Excel, which is both costly and inefficient. Our proposed Operations Systems Integration aims to streamline workflows, reduce reliance on external software, and enhance efficiency and profitability.

Major Pain Points

Disparate systems

The Community Solutions department uses several disconnected software programs to complete their work.

High Salesforce cost

The company is paying for a huge number of subscriptions to Salesforce, many of which are rarely used.

Copy-paste waste

According to executives, the current process of taking an opportunity from Salesforce and creating Jira tickets requires about “20 minutes of copy-pasting” to complete.

Drowning in forms

The current workflow includes a 56 page “Post-sale Process Document” which is very inefficient.

Phase .4
Beginning with a Bite-Sized Solution

The initial phase for OSI is deemed “Phase .4” because it does not offer a complete web app but rather starts the project by offering a solution to a small, isolated problem. In the current workflow, users must spend about 20 minutes copying and pasting information from Salesforce to Jira to transfer data for new tasks.

User Personas
A diverse group of stakeholders

As an internal project, the users are all Spectrum stakeholders who work for the Community Solutions department. Any of these users could complete the main action afforded by Phase .4 of OSI. • Field Technicians • Sales Engineers • Software Engineers • Project Managers

Device Considerations
Focusing on the Laptop

Spectrum stakeholders will access this product during business hours using their work laptops. Consequently, our design focuses on laptop and desktop screens rather than mobile devices.

User Flow
Submit a new project

The initial product provides essential functionality. In the “happy path,” users: 1. Enter a Project ID or URL. 2. Identify the relevant project. 3.View related information. 4. Submit the project The submission triggers the creation of a Jira issue with associated tasks for the team.

User Flow
Submit a new project

The initial product provides essential functionality. In the “happy path,” users: 1. Enter a Project ID or URL. 2. Identify the relevant project. 3.View related information. 4. Submit the project The submission triggers the creation of a Jira issue with associated tasks for the team.

Design
A One-Page App with a Landing Page Feel

Despite being an internal application, we maintain the Spectrum brand identity. The final design resembles a landing page, featuring: • Hero image • Clear title • Concise description • Search field for project queries

Design
A One-Page App with a Landing Page Feel

Despite being an internal application, we maintain the Spectrum brand identity. The final design resembles a landing page, featuring: • Hero image • Clear title • Concise description • Search field for project queries

Design
Fully Responsive for Mobile

While the primary use case is laptop-based, we recognize the need for responsive mobile design.

Design
Fully Responsive for Mobile

While the primary use case is laptop-based, we recognize the need for responsive mobile design.

Initial Rollout
Swift Deployment and Positive Feedback

After collaborating closely with the Front-End Engineer to ensure UI quality, usability, and aesthetics, Phase 0.4 of OSI was rolled out to a select group of users. Initial feedback was overwhelmingly positive: • An executive marveled at the efficiency: “it’s just amazing that they can do now in only 10 seconds, what before may have been a 20-30 minute lift.” • Users appreciated the visually appealing and responsive nature of the web app.

Phase 1
Getting into the meat of the project

Having completed Phase 0.4, our team now tackles broader initiatives. While Phase 0.4 addressed the immediate need to eliminate a time-consuming “copy/paste task,” Phase 1 dives into more extensive business challenges.

Phase 1
Getting into the meat of the project

Having completed Phase 0.4, our team now tackles broader initiatives. While Phase 0.4 addressed the immediate need to eliminate a time-consuming “copy/paste task,” Phase 1 dives into more extensive business challenges.

Kickoff

Discovery

Personas

Key User

Research & Discovery
Getting to Know the People Behind the Process

Before a single wireframe was drawn, we needed to deeply understand the humans this product would serve. Through intensive discovery sessions, stakeholder interviews, and a visit from our Subject Matter Expert, we built a clear picture of who our users were, how they worked, and where the existing process was letting them down.

Kickoff
Say Hello to the SME

Our Subject Matter Expert (SME), a seasoned Manager of Strategic Operations at Spectrum, flew in from out of state. With firsthand experience managing Community Solutions teams, the SME provided valuable insights into personas, use cases, pain points, and business goals.

Research & Discovery
Getting to Know the People Behind the Process

Before a single wireframe was drawn, we needed to deeply understand the humans this product would serve. Through intensive discovery sessions, stakeholder interviews, and a visit from our Subject Matter Expert, we built a clear picture of who our users were, how they worked, and where the existing process was letting them down.

Kickoff

Discovery

Personas

Key User

Kickoff
Say Hello to the SME

Our Subject Matter Expert (SME), a seasoned Manager of Strategic Operations at Spectrum, flew in from out of state. With firsthand experience managing Community Solutions teams, the SME provided valuable insights into personas, use cases, pain points, and business goals.

Journey Map
OSI Sales Intake

One major challenge we've identified with the current Sales Intake process is the time-consuming and error-prone task of manually transferring information from Excel spreadsheets into Salesforce by copying and pasting. Additionally, sales reps must check Excel sheets for pricing by region. From the user journey, it's clear that Integrating this information with the intake system could automate much of this activity.

Journey Map
OSI Sales Intake

One major challenge we've identified with the current Sales Intake process is the time-consuming and error-prone task of manually transferring information from Excel spreadsheets into Salesforce by copying and pasting. Additionally, sales reps must check Excel sheets for pricing by region. From the user journey, it's clear that Integrating this information with the intake system could automate much of this activity.

Information Architecture
Sketching the Web App Site Map

We began by creating a rough site map for the web app. This map encompasses not only Phase 1 features but also accounts for future phases. The goal? To establish a flexible structure that accommodates all OSI development efforts.

Information Architecture
Sketching the Web App Site Map

We began by creating a rough site map for the web app. This map encompasses not only Phase 1 features but also accounts for future phases. The goal? To establish a flexible structure that accommodates all OSI development efforts.

User Flow
The OSI Happy Path in a Nutshell

The basic process for this product consists of 3 steps: 1. Sales Intake - A sales representative completes intake forms 2. Eng. Review - An engineer reviews the sales intake and completes configurations 3. Approval - An engineer approves the project (or a Manager/Director if the total is over a certain dollar amount.)

User Flow
The OSI Happy Path in a Nutshell

The basic process for this product consists of 3 steps: 1. Sales Intake - A sales representative completes intake forms 2. Eng. Review - An engineer reviews the sales intake and completes configurations 3. Approval - An engineer approves the project (or a Manager/Director if the total is over a certain dollar amount.)

Key Consideration
Project Shot Clock: Tracking Milestones

As projects progress, input is required from various teams. Key milestones trigger the “shot clock”: • When the Sales Rep completes an Intake, the project enters the Engineering Queue. • After Engineers finish Product Costing, they wait for approval. The clock restarts at each stage, ensuring transparency and team accountability.

Data Model
Understanding the information

Portfolio

• A collection of properties owned by an individual or entity

Property

• A real estate property, which is often part of a portfolio

Project

• Represents an opportunity to provide services/products for a single property

Offer

• A scripted collection of services and products at a specific price • A single Project may contain multiple offers

Stakeholder Collaboration
Bringing the SME’s Vision to Life

Having immersed ourselves in the product space, user personas, business requirements, and goals, we swiftly transitioned to rapid wireframing and prototyping. Our primary focus? Accommodating our subject matter expert (SME) and translating their vision into tangible design elements.

Stakeholder Collaboration
Alignment with Engineering for the MVP

As we breathed life into the SME’s vision, close collaboration with our Engineering Manager and team ensured technical feasibility. When faced with scope creep or unnecessary features, we exercised discernment, carefully selecting what to include and what to discard.

PO's Vision

Discovery

Wireframing
From Vision to Validated Direction

Not every great design idea survives first contact with reality, and that is a good thing. During the wireframing phase, we took our Product Owner's initial vision and pressure-tested it against engineering constraints, UX best practices, and the real-world needs of our users, arriving at a stronger and more intentional solution in the process.

PO's Vision
A Flexible Stepper That Shows the Full Journey

Our Product Owner shared his vision for a horizontal stepper, expressing his desire for a flexible component that could include multiple steps as well as clear indicators showing where in the process the user currently was. He also noted that the stepper should make it clear whether the user was in the Intake or Pre-Sale Costing workflow, and allow users to navigate freely between the two.

Wireframing
From Vision to Validated Direction

Not every great design idea survives first contact with reality, and that is a good thing. During the wireframing phase, we took our Product Owner's initial vision and pressure-tested it against engineering constraints, UX best practices, and the real-world needs of our users, arriving at a stronger and more intentional solution in the process.

PO's Vision

Discovery

PO's Vision
A Flexible Stepper That Shows the Full Journey

Our Product Owner shared his vision for a horizontal stepper, expressing his desire for a flexible component that could include multiple steps as well as clear indicators showing where in the process the user currently was. He also noted that the stepper should make it clear whether the user was in the Intake or Pre-Sale Costing workflow, and allow users to navigate freely between the two.

UI Framework
Layout inspiration and Kite Design System

Our access to the Kite Design System, along with Figma libraries and React components, empowered us to create concepts and products with remarkable speed. We decided to reuse the framework from an internal tool called Aloha, which features a clean 3-column layout for forms.

UI Framework
Layout inspiration and Kite Design System

Our access to the Kite Design System, along with Figma libraries and React components, empowered us to create concepts and products with remarkable speed. We decided to reuse the framework from an internal tool called Aloha, which features a clean 3-column layout for forms.

Content Management System
Seamless Form Editing Experience

To facilitate form content editing, we adopted a format where the site seamlessly transitions into “Content Management” mode. In this mode: • The right column serves as the form editor. • The center displays a live form preview.

Content Management System
Seamless Form Editing Experience

To facilitate form content editing, we adopted a format where the site seamlessly transitions into “Content Management” mode. In this mode: • The right column serves as the form editor. • The center displays a live form preview.

Presentation
Earning "Buy-in" from Executives

Before diving into development, we presented our concept to executives for approval and funding. Our Figma slideshow/prototype showcased three critical tasks: • Submit a Sales Intake (User: Sales Rep.) • Pre-Sale Costing (User: Engineer) • Escalate a Project (User: Sales Director) The positive reception prompted us to swiftly move forward with development.

Project Management
Leading Agile Processes in the Absence of a Scrum Master

After successfully completing the design work for our MVP, our team faced an unexpected challenge when our Scrum Master was reassigned to a different team, leaving us without a project manager. As the most knowledgeable team member on this project, aside from the Product Owner/SME, I stepped up to fill the gap. Having led the discovery phases, conducted generative research, and crafted the UI design, I was well-prepared to take on this responsibility. For approximately three weeks, I assumed the Scrum Master’s role, effectively communicating with developers, writing user stories, breaking down tasks, and managing tickets.

Testing
Collaborating with User Researchers

Given the OSI project’s significance, we enlisted the help of a UX Research Director and two UX Researchers. Their planned exercises included:

Salesforce Walkthrough

• Meeting with one user from each persona to understand their existing processes (now being replaced by OSI).

Focus Groups

• Small-group discussions guided by facilitators to gather user thoughts and opinions on specific topics or interfaces.

Moderated Usability Testing

• One-on-one sessions with participants, evaluating user behaviors and prototypes for system improvements.

Quantitative Data

Comments

Intake Readout

Usability Testing Results
Detailed Readout

Our Research team provided a live readout of their results document. We scored high in both task success and confidence levels.

Quantitative data
How We Scored

We received high scores for both Task success and Confdence level.

Usability Testing Results
Detailed Readout

Our Research team provided a live readout of their results document. We scored high in both task success and confidence levels.

Quantitative Data

Comments

Intake Readout

Quantitative data
How We Scored

We received high scores for both Task success and Confdence level.

Iteration
Fine-Tuning Based on User Research

Testing validated our design’s success, allowing users to complete tasks with minimal confusion. We made adjustments, primarily refining terminology, to enhance the overall experience.

Design Slideshow

Sales Landing

Open Ticket

Dashboard

Issue

POST MVP DEVELOPMENT
Added pages and functionality

After launching our initial product, we made additions to the system, making it even more robust and capable.

Sales Landing Page

Prior to building this page, a Sales rep would land directly on an intake form when navigation from Salesforce to OSI. This new page allows users to see an overview of the offer,, link it to an existing Project, and start a new Intake.

POST MVP DEVELOPMENT
Added pages and functionality

After launching our initial product, we made additions to the system, making it even more robust and capable.

Sales Landing

Open Ticket

Dashboard

Issue

Sales Landing Page

Prior to building this page, a Sales rep would land directly on an intake form when navigation from Salesforce to OSI. This new page allows users to see an overview of the offer,, link it to an existing Project, and start a new Intake.

Retrospective
Great collaboration, Slighly sub-par understanding of priority

Reflecting on this project, I am proud of the thorough discovery process and the strong alignment I achieved between the product owner and the engineering team. My efforts in understanding user personas and use cases laid a solid foundation for the project’s success. I excelled in facilitating clear communication and collaboration, ensuring that both the product vision and technical feasibility were aligned. One key learning was understanding the heavy focus on the sales intake process versus the engineering product costing process. Initially, I was concerned about the complexity of the engineering process; however, I realized that sales engineers, being more tenured, were well-versed in their tasks. In contrast, the higher turnover rate among salespeople necessitated a greater focus on usability testing for their intake process. This insight will guide me in future projects to better prioritize user needs based on their roles and experience levels.

Retrospective
Great collaboration, Slighly sub-par understanding of priority

Reflecting on this project, I am proud of the thorough discovery process and the strong alignment I achieved between the product owner and the engineering team. My efforts in understanding user personas and use cases laid a solid foundation for the project’s success. I excelled in facilitating clear communication and collaboration, ensuring that both the product vision and technical feasibility were aligned. One key learning was understanding the heavy focus on the sales intake process versus the engineering product costing process. Initially, I was concerned about the complexity of the engineering process; however, I realized that sales engineers, being more tenured, were well-versed in their tasks. In contrast, the higher turnover rate among salespeople necessitated a greater focus on usability testing for their intake process. This insight will guide me in future projects to better prioritize user needs based on their roles and experience levels.

Thanks for stopping by 👋

Feel free to dive into more of my
case studies below.

Thanks for stopping by 👋

Feel free to dive into more of my case studies below.

© 2025 Nate Worford