StoneTEKK: Stone Industry Management System

- brief -

StoneTEKK aims to modernize the traditionally disorganized stone industry. The project includes a real-time inventory management system, an e-commerce platform for purchasing stone online, and an AR experience for visualizing stone in 3D on walls or floors. It also features an advanced calculator for pricing stone defects.

- context -

The stone industry often relies on paper-based systems and lacks digital solutions for managing inventory and sales. StoneTEKK was developed to address these inefficiencies by integrating technology into every aspect of the industry, from inventory management to customer purchasing experiences.

- problem statement -

The traditional stone industry suffers from disorganization and inefficiencies. There is a need for a modern system to manage inventory, provide an online purchasing solution, and offer tools for dealing with defects and pricing adjustments.

- quick glance for hiring managers -

As the UX Lead for StoneTEKK, I led the design and development of a transformative management system for the stone industry, addressing inefficiencies in a paper-reliant sector. The platform integrated real-time inventory management, an e-commerce solution, and AR-based 3D visualization for stone layouts.

• Stakeholder Collaboration: Partnered with a stone company owner to understand industry workflows like batch management and defect handling, aligning the design with real-world needs.
• Innovative Features: Designed solutions such as a defect-pricing calculator and gamified progress indicators, leveraging the Zeigarnik Effect to enhance user engagement.
• Iterative Design: Conducted user testing to refine the experience, ensuring usability and functionality tailored to business goals. We faced challenges with making the right design that feels seamless to the workers with their limited technical knowledge, and CUJ efforts were crucial. We finally achieved an intuitive, easy-to-use solution.
• Effective Core logic: Stone is a natural material that gets cut and ship in batches. It also needs the right order so they are adjacent to each other and complete the design when placed on floor. This was carefully put in with our ordering system in inventory management for such stones.
• Cross-Functional Leadership: Collaborated with designers, developers, and marketers to deliver a cohesive, user-centric platform.

- pitch -

Pitch for Stone Industry Management app

- crafted solution -

• Real-Time Inventory Management: Allows users to manage and track stone inventory seamlessly.
• E-Commerce Platform: Enables online purchasing of stone for flooring.
• AR Experience: Lets users visualize how the stone looks in their space.
• Defect Calculator: An advanced algorithm-based tool for adjusting the price of stone with defects.

- skeleton loading -

Skeleton Loading: Smartly animated skeleton loader that improves loading experience.

- timeline -

• Team: Paawan (Designer), Yogendra (Senior Designer), Sahil (Product Manager), Gourav (Frontend), Lovely (Frontend), Shubhi (Backend), Merul (Senior Backend & CTO), Ananya (Frontend Intern), Prashant (Marketing Lead), Jyoti (Social Media), Pratibha (Marketing & Sales), and Yash (User Experience Lead).
• Role: Primary Designer and Lead UXE
• Duration: 5 weeks
• Tools Utilized: HTML, CSS, JavaScript, TypeScript, Svelte, Postgres, Figma, Google Sheets (for OKRs), various UI/UX tools

- design system styleguide -

Developed a style guide using the Geologica font, ensuring consistency across the platform. The design system included guidelines for color, typography, and component styles to maintain a cohesive user experience.

- project goals -

• To modernize the stone industry with a digital solution that integrates inventory management, e-commerce, and AR experiences.
• To provide an easy-to-use tool for managing defects and pricing adjustments.
• To offer a more engaging and satisfying user experience through gamification and progress indicators.

- research -

• Personas: Developed personas for stone industry professionals, buyers, and homeowners looking to purchase stone.
• Target Audience: Stone industry businesses, contractors, and end customers.
• Analysis: Research highlighted the need for streamlined inventory management and engaging online purchasing experiences. The Zeigarnik Effect was identified as a key factor in enhancing user engagement.

- case study: zeigarneik effect -

In our research and testing, we found that users preferred having an indication of the number of steps required to order a stone. We implemented a step-by-step guide showing the stages: adding to cart, adding address, adding payment, and swiping to pay, labeled as 1, 2, 3, 4. Upon completing the process, we added a celebration confetti animation for a successful order. This feature was well-received and loved by users.

The Zeigarnik Effect, a psychological phenomenon where people remember uncompleted or interrupted tasks better than completed ones, can be leveraged in UX design to enhance user engagement and completion rates. By showing users the steps required to complete their order, we tap into the Zeigarnik Effect, keeping them motivated to continue through each step until completion. If a person leaves the process mid-way, they are constantly reminded of their incomplete steps when they return to browse more stones, driving their desire to complete the task. The visual progress indicators and the final celebration confetti act as incentives, reducing the likelihood of task abandonment and ensuring a more satisfying user experience.

This strategic use of the Zeigarnik Effect in our design directly contributed to the positive feedback and increased user satisfaction in our case study. Users particularly loved the gamification aspect, where the confetti celebration provided a rewarding sense of achievement upon completing their purchase.

- calculator for stone defects -

An innovative UX backed by Robust algorithms to solve client needs.

- experimental react app -

• Contact Picker API: We ran an experimental feature in favour of the Contact Picker API to showcase how it reduced friction and supported us with faster onboarding. The app was build in react and shows how Contact Picker is way faster than autofill with multiple contacts selected at once to deliver monthly recurring orders at multiple addresses. The entire process was documented and can be found below:

- brainstorm and ideation -

• Possible Solutions: Explored various ways to integrate inventory management, e-commerce, AR, and pricing adjustments. Considered incorporating gamification elements and progress indicators.
• Chosen Solution: Implemented a step-by-step order guide, AR visualization, and an advanced defect calculator to address industry needs and enhance user experience.

- sketches and wireframes -

Created initial sketches and wireframes focusing on the user flow from inventory management to purchasing and defect calculation. Emphasized intuitive navigation and clear progress indicators.

- iterations -

Iterated on designs based on user feedback and usability testing. Refined the step-by-step guide, AR experience, and defect calculator to improve functionality and user engagement.

- prototype -

Created a high-fidelity prototype in Figma, showcasing the full user journey from managing inventory to completing a purchase and visualizing stone in AR.

- usability testing -

Conducted usability tests to ensure the system met user needs and expectations. Tested the step-by-step order guide, AR features, and defect calculator to gather feedback and identify areas for improvement.

- design overview & web link -

- design -

• Color and Typography: Geologica font and a color scheme tailored to the stone industry.
• UI Components: Designed for clarity and ease of use, including interactive elements for AR and e-commerce.
• Gamification Elements: Added celebration confetti and progress indicators to enhance user satisfaction.

- conclusion -

• Challenges: Integrating advanced algorithms for defect calculation, ensuring a seamless AR experience, and managing user expectations.
• Learnings: Identified the importance of clear progress indicators and the value of gamification in enhancing user engagement.
• Outcomes: The project effectively modernized the stone industry, providing a comprehensive solution that improved inventory management, facilitated online purchasing, and offered an engaging user experience.

- scope of improvements -

Future enhancements could include additional features for inventory management, expanded AR capabilities, and further refinements to the defect calculator (detecting largest rectangle at certain angles for some tiles).

- what could have been better -

Initial designs could have benefited from more in-depth user research and testing, particularly in the AR and e-commerce areas, to ensure the platform met all user needs effectively.

- final feedback and suggestions -

The project successfully addressed key industry pain points and received positive feedback for its innovative approach and user-friendly design. Future iterations should continue to focus on refining the AR experience and exploring new features to further enhance the system.