Timeline
Summer 2023 | 6 weeks
Skills
UX Design
UX Research
Motion Graphics
Role
UX Designer
UX Researcher
Motion Graphic Designer
Tools
Figma
Adobe Illustrator
Adobe After Effects
Project Description
Musimate is a social media app designed to connect you with other users who share similar music tastes.
Timeline
Summer 2023 | 6 weeks
Skills
UX Design
UX Research
Motion Graphics
Role
UX Designer
UX Researcher
Motion Graphic Designer
Tools
Figma
Adobe Illustrator
Motion Graphic Designer
Project Description
Musimate is a social media app designed to connect you with other users who share similar music tastes.
Role
UX Designer
User Researcher
Motion Graphic Designer
Skills
UX Design
User Research
Motion Graphics
Timeline
Summer 2023 |
6 Weeks
Background —
A solo project created to get into the Cal State Long Beach BFA Program in Graphic Design.
Problem —
"There's a music event I'm really excited for, but I have no one to go with."
Research —
Majority of social apps don't offer satisfying user experience for those who are primarily interested in sharing or finding music, or other music related activities. There aspects are often an afterthought.
I held organized focus groups with friends and family members in order to get input on desired functions, prototypes, and to test user experience.
I found common points to be:
Incorporating music genres to discover new artist as well as make a friend in the process.
Ensuring there is way to post various forms of media, primarily image and text posts separately.
Implementing "stories" as well as text and media posts to help boost social media appeal.
This app offers ease of accessibility to form relationships with others seeking fun and entertainment in all things related to music events.
Musimate is my introductory project to the world of UX/UI design. A majority of my summer vacation learning the basic fundamentals, as well as Figma.
Background
Musimate is a solo project I created to get into the Cal State Long Beach BFA Program in Graphic Design.
Background
A solo project I created to get into the Cal State Long Beach BFA Program in Graphic Design.
Musimate is my introductory project to the world of UX/UI design. A majority of my summer vacation learning the basic fundamentals, as well as Figma.
Research
Majority of social apps don't offer satisfying user experience for those who are primarily interested in sharing or finding music, or other music related activities. Their aspects are often an afterthought.
Research
Majority of social apps don't offer satisfying user experience for those who are primarily interested in sharing or finding music, or other music related activities. There aspects are often an afterthought.
I held organized focus groups with friends and family members in order to get input on desired functions, prototypes, and to test user experience.
I found common points to be:
Incorporating music genres to discover new artist as well as make a friend in the process.
Ensuring there is way to post various forms of media, primarily image and text posts separately.
Implementing "stories" as well as text and media posts to help boost social media appeal.
Problem
"There's a music event I'm really excited for, but I have no one to go with."
Problem
"There's a music event I'm really excited for, but I have no one to go with."
This app offers ease of accessibility to form relationships with others seeking fun and entertainment in all things related to music events.
I held organized focus groups with friends and family members in order to get input on desired functions, prototypes, and to test user experience.
I found common points to be:
Incorporating music genres to discover new artist as well as make a friend in the process.
Ensuring there is way to post various forms of media, primarily image and text posts separately.
Implementing "stories" as well as text and media posts to help boost social media appeal.
Musimate is my introductory project to the world of UX/UI design. A majority of my summer vacation learning the basic fundamentals, as well as Figma.
This app offers ease of accessibility to form relationships with others seeking fun and entertainment in all things related to music events.
Project Description
Musimate is a social media app designed to connect you with other users who share
similar music tastes.
Timeline
Summer 2023 | 6 weeks
Skills
UX Design
UX Research
Motion Graphics
Role
UX Designer
UX Researcher
Motion Graphic Designer
Tools
Figma
Adobe Illustrator
Adobe After Effects
Target Audience
Animation & Prototyping
Solutions
Hunter
Tell me a bit about what you seek in an app to help further enhance your experience.
I definitely have gotten better with socializing throughout the years from when I first started college. Attending concerts has always been something I’ve been interested in, but looking for people to go with has not been the easiest task. I really like the focus of functionality for this app, how it basically is a social media app, but focused solely on music for the purpose of socializing and meeting others.
Hunter
Tell me a bit about what you seek in an app to help further enhance your experience.
I definitely have gotten better with socializing throughout the years from when I first started college. Attending concerts has always been something I’ve been interested in, but looking for people to go with has not been the easiest task. I really like the focus of functionality for this app, how it basically is a social media app, but focused solely on music for the purpose of socializing and meeting others.
Aaron
As a musician, how does social media affect you with self promoting on a platform?
One of the hardest parts about using social media as an artist is being able to easily navigate to a space where people will not only enjoy but engage with your art. A lot of people aren't on Instagram or X to learn about or listen to music so I feel pushed to the side or like I’m interrupting their normal scrolling through pictures.
Tyler
As a Web Developer at PDC Healthcare, what do you look for to raise user experience?
I find that apps with an intuitive and responsive UI and good color usage provide a more enjoyable experience. Efficient layouts and familiar button icons make it easier for users of all experience levels to get started quickly. A common theme used throughout the application also helps keep the flow of user interaction.
Aaron
As a musician, how does social media affect you with self promoting on a platform?
One of the hardest parts about using social media as an artist is being able to easily navigate to a space where people will not only enjoy but engage with your art. A lot of people aren't on Instagram or X to learn about or listen to music so I feel pushed to the side or like I’m interrupting their normal scrolling through pictures.
Aaron
As a musician, how does social media affect you with self promoting on a platform?
One of the hardest parts about using social media as an artist is being able to easily navigate to a space where people will not only enjoy but engage with your art. A lot of people aren't on Instagram or X to learn about or listen to music so I feel pushed to the side or like I’m interrupting their normal scrolling through pictures.
Tyler
As a Web Developer at PDC Healthcare, what do you look for to raise user experience?
I find that apps with an intuitive and responsive UI and good color usage provide a more enjoyable experience. Efficient layouts and familiar button icons make it easier for users of all experience levels to get started quickly. A common theme used throughout the application also helps keep the flow of user interaction.
Tyler
As a Web Developer at PDC Healthcare, what do you look for to raise user experience?
I find that apps with an intuitive and responsive UI and good color usage provide a more enjoyable experience. Efficient layouts and familiar button icons make it easier for users of all experience levels to get started quickly. A common theme used throughout the application also helps keep the flow of user interaction.
Hunter
Tell me a bit about what you seek in an app to help further enhance your experience.
I definitely have gotten better with socializing throughout the years from when I first started college. Attending concerts has always been something I’ve been interested in, but looking for people to go with has not been the easiest task. I really like the focus of functionality for this app, how it basically is a social media app, but focused solely on music for the purpose of socializing and meeting others.
Aaron
As a musician, how does social media affect you with self promoting on a platform?
One of the hardest parts about using social media as an artist is being able to easily navigate to a space where people will not only enjoy but engage with your art. A lot of people aren't on Instagram or X to learn about or listen to music so I feel pushed to the side or like I’m interrupting their normal scrolling through pictures.
Tyler
As a Web Developer at PDC Healthcare, what do you look for to raise user experience?
I find that apps with an intuitive and responsive UI and good color usage provide a more enjoyable experience. Efficient layouts and familiar button icons make it easier for users of all experience levels to get started quickly. A common theme used throughout the application also helps keep the flow of user interaction.
Target Audience
Mid-fi Wireframes
Animation & Prototyping
Solutions
Hunter
Tell me a bit about what you seek in an app to help further enhance your experience.
I definitely have gotten better with socializing throughout the years from when I first started college. Attending concerts has always been something I’ve been interested in, but looking for people to go with has not been the easiest task. I really like the focus of functionality for this app, how it basically is a social media app, but focused solely on music for the purpose of socializing and meeting others.
Aaron
As a musician, how does social media affect you with self promoting on a platform?
One of the hardest parts about using social media as an artist is being able to easily navigate to a space where people will not only enjoy but engage with your art. A lot of people aren't on Instagram or X to learn about or listen to music so I feel pushed to the side or like I’m interrupting their normal scrolling through pictures.
Tyler
As a Web Developer at PDC Healthcare, what do you look for to raise user experience?
I find that apps with an intuitive and responsive UI and good color usage provide a more enjoyable experience. Efficient layouts and familiar button icons make it easier for users of all experience levels to get started quickly. A common theme used throughout the application also helps keep the flow of user interaction.
Target Audience
Key Elements
Animation & Prototyping
Splash Screen
The main focus I had when creating this animation is how to incorporate the mascot, Musi. The mascot was conceptualized as an animated blinking chat bubble, characterizing the social media aspects of the app.
In order to avoid an overly chaotic animation, I timed the keyframes mapping out the direction of each element.
Splash Screen
The main focus I had when creating this animation is how to incorporate the mascot, Musi. The mascot was conceptualized as an animated blinking chat bubble, characterizing the social media aspects of the app.
In order to avoid an overly chaotic animation, I timed the keyframes mapping out the direction of each element.
Splash Screen
The main focus I had when creating this animation is how to incorporate the mascot, Musi. The mascot was conceptualized as an animated blinking chat bubble, characterizing the social media aspects of the app In order to avoid an overly chaotic animation, I timed the keyframes mapping out the direction of each element.
Location & Genre Selection
When designing the app, I made sure that all my call-to-action buttons were the same thematic color, hot pink. I also made sure to implement the signature blue color once the buttons are selected. This ties a relation to the overall product, and creates a sense of unity. To enhance app responsiveness experience, I enlarged the text and added an under-glow that really connected well with testers.
Location & Genre Selection
When designing the app, I made sure that all my call-to-action buttons were the same thematic color, hot pink. I also made sure to implement the signature blue color once the buttons are selected. This ties a relation to the overall product, and creates a sense of unity. To enhance app responsiveness experience, I enlarged the text and added an under-glow that really connected well with testers.
Making A Post
I incorporated two different key actions within the prototyping process. One would be the blinking animation for the text input field. This would give the user the ability to make a text post. The next action is the initial bounce into frame once the post button was pressed. I chose to implement the bounce frame due to overall flow and cohesion once executed. Additionally, I included easily accessible buttons within the post frame for better user experience.
Making A Post
I incorporated two different key actions within the prototyping process. One would be the blinking animation for the text input field. This would give the user the ability to make a text post. The next action is the initial bounce into frame once the post button was pressed. I chose to implement the bounce frame due to overall flow and cohesion once executed. Additionally, I included easily accessible buttons within the post frame for better user experience.
Solutions
To allow the user to express themselves, creating an engaging profile page by showcasing all your media on one page was key.
Media included: a user bio for introduction, a banner to showcase whatever they want, and a user profile image as visual representation for themselves.
Start connecting with new people based on similar music tastes. Musimate automatically incorporates your posts in tags relating to the music genres.
This ensures that the user can easily connect to other users based off similar interests.
The ability to post in various forms of media. The user should have the option to make any type of post as well as making it easily accessible.
In order to avoid confusion on where the post starts to where it ends, dividers are incorporated.
Final Prototype
Reflections
This project overall was an amazing experience. I never thought I would be able to implement various ideas like this all on my own given my timeframe.
If I were to go back and change anything, it would be to implement more interactions within the pages. One of my biggest constraints was figuring out how to create a nice visual flow with the logo animation to the log in screen. Learning to take constructive criticism, understanding your mistakes, and problem solving based off various difference sources online is something no one can really teach you.
Ultimately, I would have never been able to get into the BFA program if it wasn't for understanding and accepting these ideas. You can't buy that type of education.
Next Project — Pugmug
This project overall was an amazing experience. I never thought I would be able to implement various ideas like this all on my own given my timeframe.
If I were to go back and change anything, it would be to implement more interactions within the pages. One of my biggest constraints was figuring out how to create a nice visual flow with the logo animation to the log in screen. Learning to take constructive criticism, understanding your mistakes, and problem solving based off various difference sources online is something no one can really teach you.
Ultimately, I would have never been able to get into the BFA program if it wasn't for understanding and accepting these ideas. You can't buy that type of education.
Next Project — Pugmug