Urritrek’s E-commerce Platform: a journey from concept to completion

Growth
Aug 1, 2024

Renovation and redesign of an old website

Creating a new e-commerce platform for Urritrek was an extensive process that involved meticulous planning, deep collaboration, and a commitment to delivering a user-friendly and effective website that aligned with the brand’s values and customer needs. In this blog post, I’ll walk you through the entire process, from gathering information to launching a fully functional e-commerce site that has transformed Urritrek’s online presence.

First, some background on the old website

When I first approached the Urritrek website project, the existing site was far from ideal. It wasn’t an e-commerce platform, lacked multilingual support, and had a range of significant issues that were hindering the brand’s online success. The site was disorganized, with poor responsiveness for mobile devices, confusing navigation, and a chaotic layout that left users frustrated and led to lost conversions.

• No E-commerce Capabilities: The old Urritrek site didn’t allow customers to book tours directly online, leading to a cumbersome process that involved unnecessary steps and missed sales opportunities.

• Single Language Limitation: With only one language available, Urritrek was missing out on a global audience, resulting in higher bounce rates from users who struggled to navigate the content.

• Disorganized and Confusing Navigation: The site’s layout was chaotic, with poorly structured content and navigation that left users frustrated. Essential information was buried, making it difficult for visitors to find what they needed, which led to lost traffic and low conversions.

Our user flow usually started on the old Services page, with 70% of our visitors landing there, but it had an 85% drop-off rate. Of the users who landed on the home page, 32% went to Services, 27% went to El Camino de Costa Rica (with a 31% drop-off), and 31% dropped off immediately.

• Poor Mobile Responsiveness: The site did not adapt well to different screen sizes, making it difficult to use on mobile devices, further contributing to high bounce rates.

To address these challenges, we executed a comprehensive redesign that turned the outdated site into a modern, user-friendly, and fully functional e-commerce platform.

E-commerce Integration: We implemented a robust e-commerce system, enabling users to browse, select, and book tours directly on the site, streamlining the entire booking process.

Multilingual Support: We introduced multilingual capabilities to cater to a broader audience, improving accessibility and engagement.

Content Restructuring: We reorganized the site’s content to ensure that all important information was easily accessible. Each tour now has a dedicated page with detailed descriptions, itineraries, and booking options.

Enhanced Mobile Experience: The new site is fully responsive, providing a seamless experience across all devices, significantly reducing bounce rates and improving user satisfaction.

Simplified Navigation: We restructured the navigation to be intuitive and user-friendly, allowing visitors to find what they need quickly and easily.

Old Website:

Urritrek's old calendar page
Urritrek's old home page

Urritrek's new e-commerce website

Phase 1: Information Gathering

The first step in this project was to understand the current state of Urritrek’s website and identify the pain points. The old site was cluttered, confusing, and didn’t effectively communicate the brand’s offerings or the unique experiences it provided. I started by conducting a thorough audit of the existing site, noting down what worked, what didn’t, and what was missing.

I then moved on to gathering insights from key stakeholders, including the Urritrek team and some of their customers. I conducted interviews and surveys to understand their needs, expectations, and the issues they had encountered with the old website. This step was crucial because it provided a clear picture of what the new site needed to achieve.

Phase 2: Organizing and Structuring Information

With all the information in hand, the next step was to organize it in a way that made sense for both the brand and its customers. I created detailed site maps and user flow diagrams to visualize how the information would be structured on the new site. This involved categorizing the different types of content—such as tour descriptions, customer testimonials, and booking information—so that users could easily find what they were looking for.

A major focus was on the product pages, which had to be informative, engaging, and easy to navigate. Each tour needed to have its own dedicated page, complete with all the necessary details like itineraries, pricing, and additional options. I also planned for a multi-language feature to cater to Urritrek’s diverse clientele.

Phase 3: Developing a Project Timeline

To ensure the project stayed on track, I created a detailed timeline that outlined all the phases of development. This timeline served as a roadmap, guiding the team through each stage of the project and helping us meet key milestones. The timeline included deadlines for information gathering, design approval, development sprints, testing, and final launch. Regular check-ins and progress reports were scheduled to keep everyone aligned and address any potential issues promptly.

Phase 4: Designing the User Experience

Once the structure was finalized, it was time to design the user experience. The goal was to create a seamless, intuitive journey from the moment a user landed on the homepage to the point where they completed a booking. I worked closely with UX/UI designers to create wireframes and prototypes that reflected this vision.

We paid special attention to the user flow, ensuring that it was logical and straightforward. For example, the booking process was simplified to require as few steps as possible, while still providing users with all the information they needed to make an informed decision. The navigation was designed to be intuitive, with clear categories and filters that made it easy for users to find the perfect tour.

Phase 5: Development and Customization

With the designs in place, I moved on to the development phase. This involved coding the website from the ground up, with a focus on creating custom functionalities that would enhance the user experience. One of the key features was the custom code for product pages, which ensured that each tour page communicated all the essential information effectively.

I also implemented the multi-language feature, allowing users to switch between languages with ease. This was particularly important for Urritrek, as they cater to an international audience. Additionally, I integrated the site with external booking systems and payment gateways, ensuring that the entire process from browsing to booking was smooth and secure.

Phase 6: Testing and Feedback

Before the final launch, the website underwent rigorous testing. I conducted multiple rounds of usability testing, both internally and with real users, to identify any potential issues. This included testing on different devices and browsers to ensure that the site was fully responsive and provided a consistent experience across platforms.

Based on the feedback from these tests, I made several adjustments to the site. This iterative process was crucial in refining the user experience and ensuring that the final product met the high standards we had set at the beginning of the project.

Phase 7: Launch and Post-Launch Support

Finally, after months of hard work, the new Urritrek e-commerce platform was ready to launch. The response from users was overwhelmingly positive, with many praising the improved design, ease of use, and the wealth of information available on each tour.

But the work didn’t stop there. Post-launch, I continued to monitor the site’s performance, making adjustments as needed and providing ongoing support to the Urritrek team. This included training them on how to manage the site and make updates, ensuring that they could maintain the high-quality experience we had created.

The journey of creating Urritrek’s new e-commerce platform was a challenging yet rewarding experience. It was a project that required not just technical skills but also a deep understanding of the brand and its customers. By taking the time to gather information, plan meticulously, and focus on the user experience, we were able to create a website that not only looks great but also drives more sales and better serves Urritrek’s clients.

I’m proud of the work we accomplished, and I highly recommend hiking with Urritrek to experience the incredible tours that this new platform now showcases so beautifully.

And good news: they’re already making big sales. Just 15 days since the launch, the investment in the new website has already paid off <3

  1. Started in: May 1, 2024
  2. Final deliver by: Aug 26, 2024
  3. Hours: 120h of work from Nice One side.
  4. Cost: $5000