Victoria Kocevski
Las Vegas
Active
Responsive Design
Seamless Experiences Across All Devices
Overview
Imagine moving to a new city or changing your routine with activities like cycling, running, or basketball. Finding safe spots, clubs, or events can be overwhelming, but Las Vegas Active is here to make it simple and accessible.
My role
UX Designer
UI Designer
Duration
6 weeks
Nov - Dec 2024
Tools
Figma, Optimal workshop, Maze
Overview
Imagine moving to a new city or changing your routine with activities like cycling, running, or basketball. Finding safe spots, clubs, or events can be overwhelming, but Las Vegas Active is here to make it simple and accessible.
My role
UX Designer
UI Designer
Duration
6 weeks
Nov - Dec 2024
Tools
Figma, Optimal
workshop, Maze
Design Process
Design Process
Design Process
Research
I researched user needs through interviews, surveys, and competitive analysis, identifying pain points to shape a website where users can easily access sports information.
User interview
Who?
I interviewed 3 male and 2 female participants with age range from 21 to 40 via FaceTime and in person.
Why?
Gathered personal stories and firsthand experiences, uncovering the barriers, challenges, and difficulties users face when it comes to sports or activities.
Survey
Who?
I gathered 10 surveys from individuals with diverse skill levels and interests in sports.
Why?
Collected detailed insights into popular sports, participation levels, and preferred resources, uncovering unique regional trends and user priorities.
Competitive Analysis
Who?
I conducted an in-depth competitor analysis of four competitors: two direct and two indirect.
Why?
Exposed gaps in existing platforms, such as outdated information or poor mobile usability, allowing me to create a more reliable and responsive solution.
Affinity Map
I synthesized all the research findings into an affinity map because I had a large amount of research data, and it is an effective tool for organizing information, uncovering relationships, and identifying recurring patterns and themes.
Top Findings from the Affinity Mapping Process
Socializing is a key factor for individuals looking to learn a new sport.
People expressed that having a coach makes it significantly easier to improve and maintain focus.
Pain Point: Maintaining consistency and staying motivated.
Problem Statement
Learning a new sport is easier and more enjoyable with social support and coaching. However, many struggle to stay consistent and motivated without structured guidance or opportunities to connect with others. This highlights the need for a solution that fosters social interaction, provides coaching support, and encourages long-term engagement.
Building on this problem statement, I formulated a series of How Might We questions to explore potential solutions and address the key challenges identified.
How Might We Questions?
How might we make coaching more accessible and impactful for learners?
How might we help users connect and build friendships while learning a sport?
How might we create an inclusive environment that welcomes people of all skill levels?
How might we design tools to help people stay consistent and motivated in their sports journey?
Define
Storyboards help me visualize how users interact with the website, their emotions, and thoughts. To address a wide audience, I focused on two common user problems and turned them into simple, relatable storyboards.
After completing the storyboard and gaining a clearer understanding of how users search for sports information in Las Vegas, their challenges, and motivations, I moved on to creating detailed user personas to further define the target audience.
After the storyboard and personas, I created the user flow to map out the steps users take, ensuring a seamless path to finding sports information on the website.
.jpg)
Design: Mid-Fidelity Wireframes
Mid-fidelity wireframes were created to design the key user flows: finding a coach and locating a pick-up game through the chat feature, ensuring a seamless and intuitive experience.
.jpg)
.jpg)
.jpg)
.jpg)
.jpg)
.jpg)
Testing
My testing process included two stages: usability testing to evaluate the site's functionality and ease of use, followed by feedback sessions to gather insights and refine the design based on user input.
Usability Testing
Objective
To evaluate how effectively users can navigate the website and accomplish 2 key tasks: finding a pickleball coach and joining a pick-up game.
Methodology
Number of participants: 5
Testing method: remote and in-person
Tools: Figma prototypes
Top Findings from the Usability testing
Add a search bar to the chat feature, allowing users to easily find topics they are interested in.
Add the price per session and social media links to each coach profile so users can easily view these important details at a glance.
Add a label to all clubs and events indicating the level of participants ( pro, beginners, or all levels).
Feedback Sessions
Objective
The goal of the feedback session was to gather insights on the design, functionality, and overall user interaction with the mid-fidelity wireframes.
Methodology
Number of participants: 2
Testing method: remote
Tools: Figma prototypes
.jpg)
Top Findings from the Feedback Sessions
Add a label on the sport and coach profiles to make it clearer that they are clickable cards.
The wireframes are well-structured and easy to navigate. However, users expect to see bright and vibrant colors to enhance the design
Add arrow buttons throughout the screens to help users move through the interface smoothly.
342133
Visual Design
For my visual design, I began by creating a logo that captures the essence of the project—below are some initial sketches exploring different concepts.
Final Logo Design
Active
Las Vegas
Las Vegas
Active
Color Palette
Primary color
.jpg)
Secondary colors
Primary color
.jpg)
Background colors
Typography
I chose Raleway for titles and subtitles for its clean, modern look, and Lato for body text for its readability and friendly, approachable feel.
Raleway Font
Desktop version
48 px Heading 1
36 px Heading 2
20 px Call to Action
Mobile version
36 px Heading 1
28 px Heading 2
18 px Call to Action
Lato Font
Desktop version
24 px Subheader
18 px Body text
14 pm Small text
Mobile version
20 px Subheader
16 px Body text
14 pm Small text
Design: High-Fidelity Wireframes
Please find below the desktop prototype version, showcasing an overview of the main pages.
Please find below the mobile prototype versions, highlighting two primary user flows: locating a pickleball coach and accessing the schedule for pickleball pick-up games through the chat feature.
User Flow: Find a coach and begin the process of working with them.
User Flow: Inquiring about pickleball pick-up games through the chat feature.
Lessons Learned & Next Steps
Valuable insights I gained through this project
A well-structured yet flexible chat allows users to find information quickly while keeping the interface simple and engaging.
I learned that balancing structure with flexibility enhances user engagement by providing clear pathways while allowing customization to meet diverse needs.
Consistency across platforms – ensuring a smooth transition between desktop and mobile experiences was crucial for usability.
Moving forward, I plan to gather more user feedback, analyze platform performance post-launch, and refine the experience based on real-world usage. This project reinforced the importance of user-centric design in creating functional and engaging digital experiences for sports communities.