My Design Process

A SaaS Project

To showcase my end-to-end design process, I’ve chosen this SaaS project as a clear example of how I apply design thinking, user-centered methodologies, and collaborative practices from discovery through to delivery.

Goal:
The goal was to modernize the UI and improve the overall UX of an internal backend system used by staff to manage both employee onboarding—such as creating roles and assigning access permissions—and operational workflows, including customer visit records, performance stats, and loyalty offers.

Role:
Product Designer

Discover

Kick-off & Discovery:
We started with a stakeholder workshop to align on business goals, technical constraints, and project scope. This gave us a clear direction and helped ensure everyone was on the same page before we began designing.

Understanding Users:
I ran moderated interviews and in-house workshops (eg. card-sorting to improve UX on navigation) to uncover user pain points and needs. These insights grounded the design process in real experiences and helped shape a user-centred approach from the start.

Define

User Flows:
Using a combination of insights from the current platform and the pain points identified during discovery, I created user flows to map out the ideal experience. These flows helped identify friction points and redundant steps. The flows aimed to create a smoother, more intuitive journey by integrating user needs into every step.

Wireflows & Wireframes:
I created wireframes mapped out as flows—to test the structure and navigation logic early on. We validated these with users and stakeholders to confirm that the journey made sense before moving into visual design.

Based on the approved wireflows, I sketched low-fidelity wireframes to refine layout and content. These were shared with the team for fast feedback and alignment on structure and hierarchy.

Design

Design System & Collaboration:
Working closely with developers, we aligned on using React code and Material.io for the design components. I adapted the Material.io components to fit our specific needs, creating a design system that was both scalable and developer-friendly.

High-Fidelity:
With our system in place, I produced high-fidelity screens, interactive prototypes, and detailed mockups. These brought the product to life visually and functionally, enabling realistic walkthroughs for stakeholders and further testing.

Deliver

Usability Testing & Iteration:
We ran multiple rounds of usability testing, iterating quickly based on feedback. Each cycle brought improvements, helping to refine the product into something more seamless and user-friendly.

Developer Handover:
Finally, I prepared detailed handoff documentation and worked closely with the development team to ensure a smooth transition. This included annotated designs, interaction notes, and collaborative walkthroughs—helping to bring the final product to life as intended.

Conclusion

I have a strong, hands-on understanding of the end-to-end design process—from discovery and research through to ideation, prototyping, testing, and developer handoff. I’m comfortable navigating ambiguity, collaborating across disciplines, and balancing user needs with business and technical constraints. I approach each stage with curiosity, clarity, and a focus on creating thoughtful, usable experiences.

Next
Next

B2B Web Redesign: Edward Snell & Co