CommnRoom
Client: CommnRoom
Role: UI/UX Designer
Year: 2020
CommonRoom is an educational app that offers users a space to expand their knowledge while connecting with people who share similar interests and passions. Its main focus is to promote a more natural and relaxed learning experience, based on conversation and the exchange of ideas, perspectives, and experiences.
Project Goals
Design a native app interface that allows users to search, create, and explore themed chat rooms, facilitating interaction with other participants through posting specific content. The goal is to achieve a modern and coherent design, aligned with both the app's theme and the guidelines provided by the client.
It's a social app that allows users to connect with each other through shared interests and areas of study. The platform offers the ability to create themed chat rooms, where users can exchange ideas, participate in conversations on specific topics, and make new friends.
Who is our target?
The client provided a list of 12 potential users (men and women between 20 and 30 years old, university students), with whom individual 20 minutes interviews were conducted. The objective was to deepen the app's conceptualization, gather feedback and suggestions, and better understand the user needs,and expectations.
Chat rooms should be customizable and have a limited number of participants, due to spam and potential unwanted interactions.
Negative perceptions of social apps, associated with scams, fake profiles, and risks of personal information leaks.
Interviewees would pay for a premium version if the app allows them to meet interesting or relevant people.
Social Apps are often linked to adult content, which can generate distrust.
The main attraction for those interviewed was the ability to interact anonymously and exchange ideas. At the same time, two important points were highlighted that would help further understand the purpose of use.
Interviewees also mentioned various apps considered as indirect competitors or alternative uses. Analyzing these references, it was identified that they share a similar target audienc, but pursue different objectives, primarily focused on matchmaking. Relevant observations included the following:
Most social apps focus on finding a partner and friends in general.
Are more inclined towards language learning.
There is no other similar apps in the country.
Have a defined visual design pattern.
The competitive map was created to define key features and service options, as well as to identify strengths and weaknesses relative to similar products. Direct competition was determined through online research, considering criteria such as functionality, target audience, location, and user interaction methods.
Among the most relevant findings, we identified a strategic differential: the ability to "filter content of specific interest," as well as a major weakness in our current service: the lack of an option for video calls.
A card sorting exercise was also conducted with 7 of the 12 interviewees to structure the content options. This activity provided a clearer view of the relevance of the features to the average user, as well as a ranking of elements with a potential direct impact on design decisions.
This entire process was key to defining the product's features and functionality, as well as establishing a content distribution aligned with user design preferences.
Design
For the design, the client requested a "study" theme and a modern aesthetic that conveyed peace, in line with the brand's essence and visual identity (limited to the logo).
To build this distinctive style, I proposed the conceptual idea of a "forest," a symbol of wisdom and serenity, associated with tranquility, patience, and study.
I developed flat-style vector illustrations of forest compositions for the backgrounds to achieve the desired atmosphere. Purple was used as the main color, complemented by color extensions to create depth and enrich the visuals.
Clarity and usability were prioritized, leading to the development of a clean, distraction free design that facilitated fluid and intuitive navigation.
One of the key resources was the design and strategic use of icons, which not only complemented the reading experience but also added dynamism and helped to define the product's visual style.
Users can create and explore multiple themed chat rooms (music, sports, cooking, among others), designed to encourage interaction around shared interests.
Within these rooms, users can chat, get to know each other, and exchange experiences. The goal is to promote the formation of friendly bonds and natural learning through spaces with specific focuses that facilitate conversation and generate affinity.
Chat Room
Communication and interaction between users is essential, so the chat was designed with an interface that balances conventional functionality and visual simplicity.
From this space, users can access other participants profiles and decide whether to add them as friends.
Profile
Rooms Creation
Users can create chat rooms, customizing the type of activity, the level of difficulty, and the number of participants, according to their preferences.
Other Profiles
Access to other participants profiles is limited, ensuring a high level of anonymity and security. Additionally, users have the option to block or report others, reinforcing personal control and protection within the platform.
Settings
Allows users to edit certain profile information, and data, configure notification preferences, change plans, and, if desired, delete their accounts.
Finally, the user will have a 30-day trial period. After this period, they can choose from the available plans to continue using the platform and accessing its features.
The design was developed using a 375x812 px layout. The low-resolution wireframes and static prototype were created in Figma, while the background illustrations and icons were designed in Adobe Illustrator.
