Vanlife Trader

Vanlife Trader serves the vibrant community of van life enthusiasts, offering a platform for buying, selling, and trading customized vans. With a user-friendly and aesthetically pleasing design, the website caters to those passionate about the adventurous van life lifestyle. This case study explores our comprehensive project with Vanlife Trader, highlighting our collaborative success and innovative solutions.

Objectives

Our primary goal was to revamp the Vanlife Trader website, enhancing user experience, integrating a blog, and modernizing the design. The project demanded a balance between aesthetic appeal and functional robustness, aiming to resonate with the website's target audience.

On top of the design overhaul, we had to come up with a better data architecture and migrate all the data from the old site.

Solution

We leveraged WordPress and React, creating a dynamic and responsive site that is both manageable and interactive. This combination was key to accommodating the site's extensive content, complexity, and user interactions.

The primary focus was on the offer listing speed. With hundreds of offers and multiple dynamic filters that traverse through many post-meta and taxonomies, we had to use something more robust than a classic REST API. For that reason, we implemented GraphQL API which provided us both flexibility and required speed.

Workflow

In 2022, at the outset of our collaborative project with long-time partner Good People Digital, we faced significant challenges due to the project's scale and the involvement of multiple teams. Despite these complexities, our team successfully managed the workflow and delivered high-quality results, albeit with a slight delay.

Project Challenges

Data migration

The particular challenge was the data migration. We had to carefully analyze the content on the old website. It has been built on top of a general-purpose WordPress listing theme, with a poor data architecture, leveraging a lot of post meta entries. With such a big website, this created a serious bottleneck in the site’s performance.

We came up with a better architecture, that leveraged more taxonomies than post meta. Taxonomies have overall better performance as they have a better relational structure within the default WordPress database schema.

Translating the data to the new schema was crucial and allowed us to create almost instantaneous listing search results on the front end.

Fast and dynamic listings

Having clean and organized data in the database is only half of the battle. We needed to ensure a smooth experience on the front end. This is why we implemented a React UI that loads all the data as quickly as possible, without refreshing the page when using filters.

Organizational Challenges

Coordinating with multiple teams and managing this large-scale project tested our organizational skills, which we navigated through effective communication and adaptability.

Results

The project's success led to significant satisfaction from the client, with improvements in functionality and design being particularly praised. User feedback echoed this positivity, highlighting the enhanced user experience.

Team Learning and Development

This project was a growth opportunity for our team, deepening our expertise in WordPress, GraphQL, React, and large-scale project management.

Future Plans

The project's success culminated in a significant milestone this year: we took ownership of the Vanlife Trader project. Now, we can openly discuss our collaboration and continue to develop and refine the website. Plans include implementing new features, and monitoring and updating the website, with a continued focus on enhancing the van life community experience.

The Vanlife Trader project is a testament to our team's ability to handle complex web development challenges and collaborate effectively with external teams, including a talented graphic designer responsible for the site's design. Our successful handling of this project has broadened our skill set and positioned us as a reliable partner in digital transformation journeys

Design copyright: Charles Miller.