MAP3
MAP3
MAP3
Product Design - Web Design - Branding
Product Design - Web Design - Branding
MAP3, a startup was founded in 2023 to solve the issue of ticketing & rewards in todays world.
MAP3's mission is to create a ticketing platform with a built in loyalty rewards program, powered by WEB3.
Through blockchain technology, the company is able to extract data & target artists super fans & reward them for their loyalty.
MAP3, a startup was founded in 2023 to solve the issue of ticketing & rewards in todays world.
MAP3's mission is to create a ticketing platform with a built in loyalty rewards program, powered by WEB3.
Through blockchain technology, the company is able to extract data & target artists super fans & reward them for their loyalty.
MAP3, a startup was founded in 2023 to solve the issue of ticketing & rewards in todays world.
MAP3's mission is to create a ticketing platform with a built in loyalty rewards program, powered by WEB3.
Through blockchain technology, the company is able to extract data & target artists super fans & reward them for their loyalty.
CLIENT
MAP3
CLIENT
MAP3
CLIENT
MAP3
ROLE
Product Designer
ROLE
Product Designer
ROLE
Product Designer
BRIEF
Develop the business identity, construct a
landing page to attract clients & eventually
design a fully functioning mobile app. Lastly,
produce a pitch deck to present to investors.
BRIEF
Develop the business identity, construct a landing page to attract clients & eventually design a fully functioning mobile app. Lastly, produce a pitch deck to present to investors.
BRIEF
Develop the business identity, construct a landing page to attract clients & eventually design a fully functioning mobile app. Lastly, produce a pitch deck to present to investors.
Challenge
Currently, the ticketing industry is viewed as profit-focused, unreliable, and lacking rewards. The challenge involves creating a dependable ticketing and rewards platform that is user-friendly, trust worthy and attracts new customers.
Challenge
Currently, the ticketing industry is viewed as profit focused, unreliable and monopolistic. Additionally, commited supporters of artists are not being recognized for their devotion.
The challenge involves creating a dependable ticketing and rewards platform that is user friendly, trust worthy & attracts new customers.
Challenge
Currently, the ticketing industry is viewed as profit-focused, unreliable, and lacking rewards. The challenge involves creating a dependable ticketing and rewards platform that is user-friendly, trust worthy and attracts new customers.
Solution
To distinguish MAP3 from its competitors, I developed a contemporary and clean visual style using vibrant colors, uncluttered designs, & intuitive functions.
Solution
To distinguish MAP3 from its competitors, I developed a contemporary and clean visual style using vibrant colors, uncluttered designs, & intuitive functions.
Solution
To distinguish MAP3 from its competitors, I developed a contemporary and clean visual style using vibrant colors, uncluttered designs, & intuitive functions.
Design System
Design System
Check out the full design system here
Check out the full design system here
COLOR PALETTE:
The palette is designed to be bright & engaging. Blue represents WEB2 while the pink shade represents WEB3. The gradient meshes both.
COLOR PALETTE:
The palette is designed to be bright & engaging. Blue represents WEB2 while the pink shade represents WEB3. The gradient meshes both.
TYPOGRAPHY:
Combing a bold sans-serif typeface, Rubik with Sf Pro a modern, sans-serif typeface created a clean & clear UI. They are also IOS compatible.
TYPOGRAPHY:
Combing a bold sans-serif typeface, Rubik with Sf Pro a modern, sans-serif typeface created a clean & clear UI. They are also IOS compatible.
BUTTONS:
The main button has a thin gradient line that fills in when clicked on for a positive user experience. For other buttons, the slider buttons highlight in a subtly darker black when different page sections are clicked.
BUTTONS:
The main button has a thin gradient line that fills in when clicked on for a positive user experience. For other buttons, the slider buttons highlight in a subtly darker black when different page sections are clicked.
LOGO:
My goal behind the logo was to connect the letter M & 3 with a seamless line, thus representing the connection between web2 & web3. That is also represented through the blue to pink gradient.
LOGO:
My goal behind the logo was to connect the letter M & 3 with a seamless line, thus representing the connection between web2 & web3. That is also represented through the blue to pink gradient.
FINAL ANIMATED LOGO
Design System
Check out the full design system here
COLOR PALETTE:
The palette is designed to be bright & engaging. Blue represents WEB2 while the pink shade represents WEB3. The gradient meshes both.
TYPOGRAPHY:
Combing a bold sans-serif, typeface like Rubik & Sf Pro (also a sans-serif typeface) created a clean & clear UI. They are also IOS compatible.
BUTTONS:
The main button has a thin gradient line that fills in when clicked on for a positive user experience. For other buttons, the slider buttons highlight in a subtly darker black when different page sections are clicked.
LOGO:
My goal behind the logo was to connect the letter M & 3 with a seamless line, thus representing the connection between web2 & web3. That is also represented through the blue to pink gradient.
FINAL ANIMATED LOGO
Mobile App
Mobile App
User Persona
Analyzing the key demographic for this application was vital to its success. I was able to identify who our customer is & what they are looking for.
User Persona
Analyzing the key demographic for this application was vital to its success. I was able to identify who our customer is & what they are looking for.
User Journey
Outlining a general journey a customer would take helped me understand how to build the foundation of this application & any pain points that may arise.
User Journey
Outlining a general journey a customer would take helped me understand how to build the foundation of this application & any pain points that may arise.
User Journey:
Outlining a general journey a customer would take helped me understand how to build the foundation of this application & any pain points that may arise.
Wireframes
The objective in designing the wireframes was to achieve a clean, image-centric UI. My research revealed that users sought swift and effortless interactions, which was integrated into the workflow.
Wireframes
The objective in designing the wireframes was to achieve a clean, image-centric UI. My research revealed that users sought swift and effortless interactions, which was integrated into the workflow.
Final Design
Final Design
The design of the MAP3 app encorporated powerful visuals, vivid icons & striking text to attract the user. The UX design is intuitive & simple to navigate. I wanted to ensure the app possessed 2 separate routes, the initial to discover events & purchase tickets & the latter to accumulate rewards/stamps.
Final Design
The design of the MAP3 app encorporated powerful visuals, vivid icons & striking text to attract the user. The UX design is intuitive & simple to navigate. I wanted to ensure the app possessed 2 separate routes, the initial to discover events & purchase tickets & the latter to accumulate rewards/stamps.
Final Design
Final Design
Mobile App
User Persona
Analyzing the key demographic for this application was vital to its success. I was able to identify who our customer is & what they are looking for.
User Persona:
Analyzing the key demographic for this application was vital to its success. I was able to identify who our customer is & what they are looking for.
User Journey:
Outlining a general journey a customer would take helped me understand how to build the foundation of this application & any pain points that may arise.
Wireframes
The objective in designing the wireframes was to achieve a clean, image-centric UI. My research revealed that users sought swift and effortless interactions, which was integrated into the workflow.
Final Design
Final Design
The design of the MAP3 app encorporated powerful visuals, vivid icons & striking text to attract the user. The UX design is intuitive & simple to navigate. I wanted to ensure the app possessed 2 separate routes, the initial to discover events & purchase tickets & the latter to accumulate rewards/stamps.
Final Design
Final Design
Landing Page Design
Landing Page Design
Landing Page
Wireframes
Initial wireframes were developed to arrange the content for the landing page and determine the user flow. While designing the wireframes, it became apparent that the website required animation, with phones seamlessly transitioning into one another to reduce repetitiveness.
Wireframes
Initial wireframes were developed to arrange the content for the landing page and determine the user flow. While designing the wireframes, it became apparent that the website required animation, with phones seamlessly transitioning into one another to reduce repetitiveness.
Wireframes
Initial wireframes were developed to arrange the content for the landing page and determine the user flow. While designing the wireframes, it became apparent that the website required animation, with phones seamlessly transitioning into one another to reduce repetitiveness.
Final Design
The final landing page showcases a minimalist, yet captivating aesthetic. It features an animated style where each phone effortlessly slides into position. Ultimately, it uses vivid colors & gradients to highlight the key elements.
(Scroll through to see the final landing page in real time)
Final Design
The final landing page showcases a minimalist, yet captivating aesthetic. It features an animated style where each phone effortlessly slides into position. Ultimately, it uses vivid colors & gradients to highlight the key elements.
(scroll through to see the landing page in real time)
Final Design
The final landing page showcases a minimalist, yet captivating aesthetic. It features an animated style where each phone effortlessly slides into position. Ultimately, it uses vivid colors & gradients to highlight the key elements. (Scroll through to see the final landing page in real time)
Scroll through to see the landing page in real time
Final Thoughts
Final Thoughts
Final Thoughts
IMPACT
My goal when working with MAP3 was to help revolutionize the ticketing industry & reward fans for their loyalty.
I believe the UI/UX design of the app & landing page is clean, user friendly, modern & exciting.
IMPACT
My goal when working with MAP3 was to help revolutionize the ticketing industry & reward fans for their loyalty.
I believe the UI/UX design of the app & landing page is clean, user friendly, modern & exciting.
IMPACT
My goal when working with MAP3 was to help revolutionize the ticketing industry and reward fans for their loyalty.
I believe the UI/UX design of the app & landing page is clean, user friendly, modern & exciting.
NEXT STEPS
Design a fully fleshed out, interactive website
Rework the rewards section of the app to be more interactive
Add a community aspect to the app where people can message each other
NEXT STEPS
Design a fully fleshed out, interactive website
Rework the rewards section of the app to be more interactive
Add a community aspect to the app where people can message each other
NEXT STEPS
Design a fully fleshed out, interactive website
Rework the rewards section of the app to be more interactive
Add a community aspect to the app where people can message each other