JSC

Overview Challenge Mapping Branding Prototype Solution Results

Details

Duration

4 weeks
March 2024

Role

Interaction Design, Product Thinking, Web Design, Group Delegation, Advanced Prototyping, Brand Design

Team

Ronald Atutubo
Tina Le
Briana Truong
Aaron Nicor
Chris Nicdao
Aleksandr Brundyi

Tools

Figma, Adobe Illustrator, Trello

Project

Challenge

This project addressed the challenge of designing an engaging, community-focused e-commerce platform that felt both authentic and playful, while delivering a smooth and intuitive shopping experience.

The core problem was creating a space where local artists could showcase their work affordably, without compromising on essential e-commerce functionality like dynamic pricing, cart management, and user-friendly navigation.

Summary

Jason’s Sticker Club is an online marketplace for local artists to showcase their work through stickers.

This project emphasized interaction design, where I focused on creating an intuitive user experience while developing a scalable component library and cohesive brand guidelines.

Contributions

As a product designer, I designed and built a comprehensive component library to ensure scalability and consistency across the platform.

I created the brand logo and contributed to the overall visual identity, helping shape a fun and authentic look for the marketplace.

My primary focus was on advanced prototyping, where I implemented dynamic pricing, cart functionality, and quantity selection.

Additionally, I provided input on the site’s structure, feature placement, and key interaction design decisions to enhance the overall user experience..

Project Overview

Jason’s Sticker Club is an online marketplace where local artists can showcase and sell their artwork through stickers—a fun, low-cost, and expressive medium. This project focused on interaction design, aiming to create an intuitive and engaging user experience while building a comprehensive component library and brand guidelines for consistency and scalability.

Project Approach

This project was mainly focused on the aspects of interaction design, such as navigational flows and user feedback mechanisms as a result we focused on two key aspects,

We focused on creating an intuitive and seamless user experience, ensuring that browsing, purchasing, and navigating the site felt natural and efficient. Every step, from product discovery to checkout was mapped with user behaviour in mind to support smooth interactions and minimal friction.

To maintain consistency and scalability, we developed a comprehensive component library and clear brand guidelines. This ensured a cohesive visual identity across the platform and allowed for efficient updates and expansion in the future. Every component was designed with flexibility and reusability in mind.

Results

The project successfully created a seamless, user-friendly platform.

By focusing on simple, yet effective navigation and a smooth checkout flow, we reduced friction and enhanced the overall user experience.
‍
The development of a comprehensive component library and clear brand guidelines ensured consistency across the platform.
‍
User feedback was overwhelmingly positive, particularly around the site’s clean design and ease of use.

The browsing and purchasing processes were noted for their ease, leading to increased satisfaction.
‍
Internally, the solid interaction design foundation led to faster development cycles and improved collaboration within the team, making the project more efficient and impactful.

The main challenge:

Creating a space where local artists could showcase their work affordably, without compromising on essential e-commerce functionality like dynamic pricing, cart management, and user-friendly navigation.

Design Goals

Intuitive Navigation

Our team needed to ensure smooth, easy navigation across the platform
Create an experience where users could easily browse, select, and purchase products with minimal effort.

Playful Visual Consistency

Creating a unique and cohesive design system to keep the spirit of the sticker club
Developing a comprehensive component library and clear brand guidelines to maintain a consistent visual identity across the website.

Versatility

Design adaptable and reusable components for long-term efficiency
Every element of the design was created with flexibility in mind, allowing for easy updates and modifications.

mapping Phase

UNDERSTANDING USER FLOW

This project focused heavily on interaction design, with our team prioritizing the user flow to ensure a seamless browsing and checkout experience.
We aligned the website’s functionality with natural small-market e-consumer behaviours, making navigation intuitive and on-brand.

Using a user decision map, we identified key pages and essential functions, allowing us to prioritize features that enhanced usability, streamlined workflows, and created a frictionless shopping experience.

Information Architecture

The journey begins with a quick onboarding and simple homepage, allowing users to explore a wide range of sticker designs, browse local artists’ profiles, and filter by style or theme. Key features like artist recommendations and user reviews build trust, while the smooth add-to-cart and checkout process encourages users to complete their purchases. Engagement loops, such as limited-time offers and new sticker alerts, keep users coming back for more, creating a community-driven experience that fosters ongoing discovery and participation.

Branding and visual identity

Understanding why Jason's Sticker Club feels like Jason's Sticker Club

For Jason’s Sticker Club, we wanted the brand to feel fun, playful, and community-oriented while staying true to its core values of connection, creativity, and authenticity. To achieve this, we chose a bold yellow and black color scheme, inspired by the contrast of a sticky note, reinforcing the idea of stickers as an everyday, expressive medium. Additionally, we selected a strong, bold typeface to give the brand a distinct and energetic presence, making headlines stand out while maintaining a sense of approachability and creativity.

I personally designed the logo, drawing inspiration from our real-life friend Jason, whose personality embodies the brand’s fun and welcoming spirit. Alongside the logo, I also contributed input on other aspects of the brand as the group lead, ensuring a cohesive and engaging visual identity.

Prototyping Phase

Creating Wireframes

FIGMA FILE

In the lo-fi wire framing stage, as a team we decided to focus on establishing proper webpage spacing and defining the general layout of key features.

Our goal was to ensure that the structure and flow of the website made sense before moving into higher-fidelity designs. We approached this by mapping out the pages of our user flow and understanding user interactions with products and considering what customers might need in terms of e-commerce functionality, such as smooth navigation bar, clear product displays, and an intuitive checkout process.

The Hi-Fidelity Mockups

For the Hi-Fi Prototype, I personally focused on advanced prototyping, ensuring the prices dynamically updated with the add to cart function, integrating radio buttons, and refining the quantity functionality for a smoother shopping experience. I also contributed input on the placement of product banners and the overall structure, ensuring each element aligned with the website’s flow.
‍
Our goal was to maintain consistency with the Lo-Fi prototype’s structure while implementing necessary changes to enhance visual fidelity and ensure the interface was intuitive. The final product represented the pinnacle of our interaction design skills as second-year students, showcasing our ability to bring together functionality and design in a seamless and cohesive user experience.

Solution

Products with character

Sticker browsing has never been easier
‍‍Creating the e-commerce experience you know and love but with a little flair.

Checkout Systems made Easy

Checkouts still hold the charm of Jason's Sticker Club
Purchasing stickers has never felt easier, and still engaging to push you the whole way throughs.

Results and Lessons

Results

The project successfully created an intuitive, unique user experience for Jason’s Sticker Club, with seamless navigation and a streamlined checkout process.

These improvements led to higher user engagement and conversion rates, making it easy for customers to browse and purchase stickers.
‍
Features like peer recommendations, artist profiles and community involvement encourages repeat visits.

The visual identity, supported by a comprehensive component library and brand guidelines, ensured consistency and scalability for future updates.
‍
User feedback was overwhelmingly positive, with appreciation for the ease of discovery, personalized recommendations, and the strong community connection.
‍
The focus on interaction design and community-driven features contributed to the platform’s success, fostering a vibrant marketplace for artists and customers.

Reflection

Understanding Component Structure
I learned that advanced prototyping requires a deep understanding of interaction design and component structure. Each interaction had to be carefully mapped out to ensure it was intuitive and seamless.
‍
Clear Communication is key
Collaborating in a team reinforced the value of clear communication. Regular check-ins, feedback sessions, and setting expectations early on helped ensure we were all aligned with the project’s goals and streamlined the decision-making process..
‍
E-Commerce Flows are a simple experience but complex
I discovered that e-commerce flows are far more complex than they appear at first glance. While the general process may seem straightforward, it involves a multitude of details, from managing cart functionality to ensuring accurate pricing, taxes, and shipping options. Each step required careful consideration to ensure smooth functionality.
‍
Balance Betweeen Authenticity and Corporate
Creating a balance between a corporate-friendly design and authenticity posed a significant challenge. We had to ensure that the site was professional, efficient, and aligned with business needs while still reflecting the creative, community-driven spirit of the brand.

Also Check out these projects: