Promo image of the Inner Circle app.

Keeping your contacts up-to-date with
Inner Circle

Project Detail


UX, UI, Visual Design


Timeline: 4 Week
Team: UX/UI Designer, Mentor
Tools: Figma, Photoshop,
           Google Forms, UsabilityHub


User inteview
Journey map
Competitive Analysis
Paper Prototype
usability test


Inner Circle is a mobile application that allows its users to keep contact information up to date easily and organize their contacts into a meaningful grouping called “Circle.”


Keeping contact information up to date can be a hassle. There isn’t an easy way of knowing if a phone number or an address is still current. As someone who just got a new phone number or address, the process of giving your updated information to your contacts is equally troublesome.


Inner Circle will allow the user to verify if the contact information is correct by providing them with a simple Request Update feature.
Anytime the user updates their information, the people within their contact will be automatically notified of such changes.
The contacts can be organized into meaningful groups called “Circle.”

My Process

User Interview / Survey

User interviews and surveys were conducted to validated the assumptions made about the users. The research findings help define the target audience and their frustrations and goals.

Competitive Analysis

A competitive analysis summary slide.
According to USPS, as of July 2020, over 15 million people submitted requests to change the address. This shows that there are indeed a lot of people moving even during the middle of a pandemic. People need an easy way to share their new contact information.

Evaluating some products currently on the market, I found that while products like Google Contacts and mobile applications like Address Book allows users to store contact information, updates are not automatically synced.

Social media applications like Facebook and Instagram allow users to update and sync their information with other users. However, users aren't inclined to share their personal information on such platforms.

Target Audience

A target audience infographic.
Using qualitative and quantitative data collected from user surveys, user and client interviews, the target audience was defined to help the team understand who the products' users will be and drive decision-making when evaluating the solutions.

User Persona

Based on research, the persona was created to represent the key audience and serve as a reference point. This helps keeps the team focused on the problems needed to be solved.


Be as efficient as possible.
Have a simple process of gathering contact information.
Getting accurate information about her contacts.
Making sure she doesn’t forget to include anyone she wanted to invite.


Don’t know if her contact information is up to date.
Don’t have a convenient way of organizing her contacts.
Don’t have an easy way to request information from her contacts.

A user persona image.

Mistee U.

Age: 29
Job Title: Artist


During the design sprint, storyboards are sketched out to show how the user will engage the product.

In this scenario, Mistee U. is planning her wedding. She needs to gather up-to-date mailing addresses from the people on her guest list. Mistee uses the Request Update feature in the Inner Circle app to help her to complete her task.

A sketch of the storyboard.

Lightning Demo

Lightning Demo is an exercise used to draw inspiration from existing products. Notable features that are unique or proven to be successful are taken into consideration and are build upon during the idea exploration phase of the design process.
Twitter and Instagram were used in this demo. The simple UI elements, swiping menu, floating action button, carousel, and infinite scrolling were noted.

A sketch of a lightning demo.

Crazy 8's

The crazy 8's is a quick and iterative exercise that pushes for divergent thinking. It is excellent for coming up with ideas as it forces the designer to make rapid decisions and be more explorative. It was us in this example to explore the layout and design concepts for the home page and profile page.

A sketch of the crazy 8 exercise.

Wireframe Sketch

Starting the wireframes from sketches is less resource-intensive and allows for quick revisions. The low fidelity of these artifacts makes it easy for the designer to discard inadequate solutions as little resources have been invested.

Sketches of the Inner Circle wireframes.

Paper Prototype

I created a prototype from paper to quickly test some of the interactions, such as the circle carousel and the user profile overlay.
Paper prototype is excellent as they are very accessible and requires minimal resource.

A photo of a paper prototype.

Clickable Prototype

A prototype was created with features that fulfill the user stories to satisfy the requirements of the MVP.

The user can organize their contacts into grouping call circles.

The user can request their contacts to verify that their contact information is up to date.

The Notification tab provides the users with updates from their contact and upcoming special occasions like birthdays and anniversaries.

The user can use the search feature to find and add new contacts into their circles.

The prototype was also designed with accessibility in mind by complying with the Universal Design principles.

Usability Test Result

A usability test was conducted to test the solutions.

5 User interviews were conducted remotely through Zoom. Each session lasted between 20-30 minutes. The participants were asked to perform 13 tasks designed to test the flows and information architecture of the prototype.

A display of the usability test participants.

The table below shows the test result. The tasks are in the left-most column, follow by the participant's success rate and notable observations. "Yes" in green means the participant was able to complete the task. "But" in yellow represent conditional observations. "No" in red implies the participant was not able to complete the task.

A usability test result table.

What Worked?

From the usability interview, I learned that:

All participants understood what the app was designed to do. They were able to identify at least one product goal requirement without contextual explanations.

All participants completed at least 92% of the tasks.

60% of participants completed all the tasks.

All participants found the app helpful.

Usability result summary graphic.

What Didn't Work?

One particular area of the prototype was difficult for all participants to understand. This was the Circle Member button.

The participants had trouble understanding what this button was meant to be.

They did not recognize it as a call to action button.

Once opened, the participants had trouble figuring how to close the circle member page.

A mockup screen showing the part of the UI where user had trouble navigating.

High Fidelity Mockup

I begin turning the prototype screens into a high-fidelity mockup by first creating an interface inventory.

Using the client's design criteria, I created a branding style guide that best reflects the image of the app. This, along with the inspirations I've gathered from existing products, assisted in remixing the screens you see here.

A spread of hifi mockup screens for the Inner Circle app.

High Fidelity Prototype

A limited prototype was created to test  the visual design of the mockup.

Demo the prototype
A mockup screen displaying the family grouping in Inner Circle.

What's Next?

A list of potential features to include in future iterations.

The prototype was revised based on the learning from the usability testing. The recommendation would be to test the changes made to validate the solutions introduced in the revision.

A user testing participant asked, "What if I don't want to share certain information with certain people within my contact list?" While this was not one of the goals of this design sprint, it should be considered for future plans. The user must have control over who they share their more sensitive information with.

Other basic app functionalities like logins and settings also require attention. From here, additional features such as having a messaging system or a way for users to indicate that they are online or available to hang out may be considered to increase user engagement and ultimately product viability.


This project taught me that using a methodical design process helps make complex problems solvable and can lead to well-designed products.

While a single designer can take on tough challenges, the design sprint is most effective when done collaboratively.

Thank you for reading