I completed a course on Human Computer Interaction offered by University of California, SanDiego on Coursera.org. This is a brief synopsis of my assignments.

Needfinding

Our assignments started with Needfinding exercise. The goal of this exercise is to observe people perform various tasks and uncover user needs, breakdowns, clever hacks or opportunities for improvement. Watching how people do things is a great way to learn their goals and values, and come up with design insight. We had three design briefs – Glance, Time and Change.

I chose Change. The mission of this brief is to design an interface that facilitates personal or social behavior change. Can technology help people and communities change their behavior to meet their goals? was the central point of this brief.

I observed single young adults or those who are living alone or with family. I wanted to know the effects of loneliness on their activities. With Individuality on the rise and life becoming too mechanical in the modern world, more and more people are often feeling lonely which leads to psychological and social problems. I observed how people feel when they are lonely, what they do, what they wish to do etc. I realized that people do get depressed when they come back home on a weekend willing to spend time with some good friends and find that everyone is busy in their own world and don’t have time to interact. People feel sad and lonely if they come to know that they need to spend the rest of the weekend alone. Some people also get jealous of their friends who post happy pictures on Facebook. I also realized that we do not perform lot of tasks (like going for a jog or attending a concert) just because we don’t have / find company; which is bad and since people around us also feel the same, there can be a way to interact with others and this world can become a better place!

Storyboarding

The second assignment was to write a simple point of view and create storyboarding.

My Point of View was that loneliness shouldn’t be a reason for your increased stress levels. There is a whole neighborhood community out there to not make you feel lonely.

So, my goal was to make a mobile app that would somehow solve this problem. For Storyboarding, I came up with 2 different scenarios in which my app can be used. Here are the two storyboards:

storyboarding-1 storyboarding-2

Wireframing

The third assignment was to create interactive wireframes for the app. I chose to do them in Balsamiq Mockups and create an interactive PDF out of it as was indicated in the Assignment tips.

So, here was my simple interactive wireframe for the mobile app.

Interaction and Visual Design

Next assignment was to actually do the visual design part. Before I actually started this, I had to make a plan for it.

Planning for Testing

Next step was to create required material and documents for user testing.

User Testing and Evaluation

The brief setup for experiments looked like this:

Most of the feedback I received was through "think aloud" technique where we ask users to just speak out their thoughts while browsing or navigation through the interface.

I recorded the videos of the tests and jotted down the design breakdowns.

Design breakdown 1

Sailesh struggles to find out how to delete an update. He tries by long-tap on the update as shown in the pictures. He took a few seconds to realize that he has to tap on edit and then delete it. For better explanation, watch this video: https://vimeo.com/104169645

Design breakdown 2

Yuvraj tries hard to navigate with the hamburger menu. He tries with thumbs of both his hands and took 5 attempts to open the menu. (His thumbs are large and the tap area was small.)

Design breakdown 3

Suraj struggles to locate logout option in the app. He navigates to the hamburger menu and thinks he can find the logout there. But he doesn't. He searches on header in vain. He even makes fun by saying "logout" to the app! You can also watch the video clip here: https://vimeo.com/104192160

Design breakdown 4

The screen needs to be locked in portrait mode or redesigned for landscape mode. Preethi, one of the participants got irritated when this happened.

Design breakdown 5

Yuvraj thinks the forgot password popup should close automatically after it's job is done. Video clip here: https://vimeo.com/104191958

Design breakdown 6

Edit Profile is not clear especially for users who are habituated to Android devices. In the above picture, Bharat is trying to edit the profile by long tapping on the profile items in vain. He was unable to realize that there is an edit icon on the header because he didn't recognize it as he was a heavy android user.

Also, many users expressed their opinion that profile page should contain more details about the person such as interests, hobbies, age etc. because that's how they can decide if it's an appropriate connection or not.

Summary

  • Deleting an update is not very intuitive and involves more steps than necessary.
  • Logging out is not clear. One has to go to Profile to logout which is confusing to certain users.
  • Responding to comments can be a bit better than what I designed now. On tapping a feed item, the keyboard can automatically slide up making the user tend to comment instead of searching for the comment box.
  • Popups should automatically close once their function is done. (like password reset)
  • A couple of users felt that sorting by time isn't really a useful feature.
  • Friends screen is missing an "add a friend" button according to few users.
  • Friends can be changed to "my friends" to make the meaning more clear.
  • Activity log being on profile page is not very intuitive to everybody.
  • Edit profile should give an option to change name and location also.
  • Edit profile is not easy to locate especially for people habituated to android OS. So, probably icon needs to be changed to "edit" text.
  • The profile page for this app might also include phone number, age, interests etc. according to a couple of users.
  • The comments for an update should also show "distance" along with "time" so that the person who has posted can make an informed decision.
  • Almost everyone liked the Bottom Tabbar menu design than the hamburger sliding menu (alternate design).

Overall, this assignment was helpful in giving me some hands on experience on conducting user research and usability tests. It also helped me follow a streamlined process for interaction design.