Ancheroule

Unleash your skate style and elevate with top-tier gear and fashion

Case study

Product design

Desktop

Contribution

UX, UI Designer

Tools

Figma, Miro

Duration

2 Weeks

Overview

Ancheroule is a skate gear and fashion retail store offering custom skates and curated skate gear and skate apparel from the best brands.

Problem

Skaters struggle with finding skate shop websites that match their preferences. Existing sites lack desired features, leading to time-consuming searches across multiple stores

Solution

Create a skateboard retail store website that can help meet user needs and be an advantage in business goals to combine and generate product features needed by users.

Design Process

Empathize

Competitive Analysis

In the Custom Page, I created several features to make it easier for users to customize the product of their choice. Let's dive in:


1.

Filter

I added Filter in the form of Brand, Color, and Size options to make it easier for users to choose products according to their preferences.

2.

Product Category

I made it easier for users to see products that match the highest price category, lowest price, and newest product.

Product Gallery & Detail

In the Custom Page, I created several features to make it easier for users to customize the product of their choice. Let's dive in:


1.

Filter

I added Filter in the form of Brand, Color, and Size options to make it easier for users to choose products according to their preferences.

2.

Product Category

I made it easier for users to see products that match the highest price category, lowest price, and newest product.

Product Gallery & Detail

Key Findings

1.

No special features available currently

The analysis above shows that competitor websites do not have unique pages to attract customers, such as blog pages and custom pages to make it easier for users to create products according to user preferences.

2.

Few competitors

There are still a few retail skate shops that have websites to sell their products, and most of the shops that don't have their websites use e-commerce as a place to sell their products where there are no features such as custom skateboards and blog pages.

3.

Skateboard is special product

Skateboard is an exceptional product where there is a need for a unique website, such as a custom skateboard and a blog about the development of skateboarding in one website.

Product Gallery & Detail

In the Custom Page, I created several features to make it easier for users to customize the product of their choice. Let's dive in:


1.

Filter

I added Filter in the form of Brand, Color, and Size options to make it easier for users to choose products according to their preferences.

2.

Product Category

I made it easier for users to see products that match the highest price category, lowest price, and newest product.

Product Gallery & Detail

In the Custom Page, I created several features to make it easier for users to customize the product of their choice. Let's dive in:


1.

Filter

I added Filter in the form of Brand, Color, and Size options to make it easier for users to choose products according to their preferences.

2.

Product Category

I made it easier for users to see products that match the highest price category, lowest price, and newest product.

User Research

I use a qualitative method by conducting direct interviews with users to find out user needs by asking several questions such as: why do they buy skateboarding equipment and skate apparel online, what are they looking for and what are their Pain Points, what devices do they use when looking for a product. I have three answers ( two boys and one girl), between 18-30 years old.

User Interview Findings

  • The pandemic has changed user habits to prefer shopping online rather than directly at stores which can take time.

  • Users prefer a website for product exploration - no downloads, no registration hassle



  • Users expect a diverse product range, easy search, and fair prices.

  • Users delighted with skateboarding updates, culture, and education.

Define

User Persona

Personas drive decision making by solving user problems, frustrations, and goals using insights from user interviews.

Empathy Map

I used an Empathy Map to delve into user behavior, attitudes, and habits, gaining insight into their point of view and the problems they face.

Business Goals

  • Get benefits by working with brands from around the world whose products are in great demand by users.

  • Become a website with the most traffic through blog pages and the best products.Business Goals

  • Custom Pages and Blog Pages do not yet exist in Indonesia so they can be a special feature offered by Ancheroule for users

User Goals

  • Makes it easy for users to get skateboard products according to their preferences


  • The existence of a Custom Page can provide a better experience for the user


  • Become a place to get insight for users by providing a Blog page that helps provide information and skateboarding culture

Ideate

User Flow

I created User Flow to understand how users interact with the product. Making User Flow makes me think from the user's point of view to make it easier to consider the various features used by the user.

Sketches

I explored views on other websites and made sketches to get an initial picture of the ideas to be developed.

Prototype

Wireframe

Home Page

Product Galery

Product Page

Product Detail Page

Custom Page

Blog Page

Blog Detail Page

Test

Usability Test

I did a Usability Test directly to 4 users and gave Tasks to explore Home Page, Blog Page, Custom Page, Product Gallery, and Product Details. Here are some points that I got:


Pain Points

  • There is no Filter in the Product Gallery to make it easier to find and sort products according to preference

  • Quick save options are not available, such as quickly adding to cart and favorites

  • Cannot return to Gallery Blog Page when opening Blog Page Details article because there is no return option.

Implement

Brand Identity

Typography

Color

Hi-Fidelity Design

Home Page

Ancheroule

Ancheroule

Unleash your skate style and elevate with top-tier gear and fashion

Unleash your skate style and elevate with top-tier gear and fashion

Product Gallery & Detail

In the Product Gallery, according to the user's pain points, I added several features:

1.

Filter

Steps are used to assist the user in customizing the selected product according to the steps that have been given.

2.

Order Detail

After selecting a product, the user can view the products that have been added by providing product information that has been added to make it easier for the user to see what products have been added.

Custom Page

In the Custom Page, I created several features to make it easier for users to customize the product of their choice. Let's dive in:


1.

Steps

Steps are used to assist the user in customizing the selected product according to the steps that have been given.

2.

Order Detail

After selecting a product, the user can view the products that have been added by providing product information that has been added to make it easier for the user to see what products have been added.

Blog Page

To answer the needs of users who want to get up-to-date information, I created a blog page so users get quality information about skateboarding.

Email

Yaldi Sanubari © 2023

Case Study

Product design

Desktop

Case Study

Product design

Desktop

Contribution

UX, UI Designer

Tools

Figma, Miro

Duration

2 Weeks

Contribution

UX, UI Designer

Tools

Figma, Miro

Duration

2 Weeks

Overview

Ancheroule is a skate gear and fashion retail store offering custom skates and curated skate gear and skate apparel from the best brands.

Problem

Skaters struggle with finding skate shop websites that match their preferences. Existing sites lack desired features, leading to time-consuming searches across multiple stores

Solution

Create a skateboard retail store website that can help meet user needs and be an advantage in business goals to combine and generate product features needed by users.

Overview

Ancheroule is a skate gear and fashion retail store offering custom skates and curated skate gear and skate apparel from the best brands.

Problem

Skaters struggle with finding skate shop websites that match their preferences. Existing sites lack desired features, leading to time-consuming searches across multiple stores

Solution

Create a skateboard retail store website that can help meet user needs and be an advantage in business goals to combine and generate product features needed by users.

Design Process

Design Process

Empathize

Competitive Analysis

Empathize

Competitive Analysis

Key Findings

1.

No special features available currently

The analysis above shows that competitor websites do not have unique pages to attract customers, such as blog pages and custom pages to make it easier for users to create products according to user preferences.

2.

Few competitors

There are still a few retail skate shops that have websites to sell their products, and most of the shops that don't have their websites use e-commerce as a place to sell their products where there are no features such as custom skateboards and blog pages.

3.

Skateboard is special product

Skateboard is an exceptional product where there is a need for a unique website, such as a custom skateboard and a blog about the development of skateboarding in one website.

Key Findings

1.

No special features available currently

The analysis above shows that competitor websites do not have unique pages to attract customers, such as blog pages and custom pages to make it easier for users to create products according to user preferences.

2.

Few competitors

There are still a few retail skate shops that have websites to sell their products, and most of the shops that don't have their websites use e-commerce as a place to sell their products where there are no features such as custom skateboards and blog pages.

3.

Skateboard is special product

Skateboard is an exceptional product where there is a need for a unique website, such as a custom skateboard and a blog about the development of skateboarding in one website.

User Research

I use a qualitative method by conducting direct interviews with users to find out user needs by asking several questions such as: why do they buy skateboarding equipment and skate apparel online, what are they looking for and what are their Pain Points, what devices do they use when looking for a product. I have three answers ( two boys and one girl), between 18-30 years old.

User Interview Findings

  • The pandemic has changed user habits to prefer shopping online rather than directly at stores which can take time.

  • Users prefer a website for product exploration - no downloads, no registration hassle


  • Users expect a diverse product range, easy search, and fair prices.

  • Users delighted with skateboarding updates, culture, and education.

User Research

I use a qualitative method by conducting direct interviews with users to find out user needs by asking several questions such as: why do they buy skateboarding equipment and skate apparel online, what are they looking for and what are their Pain Points, what devices do they use when looking for a product. I have three answers ( two boys and one girl), between 18-30 years old.

User Interview Findings

  • The pandemic has changed user habits to prefer shopping online rather than directly at stores which can take time.

  • Users prefer a website for product exploration - no downloads, no registration hassle


  • Users expect a diverse product range, easy search, and fair prices.

  • Users delighted with skateboarding updates, culture, and education.

Define

User Persona

Personas drive decision making by solving user problems, frustrations, and goals using insights from user interviews.

Define

User Persona

Personas drive decision making by solving user problems, frustrations, and goals using insights from user interviews.

Ideate

User Flow

I created User Flow to understand how users interact with the product. Making User Flow makes me think from the user's point of view to make it easier to consider the various features used by the user.

Ideate

User Flow

I created User Flow to understand how users interact with the product. Making User Flow makes me think from the user's point of view to make it easier to consider the various features used by the user.

Prototype

Wireframe

Home Page

Product Galery

Prototype

Wireframe

Home Page

Product Galery

Product Page

Product Detail Page

Product Page

Product Detail Page

Custom Page

Custom Page

Blog Page

Blog Detail Page

Blog Page

Blog Detail Page

Test

Usability Test

I did a Usability Test directly to 4 users and gave Tasks to explore Home Page, Blog Page, Custom Page, Product Gallery, and Product Details. Here are some points that I got:


Pain Poin

  • There is no Filter in the Product Gallery to make it easier to find and sort products according to preference

  • Quick save options are not available, such as quickly adding to cart and favorites

  • Cannot return to Gallery Blog Page when opening Blog Page Details article because there is no return option.

Test

Usability Test

I did a Usability Test directly to 4 users and gave Tasks to explore Home Page, Blog Page, Custom Page, Product Gallery, and Product Details. Here are some points that I got:


Pain Poin

  • There is no Filter in the Product Gallery to make it easier to find and sort products according to preference

  • Quick save options are not available, such as quickly adding to cart and favorites

  • Cannot return to Gallery Blog Page when opening Blog Page Details article because there is no return option.

Implement

Brand Identity

Implement

Brand Identity

Empathy Map

I used an Empathy Map to delve into user behavior, attitudes, and habits, gaining insight into their point of view and the problems they face.

Business Goals

  • Get benefits by working with brands from around the world whose products are in great demand by users.

  • Become a website with the most traffic through blog pages and the best products.Business Goals

  • Custom Pages and Blog Pages do not yet exist in Indonesia so they can be a special feature offered by Ancheroule for users

User Goals

  • Makes it easy for users to get skateboard products according to their preferences


  • The existence of a Custom Page can provide a better experience for the user


  • Become a place to get insight for users by providing a Blog page that helps provide information and skateboarding culture

Empathy Map

I used an Empathy Map to delve into user behavior, attitudes, and habits, gaining insight into their point of view and the problems they face.

Business Goals

  • Get benefits by working with brands from around the world whose products are in great demand by users.

  • Become a website with the most traffic through blog pages and the best products.Business Goals

  • Custom Pages and Blog Pages do not yet exist in Indonesia so they can be a special feature offered by Ancheroule for users

User Goals

  • Makes it easy for users to get skateboard products according to their preferences


  • The existence of a Custom Page can provide a better experience for the user


  • Become a place to get insight for users by providing a Blog page that helps provide information and skateboarding culture

Sketches

I explored views on other websites and made sketches to get an initial picture of the ideas to be developed.

I explored views on other websites and made sketches to get an initial picture of the ideas to be developed.

Sketches

I explored views on other websites and made sketches to get an initial picture of the ideas to be developed.

I explored views on other websites and made sketches to get an initial picture of the ideas to be developed.

Typography

Typography

Color

Color

Hi-Fidelity Design

Home Page

Hi-Fidelity Design

Home Page

Ancheroule

Ancheroule

Unleash your skate style and elevate with top-tier gear and fashion

Unleash your skate style and elevate with top-tier gear and fashion

Case study

Product design

Desktop

Case study

Product design

Desktop

Contribution

UX, UI Designer

Tools

Figma, Miro

Duration

2 Weeks

Contribution

UX, UI Designer

Tools

Figma, Miro

Duration

2 Weeks

Overview

Ancheroule is a skate gear and fashion retail store offering custom skates and curated skate gear and skate apparel from the best brands.

Problem

Skaters struggle with finding skate shop websites that match their preferences. Existing sites lack desired features, leading to time-consuming searches across multiple stores

Solution

Create a skateboard retail store website that can help meet user needs and be an advantage in business goals to combine and generate product features needed by users.

Overview

Ancheroule is a skate gear and fashion retail store offering custom skates and curated skate gear and skate apparel from the best brands.

Problem

Skaters struggle with finding skate shop websites that match their preferences. Existing sites lack desired features, leading to time-consuming searches across multiple stores

Solution

Create a skateboard retail store website that can help meet user needs and be an advantage in business goals to combine and generate product features needed by users.

Design Process

Design Process

Empathize

Competitive Analysis

Empathize

Competitive Analysis

Key Findings

1.

No special features available currently

The analysis above shows that competitor websites do not have unique pages to attract customers, such as blog pages and custom pages to make it easier for users to create products according to user preferences.

3.

Skateboard is a special product

Skateboard is an exceptional product where there is a need for a unique website, such as a custom skateboard and a blog about the development of skateboarding in one website.

2.

Few competitors

There are still a few retail skate shops that have websites to sell their products, and most of the shops that don't have their websites use e-commerce as a place to sell their products where there are no features such as custom skateboards and blog pages.

Key Findings

1.

No special features available currently

The analysis above shows that competitor websites do not have unique pages to attract customers, such as blog pages and custom pages to make it easier for users to create products according to user preferences.

3.

Skateboard is a special product

Skateboard is an exceptional product where there is a need for a unique website, such as a custom skateboard and a blog about the development of skateboarding in one website.

2.

Few competitors

There are still a few retail skate shops that have websites to sell their products, and most of the shops that don't have their websites use e-commerce as a place to sell their products where there are no features such as custom skateboards and blog pages.

User Research

I use a qualitative method by conducting direct interviews with users to find out user needs by asking several questions such as: why do they buy skateboarding equipment and skate apparel online, what are they looking for and what are their Pain Points, what devices do they use when looking for a product. I have three answers ( two boys and one girl), between 18-30 years old.

User Interview Findings

  • The pandemic has changed user habits to prefer shopping online rather than directly at stores which can take time.

  • Users prefer a website for product exploration - no downloads, no registration hassle


  • Users expect a diverse product range, easy search, and fair prices.

  • Users delighted with skateboarding updates, culture, and education.

User Research

I use a qualitative method by conducting direct interviews with users to find out user needs by asking several questions such as: why do they buy skateboarding equipment and skate apparel online, what are they looking for and what are their Pain Points, what devices do they use when looking for a product. I have three answers ( two boys and one girl), between 18-30 years old.

User Interview Findings

  • The pandemic has changed user habits to prefer shopping online rather than directly at stores which can take time.

  • Users prefer a website for product exploration - no downloads, no registration hassle


  • Users expect a diverse product range, easy search, and fair prices.

  • Users delighted with skateboarding updates, culture, and education.

Define

User Persona

Personas drive decision making by solving user problems, frustrations, and goals using insights from user interviews.

Define

User Persona

Personas drive decision making by solving user problems, frustrations, and goals using insights from user interviews.

Empathy Map

I used an Empathy Map to delve into user behavior, attitudes, and habits, gaining insight into their point of view and the problems they face.

Business Goals

  • Get benefits by working with brands from around the world whose products are in great demand by users.

  • Become a website with the most traffic through blog pages and the best products.Business Goals

  • Custom Pages and Blog Pages do not yet exist in Indonesia so they can be a special feature offered by Ancheroule for users

User Goals

  • Makes it easy for users to get skateboard products according to their preferences


  • The existence of a Custom Page can provide a better experience for the user


  • Become a place to get insight for users by providing a Blog page that helps provide information and skateboarding culture

Empathy Map

I used an Empathy Map to delve into user behavior, attitudes, and habits, gaining insight into their point of view and the problems they face.

Business Goals

  • Get benefits by working with brands from around the world whose products are in great demand by users.

  • Become a website with the most traffic through blog pages and the best products.Business Goals

  • Custom Pages and Blog Pages do not yet exist in Indonesia so they can be a special feature offered by Ancheroule for users

User Goals

  • Makes it easy for users to get skateboard products according to their preferences


  • The existence of a Custom Page can provide a better experience for the user


  • Become a place to get insight for users by providing a Blog page that helps provide information and skateboarding culture

Ideate

User Flow

I created User Flow to understand how users interact with the product. Making User Flow makes me think from the user's point of view to make it easier to consider the various features used by the user.

Ideate

User Flow

I created User Flow to understand how users interact with the product. Making User Flow makes me think from the user's point of view to make it easier to consider the various features used by the user.

Sketches

I explored views on other websites and made sketches to get an initial picture of the ideas to be developed.

Sketches

I explored views on other websites and made sketches to get an initial picture of the ideas to be developed.

Prototype

Wireframe

Home Page

Product Galery

Prototype

Wireframe

Home Page

Product Galery

Custom Page

Custom Page

Product Page

Product Detail Page

Product Page

Product Detail Page

Blog Page

Blog Detail Page

Blog Page

Blog Detail Page

Test

Usability Test

I did a Usability Test directly to 4 users and gave Tasks to explore Home Page, Blog Page, Custom Page, Product Gallery, and Product Details. Here are some points that I got:


Pain Poin

  • There is no Filter in the Product Gallery to make it easier to find and sort products according to preference

  • Quick save options are not available, such as quickly adding to cart and favorites

  • Cannot return to Gallery Blog Page when opening Blog Page Details article because there is no return option.

Test

Usability Test

I did a Usability Test directly to 4 users and gave Tasks to explore Home Page, Blog Page, Custom Page, Product Gallery, and Product Details. Here are some points that I got:


Pain Poin

  • There is no Filter in the Product Gallery to make it easier to find and sort products according to preference

  • Quick save options are not available, such as quickly adding to cart and favorites

  • Cannot return to Gallery Blog Page when opening Blog Page Details article because there is no return option.

Implement

Brand Identity

Implement

Brand Identity

Typography

Typography

Color

Color

In the Custom Page, I created several features to make it easier for users to customize the product of their choice. Let's dive in:


1.

Steps

Steps are used to assist the user in customizing the selected product according to the steps that have been given.

2.

Order Detail

After selecting a product, the user can view the products that have been added by providing product information that has been added to make it easier for the user to see what products have been added.

Custom Page

In the Custom Page, I created several features to make it easier for users to customize the product of their choice. Let's dive in:


1.

Steps

Steps are used to assist the user in customizing the selected product according to the steps that have been given.

2.

Order Detail

After selecting a product, the user can view the products that have been added by providing product information that has been added to make it easier for the user to see what products have been added.

Custom Page

To answer the needs of users who want to get up-to-date information, I created a blog page so users get quality information about skateboarding.

Blog Page

To answer the needs of users who want to get up-to-date information, I created a blog page so users get quality information about skateboarding.

Blog Page

Hi-Fidelity Design

Home Page

Hi-Fidelity Design

Home Page

Custom Page

In the Custom Page, I created several features to make it easier for users to customize the product of their choice. Let's dive in:


1.

Steps

Steps are used to assist the user in customizing the selected product according to the steps that have been given.

2.

Order Detail

After selecting a product, the user can view the products that have been added by providing product information that has been added to make it easier for the user to see what products have been added.

Custom Page

In the Custom Page, I created several features to make it easier for users to customize the product of their choice. Let's dive in:


1.

Steps

Steps are used to assist the user in customizing the selected product according to the steps that have been given.

2.

Order Detail

After selecting a product, the user can view the products that have been added by providing product information that has been added to make it easier for the user to see what products have been added.

Blog Page

To answer the needs of users who want to get up-to-date information, I created a blog page so users get quality information about skateboarding.

Blog Page

To answer the needs of users who want to get up-to-date information, I created a blog page so users get quality information about skateboarding.

Email

Yaldi Sanubari © 2023

Email

Yaldi Sanubari © 2023

Email

Yaldi Sanubari © 2023