TradeGecko for Warehousing

In an effort to open up new revenue streams for the business, we spent a quarter coming up with low risk, simple tools we could quickly launch that our customers could add on to their subscription. Constrained with a shorter product development lifecycle, our team was tasked to create mobile-first web-based apps to automate and support our existing customer base’s warehouse operational workflows.

In this project, we released two barcode-enabled add-on apps under the TradeGecko for Warehousing suite: a Stock Receiving App, and a Pick-Pack App. The Stock Receiving App was made for transient warehouse staff to be able to perform stock receiving operations with the help of a barcode scanner, and sync purchase order status and inventory updates (increments) back to our customers’ TradeGecko accounts. The Pick-Pack App on the other hand allowed transient warehouse staff to be able to perform fulfillment operations and sync sales order status and inventory updates (decrements) back to our customers’ TradeGecko accounts.

The add-on apps were purposely designed to be mobile first given the nature of the job of our target users, which often require performing tasks while moving around the warehouse.

I was Lead Product Designer for TradeGecko for Warehousing, which I took from zero to one as a triad lead alongside a Product Manager and a Technical Lead, driving a team of engineers.

As this was a project that was highly time-constrained, in lieu of our usual initial user research phase involving rounds of customer interviews, I leveraged on peers in the product development team who had prior knowledge and experience building a similar app on the Shopify app store (iOS; not TradeGecko-integrated), which was historically built as a growth tool to drive new customers into TradeGecko. Apart from partnering with them, I did an analysis of existing tools in the landscape to watch for patterns and ensure that we are not veering away from established warehouse operations workflows.

Considering the information I’ve gathered both internally and externally, I created wireframes to start gathering early feedback from existing customers to validate our assumptions. As the wireframes took shape as we progressed on our customer calls, I started involving our Technical Lead to make way for an early spike on the technical implementation in preparation for breaking down and estimating the work in more detail without needing to wait for high fidelity designs to be finalised.

Example wireframes shown to customers to do an early validation of the barcode-enabled Stock Receiving workflow

Example wireframes shown to customers to do an early validation of the Picking workflow of our barcode-enabled Pick and Pack App

Example wireframes shown to customers to do an early validation of the Packing workflow of our barcode-enabled Pick and Pack App

As we form a better sense of our customers’ needs from the ongoing broader research, in parallel, I then start creating designs in higher fidelity, and stitch core workflows together into usable prototypes that we could have customers in our ongoing rounds of interviews click on like a real product themselves. Alongside my Product Manager, we start tweaking our interviews script to be more focused on the usability of the end-to-end workflow design in the context of using it within the TradeGecko product following its design patterns.

Sample screens on updates made to the TradeGecko Core App document viewer and settings to allow enabling barcodes on warehouse-related documents such as Purchase Orders

Sample screens from the barcode-enabled Stock Receiving App

Sample screens from the barcode-enable Pick and Pack App. All three warehouse workflows (receiving, picking, and packing) were purposely designed to re-use the same UI components to not only speed up our development process, but to also ensure consistency and familiarity for our customers when using the apps.

With more confidence on the final shape and form of our MVP, we break down and estimate the work in more detail. In the task breakdown and estimation exercises, I guide the engineers on questions pertaining to implementation to allow them to estimate the work with more confidence, especially given our time constraints.

I worked side-by-side with frontend engineers on a day-to-day basis to ensure the UI and UX is up-to-spec, and to unblock them on any issues we encounter along the way during implementation.

I worked with the team to do several rounds of bug bashes, testing the apps on different handheld devices. From this exercise, bugs were filed on JIRA to define our launch ready-ness until all critical issues were resolved prior to our Beta release.

I partnered with my Product Manager in continuing our testing and research as we release a fully working product to a handful of customers in Beta. Working with our team of engineers, I summarised our findings and helped ensure critical issues that came out of the feedback received at this stage were addressed to help identify our full rollout ready-ness, as well as recalibrate our post-release roadmap and sequencing.

I worked with our Knowledge Experts in creating help articles for our knowledge center prior to release. I also worked closely with my Product Manager in creating release communication artifacts and onboarding our customer facing teams into how the add-on apps work.

Design and Prototyping

User Research

Project Management