Bringing classic cars into the modern age: Goodbye Retool, Hello React

Kindred Motorworks is in the business of modernizing and electrifying classic cars, or in their words, “Making your formerly irrational desire for a vintage car completely justifiable”. However, as they ramped up production and readied plans to open an even larger factory, that passion began to show growing pains. Blueprints, Kindred's custom teardown and restoration instructions, allow precise ordering and complex dependencies while holding all the necessary details for each step of the process. Yet technicians were struggling to take full advantage of them. Missed opportunities for parallel work left time and money on the factory floor. Kindred quickly realized that their Retool solution wasn't cutting it and that this hit to efficiency would only grow over time. Kindred came to Lab Zero to help redesign and replace their Retool implementation with a modern React application.

What did we do?

Lab Zero's project team (product, design and engineering) dove deep into Kindred's processes, tested concepts with technicians, and created an internal tool allowing technicians to blueprint the teardown and rebuild processes for their classic car offerings.

So what exactly is ‘blueprinting’? Once Kindred decides on a model to restore and/or electrify, they first need to get that vehicle into the shop. There, it's torn down and put back together multiple times before production can begin. Through this process, every tool, part, time estimate, and more is painstakingly documented. Lab Zero’s challenge lay in crafting an experience to best help blueprinters organize that information, surface hidden connections, and work in parallel with the rest of the team.

More than a simple list of steps, the new app is a hierarchical database making it easy to set dependencies and let other work run in parallel. Now, multiple technicians can work on different parts of the same car at the same time, meaning more vehicles produced in less time—a win for everyone!

“Super excited that this is real. This is pretty awesome.

You’re knocking it out of the park!”

 

Troy Eastlack, VP, Engineering at  Kindred Motorworks

How did we get there?

From the start, we used our agile delivery playbook to slice up our work into weeklong sprints. We set off with a crash course on Kindred’s existing blueprinting system. This demonstrated their manufacturing model while also revealing the current software limitations. With this base knowledge, we planned interviews with the technicians to find out more about how they used the system.

Talking with users is critical for any successful project and with Kindred it was no different. Seeing the system in use revealed not only errors and a confusing interface, but also how technicians worked around such difficulties. Reviewing and prioritizing the learnings from these sessions pointed us in the direction of key moments to focus on for the new app.

Kindred technicians wanted a more visual representation of tasks; a representation that surfaces connections across blueprints and differentiates tasks at different levels.

Working systematically

To expedite the design stage and produce a functional MVP within six months, we evaluated different open-source design systems. Considering that this internal tool needed little in the way of branding, working from a design system would significantly reduce the time to development. From a range of options, we decided on Ant Design due to the breadth of its component library, its simple integration with React, and its focus on accessibility. Confirming this choice let the design team start mocking up potential layouts much sooner than we’d otherwise be able to.

At set milestones, we organized user testing sessions to validate our design and catch any major issues. Starting with static prototypes, we eventually moved our testing to the development environment. These sessions gave us valuable feedback, both on our surface-level design decisions, as well as on deeper gaps in understanding between technicians and management.

“The expanded tree layout is really fantastic.

It’s miles better than what we’re dealing with today.”

 

Basil Elbanna, Process Engineer, Kindred Motorworks

Throughout the project, Kindred’s trust in the Lab Zero process allowed us to prioritize our goals, stick to a solid sprint schedule, and iterate quickly. The availability and close collaboration of their engineers right from kick-off ensured that design decisions always stayed feasible. Feedback from Kindred arrived on-time to influence the next design iteration, while easy access to their technicians let us test our designs and prototypes at critical milestones. Transparent check-ins and schedule reviews with our product manager kept everyone on-track and abreast of progress.

Challenges

No project is ever 100% smooth sailing, and with a small team and a short deadline, we naturally encountered some difficulties along the way. The primary challenge the team faced was aligning the pace of engineering between Lab Zero’s front-end work and Kindred’s API development. At the project’s start, their existing front-end was making direct queries to the database—something we urgently needed to move away from through the development of an API. To even up this disparity, we helped our partners at Kindred find new backend developer candidates, while also integrating our front-end engineers more closely in Kindred’s development cycles.

Scaling up

While we succeeded in delivering a functional MVP in six months, that’s just the beginning for Kindred. With plans to transition to a larger facility later this year and a further ramp up of production in early 2023, our new blueprinting app will have ample opportunity for further testing and refinement. Along with a roadmap of future features to work on, Lab Zero and Kindred look forward to continued collaboration to ensure their process is as efficient as possible at scale.