A brief background on KTM AG

KTM AG is an Austrian motorcycle and automotive manufacturer which was formed in 1992. With years of experience in the automotive industry and a reputation for quality across Europe, KTM AG is one of Europe’s largest motorcycle manufacturers. With such a stellar reputation and legacy in the motorcycle and automotive business, KTM AG wanted to ensure the same quality of service for its customers in Austria and across the rest of Europe through its website.

Challenges

KTM AG came to nopStation with its existing website built on nopCommerce version 4.20. KTM AG requested several changes to its website including new functionalities, optimizations, and UI changes. After an extensive audit and R&D process, our team identified key development challenges for this project.

Integrating FactFinder search services: KTM AG requested integration with FactFinder for an enhanced searching and filtering experience. Our team had to develop a way to integrate this functionality to enhance the search feature of the storefront. One of the most significant development challenges for us was developing integration with FactFinder's search services.

Handling FactFinder URLs for a multi-store system: KTM AG wanted a search solution optimized for multi-stores. This presented additional development complexities for FactFinder Integration as before data binding, store availability and store URL for a product had to be considered. Our team faced an additional challenge with FactFinder integration. We had to account for the fact that FactFinder search integration was fetching FactFinder responses and data. As the data retrieved was coming from FactFinder’s database, our team had to develop a way to bind the data with the website’s database to fetch accurate product page data as well as SEO-friendly names for pages and the URLs.

Developing a custom KTM parts finder module: A major development requirement from KTM AG was the development of a spare parts finder feature for their ktmshopping.at website. This presented a significant engineering and development challenge as the searching and filtering had to account for the category, year, bike model and variants, frame parts, and engine parts. KTM AG also requested that the parts should be visually mapped with the spare parts manual for a more immersive shopping experience. As this requirement was quite abstract, it presented the team with significant R&D challenges.

Creating a more adaptive and informative product details page: KTM AG wished to create a more adaptive and contextual bike finder feature. They wanted customers to have the ability to save certain bike models and configurations for repeated searches. They wanted this functionality to be available for both registered and unregistered customers.

Adding an estimated delivery range to products: KTM AG had requested showing estimated delivery dates for products based on product availability date. They wanted the estimate to be between 3-10 working days and handle weekends for calculation.

Developing an adaptive and optimized UI: Besides purely functional changes, KTM AG requested several UI enhancements on their website and faster loading times. Our team used its UX expertise to conduct R&D on implementing a more intuitive UI/UX for these enhancements while also increasing loading speeds.

Post AG integration for shipping: With KTM AG’s ktmshopping.at being targeted at its Austrian customers, they requested support for Post AG as a shipping method. Our team had to find a way to develop a way to add Post AG services with ktmshipping.at.

Our Solution

To achieve all of the development requirements for KTM AG’s Austrian website project, our team at nopStation went through an extensive analysis and breakdown of the business requirements and in-depth research to finalize its development strategy for the total project. Having to work with an existing codebase, we decided to utilized mostly a custom development approach on top of the system to implement all of the new functionality.

Developing a FactFinder search module with URL builder for multi-store setup: Our team engineered a search integration module for the FactFinder search feature. We had to additionally develop a URL builder to implement a custom search results page based on response data from the FactFinder search module. The URL builder implemented by the team takes the FactFinder URLs data and uses Product ID-based mapping to bind KTM AG’s product data to build SEO-friendly URLs and display product information. This ensures accurate search results pages with SEO-friendly URLs and titles. We had been able to optimize this module for KTM AG’s multi-store setup as well with accurate results and product data binding based on store and availability.

Developing a KTM parts finder module: One of the most substantial development challenges for us had been to develop a custom parts search module. Our team had to go through significant R&D to not only develop a search UI that was optimized for moto parts but also integrated parts manual visualization. We worked to integrate a robust search mechanism based on terrain, category, year, bike model and variants, frame parts, and engine parts. We also integrated searching with bike Identification numbers for more enhanced moto parts searching. The entire parts finder feature was implemented as a single-page module as well for enhanced usability.

Image 1.2: KTM spare parts finder module

Adding visualization and mapping for spare parts on the parts manual: The next significant development challenge was adding visualization in the spare parts search page to highlight the parts, default buying quantity, and assembly information. For implementing this feature, our team conducted extensive R&D and trials to develop a coordinate-based mapping for each part of its bike manual. When the mouse hovers over a specific part on the parts list or on the spare parts manual image, it shows the part's name, price, and base quantity of purchase. The pop-up includes a quantity adjustment and an add-to-cart buttons for added accessibility. This created a more intuitive UX and increased usability significantly.

Image 1.3: Visualization for spare parts

Adaptive bike finder with bike model saving feature for faster searches: Our team developed a custom bike finder module with the feature to save bike models for registered and unregistered customers. A registered customer can save bike models after or during a search. When a bike model is saved, it shows up in a carousel under the search menu.

Image 1.4: Bike finder with bike model saving feature

With this module, for repeated searches, a customer can simply click on a saved bike model from the carousel. For unregistered customers, only one bike can be saved. The bike search is also adaptive as it searches contextually based on pages. For example: on the accessories page it’ll search for accessories compatible based on the bike.

Implementing UX enhancements with CDN integration for faster load times: We developed several UX enhancements for the UX/UI of the ktmshopping.at website. For adding dynamic content, the team developed an Elements plugin that lets admins add content such as banners, custom links, reviews, parts finder info, featured categories, etc. to specified widget zones, this plugin allowed for extensive customization for the website with efficient management from the admin side.

Image 1.5: Adding Content through Elements plugin

To ensure faster loading times, our team decided to use CDN services for offloading website images. To enable CDN integration, they developed a CDN integration plugin for the website. This plugin offloads images to a CDN server to optimize webpage loading times. This approach increased loading speeds exponentially for the website.

Adding estimated shipping times for products: To show the estimated shipping information for products, our team had to develop an estimated shipping time feature based on product availability. This feature had to account for local weekends and holidays for showing estimation dates between 3-10 working days from product availability. We had been able to successfully implement this feature. Each product's estimated shipping date range is shown on the cart and checkout page.

Developing a Post AG shipping plugin: For enabling shipping services across Austria with Post AG, we developed a plugin for Post AG integration. Developing a Post AG shipping plugin from scratch took significant development time & effort. This plugin lets KTM AG’s admins easily create shipments for Post AG and generate Post AG shipping labels which are downloadable for more enhanced shipping & delivery management.

Results:

• Developed KTM parts finder module with active visualization
• Integrated FactFinder services for faster search
• Implemented URL builder to convert and bind SEO-friendly URLs from FactFinder data
• Implemented bike finder module with contextual searching
• Improved webpage load times using CDN integration
• Added estimated product shipping date feature based on availability
• Enabled shipping services through Post AG integration plugin

nopStation is a Gold Solution Partner of nopCommerce and an eCommerce wing of Brain Station 23 Ltd., a top-ranking software development company, headquartered in Dhaka, Bangladesh. At nopStation, we design, build and enhance eCommerce solutions on top of the nopCommerce platform for clients of all business sizes. The company has technology partnerships with 12+ leading ISVs including, Microsoft, Google, and AWS. We help our customers build their business online by developing the right eCommerce solution using nopCommerce at a competitive price and reasonable timeline.