Futureproofing the B2B ecommerce food supply chain

Challenge

North America’s largest food redistributor needed to understand what was required from its diverse user types so that its users could effectively perform key tasks and be migrated on to the new B2B ecommerce site while still maintaining the integrity of the features already created for its base user group. This challenge became rather exceptional due to the amount of variations around product types, pricing models, and checkout methods to accommodate the different aspects of the users and supply chain.

  • UX research

  • User interviews

  • Subject Matter Expert (SME) & Stakeholder interviews

  • User surveys

  • Research reports

  • Requirement gathering & definition

Responsibilities

  • UX strategy

  • UX design

  • User & task flows

  • Hi-fidelity wireframes

  • Prototypes

  • Interaction design

  • Concept models


My Role

  • Led the user experience strategy, design, and research for the migration of 6 unique user types to the new ecommerce site. I also led the UX for new features and design to solve additional user & business problems. Additionally, I was responsible for continuously improving existing functionality.

  • Planned, conducted, and synthesized user interviews, stakeholder interviews, and customer surveys in order to understand user needs, recommend features or requirements, and provide prioritization.

  • Created flows and high-fidelity wireframes and prototypes to communicate new features and experiences to designers, engineers, business analysts, product owners, SMEs, and stakeholders. I was responsible for creating solutions that provided the best user experience, while also being technically feasible in the timeline and would reduce the amount of technical maintenance.

  • Adjusted to market factors during covid that contributed to supply chain issues by providing solutions and strategy to end users and the business.

  • Introduced agile methodology and other process improvements, such as kick-offs, planning meetings, and Kanban, in order to create a more efficient design process

KEY OUTCOMES

  • Sales hit $1Billion last year (2022) with the new website

  • Reduced time to complete an order by 75%

    • Average orders times fell from 43 minutes to 11 minutes, allowing users to complete their job tasks more efficiently

  • Submitted forecasts from users went up 15%

    • Having accurate and updated forecasts from users is crucial for the business. This allows the business to stock the right amount of an item, too much means they may waste product and money, and too little means they are leaving money on the table and leaves customers unhappy

  • Received positive qualitative feedback from users, stakeholders, and the product owner.

Sprint overview & my responsibilities

Below is an outline of the work and meetings I was responsible for during each sprint. Although typically my other projects had 2 week sprints, because of the complexity in requirements, engineering, and solutioning, this project moved to 3 week sprints. It was my idea to improve communication with the team by adding in sprint kick-offs and using methods like kanban to track many fast moving tasks and overall improve inefficiency.

Sprint Kick-Off

For each new leg of work, I was in charge of preparing and presenting kick offs where I would better define the goal of the work and what was needed in order to achieve that goal. I would prepare by doing some initial discovery on my own by going through existing information provided and existing systems, and then start to formulate what introductory questions to ask to the product owner and SMEs so that I could give my recommendations on the best way to approach the work, such as if research was needed and the proposed methods or if features and requirements can start being defined.

Key learnings & improvements: The introduction of sprint kick-offs was essential for gathering information from different key stakeholders to define the sprint and product’s success and goals. This allowed time for everyone to align and share their knowledge which allowed me to proceed immediately with concepting and solutioning.

Types of Tasks

In this project, I encountered a variety of tasks, often requiring simultaneous attention. I categorized these tasks into three distinct types, each posing unique challenges and opportunities:

  1. Migrating a new user type: One of the primary tasks involved onboarding new user types onto the platform. This process required a deep understanding of user personas and behaviors, ensuring a seamless transition for them. Addressing their specific needs and concerns was pivotal in creating a positive user experience.

  2. Addressing new business needs or user tasks: Another significant aspect of the project was addressing emerging business requirements and user tasks. These tasks typically originated from backlog priorities or market factors. Navigating this dynamic landscape demanded adaptability and agility.

  3. Improving existing functionality: This involved a meticulous analysis of user feedback and behavior patterns. By identifying pain points and areas of improvement within the existing features, we aimed to refine the user experience continuously. Iterative improvements were made to optimize usability, performance, and overall user satisfaction.

Migrating a user type

During the project, our team often operated under the pressure to move quickly, sometimes at the cost of conducting in-depth research for a new feature or iteration. There was a prevailing mindset within the team focused on rapid deployment and testing.

When it came to migrating new users, however, the stakes were higher. The risk of rework and accumulating technical debt was significantly elevated. To mitigate these risks, I consistently advocated for preliminary research. My emphasis was on understanding the users profoundly — their key tasks, challenges, and requirements. This proactive approach was crucial in ensuring a smooth transition for users onto the new platform while enabling them to continue their tasks seamlessly. This approach stood in contrast to the prevailing 'launch and test' mentality. By investing time in understanding user needs upfront, we aimed to minimize potential disruptions and enhance the overall user experience.

Research goals for migrating new user

  1. Determine Essential Features for Migration:

    Our primary goal was to identify the key features that needed to be migrated from the legacy site to the new site. Through meticulous research, we aimed to understand the common tasks of the new user groups. By pinpointing these tasks, we could prioritize the migration of specific features, ensuring that users could seamlessly perform their essential activities on the new platform. This focused approach was fundamental in facilitating a smooth transition and maintaining user productivity.

  2. Identify Opportunities for Enhanced User Experience:

    In addition to migrating features, our secondary goal was to explore opportunities for improving the overall user experience on the ecommerce site. I sought to understand user pain points, preferences, and behaviors. This proactive stance toward user experience allowed us to identify and implement enhancements, ensuring that the new site not only met users' basic needs but also provided a superior and satisfying online shopping experience.

Images and research findings for users’ experience with the legacy site

In the research process, I adopted a strategic approach tailored to the unique context of the project. The methods employed were determined based on factors such as existing knowledge, user group complexity, and estimated effort. The majority of our research efforts centered around in-depth user and Subject Matter Expert (SME) interviews, complemented occasionally by user surveys. I played a central role in this process, being responsible for crafting or supervising the testing scripts and conducting and assisting in the interviews.

Following data collection, I meticulously synthesized the findings. These insights were then distilled into a comprehensive report, which I presented to the stakeholders. The report not only communicated the research findings and recommendations but also included a feature prioritization strategy. This strategy was developed by weighing user importance against assumed development effort, ensuring a pragmatic and user-centered approach to feature implementation.

Moreover, my research efforts went beyond addressing immediate project needs. They served as a catalyst for identifying opportunities to enhance both business processes and customer satisfaction. By probing deeper, we unearthed areas ripe for improvement, enabling us to make strategic decisions that not only met current user needs but also elevated the overall quality of our services and user experiences.

Influencing MVP Decisions Through Research Advocacy

A pivotal moment in the project occurred when the product owner initially planned to defer the implementation of a complex feature, adding GL/reference numbers and reason codes, post-MVP due to perceived development challenges. Armed with compelling user research insights, I advocated for the users. Through in-depth interviews and user feedback emphasizing the feature's crucial role in their daily tasks, I convinced the product owner of its immediate significance. By bridging the gap between technical complexity and user needs, the feature was retained in the MVP. This instance showcased the transformative power of user research, ensuring a user-centered approach and a more impactful product from the very first release.

Research process

High level summary of one user group

“You did an excellent job with the supplier interview read-out and recommendations today. The questions in your interviews elicited actionable responses. You took that, built solid recommendations, and effectively presented it to a big group.”

— Director of Integrated Marketing and Insights

Wireframing & Prototyping

Define and refine requirements

This crucial phase required close collaboration with product owners and engineers, delving deep into their business goals and existing data infrastructure. By engaging in direct and insightful conversations with clients, I aimed to uncover the intricate details of their objectives. To facilitate this process, I utilized various tools and techniques, including rudimentary wireframes, concept models, and flow diagrams. These visual aids played a pivotal role in bridging the gap between abstract ideas and concrete implementation.

Creating wireframes, flows, and prototypes

In the pursuit of translating business goals into tangible, user-centric solutions, I crafted detailed wireframes tailored to the MVP's objectives. With the insights from prior research and discovery, I navigated the intricate challenge of leveraging existing design systems and functionalities while proposing new elements to meet user needs effectively.

Balancing the utilization of existing features with the introduction of innovative functionality became a core aspect of my role. This delicate balance ensured streamlined development efforts and simplified maintenance. For complex scenarios, especially when dealing with entirely new user journeys, I created comprehensive flows. These detailed visualizations served as a roadmap for the development team, elucidating the intricate systems and interactions underlying the creation of novel features.

In instances where new or intricate interaction designs were essential, I ventured into prototyping and annotation creation. A notable example of this was our introduction of a distinct user group, necessitating the implementation of four diverse checkout processes. Each process came with its unique flows, error checks, and system integrations. Through meticulous prototyping and clear annotations, I facilitated seamless communication with the development team and the entire project cohort, ensuring a shared understanding of these intricate systems.

Collaborative Feasibility Assessment and Iterative Refinement with Development

Following the creation of comprehensive solution documents, my process involved a crucial step: engaging with the development team for a feasibility check. These sessions served as a forum for in-depth discussions about system integrations, potential background integrations, and front-end complexities. Together, we evaluated the practicality of the proposed solutions and brainstormed alternatives when faced with challenges that could lead to extensive development efforts.

One instance exemplifying this collaborative problem-solving occurred when we discovered a limitation: for the MVP, we could only access inventory data from the company's main warehouse, not the user's specific location. In response, I initiated a reevaluation of the user interface. Carefully reworking wireframes and other deliverables, we aimed to clearly communicate to users the nature of the information available, empowering them to make informed decisions aligned with their tasks. This iterative process not only ensured technical feasibility but also enhanced the user experience, showcasing our commitment to adaptability and user-focused design.

Approval from product owner and other stakeholders:

With my solution that harmonized user needs, business requirements, and development parameters, my focus shifted to obtaining approval from key stakeholders and the product owner. Presenting the updated wireframes, my goal was to ensure alignment, not only with user and business needs but also with internal operations and as a final check to see if there were any gaps.

Thanks to the groundwork laid during research, requirement definition, and development approval phases, this stage often served as a validation of the previously established consensus. Due to the comprehensive buy-in obtained earlier, these presentations typically acted as a formality. The collaborative efforts and planning paid off, leading to a streamlined approval process, emphasizing the efficiency and effectiveness of our user-centric approach.

Design & Dev Hand-Off: After approval I would update any annotations as needed before handing off to the designer and business analyst. Often I would set up a short meeting with the designer to explain what areas were open for more exploration, what were hard requirements, and where some specific user centered decisions were made so that he had the background before jumping into the work.

Development Grooming & Support: After designs were finalized, I attended development grooming sessions and resolved any questions about the interaction design or intent. I also was on support in case new information arose that impacted the development cycle, systems integration was taking too long or the a piece of data may not been available in the way they thought, or if last minute cuts had to be made due to time and budget. If needed, I would then work with the designer to update the designs, ensuring they were still meeting user needs and best practices.

Key Learnings: Enhancing Team Alignment and Communication

A significant lesson from this project emphasized the critical role of alignment and communication, especially when dealing with complex features. Unlike simpler tasks where a user story and a solution sufficed, intricate solutions demanded a more nuanced approach. Given the diverse discussions among team members, disparities in understanding often arose. Team members who missed previous discussions might reintroduce ideas already resolved, causing inefficiencies.

To streamline communication and meeting efficiency, I adopted a proactive strategy. Before meetings, I listed project goals, user considerations, and existing discussions about in-scope and out-of-scope elements. This groundwork ensured everyone started on the same page, preempting redundant discussions. Moreover, I found it invaluable to reiterate the decided scope, requirements, and design changes at the meeting's conclusion. This recap provided clarity, reinforcing our collective understanding of complex issues.

These measures not only enhanced our efficiency but also fostered a cohesive team environment. By establishing clear communication protocols, we mitigated misunderstandings, ensuring a focused and productive collaborative effort.

Get in Touch

Have a question or just want a chat? Please send a message if you’d like to work with me or want to learn more about me or my work.