Knickgasm Website Redesign

At the Protothon 2023, UX Hackathon by Dubstech at the University of Washington, our team KAVYY redesigned the Knickgasm website to improve the experience of how users design and order customized as well as pre-designed sneakers.

🗓️ Timeline

May 6 - May 7, 2023

👩🏻‍💻 Role

UX Research, UX Design, Prototyping

✒️ Tools

Figma

👥 Team

Me 🙋🏻‍♀️, Kalindi, Vartika, Yashvi, and Yoshita

IDENTIFYING BUSINESS NEEDS

With ~1000+ customers, Knickgasm stands as India's leading online brand that sells custom-painted and pre-designed sneakers primarily through Instagram DMs and WhatsApp messages. Their current website is in its early stages and incorporates a Google form to receive customer orders.

To provide a more seamless experience, Knickgasm is keen on improving its website so that browsing and ordering shoes is an easier process for customers.

Goal 🎯

To divert the online purchase traffic from social media accounts to the official Knickgasm website.

Last 90 days’ insights from Knickgasm’s Instagram account

ANALYZING THE EXISTING WEBSITE & THE MARKET

In order to identify and assess the limitations of the existing website, we conducted a quick yet comprehensive heuristic evaluation using Jakob Nielsen's principles for interaction design. 

Given that we were on a time crunch, we focused on the top 3 heuristics (listed below) that we believed would have the most impact on improving the customer’s interaction with the website.

The original Knickgasm website

  • Jakob’s law states that people spend most of their time using digital products other than yours. Customers' experiences with those other products set their expectations.

    Due to Knickgasm's lack of consistency, users are forced to learn new things, such as how to use unfamiliar concepts like Google Forms to customize sneakers, which adds to their cognitive load.

    The website also fails to follow the industry standards for e-commerce platforms by not providing customers with products’ size guide, ratings and reviews that allow customers to compare products, and product descriptions that explain its features.

  • Currently, the website is quite rigid, limiting users' flexibility in performing tasks. There is no option to search for products, and the categorization of products on the navigation bar is inadequate which reduces the products’ discoverability. Also, the available shoe brands are not highlighted.

    Although there is a currency change button, it stays unresponsive.

    The customization process is overly restrictive as well. For instance, in the Google Form, customers are asked, 'Do you want us to provide the shoes?' If a customer clicks 'no,' there is no clarity regarding the subsequent process. Instances like these render the website inefficient for users.

  • The color palette appears bland, making the website look uninteresting and failing to convey the brand's funkiness.

    There's no clear visual hierarchy, and the elements fail to showcase the brand's products effectively. Essential elements, such as CTAs, are not highlighted, ultimately diverting users' attention away from the information they truly need.

    Moreover, the website lacks sufficient description and content to help users understand what the brand does and how it works, unable to build trust.

To analyze the market, we compared the Knickgasm website with 3 brands - NikeByYou, AllBirds, and ShoeZero based on 6 factors - Customization UI, Customization Features, User Flow, Visual Design, Content Quality, and Product Reviews as shown in the table here ➡

Even though Knickgasm offers significant customization features, we concluded that the Google Form prevents users from using these features since it lacks intuitiveness and doesn’t let customers visualize their designs.

Quick competitive analysis of the existing market

UNDERSTANDING THE USERS

Most customers discover Knickgasm through their mobile on Instagram or through word of mouth. Currently, they are more likely to request and order a shoe by sending a message to the Knickgasm Instagram account.

Customers also tend to explore and design their shoe ideas with a pre-set theme they have in mind. For example, they may come in with the mindset of they want to have a custom-designed "Dragon" or "Naruto" shoe.

There’s hesitancy among customers to order as they are super new to custom sneakers. They are fascinated but don't know where to start and always have questions about the authenticity and quality of the product due to the cumbersome process of customizing shoes that causes suspicion.

PAIN POINTS

❗️Confusing process for customizing sneakers.

❗️Inability to browse and find the desired type of sneakers.

❗️Trust in the brand is not established.

DEFINING THE PROBLEM & BRAINSTORMING

After completing our research and thoroughly analyzing both the business and user needs, we defined the problem statement using the How Might We approach . . .

How might we design an easy-to-use platform that helps customers effortlessly customize their shows and facilitates higher sales for Knickgasm?

. . .and began ideating on the potential solutions.💡

Simultaneously sketching out our ideas helped us in translating our vision into reality and deciding the user flow!

AND FINALLY, COMING UP WITH THE SOLUTIONS 🤌🏻

➡️ Establishing the brand’s identity and bringing forth its funkiness

Every aspect of the brand, including the tagline, color scheme, typography, and layout, underwent a redesign to bring out the quirky vibe of the brand. The original website failed to reflect its groovy identity, making it bland and preventing it from standing out.

The vibrant and warm tangerine orange, along with the mint green, helped to highlight the shoes as the focal point while maintaining a funky theme on the website. The fonts Jost and Poppins were used to create a bold, yet clean and simple layout.

➡️ Highlighting the products, creating an effortless shoe-browsing experience

To enhance the discoverability of the products, we improved the categorization of shoes on both the homepage and the navigation bar. Also, we added options like the Filter and Sort feature on the product listing page. This led to better product discoverability and facilitated the ease of finding desired items, a concern raised by multiple customers.

We specifically highlighted two sections on the homepage, 'Featured' and 'Collections', enabling customers to easily locate bestsellers and choose the type of collections they want to explore, narrowing down their choices to what they ultimately want to purchase.

This enhancement made the website more intuitive to browse, thereby improving the overall navigation.

➡️ Simplifying the process of customizing the shoes via AI integration

We replaced Google Forms for ordering customized shoes with a more convenient, step-by-step AI-powered process.

The new system allows customers to select shoe type → select shoe size → pick a category (such as Anime, TV Shows, Gaming, etc.) → upload images for the desired design (or select from suggested images) → which generates AI-designed pattern options for them to choose from.

The 'regenerate' button enables them to explore more design variations.

Toward the end, there is an optional section to include additional details about their designs for greater precision with the option to add voice recordings, images, or attachments.

➡️ Improving the product display page and streamlining the checkout process

To assist customers in making informed decisions, we added the product rating prominently at the top of the page, highlighting the product's popularity among customers. Additionally, we included a size guide to help customers select the right size for themselves.

In the checkout process, we incorporated breadcrumbs, allowing convenient navigation, with the option to make changes to their order, such as adjusting the quantity of shoes. These modifications provide customers with increased flexibility while making a purchase.

In the end, we added a confirmation message assuring that their order was confirmed!

➡️ Ultimately . . . building trust among customers!

To foster trust among customers, we integrated elements such as testimonials from influencers and celebrities, visible on both the homepage and the checkout page. Additionally, we incorporated comments, reviews, and ratings from customers on the product display page, reinforcing the brand's authenticity and boosting the likelihood of conversions.

For assistance or inquiries, we provided the chat with us feature at the bottom of the page. This enables customers to seek help promptly, improving overall customer service and creating a sense of security.

WHAT DID I LEARN ? 📚👩🏻‍🏫

Participating in the Protothon presented a valuable opportunity for me, not only to enhance my design skills but also to focus on team collaboration within a challenging environment. The tight deadlines and intense competition fostered a sense of urgency and creativity, pushing me to think critically and problem-solve under pressure. This experience encouraged me to prioritize effective communication and teamwork, leveraging individual strengths for the collective benefit.

While reflecting on our participation, we recognized the areas where we could have enhanced our performance, particularly in the initial planning of tasks and distributing responsibilities among team members before immersing ourselves in the hackathon.

Above all,

the Protothon encouraged a mindset shift towards innovation and thinking outside the conventional boundaries to create truly impactful and easily navigable products, creating a seamless experience for customers and bringing value.

🙌🏻 CHECKOUT OUR FINAL PROTOTYPE . . .