top of page

Dupelicate

2023

Interface Design

Table of Contents 

I. Introductions

II. Research

III. Design Process

IV. Final Product

V. Reflections

I. Introduction
Problem Statement

Designer clothes are expensive and to look for affordable clothing with a similar style, one has to go on sketchy websites. Additionally users who go onto e-commerce platforms tend to have a lack of personal interaction with sales associates.

Brainstorm and Ideation

Clothing Search App

Looking up a certain product, shows and display similar products, locate things.

Dupe Search App

  • Find Dupes for luxury / athletic items

  • Dupes → Cheaper Price

Solution

Since dupes have been trending in 2023, especially on TikTok, our team purposefully designed a dupe search app that can help users detect luxury clothes and find other items that look similar to them at a cheaper price. The app will contain filters to make finding local businesses easier. Additionally, users can set an available time and date to chat and meet with the seller for any questions or concerns about their products.

But What is a Dupe?

Dupe (noun) - “A dupe is an exact duplicate or copy of another item.” (Merriam Webster)

II. Research
User Survey

  • Surveyed people who are mostly in their late teens and early 20s. There are all genders and all college students.

  • Sent out user survey through Google Forms

  • Received 19 responses

When looking for clothes, what specifically stands out about the website/app you use (please be as specific as possible)?

  • Specific filers (price, colors, size, etc.) (common)

  • Easy and clean look (common)

  • Feed to scroll through lots of clothing 

  • Clothes Recommendations 

III. Design Process
Low Fidelity Wireframes

  • Our paper sketch shows the general idea of the app concept. 

  • Compared to existing apps and websites for inspiration and general placing (e.g. Nike, Etsy, Yesstyle, Depop, etc.).

Branding
IV. Final Product
Challenges and Obstacles

  • Ran into disagreements on some aspects of our prototype frames which forced us to critically think on what to change for them.

  • Most of our team don’t have experience with Figma and we tend to have a busy schedule.

High-Fidelity Wireframes

Click on the button below to view and test out the prototype for Dupelicate. 

V. Reflections
What We Learned

  • Use consistency for user interfaces.

  • Being prepared to create our prototype through research, brainstorming, and sketching.

  • Using a color contrast checker to improve user experience, especially for those with visual disabilities.

  • Learn to create our prototype using Figma

Designers Worked With

Winston Lee

Sara Chong

Alice Duan

Xuan Tran

Mid Fidelity Wireframes

  • Design the frames from hand-drawn sketches to Figma. 

  • Finding a color scheme, overall placement of different buttons

  • Wireframe each button’s function with the respective action by adding more frames.

What We Would Do Differently

  • Take notes on how people respond to user interview questions.

  • Focus more on designing frames that can help solve our problem statement.

  • Use When2meet 

  • If we have time, do more than one usability test in making sure that the user experience in our prototype is good to go.

bottom of page