Facilitating and simplifying workflow management requires a range of solutions, especially in the warehouse space. Warehouse workers and managers need to track tasks, monitor activity within the warehouse environment, and locate and move packed items. Furthermore, they need to do it all constantly throughout the day. Fulfilld is an app that provides solutions for all of these problems and more. However, for the average warehouse manager or worker to use an app like Fulfilld to streamline and optimize their day-to-day work, the app needs more than just good technology. It also needs a design that makes user interaction (UI) accessible, intuitive, and straightforward.
For the second event in our Deep Dive series featuring Michael Pytel, co-founder and CTO of Fulfilld, Pytel gave an entire presentation on Fulfilld’s UI design. In the first event in this series, Pytel explained how the app’s different functions address the needs associated with the other areas of the warehouse workflow. This time, Pytel focused on the user experience that makes these functions easy to use for warehouse workers opening the app for the first time. In addition, UI principles like interactive task management, workplace persona modeling, and human-centered design allow Fulfilld to bring their tech directly to the workers who need it.
After a brief introduction to Fulfilld and its mission and capabilities, Pytel began with a bang and made a playful dig at the UI design of one of Fulfilld’s competitors. By doing so, Pytel demonstrated the limits of a user experience that relies on tribal knowledge. Fulfilld’s UI, by contrast, is designed to be intelligible to any first-time user. Commands are broken down by task and presented as an interactive list. The tasks are “organized by location and priority,” and then each is assigned to the appropriate team member. The list of tasks continually updates throughout the day as workflow changes. Watch Pytel explain in detail below:
Fulfilld’s UI is also built to suit different workplace personas so that the app can provide a customized UI depending on the role of the warehouse employee using it. Fulfilled currently has four different personas mapped. Watch Pytel compare and contrast the “warehouse worker” and “warehouse manager” personas here:
In the second half of the presentation, Pytel gave demos of several processes Fulfilld uses to build its UI. First take a look at how they’re using Flowmap for user story development and site mapping:
Fulfilld also creates low fidelity and high fidelity mockups using Figma, which organizes screens into folders, provides code for every element of design, and creates a clickable, playable demo version of the site. Figma can also present every possible navigation link on the site simultaneously as a “spaghetti map”:
In the last section of the presentation, Pytel outlined the Fulfilld UI code to deploy sequence with a demo on the Google Cloud Platform (GCP) console, where Fulfilld uses different cloud-based applications to host and deploy code and link to the code directly between Github, the GCP, and Fulfilld.io:
To wrap up, Pytel gave a quick recap of the entire UI process, starting with feature and function design and ending with code deployment, remarking that seeing an entire process from start to finish is “pretty cool for a 45-minute webinar.” What did you think? Are you a warehouse worker or an app developer working on your UI design? What else would you like to learn about the UI design of an app like Fulfilld? Let us know in the comments, and make sure to check out the rest of the events in our Deep Dive series on Fulfilld with Michael Pytel.