Based on our experience building a responsive platform for Sam’s Club and Walmart, the team at Levi’s knew we were the perfect fit to take their customer experience to the next level with a new UI and more performant technology stack. In fact, not only could we deliver on a single codebase for the Levi’s brand - we also proposed building a single system to use across both Levi’s and Docker’s brands with nothing more than a simple configuration change.
One codebase. Every device. Web and native. Two different brands. Sound appealing? The team at Levi’s thought so too, so we got to work.
There’s no doubt React is changing the way people create web applications, but out of the box it doesn’t provide everything you need to deploy a large-scale eCommerce app. That’s where our own framework, DoneJS, comes in. While DoneJS was built to provide everything you need for a modern app, it uses CanJS for the view model by default. For a best-of-both-worlds application, we flexed our open source muscles to create a DoneJS-React bridge that would swap out CanJS with the React view model for React-style performance and DoneJS-style ease of use. The result was an application built to be support by the community, but with the backing and guarantee of open source success that only Bitovi can provide.
“We build and maintain some of the most powerful open source frameworks for building web applications - so we can ensure quality and guarantee support to our clients.“
To kick things off, our team engaged in a short discovery phase to prove the viability of our design process, as well as our technical solutions. A discovery phase is a low-risk, short engagement for both teams to work together, solve for some of the major unknowns, and make sure we have a clear path to success. We frequently start new projects this way to ensure a good team fit, to help estimate the effort required, and make sure any assumptions about new technology are going to work. At the end, we present our findings to stakeholders and outline a plan for moving forward.
While the scene itself was a riot, we’re genuine when we say that that’s how we view our client partnerships. We are so passionate about the success of our client’s project that we go out of our way to make our team become part of theirs. The Levi’s team later told us they’d never had another consulting company arrived dressed in all denim. We’re just that geeked out.
Once the primary technical questions were answered, our team set to work building the foundation for the entire platform. With React in the center and DoneJS as the wrapper, we built a series of other tools to support high-end eCommerce, like server side rendering. At the same time, our design team worked closely with Levi’s to take what had previously been multiple, fixed experiences and turn them into a single, refined flow that would carry customers through checkout.
Our goal was to create a platform that would see improved conversion, in addition to the benefits of a single codebase. With a focus on conversion, we started the redesign effort at the bottom of the eCommerce funnel with cart and checkout. This part of the eCommerce application was the most critical, in terms of influencing conversion, and we knew if we could prove an improvement in the cart - it would lay the foundation for the rest of the site. To test it, we agreed on an A/B test to measure the old site against the new in production.
With the new cart and checkout complete, we watched the results come in from the A/B test and were ecstatic to see the new single-page app win easily. This confirmed our assumptions that performant, responsive eCommerce application would yield higher sales than the previously disconnected experiences on different platforms.
In addition to our work on cart and checkout for the global site, we also partnered with Levi’s European teams to leverage our platform to deliver click ‘n collect - a checkout option where customers can choose to pick up their order at a nearby convenience store or locker. Because our app relied on an open API and modular components, we were able to add this functionality to European markets without affecting the primary site’s checkout flow. This late addition to our project scope demonstrates a key benefit of our architecture: changes in the requirements are not as costly when the application is designed from the beginning to be modular.
Contact us and let's create something amazing.