HoloTutor Prototype Portfolio

In IDP 116, Prototype Portfolio by Sula Demers

(For better image quality, view the document in its original format on google drive! Click here!!)

IDP 116: Introduction to Design Thinking

HoloTutor

Ashley Ng, Sula Demers, Yuhan Wen

Introduction

Our design prompt was to find and design for someone who lives a double life. We interviewed a student, Catherine, and made an individualized system to help her balance between STEM and History, the two main components of her double life. Our design is an app that uses holographic technology to help her with the schedule, remind her of events,  and avoid distraction from her phone. We followed the procedure of empathizing, defining, ideating, prototyping, and testing to get to the final design. In this portfolio, we show our user’s story as well as our own with the design through four perspectives.

Human-centered

After interviewing our user, we learned that she mainly struggles with procrastination and balance in her double life.  During the semester, she takes an equal amount of STEM and History classes, however, her real passion lies in History with a particular interest in Modern China.  She strives to learn more about her own country’s history and not be hindered by the censorship she faces at home.  Her intentions in taking STEM classes are mainly influenced by her mother who is thinking of her future and the job opportunities that come with it. Catherine is taking STEM classes as a necessity and not through personal interest. She admits that there is an attitude shift when she is learning about history and when she is learning about math/science. While she sits at the front of her history class, she is usually late to her STEM classes. Through the use of empathy mapping we noticed that a lot of her choices in life is influenced by her parents. Her father plays a major role in her interest of History and her mother encourages her to take STEM classes for the sake of her future. We realized that we cannot come up with a solution for her conflict between the two academic subjects because in the end she is the one who will decide what path she will take. What we needed to design for our user was something that will help her balance the two lives.

The first time around, our team struggled a bit with this process as we left out the technology review during our first interview with Catherine. Luckily we were able to meet with her again on short notice and during our second conversation with her we found out that she relies on three types of technology that helps her balance her schedule: coffee, her laptop and her note-taking strategy. From this information we generated ideas for our user such as a personalized coffee mug, an app that can help her stay on task and a binder that combines note taking and AI technology that reminds her of homework/to-do lists. In the next section we explain the evolution of our design and how we worked towards our final prototype.

Experimental

Through the the design process, the team’s design went through five physical prototypes. Each prototype had unique features that helped map out our thinking as we designed.  Our first two low resolution prototypes were made simultaneously based on the tools our user had described helping her in everyday life; coffee, and a notebook/binder to do work in. We decided not to focus on her laptop as a tool, because there are already features available on laptops that are set to keep people on task. We did not want our project to be redundant.

The prototype above is a low resolution version of a personal trainer mug.  Our focus as designers was to help our user with the problem of balancing her time to make her homework less strenuous and to avoid procrastination. This idea was combined with a mug, because of our user’s love for coffee.

Features:

  • Tomodachi style anime character coach.  This function works via bluetooth. On their phone, the user can input homework and how long it will take. From there the artificial intelligence will sort the given information into a usable study plan, and will act as a timer to make sure the user stays on schedule.
  • Because we want our client to be health conscious, we built in a sensor that will log how much coffee she drinks, and can tell her if she is drinking too much and remind her to stay hydrated.
  • Our user mentioned that she usually uses disposable cups because she does not want to wash a mug. We built in a non-stick coat which is represented as the hot pink paper on the right image, so that it would not have to be cleaned. The coat uses nanoparticle material to imitate the self-cleaning process of lotus. It creates a rough surface which is super-hydrophobic so that water drops have less adhesion.
  • The mug has a lid so it is easily transportable, and a mute button so that the artificial intelligence will not start talking in the middle of the host’s classes.
  • The mug has the technology of a thermos, meaning there is a vacuum (a completely empty space) within the walls of the mug so that heat or cold is retained longer.

Our user also mentioned she found the Smith dining halls open at inconvenient times, not allowing her to get coffee when she wanted. Additionally she mentioned that Smith coffee is not very good, we could not find a way to solve these problems within our mug prototype.

When presenting this prototype, the main critique we received was that the user would have to be sitting a very specific way to see the tiny screen. It would be ideal to see in class when sitting at a desk, but it’s so small that there are not many features the user can edit directly on the small device. We decided the mug idea was impractical and not a useful as it could be, and may even be a distraction to the user!

This low res prototype serves a lot of similar purposes as the mug, most importantly featuring a personal trainer who will help our user balance her time. This version of the digital tutor was built into a three ring binder. The size of the device was increased so that more features could be incorporated.

Features:

  • Three ring binder is the size of any normal three ring binder, allowing the user to put in whatever type of paper they most preferred as long as the paper has been hole punched.
  • The digital tutor is a stand alone system so all of its settings can be altered from the binder instead of on a phone.
  • The digital trainer can speak to you, but their dialogue also appears in a chat underneath the main screen in case the user misses what they say.
  • There is a button on the chat log the user can press when she has a question. Alternately, she can type her question into the box with a keyboard below the record button.
  • A settings bar allows the user to alter volume, brightness, and use internet and bluetooth settings.

The binder had two major critiques. One being making the device a stand alone system would be expensive to make, and possibly not affordable to our user. The other was that only one side of the paper in the binder would be usable, because the uneven texture on the device side would make it impossible to write. We want to make our invention as environmentally conscious as we can. A similar flaw is that once done with a sheet of paper, moving it over would result in hiding the device. Overall not our best design.

Meta-Cognitive

After creating these prototypes we decided to leave the mug as well as binder concept and only keep the AI technology part of the design. As part of an empathy mapping brainstorm, we generated some crazy ideas such as; creating a robot personal trainer/tutor, cloning the user to take STEM classes for her, and making full size historical holograms to motivate our user to study. With a little research on the internet we learned that with a simple translucent material, such as a CD case, holograms can actually be made (Image above). It’s surprising that our crazy ideas led directly to our final app design that incorporates holographic technology. Below are final designs of how the app would look on a typical phone screen:

Figure 1: Calendar

Our first image shows off the default screen that comes up when a user opens the ‘Holotutor’ app. The blue triangle allows the user to change the calendar display to either month, week or day. The calendar allows the user to type in her to-do list for the day or select a future date to input tasks. Next to each task is a pink information button that lets the user set a time, alarm and add notes if necessary. The Holotoutor program then takes the user-input to do list for the day and compiles the information into a daily study schedule based on the attention span of the user. More research would have to be done in order to make this function of the app possible.

Figure 2: Hologram

Simply by pressing the diamond icon located next to the calendar, it will take you to a screen that informs the user to place their phone on the clear hologram projector (as shown in a previous image).  A simple double tap on the screen will exit out of the hologram. The purpose of this function is not just to be exciting, but to keep the user away from the distraction that is their phone. Our user suggested that we add a feature to block notifications that would normally pop up on the screen.

Figure 3: Chat log  

Similarly to the binder prototype, the hologram comes with voice recognition software. In this version, instead of pressing a button the user would say “Holotutor” to turn on voice recognition and then proceed to ask their question. Shown above is the chat log feature that allows the user to look back on the questions they asked and see the answers outside of the holographic portion of the program. The user can search keywords to find specific answers, or they can favorite an answer for later review. Questions and answers in the log will only remain for a week to save space on the user’s phone, but any favorited answers will stay on the phone for as long as the user wants. The user just has to tap the empty stars next to the questions and answers to favorite them. The user can also ask questions on this screen by tapping the mic or entering their question into the text box.

Figure 4: Settings

Settings provides three features: customize, language and contact. The customize section enables the user to change the character in the hologram and alter its personality, voice, and appearance by adding clothing and accessories. We know our user likes to watch anime so the ‘add new’ at the bottom of the screen will let her use her favorite anime characters which would be free downloadable additions to the program. There is also a ‘save character’ option so that when the user customizes their character how they want, the same settings can be selected again with ease. More than one character can be saved. The language screen is self explanatory, we want our user to be able to choose the language they are most comfortable with using. Because our user’s first language is not English, it was a feature we thought important to incorporate. The contact us section can be helpful in many ways. As this design is a prototype, feedback is always wanted and this is an easy way for people to see how to get in contact with us. Also because we want to incorporate anime characters into the app for our user, we want it to be easy for people to let us know what characters they want to see in the app. We would have to collaborate with the anime character owners to make this possible, the suggestions lets us know which owners have the characters the most people want.

Feedback from our user

Our user Catherine liked our idea of a holographic tutor and said that she’d love to actually use it to help her with the homework and scheduling. Since the hologram functions with her phone on top of the acrylic pyramid, the user can’t use her phone while playing the hologram, avoiding distraction from the phone. To go further with that point, Catherine suggested we add another feature that blocks the messages from her social media when the program is active. Also, to see the hologram clearly, the user has to keep her eyes the same level as it, which is inconvenient because of how small the hologram is. To fix this problem, we would have to make the projector taller and adjustable so that the user can keep it at eye level, instead of having to bend down to see it.

Collaboration

As a team, we all contributed and voiced our thoughts, perspectives, ideas, and worked to fit all those ideas together. We worked as one in many aspects of the project, but at the same time, we contributed our individual strengths in order to maximize the productivity of the team. Ashley did a wonderful job sketching and visualizing our design of the app. After brainstorming, she also compiled our ideas into one streamlined form and designed a unitive style. Sula is the best writer among us. In this project, she was very helpful in organizing words, drafting the slideshow and portfolio, and delivering our ideas in other words for better understanding. Wen was in charge of 3D design. She made sure our ideas were plausible, did research to find the best way to make an idea come to life, and was the one to construct our holographic model. Overall, our team worked well because everyone had plenty of ideas to share and were happy to contribute them to the team. We compensated for each other’s weaknesses and made good use of our individual strengths to provide a solid design.

Reflection

In retrospect, we never had a completely clear idea of what we wanted to make and how to do so. All of our prototypes were very different in design and use, but it was the common elements that stuck with us and became our app. As a team, we knew when to step away from an idea that was not working, and instead of forcing that idea to work, we found we could take a new angle and start fresh. As we worked on the project for our user we also made it for ourselves, as students it’s easy to empathize. That feeling that we could combine the needs of our user with our own dreams and wants is really satisfying. We made mistakes as a team, but each of those mistakes led to a better understanding of design thinking, and to more ideas we had not considered when designing.