CLIENT
Onbit
INDUSTRY
Mobile Accessories
TECHNOLOGY
Adobe Commerce/Hyva Theme Integration
Client Overview:
Onbit is an e-commerce platform based in Canada, dedicated to providing a wide range of top-quality products. Known for offering an exceptional online shopping experience, ONBIT aims to simplify the lives of its customers by providing easy access to everyday products. With over 14,500 products and an impressive return rate of 81%, ONBIT caters to a global audience, serving more than 10 million satisfied customers. The platform features advanced tools like star ratings, efficient search functionality, and convenient filters, further enhancing the shopping experience.
Project Goals and Objectives:
The primary objective of this project was to completely overhaul Onbit’s existing website by implementing the Hyva Theme. The goal was to significantly improve website speed and optimize the overall user experience. By leveraging the speed, performance, and user-friendly design principles of the Hyva theme, we aimed to create a modern, fast, and responsive website. This included redesigning critical elements, enhancing site navigation, and ensuring seamless functionality across mobile and desktop devices. Ultimately, the project aimed to exceed user expectations, delivering a more efficient and engaging online experience.
Challenges:
- Transition from Codazon to Hyva: Migrating from the Codazon theme to the Hyva theme while maintaining existing customizations and UI design.
- Managing Homepage with Page Builder:Ensuring the homepage could be managed using a page builder similar to the previous Codazon Page Builder.
- Widget Integrations:Developing banners and product sliders using widgets that match the functionality of the Codazon Theme extension.
- Algolia InstantSearch Implementation:Integrating Algolia InstantSearch for faster product search functionality within the Hyva theme.
- Third-Party Extensions Compatibility:Ensuring that all third-party extensions were fully compatible with the new Hyva theme.
- B2B Functionality:Implementing the “log in to view price” feature tailored for ONBIT’s B2B customers.
Solutions:
We developed a custom Hyva child theme that was tailored to ONBIT’s specific design needs, incorporating custom extensions to meet functionality requirements. Key aspects of the solution include:
- Hyva Theme Customization: The theme was optimized to ensure seamless performance and user experience, integrating all necessary features and customizations.
- Homepage Enhancements: Utilized Magento Page Builder to manage content effectively and created custom widgets to replicate Codazon functionality.
- Search Optimization: Integrated Algolia InstantSearch for a quicker, more efficient search process.
- B2B Features: Implemented the “log in to view price” feature, providing a secure and efficient experience for B2B customers.
Implementation:
Homepage Optimization:
- Integrated Amasty MegaMenu, Algolia InstantSearch, a customer sidebar, and an optimized minicart.
- Improved the Amasty MegaMenu performance by 80% via code optimization, and created a sticky header to improve navigation.
- Utilized Magento Page Builder to manage homepage content, including 21 sliders and CMS content.
Product List and Category Pages:
- Developed a subcategory slider to showcase child categories, easily manageable via the admin panel.
- Integrated Amasty ImprovedNavigation for a more efficient desktop and mobile navigation experience, including mobile layered navigation in a popup for better usability on mobile devices.
Product Pages:
- Enhanced the product page by adding a zoom capability for product images, a sticky “Add to Cart” button, and social sharing functionality.
- Replaced the default Hyva slider with a third-party slider for related and upsell products.
Performance and Speed Optimization:
- Optimized third-party extension code to meet performance standards.
- Implemented advanced Hyva form validation across all forms.
- Developed the ‘login to view price’ feature for the B2B functionality.
Search Functionality:
- Customized Algolia InstantSearch results, aligning them with Hyva’s design to ensure a consistent user experience.
Mobile Responsiveness:
- Ensured that all features, including navigation, sliders, and product pages, were fully responsive and optimized for both mobile and desktop devices.
Final Result:
- Improved Site Speed: The project was a resounding success, achieving PageSpeed scores above 93% for mobile and over 96% for desktop across all pages.
- Performance: The implementation of the Hyva theme significantly boosted site speed, with notable improvements in performance across product pages, the homepage, and search functionality.
- Scalable Platform: The site is now much faster and more efficient, providing an improved shopping experience that aligns with modern standards for e-commerce platforms.
- Increased User Satisfaction: The optimizations led to smoother browsing, quicker page loads, and a more responsive experience for all users.
Before Hyva implementation:
After Hyva implementation:
