Design Process Blueprint

UI Design
Company: Comcast Business Mid Market
Role: Experience Designer
Industry: Connectivity, Cybersecurity, Communication Technology
Timeline: Jan 2024 – Feb 2024
Project Overview
Crafted an innovative self-initiated process map to deepen insights into our internal design procedures, paving the way for enhancements towards an optimal workflow.
My Contributions
Expertly conducted research and synthesis, seamlessly integrating checklist items and role delineations into a comprehensive blueprint tailored to guide our team through every design challenge encountered.
The Process
Create a map for the designers of CB Mid-Market to follow during the design process. The map will include stages, goals of each stage, checkpoints, checklist items, and people involved in that stage. The goal of the map is to be aligned and follow the same process with every project we work on to cover our bases.
The Design Goals
I approached this from a couple different angles. Each designer has had a different experience working on the different projects. I conducted interviews with the UX designers to see how they are collaborating with the stakeholders and mapped out their Rose, Buds, and Thorns to synthesize.

While looking finding a thematic saturation of pain points,  identifying opportunities the opportunities those pain points left was the launching point of creating an ideal process while considering other team's processes.
Initial Stage Mapping

I started mapping what I knew if the design process already on the team. From working on different projects with different stakeholders, I had a unique perspective at parts of the process but there were evident gaps. Diverging from observations to basic needs on a design team, I expanded the steps and stages into addition mappings.

Stakeholder Flow Diagram

I needed to look at who plays a role where and why in each part of the process. I looked at all the possible stakeholders I've interacted with and seen in meetings. Mapping this allowed me to dive deeper into the smaller steps of the larger stages.

Multiple Diamond Process Map

Diverging, converging, and constant iteration that can cycle depending on the project. This brought me to creating a multiple diamond approach showing where we habitually diverge and converge. To support the diamonds, I tied the colors of the diamonds to actionable activities and who is involved in that stage of the diamond. Adding a visual to the blueprint was helpful for some stakeholders but was not effective in communicating jobs-to-be-done or locating what phase a designer was in. This brought me to explore more of a process blueprint.

First Iteration Process map

I iterated on more defined steps of the process instead of a visual representation. This new designs is more scannable but I found it really important to highlight what type of step a designer is in. Expanding upon the type of step Shows variables in the stages to get a sense of time estimation, managing possible roadblocks. After speaking to stakeholders they agreed that knowing the type of step could be beneficial along with a more actionable checklist in the activities swim lane.

Second Iteration of Process Map

The stakeholder feedback made path. The number of stages increased, a progression swim line, high level tasks, and contingencies were added to paint a simple picture of the details of each stage. The newest additions are the checkpoints and overlapping checklist items through multiple stages. A checkpoint is an action that must be completed or approved before moving forward.

The Final Design

The final design highlighted stages, overarching goals for the process and design goals for each main goal. It also includes Checkpoints, Process Expectations, and detailed Checklist Items. The use of tags were added to the Checklist items to delineate which item belongs to which department. It was important to note that actions items happen on the backend that influence additional checklist items for designers to follow.

The expectation of this process is for designers to review project status and process checklist during weekly meeting check-ins. Record any yellow or red flags within the design file and communicate issues to all relevant people.  

Final Iteration of Process MapTo-Do Checklist Figma Widgets

Simple To-Do Figma WidgetThe goal of the map is for designers to follow the process and track where they are in tasks. I collaborated with one of the engineers to build out a Figma Widget for tracking checklist items and the percentage of completion based on the number of tasks.