Design Process

Design Process

1. Observe


Based on my initial encounter with the problems using chatting feature, i had hypothesis for my research.

Icon button block the text field. It causes user accidentally often press icon button in the text field when they’re texting.


Based on my observation and research on some people who used instagram feature, I found that most of people use social media because they want to keep in touch with their friend or just to kill boredom. I think this persona could use as representation because most of people who often use instagran have similar behaviors and need goals this type of persona

User Persona

User Interview

I interviewed some of my friends who match with the persona. I asked about ‘how often they use icon button feature?’, ‘what icon button they often use?’, and observe ‘What do the think and feel about the icon button feature?’

55% of 12 people said that they often use the love icon button feature. Most of them said that the feature useful to end conversation politely. But 55% of them had bad experience about the feature, because they often accidentally pressed the love icon button. And they feel a little bit annoyed when it happen. Actually, they accidentally pressed the icon button not just happen to love icon button, but they more concern about it because When they press the love icon button, it’ll sent directly without any permission confirmation.

Whereas for the other icon button feature, they’re not commonly use it. When I asked them about the function of each feature, most of them didn’t know what the function of selfie effect camera icon button. Usually when they want to reply chat using photo, they used camera button on the left side of instagram text field.

Selfie Effect Camera

2. Define

After did the research, the problem hypothesis are now validated. I also discovered new insight.

Pain Points #1 : Icon button block the text field.

Based on the interview, i conclude that icon button block the text field so it caused user often accidentally press it. And they most concern about the love icon button, because when it accidentally pressed, it’ll sent directly.

Instagram chat icon button

Pain Points #2 : There are redundant function icon button

After i did deeper exploration and interviewed of instagram chat users, i found that there are two icon button that have similar function. When i asked the respondent the function of each icon button based on the icon image, most of the respondent answered that they don’t know about the function of selfie and effect icon button. And most of them said that they’re not commonly use the camera function to reply chat.

Selfie and effect

3. Ideate

Lo-fi Wireframes a.k.a Paper Sketches

I explore what kind of design that could help to overcome user problem. I did some idea sketch on paper.


Pain Points #1 : Icon button block the text field.

Based on the first pain point, i tried to make the UI more simple and organize. So i decided to organize the icon buttons in one button.

Pain Points #2 : There are redundant function icon button

Based on the second pain point, i decided to remove selfie camera button. The reason are because most of people rarely use that icon, so they didn’t understand about the function of that icon, and because selfie camera button had similar function with camera button. By using camera button, user also could access function from selfie camera button.

4. Prototype

For the UI prototype design, i kept using icon button from instagram because in this research i want to be more focus on user experience using instagram chat. So, this is some of my UI design for instagram chat redesign.

1st UI
2nd UI
3rd UI
4th UI
5th UI

5. Result and Validation

After i maked some design, i interviewed some user to validate my design and to decide which design that user more comfortable to use. Based on my interview, 7 of 12 people i interviewed choose 3rd design. And the other 5 choose other design. Some of their reasons are because it look more simple, they feel more comfortable to access button by organizing them in one button, and also because they like the design. They felt their fingers could more fit on the button when they pressed it.

Final Design

This is my side research project. Feel free to give feedback for my research 🙂

Source link


Please enter your comment!
Please enter your name here