Product Design Process
At Flipcause, we executed product development on a small Product Team, which included a Technology Director, a Lead Product Designer (me), and a Lead Product Manager. Within the Product Team, I led a Design Team consisting of a Frontend Developer, a Design Quality Assurance Specialist, and for a short time, a Junior Product Designer. We often collaborated cross-departmentally, working with Engineering to develop product and with Customer Experience and Customer Success to gather research and feedback. In the following process steps, I show what my role (the Designer) was in each stage of the product development workflow.
Problem
The idea owner (someone from the Product Team, the CEO, the Experience Director, or the Customer Success Director) proposes a new product or feature, with rough specs of what is required. The idea owner presents this to the Product Team (consisting of the Tech Lead, Designer [me], and Product Manager) and all other stakeholders at a meeting and shares relevant data supporting the new feature/product.
Research
The Product Team works together to gather research. Research can include interviews with clients or with Success Managers and Sales Reps, who are team members that work directly with clients. Our team will also task the Customer Experience team to conduct client interviews and surveys and to analyze feedback and reviews.
As the designer, it is my role to compile this data and use it to inform the new UX. I will also then dive into more design-specific research, looking up the latest UI trends for components we might use and sourcing examples of similar issues and product solutions as references for comparison.
Design, Feedback, & Iterations
Whiteboarding & Sketches
After gathering research, the Product Team brainstorms ideas for the basic structure of the interface. I then create sketches based on the concepts discussed, the idea owner specs, and our research. The other members of the Product Team review and give feedback, and from here, I iterate on the sketch.
Low-Fidelity Wireframes
With an approved sketch, I create a low-fidelity wireframe of the new product/feature. Often the wireframe will be interactive to demonstrate the user flow. I present these to the Product Team, where they give feedback, and I iterate the design. Once ready, our team delivers the prototype to stakeholders for approval.
High-Fidelity Prototype
Once the wireframe is approved, I create a high-fidelity, interactive prototype of the new product or feature. I present this to the Product Team, where they review and give feedback, which may lead to more iterations of the prototype. At this stage we conduct user testing, sourcing clients to let us observe them as they click through and get their feedback. When the prototype is ready, we make it available to stakeholders in the event they have feedback. If none is given, our team moves ahead with development.
A whiteboard brainstorming session for the SMS Settings feature
Low-fidelity wireframe of the SMS Settings feature
High-fidelity interactive prototype of the SMS Settings feature
Design Handoff
The Product Team meets with the Engineering team to prepare them for the project, including our timeline and development plan. I then prepare handoff materials for the Frontend Engineer on our project management system, Jira. Handoff will include all related files and specs. We typically organize product development in sprints, tackling smaller chunks of the project at a time if complex.
I will also create Design QA specs to prepare for quality assurance testing as the product is developed and review design outcome expectations with the Quality Assurance Team.
Engineering & Testing
As the Design Lead, I always manage the frontend development phase of product development. This involves setting expectations, checking the project's progress, giving feedback, and ensuring the project gets done. I also manage the Quality Assurance team as they test the developing feature's design, ensuring all scenarios, resolutions, and devices are accounted for.
On some projects, I will also manage the backend development after the frontend is complete. This includes managing the Quality Assurance team as it rigorously tests the functional implementation of the new product/feature.
If the business timeline allows, once the development is complete, the project is pushed to a beta server for beta user testing, from which our team gathers feedback to implement before the final release. We will also share the project with stakeholders for approval at this stage.
Live Release & Feedback
The Product Manager or Technology Director manages the live release of the product in coordination with stakeholders and company expectations.
After the new feature has been pushed live, the Customer Success, Sales, and Customer Experience teams gather feedback from reviews, direct conversations, interviews, and surveys to determine the success of the new product or feature. The Customer Experience team presents this data to us, and we work to iterate on the project as needed.
The live SMS Settings feature on the Flipcause Dashboard