Communication Tech:

Connecting the World with Messenger App

Overview

Brief:

This project involves designing a Messenger App with three main screens: the Primary screen, Conversation screen, and Contacts screen. The primary screen will contain all conversation threads. The Conversation screen will include the type field and all the different buttons/icons that allow users to send different kinds of content such as images, gifs, emojis, and voice notes. The Contacts screen will display a list of all the user's contacts.

Scope:

UI/UX, Wireframes, Prototyping, Design System, Mockups

Pain Points

  1. The users of our Messenger app are people who want to stay connected with their friends and family members. They find it challenging to navigate through numerous conversation threads and contacts when using other messenger apps.

  2. Additionally, users want to send different kinds of content such as voice notes, or even make video calls, but these options may not be readily available in their current messenger apps.

  3. Therefore, this product should address these pain points by providing an intuitive and user-friendly interface that makes it easy to access all conversations, send different kinds of content, and connect with all their contacts.

Design Process

  1. Research: Conducted research to understand target users, their preferences, and pain points.

  2. Wireframing: Created wireframes of all three screens using pen, paper & digital sketch. These wireframes helped visualize the app's layout and functionality and get feedback from stakeholders.

  3. Mockups: After wireframing, created mockups of all three screens reusing common components to ensure consistency throughout the app.

  4. User Testing: Conducted user testing on the app's usability, functionality, and overall user experience. This step identified and fixed any issues that users encountered.

  5. Implementation: Finally, implemented the design and make it ready to present to stakeholders.

Feature Requirements

  1. Primary Screen: Contain all conversation threads.

  2. Conversation Screen: Include type field and all the different buttons/icons that allow users to send different kinds of content such as images, gifs, emojis, and voice notes.

  3. Contacts Screen: Display a list of all the user's contacts including keyboard.

Previous
Previous

Automobile: Case Study / Car Buying App

Next
Next

Diverse Industries: Rapid Design Sprints