Focus Front — From Concept to Prototype

Hasan Gopalani
3 min readFeb 3, 2017

--

My app, Focus Front, was directly related to the location in which I found myself the week of the first assignment. I was spending time with friends of mine at our local university, and since the assignment called for me to observe the people around me to find out what they needed, I quickly began to notice students being distracted with their studies. I approached a few of them and asked them about their study habits, and I watched some of them as they studied, taking notes to see what they did to remain focused.

Watching a student struggle to remain focused and write an essay in a library shared study area

Using the information I gleaned from observing these students, I noticed a common strain that kept them focused: audio. Each of the students who remained on task were usually listening to music or some sort of audio, though there were some that were getting distracted by the very same, since their mobile devices controlled their audio intake.

In the Ideation phase of the design process, I learned how to brainstorm in a focused manner and really learned how to draw inspiration from multiple sources. Each of us in more in tune with different mediums, so by looking at a concept through words and images really helped me begin to cement my idea in place. I knew I wanted to create an app that would shut out distraction, but it should also go further and reward the user for remaining on task.

When brainstorming what to do for the initial prototype, I drew heavily on the websites I features in my ideation assignment. I saw many different websites that address varying aspects of keeping people focused and on track, and I aimed to combine them somehow. Some websites used a timer and blocked out distractions, others played calming ambient sounds, and others reinforced good behavior by involving other people. The storyboard really helped me put a scenario together in which all of these elements would need to come together to help address the real needs of the users.

One of the storyboards, showing what would eventually become the call study buddy feature

After the storyboards were finished, I created a paper prototype that brought to life the main features of the app, and this really helped me in terms of thinking how to best lay out choices users would need to make. Since the aim of this app is to increase focus, it would need to be simple so as not to distract users as they use the app.

The study timer configuration page that comprised the core feature of this app

After collecting feedback from a multitude of people and perspectives, I continued to iterate on my prototype, building it in Balsamiq. I liked how fellow students, friends, and random users all had different points of feedback. It really drove home the point that design is never truly complete, and always requires refinement to ensure multiple people can use it easily.

From paper prototype to a fully fleshed out prototype was a long arduous journey, but all of the steps before it really helped ensure I had the proper perspective in mind as I worked.

Thank you to Dr. Klemmer and all of the fellow students for being such great help during this process. All of the concepts we learned really came together, and it couldn’t have happened without the help of everyone in the course and all of the users who gave me feedback.

Check out the prototype here: https://invis.io/BTA826ZUX

--

--