HCDE 210 — Interaction Design

The Process

This week, we were asked to design and prototype a simple app pertaining to animal census in urban communities. The app I decided to design was sort of a Fitbit for pets. The app would connect with a special collar on the pet that would monitor their heartbeat and exercise. The collar would also have a small camera that would periodically take geotagged photos, allowing the user to see the world from their pet’s perspective while monitoring their location.

Sketching out the interaction flow and screen design.

I started out by brainstorming the features of the app that I thought a user might be interested in—primarily heart rate, exercise, camera, a text journal, and a way to switch between multiple pets. I then made a simple flowchart to lay out the app’s interaction flow. Next, I sketched out a few miniature screens and tried to link them in order to determine how the navigation of the app should work. I decided on using a pop-out sidebar for navigation, as it is a fairly common, simple, and intuitive way for a user to jump between different screens of an app. I also decided to make the home screen of the app a dashboard, as it allows the user to get basic information at a glance without needing to navigate to other screens.

The completed sketches for use in the POP app.

Once I solidified the design, I then sketched out larger screens and created a low-fidelity prototype using the POP app. Finally, I created a short demo video of the prototype, demonstrating its features and navigation:

The Experience

I found this project quite enjoyable, as it was satisfying to be able to start with a simple idea, sketch out an app based on that idea, and end up with a prototype that can actually be interacted with. Likewise, I also liked the process of sketching the screens of the prototype, as it allowed me to take my design ideas and represent them in a visual manner.

The problems I had this week were mostly on the technical side. When taking photos directly in the POP app, the camera would not focus on the paper, so I needed to take the photos first and import them later. However, as the screen proportions in my sketches were incorrect, importing the pictures caused the app to crop out content, so I needed to re-take the photos multiple times. This could have been avoided by familiarizing myself with the app before starting this project. I also had trouble recording the video, as the only camera I could use to record my phone with was my laptop’s webcam, which forced me to record at a difficult angle and interact with the app in a less natural way.

In the future, I would be interested in learning the process of showing off a prototype to potential users, getting feedback from them, and incorporating that feedback into the app’s design.

One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.