Target Tiles

Custom Size Calculation System
Custom Woocommerce
Enhanced User Experience

About The Project

Industry :

Sector :

Tile and Flooring Retail

Niche :

Home Improvement and Interior Design

Country :

United Kingdom

Technologies:

Team Size :

6 Members (Backend developer-2, Frontend developer-1, GSAP animator-1, QA-1, Project manager-1)

Initial Goal

Target Tiles, one of the largest tile suppliers in the UK, approached us with a critical need: to enhance their e-commerce platform for accurate cost and size estimations. While the company enjoyed a healthy flow of website traffic, they struggled to provide users with an intuitive solution to calculate tile costs based on specific dimensions and areas, leading to friction in the buying process.

Pain Area

Inaccurate Tile Sizing: Users could not calculate the exact size and cost of tiles required for their spaces, resulting in abandoned purchases.
Lack of Flexibility: Ready-made plugins failed to address the complexity of custom tile calculations, including allowances for wastage.
Impact on Sales: The inability to provide precise estimations deterred potential buyers, hampering overall sales.

Development Approach

Dynamic Cost Calculation:

Built a bespoke solution using JS calculations, PHP, and AJAX to enable dynamic input of dimensions and real-time cost calculations.
Factored in wastage calculations, allowing users to include a percentage buffer for their tile orders.

Custom WooCommerce Integration:

Extended the existing WooCommerce functionality using custom hooks to process calculated dimensions and costs into the shopping cart and checkout flow.
Ensured a seamless connection between the custom calculator and the e-commerce system.

User-Centric Design:

Focused on simplicity and ease of use, ensuring the custom functionality seamlessly blended with the website’s existing interface.

Scalability and Performance:

Optimized the custom solution for high traffic and ensured compatibility with future updates to WordPress and WooCommerce.

Deliverables Outlined

Custom Tile Calculation Tool: Built an innovative tool allowing users to input their space dimensions and calculate precise tile quantities and costs, including wastage percentages. The tool dynamically updated pricing and displayed clear results in real-time. This feature eliminated user confusion and streamlined the shopping process, making it simple for customers to make informed purchases tailored to their specific needs.

WooCommerce Custom Integration: Extended WooCommerce capabilities by developing custom hooks and PHP code to support the tile calculation logic. This ensured seamless backend integration, enabling users to add customized orders directly to their cart without breaking functionality. The integration was tailored to handle complex calculations while maintaining website speed and performance.

Responsive and Mobile-Friendly Design: Delivered a fully responsive website that functioned seamlessly across all devices and browsers. The custom calculator was tested extensively to ensure it performed perfectly on desktops, tablets, and mobile phones. This responsive approach improved accessibility and user engagement, allowing customers to interact with the site on their preferred devices.

Performance Optimization: Applied advanced optimization techniques, including lazy loading, script minimization, and caching, to ensure the website loaded quickly even with interactive features. This helped the site achieve high scores on performance testing tools like GTmetrix and Google PageSpeed Insights.

Professional and Engaging Design: Developed a visually appealing website design that aligned with the client’s brand identity. The design emphasized clarity and professionalism, particularly in the tile calculation tool and user navigation. The polished design increased user trust and positioned Target Tiles as an industry leader.

Challenges Faced

Dynamic Tile Calculator: Users can enter room dimensions and receive instant cost estimates based on tile size and selected wastage percentage.
Wastage Inclusion: A user-configurable feature to ensure they purchase adequate tiles, reducing under-ordering.
Real-Time Feedback: Instant cost updates based on user inputs for transparency and convenience.

Solution

Dynamic Tile Calculator:

Built a custom calculator that allowed users to input their specific room dimensions (length and width).
Integrated logic for tile size selection, wastage percentage, and real-time cost estimation.

Wastage Calculation:

Incorporated an option for users to add a wastage percentage to their tile order, ensuring they could cover all areas without under-purchasing.
Calculations factored in tile size, quantity, and wastage, providing users with an accurate total.

Success Story

Increase product sale

Fast development

Long term relationship

The custom size calculation feature resolved the long-standing pain point, allowing customers to effortlessly determine their tile requirements and costs. This innovation not only simplified the user experience but also significantly boosted online sales.
The client reported an increase in customer engagement and a higher conversion rate, attributing it to the enhanced functionality. The solution also garnered positive feedback from customers, who appreciated the transparency and ease of use.