Nissan E-commerce

Brazil & Japan, Full time

Tools & Stack used

Figma, Mondays, Analytics, Storybook, HTML, CSS, JavaScript, React

Project Summary

I was responsible for creating and maintaining a new e-commerce store for Nissan. As the sole designer, I gathered feedback from stakeholders to understand the online buying process and designed the entire online store, including forms, product pages, category pages, and more.

The Challenge

Previously, Nissan's online presence was limited to purchasing online and picking up the car at the dealership. The goal of this project was to develop a comprehensive online store that included delivery options, transforming the customer experience.

Before this project, Nissan's online store did not allow customers to complete the car purchase entirely online. This created several issues for the user experience:

  • Inconvenience: Customers had to drive to a dealership, leading to a loss of time and added effort.

  • Availability Issues: There was a risk that the selected vehicle might not be available at the dealership, causing frustration and delays.

  • Fragmented Process: The need to switch from an online platform to a physical location disrupted the seamless buying experience.

  • Reduced Flexibility: Customers had limited flexibility to complete their purchase at their own convenience, potentially deterring those with busy schedules or long distances to travel.

  • Customer Frustration: The overall inconvenience and inefficiency could lead to a negative perception of the brand and a higher likelihood of abandoned purchases.

Goals

To address the challenges of the previous online buying process and enhance the user experience, the following objectives were set:

  • Develop a platform where customers can complete the entire car purchasing process online, eliminating the need to visit a dealership.

  • Integrate real-time inventory management to ensure that selected vehicles are available and reserved for the customer.

  • Create a seamless and intuitive user journey from browsing to purchasing, minimizing disruptions and ensuring a cohesive experience.

  • Include vehicle delivery as part of the online purchase process, providing added convenience and flexibility for customers.

  • Reduce the time and effort required for customers to complete their purchase, enhancing satisfaction and reducing the likelihood of abandoned transactions.

Development

Updating the Experience

To accommodate the new features and create a fully functional online store, the existing user experience needed a significant update. Three new options were integrated into the vehicle page to guide customers through the updated purchasing process:

  1. Complete Purchase at Dealership: This option allows customers to pay a reservation fee online to hold their selected vehicle, and then complete the purchase process in person at a dealership.

  2. Complete Purchase Online: This feature enables customers to pay the reservation fee and then proceed to complete the entire purchasing process online, including delivery arrangements, without ever visiting a dealership.

  3. Simulate Monthly Payments and Purchase: The most complex of the new options, this feature allows users to simulate their monthly payments based on their financial situation and credit score. Once the simulation is complete, customers can proceed with the purchase online. Integrating this feature required a credit check system to ensure the payment options offered were accurate and tailored to the customer’s financial profile.

Implementing the Credit Check Process

To facilitate the new feature allowing users to simulate monthly payments and complete the purchase online, a robust credit check process was integrated into the user journey. When users selected the third option, they were redirected to a dedicated credit check page.

This new page featured a form that required users to input essential information needed to assess their financial eligibility. To successfully implement this page, it was crucial to collaborate closely with financial institutions to ensure that all necessary fields were included and that the process adhered to industry standards.

We worked with financial partners to determine the specific data points required for a thorough credit assessment, such as personal identification details, income information, and other financial indicators. Additionally, we consulted with these institutions to ensure that the methodology used on the page met legal and compliance requirements, making the credit check process both secure and legitimate.

By carefully crafting this page in accordance with financial regulations and user experience best practices, we were able to create a seamless and trustworthy credit check process. This ensured that customers could accurately simulate their monthly payments and proceed with confidence through the online purchasing journey.

Developing the Credit Calculator

After completing the credit check form, users were guided to the Credit Calculator page, a crucial step in the online purchasing process. This page presented a challenge due to the need for a brand new component—the "Interest Meter."

The Interest Meter was designed to allow users to input key information such as their desired down payment and the number of months over which they planned to finance the vehicle. This component dynamically calculated the interest rates based on the input and provided real-time feedback on the total cost of the loan. Additionally, the Interest Meter assessed the user's eligibility for special financing offers, such as zero interest rates, based on their credit score and chosen payment plan.

Creating this component required a deep understanding of financial calculations and user interface design. We needed to ensure that the Interest Meter was both accurate and easy to use, providing clear and concise information that would help users make informed decisions. The development process involved close collaboration with financial experts to ensure that the calculations were precise and compliant with industry standards.

By successfully integrating the Interest Meter into the Credit Calculator, we were able to offer users a powerful tool for customizing their financing options, enhancing transparency, and empowering them to make confident purchasing decisions.

Tackling the "Form of Death"

The "Form of Death" was undoubtedly the most challenging aspect of the project. This mandatory form, required by all financial institutions for car purchases, consisted of a four-step process with numerous fields that the user had to complete to prove their eligibility for financing.

Given the complexity and length of the form, it was easy for users to feel overwhelmed or bored, which could lead to frustration and potential drop-offs. To mitigate this risk, we focused on making the page as clear and simple as possible, ensuring that users could navigate it with minimal effort and without needing to contact support for help.

To achieve this, we employed a user-centric design approach that emphasized clarity and ease of use. Each step of the form was carefully structured to guide the user through the process, with clear instructions and intuitive layout. We also incorporated progressive disclosure techniques to prevent information overload, showing only the necessary fields at each stage.

To keep the user informed and engaged, we included real-time updates on key financial information—such as installment options, total payment, and monthly payments—throughout all steps of the form. This transparency ensured that users always knew where they stood in the process, reducing anxiety and helping them make informed decisions.

By simplifying the "Form of Death" and enhancing its usability, we were able to maintain a seamless and clear experience, minimizing disruptions and ensuring that users could complete this critical step with confidence.

Finalizing the Purchase: The Payment Screen

The payment screen was the final step in the user’s journey, where they could secure their vehicle by making a reservation or completing the full purchase. This stage was designed to be straightforward and secure, guiding the user through the final choices with clarity and ease.

For users opting to make a reservation, the process was simple: they paid the reservation fee, which held the vehicle for them. After this, they were seamlessly redirected to an external site where they could schedule the delivery of their new car, completing the purchase process.

For those who chose the financing option, the process included additional steps to ensure everything was in order. After completing the payment screen, the user would receive a digital contract via email, which they needed to sign to finalize the financing agreement. Once the contract was signed, the purchase was officially completed, and the vehicle was reserved for the user.

For users who opted for full payment, the process was slightly different. After all necessary verifications were completed on the payment screen, a secure link to the payment provider was generated. The user could then finalize their purchase through this link, ensuring that the entire transaction was completed smoothly and securely.

This payment screen was crucial in wrapping up the user experience, ensuring that the final steps were as seamless and efficient as possible, regardless of the payment method chosen. By providing clear instructions and secure pathways, we ensured that users could complete their purchase with confidence, bringing their online car buying journey to a satisfying close.

Custom Components

Given that this project was primarily focused on the Brazilian market, we needed to create new components tailored specifically to this audience. However, to maintain consistency with Nissan's global brand identity, these components had to align with the styling of the Nissan Global components kit.

This process involved close collaboration with teams from the US and Japan to ensure that the new components met Nissan’s global standards. Each component was carefully reviewed and approved by these teams to guarantee that everything was in line with the brand’s visual and functional guidelines. This collaborative approach ensured that the Brazilian e-commerce platform seamlessly integrated with Nissan’s global digital presence while catering to the specific needs of the local market.Re

Results

The launch of the new Nissan E-commerce platform yielded impressive results, demonstrating the success of the design and implementation efforts. Within just two weeks of the product’s launch, there was a 16% increase in online sales, highlighting the immediate impact of the enhanced online purchasing experience. Notably, within the first few days, three complete online sales were made, marking a significant milestone in Nissan's transition to a fully digital sales process.

In addition to the increase in sales, user satisfaction saw a remarkable boost. We implemented an NPS (Net Promoter Score) questionnaire to gather feedback from customers who completed their purchase online. The results were overwhelmingly positive, with a 98% satisfaction rate among those who utilized the new online platform. This high level of satisfaction underscores the effectiveness of the user-centered design approach and the seamless, convenient experience we were able to deliver.

Overall, the success of this project not only drove immediate sales growth but also strengthened customer trust and loyalty, positioning Nissan as a leader in digital automotive retail.

*This is just a brief overview of the project. If you’d like to dive deeper into the details or discuss my work further, I’d be happy to schedule a chat. Feel free to reach out!