Customize Messenger App for iOS
Role: UX/UI Designer
Duration: 6 weeks in 2021
UX/UI Design Tools: Research / Pencil / Balsamiq / Sketch / Figma
Designed a messenger app that can be customized to your unique style: colored bubbles, unique sound notifications, delay/schedule messages and a Chat Bot that helps you with tips and therapy when you need some support! This app is called, ‘MEZZY’ and its tagline is ‘EASY/FUN/SAFE’. Nothing worse than sending the wrong message to the person you care most about or your boss. Group messages can be stressful when your not sure who is on the message string, MEZZY will resolve all those stressful scenarios. Or maybe you just like to be super organized and unique when your messenging 24/7, this app takes cares of that too!
My Approach
To design an app that is delightfully easy, unique, and makes you feel good about that message you just sent. Customizing bubble colors can help you recognize who you are quickly messaging without worrying if you sent the wrong message. The ability to have unique sound notifications is just another step further in making sure you know who this message is from. And the ability to delay message or delete is an option that everyone can use. Scheduling those important messages like birthday wishes is another feature that I wanted to design for that extra customization.
My Challenges
Challenges were widely spread through different age groups and needs for this app.
After UX research and finding that all age groups could benefit from a customized messenger app I began sketching up the first screens with pen/paper to see what was the core findings needing to address. My challenges were an Intuitive Flow, Trending Patterns, Privacy, and a Happy Path.
My Lo-Fi Design
My wireframes screens designed in Balsamiq were extremely helpful in creating the perfect flow for the user. I was wanting to focus on the user having less screens and wanted to incorporate as many bottom drawer elements as possible but realized in the process that trending patterns were of those that the user is most comfortable with and not necessarily less screens.
My Hi-Fi Design
My final interations were done in Sketch app and imported to Figma. I presented two cycles of constructive feedback to depict how I incorporated those findings into my second cycle.
Cycle 1: Feedback revealed that the lack of color in UI elements was not necessarily a good thing, using color can be tricky but establishing a color pattern for UI elements is not a bad thing when the app is rich in color. One visual critique was the round message bubbles were not ‘Modern’ in design. Also UI guidelines regarding Onboarding screens should be easy to read and have less than 3 lines of text ie: bullet points.
Cycle 2: Revisions were made from previous critique/findings: implementation of color to CTA buttons and other UI elements as well other UI guidelines such as lines of text.
Final Hi-Fi Design
Below screens are catagorized in the groups of Settings flow.
User Flow
UX Goals
Using the Google HEART framework to set UX goals it was apparent that my strong point is Metrics.
Creating a visual graph with Meaning and Experience catagories to validate designing this app: customized messenger.
UX Post Design
Documenting tasks on a UX Debt Sheet clearly defines what feedback should be priotized and excels the app to be launched in a timely manner with few obstacles during this segment of buiding the app.
UX Post Research
Creating a Google Survey Form post design of app revealed that potential users are interested in this app and have other customize features that could be designed in next round.
Branding Visual Collateral
UCSC Silicon Valley Extension Course: Designing User Experience For Smart Things, Virtual Reality and Wearable Technology
Instructor: Eric Dorf Senior UX Designer Google.com