Tucker Rocky is one of the leading motorcycle parts and apparel distributor in the United States. They have customers all over the nation ordering motorcycle parts for their repair shops, dealerships, and more. Their B2B platform at the time was using an out-of-the-box interface and it needed attention from a user’s and designer’s perspective. At the time, customers were using both their platform but mainly using the paper catalogue to place orders. Tucker Rocky wanted to improve the UX and UI of their B2B platform so that their customers can build confidence in placing and tracking orders with this new and improved experience.

Tucker Rocky was able to organize a group of existing users, also known as The Dealer Advisory Board, that remained our core users. From interviewing and throughout testing the product, they provided insights and feedback needed to improve this B2B tool. Step one involved having separate conversations with about 8 different dealers, prioritizing what features are necessary for them, while also listening to what Tucker Rocky needed from a business perspective.

The interviews were incredibly valuable for us and gave us a good jumping off point to start wireframing our assumptions. These are some examples of working wireframes that were created in Axure. Once we designed the MVP features that our users were looking for, we could later conduct user tests to see if our assumptions on our proposed product was a good step forward.

Since Tucker Rocky is a national brand, usability tests were remote and performed via web conference. We were able to transfer the controls so we could observe how tasks were completed and listen in real-time as to what their pain-points and joys were.

As we listened, we used this method to scale which tasks were successful as well as where users were still having difficulty. This helped us visualize what areas still needed to be tweaked and help decide what to prioritize.

After our observation and some deliberation with the team and our clients, we went back to the drawing board to refine the experience for our users.

We spent the first couple weeks working on style tiles to help define what type of visual direction they preferred from an aesthetics perspective.

From a designer’s perspective, the interface should only enhance the UX that we created and support function. Iconography was something that we felt was necessary on using as these would give visual cues to certain commands, alerts, and bring personality to the B2B platform.

Choosing the right typography was very deliberate. Majority of the interface is made up of tables and we needed to fit a lot of content there. We chose typefaces that were easy to scan since users will have to assess these tables with ease.

As stated above, tables are one of the main components to this platform as it was a great solution for organizing an array of information and it was a familiar way for our users when looking at their orders. One challenge we faced was the difficulty of conveying a multitude of information on a mobile device.

We did not have the luxury of removing certain details as all of the information listed on a table is necessary for our users. We created a UX where a user can scan their products in a list and choose to expand or collapse the additional product descriptions when necessary.

Once visual design was in its final stages, I had the opportunity to tour around the country to visit some of the users along with our client. It was crucial that we did this with our users in their everyday working environments and their everyday devices to truly observe the way they handled the platform.

We were able to tackle a lot of the main pain points with the MVP: improving usability for our user's day-to-day tasks (checking stock, searching for products, checking out, etc.) and improve the mobile experience.