MAP3

MAP3

MAP3

Product Design - Web Design - Branding

Product Design - Web Design - Branding

MAP3, a startup was founded in 2022 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 2022 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 2022 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


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



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


  1. Design a fully fleshed out, interactive website


  1. Rework the rewards section of the app to be more interactive


  1. Add a community aspect to the app where people can message each other




NEXT STEPS


  1. Design a fully fleshed out, interactive website


  1. Rework the rewards section of the app to be more interactive


  1. Add a community aspect to the app where people can message each other




NEXT STEPS


  1. Design a fully fleshed out, interactive website


  1. Rework the rewards section of the app to be more interactive


  1. Add a community aspect to the app where people can message each other




©kyrahawrysh.com 2023