Vanderlande

The ask was to design applications for a warehouse management suit, with a special focus on production managers and inventory planners.

Client

Vanderlande, Netherlands

Project Duration

52 weeks

Responsibilities

Program Management, SME & Stakeholder interviews, Competitive Benchmarking, Wireframes, Rapid prototyping.

Process

We started with our discovery and immersion phase, where our research was combined with a series of SMEs and stakeholder interviews to gain an overall understanding of the domain. We translated our learnings into detailed process and module maps, which we used to validate our grasp of the warehouse platform with the clients.

During the process, we went through 20+ documents and videos from VI share point and confluence platforms. Conducted more than 5 stakeholder interviews to understand VI’s vision and organizational needs and underwent 10+ knowledge transfer sessions with stakeholders to gain a contextual understanding of the journey and users.

Challenge

One of the major challenges of this Product Delivery program come from the context in which we’ve been working. From our distributed, full-remote team collaboration between 2 countries and 4 different locations, to collaborating and bonding with the client designers was the biggest step. Apart from this, understanding the domain and learning the tools remotely was very challenging.

Our challenge defined the very core of the Vanderlande Design Approach.

Domain Knowledge

Vanderlande designers lacked domain knowledge and were slow in grasping it

Clarity of Product Architecture

Vanderlande’s existing information architecture of the entire framework was fragmented and didn't provide any accurate insights.

Novice Team

The Vanderlande team was a novice group who had no clue how to achieve the product vision they had in mind.

Lack of User Testing

With the pandemic, the team couldn't take site visits, which made it a great challenge in understanding the whole domain and its processes.

Approach

Research combined with a series of SME’s and stakeholder interviews led us to come up with a very detailed information architecture and story mapping sessions for each initiative led us to a series of design sprints.

The program ran using an agile approach in collaboration with the client team, where designers from frog and VI participated in delivering quality work. After coming up with the detailed designs, we conducted multiple usability tests, based on which we iterated and presented the final designs along with our learnings to the VI team.

Immersion

Information Architecture

Insights

Our key focus areas were to identify how the competitors handle different tasks and how might we leverage the industry’s best practices in our designs for Vanderlande.

Dashboards

A meaningful dashboard enables the user to grab the attention of critical elements at a glance, and it also helps the user perform proactive actions.

Visualize Planning

The enterprise should adopt a layout that aims to provide transparent and flexible data in the correct fashion, which helps in better decision-making.

Proactive Alerting

It is necessary to follow a functional structure: a defined label for each alert with a call to action for users to address promptly and efficiently.

Smart Inventory

Inventory Management tools have evolved from a laundry list of Excel sheets to a well-designed repository of items with more visual cues and intelligent filters.

Visual Mapping

Visual mapping provides a holistic view of the system, which helps users understand the facility and perform decision-making more efficiently, resulting in fewer manual checks.

Site Visits

The site visits helped us to gain technical and practical knowledge about warehouse materials and processes and its operations. We attended two sites which provided contextual understanding of the clients users, and their working environments. Site visits helped us in gaining contextual knowledge to supplement lack of user testing.

Micro-moments matter

Even a minor improvement on the physical/digital touchpoint that can increase the shipping speed will add immense value to the overall efficiency of the warehouse.

Work Fatigue

Information overload, monotonous work, and lack of emotional connection to the tools and systems lead to burnout and a high retention rate.

Variable Conditions

The users have various digital touch-points placed under varying conditions such as lighting, temperate, and orientation. We also noticed that some operators use screens more intensely than others.

Learning Curve

Operators perform jobs in various workstations. Adapting to new workstations and their tools will be critical for maintaining efficiency and completing tasks promptly.

Complex Situation

Warehouse configuration itself is a complex setup that works cohesively with machines and humans. We have seen multiple screens with various functionalities and information in the control room, and clear visual guidance seems missing in this complex situation.

Duality of control

Currently, the UI is an extension of the machine and the operator an extension of the UI. Operators end up in a situation where they are almost forced not to think. On the other hand, the operator has to coordinate clear actions based on information from the machines.

Site visits helped us in gaining contextual knowledge to supplement lack of user testing. Below are a few of the observations we gathered from the site visits.

Process Map

During the immersion phase, we reworked a process map that clarifies Vanderlande’s warehousing operation. It details primary users involved in the platform and illustrates where they connect across the system.

Module Map

We created a module map with key features to show how these process agnostic actions are interconnected. The map showcases primary and secondary users and the product features in a process agnostic way.

Before

After

Vanderlande had laid out a very complicated, confusing and disorderly organized IA. frog helped re-structure information in the right order so that users can successfully access the information they need.

Competitor Analysis

Outcome

The greatest outcome was in Improving the UX maturity of the organization. The project started with a huge mess in place, but frogs were able to drive the program in a great manner that brought a lot of clarity. There was a great collaboration with the Developers during the project phase. Frogs were able to jump and provide a great support in building and redefining their DLS Standards.

We were able to convince and make them understand the value in shifting the design software from XD to Figma. Frogs were able to learn and teach the VI team about the domain and project needs. Building the trust among the organizations and not compromising on frog’s standards was the best win.

Product Deliverables

App 1 - Monitor and Control

Provides valuable insights for the users to initiate an action and monitoring the chores.

App 2 - Planning

Enables distinct system visualization through transparency of tasks and progress

App 3 - Workstation

Delivers seamless experience in performances and helps to identify and report issues

Manage orders to prevent delays and errors

The overview tracks the progress of all upcoming and current orders. It provides time saving solutions to mitigate any issues that might cause a delay.

OUTBOUND ORDERS

Proactive alerting system to keep users up to date

The issues feature is a logical grouping of proactive alerts made available for the users. It is supported by quick filters and sortation techniques.

ALERTING / ISSUES

Monitor warehouse areas to keep performance on track

A multitude of warehouse areas like Decanting, Palletizer, GTP etc. are made available with a dashboard layout that provides KPI’s to keep track.

WAREHOUSE AREAS

Retain optimal inventory within warehouse areas to avoid any delays

Inventory helps maintain the right amount of stocks in the warehouse and also maintains workload balance across warehouse areas, to avoid any delays that might cause critical impact on out bound orders.

WAREHOUSE AREAS

Sets a sense of direction and Increases operational efficiency

The planning tool helps streamline operations and boost productivity. It also provides access to stored goods and improves order fulfillment rates.

PLANNING OVERVIEW

Provides a bird eye view of the entire warehouse storage area

The storage and buffer dashboard visualizes both available and occupied spaces for the entire warehouse area.

STORAGE AND BUFFERS

Perform quality checks on pallets

Each pallet that’s received in the warehouse goes through multiple quality checks based on height, weight, missing pieces etc before storing within the inventory.

SYSTEM EXITS

Helps to eliminate hazards and improves building quality

This housekeeping protocol is designed to improve the overall quality of the actual building by eliminating hazards and maintaining a clean and safe environment.

CLEARING

Re-Packing packages as per order fulfillment

The decanting process removes items from the original shipping containers and places them into storage bins per order requirements. This solution helps the user capture and perform these actions into the warehouse platform system.

DECANTING

Deliverables

Quick iterations combined with potential users as well as stakeholder validation sessions helped the team move faster. Alignment with the development team and backend team enabled us to design the product by keeping feasibility in check. One of the critical aspects of detail design was to inculcate the culture of leveraging the Design System and looking for a scalable solution rather than just focusing on a specific page or a module.

Design System

Creating a holistic Design System to deliver cohesive and scalable product experiences

We quickly recognized that Vanderlande’s fragmented design system was in no shape ready for anyone to use. We developed a foundation design language in Adobe XD. Once they acquired a Figma licence, we spearheaded the migration process and continued to develop a robust design system that was scalable and ready to use for dev and other product teams at Vanderlande.