Names: Joseph Bolling, Evan Strasnick, Jacob Simon, Xin Yang Yak

Group Number: 17

What we built: We created an alarm clock, aimed at heavy sleepers and chronic snoozers, that shuts off its buzz only when the user actually gets out of bed. It accomplishes this using a simply force-sensing resistor located under the bed that responds to the change in force of a human weight being lifted. Overall, we were delighted with how well the system functions, and how simple it was to implement such a practical feature that solves a real-world problem. We were dissatisfied, however, that the coding of the actual alarm had to be done by setting a variable in the source code of the arduino (and that only one alarm could be set at a time). An actual implementation of the device would communicate with a real alarm clock (or alarm clock interface) to allow the user to more easily set and change his alarms.

 

Sketches:

Our first design was of an insole that could be inserted into any shoe to add pedometer functionality. A force sensing resistor measured the number of steps, which could be uploaded via USB at the end of the day.

Our next design was of a device which used a thermistor to alert the user if (because of a malfunction or power outage) their refrigerator or freezer was at a temperature at which their food might spoil. In the event of a power outage, the user would exactly when their food was no longer good.

Our final design, which we decided to implement, was the alarm clock which shuts off when the user actually gets out of bed.

Storyboard:

Final System:

Here’s a video demonstration of our prototype. Since, to our surprise, we were unable to find a bed in the lab, our user demonstrated the system by falling asleep in a chair instead. http://www.youtube.com/watch?v=7fJjzzmrqKU&feature=youtu.be

List of Parts:

  • 1 x Arduino UNO connected to power supply
  • 1 x Force sensing resistor
  • Approx. 5 feet of wire
  • 1 x 10 kOhm resistor
  • 1 x 330 ohm resistor
  • 1 x Buzzer

Instructions to recreate:

To construct our alarm clock, simply connect the parts as indicated in the diagram above.  The force-sensing resistor should be connected to the Arduino using two wires long enough to reach from the location of your alarm clock to the point where you’d like the force-sensing resistor to be located-] (we recommend near the center of your mattress or underneath one of the legs of your bed).  One of these wires should travel from the +5V pin on your Arduino, and the other should connect with a 10kΩ resistor.  The other end of the 10kΩ should connect to ground.  Connect analog pin 0 on your Arduino to the junction between the force-sensing resistor and the 10kΩ resistor. Then, connect the buzzer in series with a 330Ω resistor between pin 3 and ground, set how long you’d like to sleep in our code (the “secondsUntilWake” parameter), and upload to your Arduino!

Source Code:

/*COS 436 Lab 1
*Joseph Bolling, Evan Strasnick, Jacob Simon, Xin Yang Yak
*Force Sensing Alarm Clock
*/

int fsrAnalogPin = 0; // FSR is connected to analog 0
int buzzerAnalogPin = 3; // Buzzer is connected to analog 1

int fsrReading; // the analog reading from the FSR resistor divider
int fsrInitialRead; // the value of fsrReading when the alarm begins

int secondsLeft;
// PARAMETERS:
int releaseThreshold = -50;
int buzzerTone = 50; // default buzzer pitch

// -------------------------------------------------------------------
// SET THE TIME UNTIL ALARM HERE:
int secondsUntilWake = 5;
//
//--------------------------------------------------------------------
boolean alarmOn;

void setup(void) {
secondsLeft = secondsUntilWake;
alarmOn = false;
pinMode(buzzerAnalogPin, OUTPUT);
}

void loop(void) {
if (!alarmOn) {
secondsLeft--;
}
else {
while (pressureOn()) {
buzzOn();
}

buzzOff();
while(true);

}

if (secondsLeft == 0) {
markPressure();
alarmOn = true;
}

delay(1000);
}

void markPressure(void) {
fsrInitialRead = analogRead(fsrAnalogPin);
}

boolean pressureOn(void) {
if ((analogRead(fsrAnalogPin) - fsrInitialRead) <= releaseThreshold) {
return false;
}
else return true;
}

void buzzOn(void) {
analogWrite(buzzerAnalogPin, buzzerTone);
}

void buzzOff(void) {
analogWrite(buzzerAnalogPin, 0);
}

 

Assignment 2 – Xin Yang Yak

Observations

General Observations:

  • Many students already take out their laptops before lecture, but many students still don’t. Some classes don’t discourage/don’t allow laptops.
  • Getting into a seat is always a problem for students who are not that early to class.
  • Students commonly prepare to take notes before lecture begins.

Specific Observations:

  • Transit
    • Relatively uneventful, most people are just walking/cycling to class.
  • Early(5 – 10 mins before lecture):
    • (Networks 10am lecture) Some students were sipping a coffee and relaxing. Lecturer makes some small talk with TAs and students.
    • (GSS 201) Lecturer had some remarks about changes to the schedule before the class began, one student was observed to update her calendar. Some students were checking email, others were tweaking their schedule on SCORE, others were reviewing their notes from the previous lecture (on laptop or physical notebook).
    • (HCI) Only a few students had their laptops out. Many students were chatting. One student was observed to be reading technology-related news.
  • Mid(<5 mins before lecture):
    • (GSS 201) Almost all students had their laptops or notebooks out. Laptops and notebooks were balanced unwieldily on the small desks in McCosh seats. One student was folding her note-taking sheet vertically along a letter-sized paper to take her notes in two columns.
    • (HCI) Many but not all laptops were out. Students started to have some trouble finding seats that have a good view but do not have blocked entrances and are have elbow space. Students seated near the aisles of CS 104 started having to stand up and let people in.
    • (Algo) Some students took out printouts of the lecture slides uploaded beforehand, some students prepare to take notes on physical notebooks, most students don’t. Few laptops were out as the lecturer discouraged it.
  • End of lecture –
    • (GSS 201) Most students packed up and left, some students stayed behind for questions or administrative issues. A bit of small talk outside the lecture hall, but people quickly dispersed.
    • (HCI) Pockets of students started to hang out and chat along the aisles, students in the middle of the lecture hall took a while to get out.

Brainstorming
 Ideas:

  1. A way to secure your laptop to the small lecture hall desks and prevents it from falling off.
  2. A way to organize your notes for you before the lecture, based on timing and your class schedule
  3. A real-time piazza during lecture – student can indicate a query about a lecturer’s slides in real time.
  4. A quiz on content from the previous lecture, with an easy method to make quizzes for yourself and share with others.
  5. Location-based chatroom (same lecture same chatroom)
  6. Lecture room seat booking system so that you can always sit next to your friends
  7. Face recognizer (based on princeton profile and students enrolled in class), make it easier to find out more about the person sitting two seats from you and initiate conversation.
  8. A zipline to drop students into lecture hall seats
  9. Lecture hall seats that disappear/get out of the way when they are unused.
  10. Desks that are both lefty and righty friendly
  11. An visualizer that uses the heat map of the room to generate and display the perfect terrorist attack for maximum casualty in the lecture room, the best escape route, and who’s most and least likely to survive.
  12. Random trivia somewhat related to the class
  13. Virtual graffiti wall that every student in lecture can update and display on-screen in real time.
  14. A bouncing beach ball passed to the lecture hall that counts the number of times it has been bounced, and changes color when someone beats the record of bouncing it the highest.
  15. An FML for the class.

Ideas chosen for prototyping:

  1. A way to organize your notes for you before the lecture, based on timing and your class schedule.
    I choose this idea based on the observation that most students eventually begin to prepare to take notes during lecture, so solving this problem would not just save time but also make revision easier since all the notes are in one place.The prototypes are meant to simulate a screen on a laptop.
    proto1_home
    The home page for the user to select the class. The classes and times are populated based on the user’s course information.proto1_main
    Main screen that the user sees when the class is chosen. Two carousel elements that can slide horizontally for the user to browse different lectures and other course materials.
    proto1_lecture
    Once the user clicks on one of the lecture, the user can take notes in the margins of the lecture slides.
    proto1_note
    The user also gets to edit other text documents.
  2. A quiz on content from the previous lecture, with an easy interface to make quizzes for yourself and share with others.
    I like this one because it is somewhat entertaining, get students’ minds warmed up for lecture, gives lecturer/students a sense of how they are doing, and also provides a basis for discussion.proto2_all
    This prototype is also meant to simulate a laptop screen.proto2_home
    The home page. User gets to select class from dropdown menu, make their own quizzes, or take quizzes that other users have made.

    proto2_myquiz_filled
    This is a quiz that a user has previously made. The user can edit the questions on the quiz.

    proto2_myquiz_empty
    This screen is shown if the user has not made a quiz for a particular lecture yet.

    proto2_myquiz_typeselect
    The user can choose to add a True/False question, a Multiple choice question, or a short answer question…

    proto2_myquiz_tf
    A True/False question like this… (note the confirm button, which would be greyed out if the user has not entered a question yet).

    proto2_myquiz_shortanswer
    A short answer question like this…

    proto2_myquiz_edit
    Or a multiple choice question like this. Note the interactive “+” button, which would cause a new choice to appear.

    proto2_otherquiz
    User can also take a quiz that others have set. The user can look at the answer, but only if the user has attempted the question.

    proto2_otherquiz_wrong
    User can also check his/her own answer, and the page would respond with whether the user got it right.

User testing

I chose to perform user testing on the quiz sharing prototype.

Nick (PHY Junior):

proto2_nick
During user testing, the following was observed:

  • The purpose of the site is not immediately obvious. Need a help page to explain.
  • Need warning if no answer is chosen before user presses “check answer”
  • Greyed-out “confirm” buttons are sometimes confusing when no edits have been made
  • Requested functionality
    • Feedback for the quiz taker, including information such as how others are doing on the quizzes
  • Said that it is otherwise efficient, intuitive and simple.

Jana (MOL Freshman):

proto2_jana

  • Should have a way to provide summary stats for the quiz when the user is done taking the quiz.
  • Need to change error message (“Changes will be lost -> Previous answers will be deleted”)
  • Need short answer stub
  • Requested functionality
    • to see how everyone else performed on the quizzes
    • to see which quizzes you’ve already taken
    • to be able to see quizzes from past year
  • Said that she would use it only if other people already made good quizzes.
  • Found it easy and intuitive
  • Mentioned that the interface is also suitable for touch screens

Elaine (COS Junior):

proto2_elaine

  • Didn’t understand the meaning of “What lecture?” and “Intro” in the left column of the homepage – need to be more explicit that these are quizzes for different lectures. Would be better to rename them to “Lecture 1: Intro”, “Lecture 2: Link Layer”.
  • Not clear that tests that are already made (and are in “make test”) are not meant to be answered – In “Make Test” section, answers should be immediately revealed.
  • Feedback: “Not bad”

Assignment 2: Individual Design Exercise

Observations:

Aaron Glasserman, 1:30 pm Wednesday 2/20/13

I asked Aaron if I could walk with him to his 6-person Persian seminar and ask him a few questions about his experience. He told me he had to stop by Campus Club to print something. I asked him whether it was readings or homework, and he replied that he would have printed out readings ahead of time and that this was homework. I also asked how he picked Campus Club, and he said that he was walking by Campus anyway and if the printer there were broken, he could always go print in Frist. When we got to Campus Club, the cluster was crowded, but no one was actively printing pages. I asked at what point he would just go on to Frist, and he said if someone were printing pages when he got there, he would go to Frist instead. Aaron began to log on, and then turned to our friend who was already logged in to a cluster computer and asked if he could print using the friend’s login. He said that the cluster computers sometimes take annoyingly long to log in. In my experience, I mostly print things from the web, rather than my H drive, so I don’t need to log in to my account, just an account. In this situation, if there were a guest account that was always logged in and could be easily switched to, that would be much easier. As he was printing, he realized that he had left some notes to himself at the end of the assignment, so he had to delete those and then reprint. Homework printed!

Then, we headed to Witherspoon’s in Frist for a coffee.

“It’s a long seminar, so I’m going to treat myself to something nicer.”

Unfortunately, there was a long line! Aaron was debating going back to Tower for a coffee, but after watching the line for a moment, we saw that it was moving pretty quickly.

 I asked Aaron if there were any tasks he needed to do for class or wanted to do for fun that he’d like to do while walking between classes. He said that for Persian class, he has to pull vocabulary words from recent news headlines. Also, he likes to read the news. He mentioned that for Chinese language classes, a three-sided “flashcard” with english, pinyin, and characters would be cool.

Sean Power, 2:30 pm Wednesday 2/20/13

Sean was waiting for someone that he was going to walk to class with, but then it turned out his friend was in Frist and they would just meet at class. He said that usually it’s a coincidence if he walks to class with someone. He doesn’t have any readings to print out for this class, because he splits up the readings in a group. Before class, the person responsible for that week’s readings emails out a summary to the group. Sean doesn’t always have time to read the summary before class, so he sometimes reads it during the first few minutes of class. Sean helps run Orange Key, so he gets a lot of emails. He’s also obsessive about keeping his inbox clean. He has a hard time emailing while walking, because he can’t get enough words written. Instead, he usually texts the author of the email. Often he finds that he’s deleted or archived an email, and then forgotten to take care of what he needed to. He makes one to-do list on his phone for urgent things, and another on the Stickies app on his computer for medium-term things.

Alex Judge, 3:30 pm Wednesday 2/20/13

Alex was really bored between the end of his class at 3 pm and the start of precept for that class at 3:30 pm. When I met him at 3:15, he was moving a mouse randomly around his screen, trying to find some more fun way of procrastinating. He said that he usually comes to Tower between those two classes to read emails, surf the web, and check Facebook. He spent most of the time on Facebook chat or talking to friends. In order to get to class on time, Alex sets his watch fast. Although, we ended up getting to class about 2 mins late when Alex lost track of time.

Brainstorming

Collaborated with Phil Oasis, Aaron Glasserman, Paige Tsai, and Megan Karande

  1. 3-sided “flashcard” app (character drawing, pronunciation, english) for use before Chinese language classes with tone and drawn character recognition
  2. Guest accounts always logged in on cluster computers that would keep people from having to log in when all their files are on the web anyway
  3. Wait time measuring stations at print clusters, food places, etc that you could subscribe to on an app (like weather forecasts almost) and then prioritize where to go when
  4. Social walking app that uses your current location and calendar (for destinations), and communicates with the app on friends’ phones to coordinate walking together
  5. App that lets you reply to emails with texts, and loads them into the Gmail conversation
  6. Browser plugin that lets you move emails from your inbox to a to-do list, and helps you copy only the pertinent information
  7. Voice dictation hardware that is more stylish or makes talking to yourself more socially acceptable
  8. Interface that helps you procrastinate – when you stop giving the computer useful input (mouse clicks or keyboard commands), it starts serving you popular content
  9. Glasses that display text/media you’re trying to read overlaid on the real world so you can walk while checking your email
  10. Smart to-do list that orders items based on your estimate of how long it will take to do them, and your available time based on your calendar
  11. App that parses emails from the FreeFood listserv, and shows you the locations, time stamps, and food items
  12. Alarm for class that won’t stop until you begin walking, and are heading in the correct direction for class
  13. Sensor for when your Frist mailbox isn’t empty and texts you
  14. Mobile ordering system for the Tower lunch grill; lets you place orders while walking from class to Tower, and tells you expected wait time
  15. Portable clock projector that displays the time on the wall in classrooms without a clock; helps make sure class starts and ends on time

Two Favorite Ideas

Three-sided “flashcard”

My conversations with Aaron and other students of Chinese convinced me of how useful the character and pronunciation training would be and how the current solutions fall short.

Mobile Grill Ordering

Tower lunch has an open grill that gets overcrowded at the 12:20 pm rush – this app lets people see if they have time to get food between classes or put in an early order.

Paper Prototypes

Mobile Grill Ordering

Main Screen If you want to look at the menu, click the green Menu button. That takes you to the Menu Page. If you want to expand one of the panes there that isn’t shown, click on it. Then click on any grill item to order it. Ordering from the menu. To order from one of the blue items on the main screen (your most commonly ordered items), simply press it. Or, if you’re in the mood for a surprise, choose that! When you order any item from the menu or the main screen, you have the chance to put in Special Requests, which you type into the box shown. Once you hit okay, you have a chance to Confirm Your Order. At this point, the order is sent to the grill staff via a screen behind the bar (interface not designed). When your order is ready and the grill staff delete your order from their on-screen queue, you get a Notification from the grill app. If you’ve already ordered a smoothie today and you try to order another, or if you’ve ordered a food item and try to order another, this Popup shows. If you’ve got extra food or are still hungry, press the pink Share button on the main screen. Press and drag with your finger to scroll through the list of shared items. You can Post your food on the sharing board, and you can Choose whether you want to give up half of your item or the whole thing. The app posts the item that you previously ordered in the amount you specify. To pick up someone else’s shared item, simply click that item, then Confirm that you . The person who shared that item will get a Notification.

Chinese Language “Flashcards”

First, choose a Vocabulary List. Then, on the Start Page, drag the pin to the side of the flashcard that you want to be provided with (you’ll be tested on the rest). If you’ve previously worked on this list, you’ll have the option to Resume. Once you’ve chosen one of those options, you’ll be tested on the three sections that aren’t pinned. In this case, you start with English. Hit the Done button to check your answer. If you got it right, you’ll see the next testing page. If not, you’ll be told you were Incorrect, and you’ll be given the chance to see or hear the correct answer. Other testing modes are Speaking/Pronunciation and Character Drawing. In any of these testing screens, hit the pin to go back to the Start Page and choose a different side of the flashcard to be presented with. For example, display the Chinese Characters.

Feedback

Aaron Glasserman

At first, I thought Aaron understood moving the pin in order to select the front side of the card. Then he drug the pin over to pinyin, wrote the pinyin, drug the pin over to the character panel, and wrote the character. If this had been a real app, nothing would have happened when he tried to write/draw on the home screen.

He was confused by the speaker/microphone tab as well. He drug the pin to the speaker icon, and expected the app to pronounce the word. He then moved the pin to the microphone icon, and pronounced the word.

Also, he thought that the vocabulary list name was the front side of the card, so he wrote, drew, and said the pinyin, characters, and sounds for the word “family.” After testing was over, he said that most people learn characters by writing them over and over, so a “drill” function would be really useful. Regarding the word list, he said that I should make the text smaller or put it in parentheses to emphasize that it is not a flashcard.

Sam Zeluck

After working with Aaron, I added a prompt to the screen where users choose the “front” side of the flashcard. Sam had no problem with the screen after that. After she pressed the start button to begin the flashcards, she did need prompting before she typed the pinyin. Drawing the characters was more intuitive. The start button on the speak screen wasn’t obvious to her. She mentioned that since you don’t need the screen space for anything, that a prompt would be useful. She kept forgetting to press the Done button to move to the next “side” of the flashcard, so I just waited for her to remember each time.

She said that a card summary feature that displayed the english, pinyin, character, and spoke the word would be really useful. Also, Sam said that preloaded language packs for each chapter of a book that came with the language book would be a great addition. One of Sam’s friends in a summer language program had a flashcard app that she found very useful, and Sam liked the added ability to draw the character on the screen in my app.

Paige Tsai

Paige often stopped and asked for clarification or explanation of screens on the app. She said that popup prompts for most screens the first time a user opened the app would be a good addition. I found it difficult not to take the place of those prompts by giving instructions when she seemed stuck.

Paige requested several features:

  1. Ability to flip a card and look at the answer
  2. Ability to select which “reverse” sides of the card to be tested on, because some classes don’t require people to learn pinyin, for example

Insight

When making a paper prototype that will allow people to draw on the screen, find some way to make nothing happen when the user is in the wrong app state. In other words, if the user is drawing with a pen, have them draw what they would on another piece of paper, and then only transfer the drawing to the app screen if that actually would have happened.

Although the app components made from sticky notes did allow me to reuse pieces and move them around during the design process, they were not as effective during testing. I was inspired by the paper prototyping video we watched in class with the accordion fold pieces, scrolling, etc. However, it took to long to move the pieces around in response to the actions of the users. Next time, I will use only flashcards with each screen filled out completely in advance. Then, I’ll make many photocopies of each screen so that users can draw on the screens. Especially for a mobile app that users would use while walking/standing up, this makes more sense.

One possible way of adding only necessary prompts would be to take your almost-ready interface, show it to users, and wait until they need prompting or help. Then, add a prompt that pops up on the first several uses of the app that contains a minimal message communicating that same help. I personally dislike popup prompts, and I let that prejudice influence my design.

I didn’t think enough about the role of text size. The distinction between vocabulary list selection and front side of the flashcard wasn’t clear to my users. I think that fonts are not important in a paper prototype, but text size definitely is.

Through this process, I realized that “clever” interface tricks are not so clever. The pin for selecting the side of the flashcard that the user sees confused people. In the future, I’ll stick to more familiar paradigms.

Assignment 2 – Andrew Cheong

Observations

When examining the behavior of students between lecture, I focused during two times, the ten minute period prior to an 11 AM class on a Wednesday as well as a ten minute period prior to a 3 PM course on Thursday. Some of the behavior I noticed from the students include talking with friends, browsing the web, checking Facebook, eating a sandwich, looking for the bathroom, and reading sheet music. Of the people examined, the most common activity for an individual during this time period is talking with his/her friends.

Brainstorm:

  1. Alertness: Examine your alertness in your previous lecture. (provide recommendations)
  2. BrushUp – pulls from piazza, blackboard, etc different sources that the student might need for the upcoming lecture.
  3. Diary2Go – makes it easier to jot down a mini diary of what’s happening during your day
  4. Puzzler – provides small engaging puzzles to stretch the mind
  5. HealthChecker – provides health statistics based on that day’s steps walked, number of minutes sitting, etc.
  6. InTidbits – Pulls from your immediate problem sets that are due soon and spits out one problem for you.
  7. Time4Break – After pulling data from ICE, uses the distance to your next class and the nearest bathrooms and/or food locations to check if you have time for a break.
  8. Notes4You – records the previous lecture and pulls what it thinks as key parts of the lecture, then the user can engage with these notes accordingly.
  9. EnRoute – If friends sign up for this app, it checks to see if the route they are taking may intersect with yours.
  10. PeskyReminders – Constantly reminds you of upcoming psets, projects, exams, until you finish them
  11. VocabRefresher – Provides new words as well as quiz past words.
  12. Reviewer – go over past slides pertaining to the upcoming class and reviews you.
  13. CreationKit – Provides little origami/mini crafts/and cute projects to conduct.
  14. AggregateUpdate – Provides updates from different sources with accounts such as facebook, email, youtube, etc.
  15. MoodRecorder – provides few questions and maps your mood throughout the day.

The two ideas that will be prototyped are Alertness and MoodRecorder.

Falling asleep in class tends to be a problem for certain individuals and Alertness serves to help those who are unfortunate to learn what they missed during their lack of alertness.

I think MoodRecorder is interesting because to some sense, it is equivalent to a diary for the day but the data recorded is more rich because it keeps track of your mood rather than recording the different events that occur during the day.

Alertness:

P1070488

Here are two screens: left screen allows the user to enter the analysis screen. right screen is the analysis screen that provides a graph on the individual’s alertness in his/her previous class. Has buttons to allow closer analysis of the data as well as the option to save or go to home page.

P1070490

Left: this is the home page. Allows user to start a new log, view a past saved log, or examine the most recent log. Right: The list with past logs.

P1070491

Left: This shows the that the user’s condition was “alert” during this period. Right: This shows that the user’s condition was “not alert.” They have to option to hear segments of the lecture that he/she might have missed.

P1070492

Left: The form where user inputs data before saving. Right: Shows that the log has been saved.

P1070493

This screen shows that the app is running and recording the surrounding ambient data.

P1070494

This is the playback process. Users can check to hear what the missed during their “sub-alert” state.

MoodRecorder:

P1070495

User has two option to examine record of moods or record their current mood.

P1070497

While looking at the happiness tab, the user can examine their levels of happiness throughout the day.

P1070496

The user is able to toggle the bar to place an accurate depiction of their happiness, content, and concern levels. They can then record these values or examine past values.

 

Testing and Feedback: Arthur Phidd, Jamie Chong, Parth Parihar

Here are some photos to show how my users interacting with Alertness.P1070487

P1070479 P1070480 P1070481 P1070482 P1070483 P1070484 P1070485

Things I noted and insights generated:

  • The buttons under the diagram seem unclear
  • Users seems to click the actual diagram.
  • The save button captures too much attention during the analysis screen thus influencing the user to save before examining the data.
  • After saving a log, users tend to be lost for a bit and eventually click the home button. It would appear that they want to go back to the data. Providing an option back to analysis may be appropriate.
  • The user tends to mindlessly save whenever they have the chance. Maybe tamper with location or provide more awareness how much data might be stored with each save.
  • Users tend to get lost for a bit when they start a new log. I noticed that they seemed confused that it records immediately. It may be necessary to have an intermediate screen where the user can understand that the next press will begin the recording process.

Feedback:

  • The navigation of the app was relatively straightforward
  • There is more potential for the data that can be recorded and used
  • More contextual recording would be nice. Immediate recording for when you are not alert is too out of context.
  • Immediate recording can be hard to deal with and comprehend.
  • The ability to redirect to home for most screens made it easier to navigate the app.

 

 

Assignment 2 – Ed Kelley

Observations

  • Student 1
    • Location: Tower Coat Room
    • Student is watching a short YouTube video that was sent out on TowerTalk, the Tower listserve.
    • Other students nearby lean in to watch as well and discuss/joke about the video.
    • Video is being watched on a Macbook, which is packed away when the students head to class together.
  • Student 2
    • Location: Precept Room in McCormick
    • Student has pulled up the readings and notes on the readings assigned for class on her computer and is casually skimming over the material as other students come into the room for Precept
  • Student 3
    • Location: Lecture Hall in McCormick
    • Student is looking at Google News on his laptop and clicking through various news stories
    • Each page is looked at very briefly, just long enough to get a summary of what was happening

 

General Thoughts

  • 10 minutes is very little time. For classes that a reasonable close, it is just enough time to walk there. If classes are farther away, it is not enough.
    • Mobile is potentially most useful as it can be used while walking
    • Use existing hardware, particularly projectors in lecture halls
  • Are these 10 minute breaks worth “solving”? Most students I talked to don’t even consider the break between classes as “waiting” time since it is so short.
    • Should we be designing something for other, slightly longer gaps during the day?
      • Lunch
      • Slightly mismatched classes (e.g. end at 12:20, start at 1:00)
      • First class of the day
      • Evening classes
  • The 10 minute changing periods are a nice break from academic work. Maybe it would be best to focus on something entertaining, distracting, or productive in a non-academic sense.

Brainstorming

  1. Mobile app that shows the funny/interesting videos/pictures that everyone in your eating club is watching.
  2. Mobile app that shows you the highlights from the reading you did to prepare for class. Content either self-created or created by any member of the class.
  3. In lecture halls, show news blurbs or campus information/events on the projector. Would encourage students to get to lecture early and already be paying attention to the screen.
  4. A mobile app to place your order from the Tower grill. Quickly jot down what you want for lunch and when you will get there so the food will be waiting for you.
  5. A mobile app to measure the overal happiness/emotional state of the campus. While walking between classes, just quickly tap how you are feeling, allowing an aggregate measure of mental health to be built.
  6. An application that will ask you to quickly create a couple study questions from the last lecture/precept and ask you several questions created over the semester to help refresh your memory and reduce cramming for exams.
  7. An app that will track your movements between classes, building a campus wide map with best walking routes (and average travel times) between any two places on campus. Find the fastest way between two buildings. Especially helpful for freshmen.
  8. An app that will show the upcoming events held at the eating clubs, pass colors, opening times.
  9. Mobile app that shows you all the currently showing/upcoming shows and performances on campus and allows you to reserve tickets.
  10. An augmented reality app that shows you images of what campus looked like from your vantage point many years ago.
  11. An app that will show which friends are walking in the same direction as you are so that you can walk together.
  12. An app that shows you the recent results of the Princeton sports teams and upcoming home matches/games.
  13. An augmented reality app that turns walking around campus into an easter-egg style game. Try and collect items/artifacts “hidden” around campus.
  14. A multiplayer game projected on the lecture hall projector where students use their smartphones as controllers.
  15. An app that will show the discussion questions/topics of the next class, so students can start to think about them before arriving.

Favorite Ideas

  • An augmented reality app that shows you images of what campus looked like from your vantage point many years ago.
    • Allowing Princeton students to get a glimpse into the past would help remind them of the history of this campus and all those who came before them.
  • A mobile app to place your order from the Tower grill. Quickly jot down what you want for lunch and when you will get there so the food will be waiting for you.
    • Using an app to order food would greatly speed up the time it takes to get food, which is currently up to 30 minutes using the paper system.

Prototypes

Historical Campus Augmented Reality App

First, a database of old images with their associated locations, view directions, and years would need to be created. Then, when walking through campus, students (or visitors) could pull up the augmented reality app. Using their current position and heading information, the app can show a timeline of images from very close to that location. The user can essentially look back and time when holding up their phone to the present day campus.

This slideshow requires JavaScript.

Tower Grill

Every weekday, Tower has a full-service grill with a very large menu. The current system for ordering involves writing on a slip of paper and placing the paper in a bowl. Although very straightforward, the current system results in long waits for food as the kitchen cannot anticipate the orders. With this application, members will be able to choose the item they want, add special instructions, and set a lunch time, meaning there will be very little wait for food.

This slideshow requires JavaScript.

User Testing

I took the paper prototype of the lunch ordering app to Tower and tested it with a few different members.

This slideshow requires JavaScript.

  • Feedback
    • There is no “Back” button on several of the pages, leaving the user stranded.
    • “See menu” is confusing. One of the users tried to order from the static menu page.
    • There should be a “Cancel” button on the order page.
    • Login should only occur once (like Dropbox, Facebook, etc..)
    • The grill menu is not static but has daily specials as well.
    • There should be a notification when the order is ready.
    • Users would like a way to gage how busy lunch is. Get an estimation of order time.
    • The ability to track the progress of the order (received, started, completed) would be nice
  • Insights
    • Users were very excited about the prospect of this app potentially being built.
    • This app would solve a daily frustration for most members of Tower.
    • The app should not just be a form submission, but rather a process that follows the order from submission through delivery.
    • This system could be beneficial to the kitchen staff as well, since it allows them to start prepping food earlier, prevents the 12:00pm rush, and could provide analytics about food consumption/favorite items/etc…
    • Users expect a certain design structure (e.g. they were looking in the top-left corner for a back button)

 

 

 

Assignment 2

Observations

I observed COS 333 and ECO 332 about five minutes before class started. In both
classes, my professors showed up early (earlier than I show up, presumably to
set up projectors, etc). In COS 333, Prof. Kernighan always arrives early and p
lays music. In both classes, ith less than a third of the class arrived, almost
no one talks to each other; rather, most people are on facebook/reddit/various
social media, checking email, doing homework, or texting. As more people arrived, some
students began to strike up conversation. It seems to be a fairly even
split between students doing work and entertaining themselves; however, there
were surprisingly few people talking with each other, especially among the earlier
students. These are large classes, and students tend to just interact with
those they already know.

  • Student 1 arrived early to ECO 332, generally arrives early to all classes. She finds someone she knows to talk with.
  • Student 2 arrived right before class started, checked email, and continued to check email through class. She usually checks email and/or facebook if she arrives early.
  • Student 3 arrived a bit late to class, due to having to walk across campus from a previous class.

Ideas

1. A shared music playlist that anyone in the class can add to.
2. Class-wide chatroom
3. Simple quiz questions to refresh students’ memories before class starts.
4. Course-relevant news (which both students and teachers can add to) with comments and ‘like’ capability
5. Q&A (about anything) with professor
6. Random seat assignments, get to know your new neighbors.
7. Site for collaborative doodling
8. Stalker app — provides facial recognition (to names) for students and teachers.
9. Location and time-specific weather (is it raining outsides? snowing?) with finer granularity than city, morning/afternoon/evening.
10. Course-related question/answer (anyone can ask, anyone can answer)
11. Selection of interesting current research in the subject area.
12. Group poll for planning meals/study breaks/etc (similar to generalized doodle pool)

Prototypes

I chose to prototype 1 and 4: 1 since I’ve been in a couple classes where the professor sets up early and plays music until class is to begin, and it’s had a good response; 4 since the content is course-relevant and interesting.

1: shared playlist

4: aggregation of course-relevant news, papers

User Testing

Testing with idea 1:

Insight

Overall, the interface was fairly intuitive — once they knew what the goal of the application was. It’s not entirely clear from the mock up that the application is for playing songs (as opposed to buying them, for example), or that it is a shared playlist. The immediate reaction seems to be to try to interact with the currently playing song or the songs in the playlist (as those take up the majority of the space of the app), which I hadn’t planned for. Once they got to the ‘add’ button, though, searching for a new song and adding it to the playlist seemed to be straightforward. There were concerns raised that given at most a 10 minute wait, such an application wouldn’t scale for classes with a large number of students, since the playlist could dwarf the wait time. I then suggested voting on the songs to order the playlist (which I hadn’t thought of previously), which was received favorably as a potential solution. Users liked the idea, were generally able to navigate through though the purpose of the application should be more clear, and provided some valuable insights to improve the application.

Friend Map App

Erica Portnoy (eportnoy) Assignment 2

1. A description of how you conducted your observation (who, where, when). Notes and insights from observations / contextual interviews.
I conducted my observations between 11:50am and 12pm in and near Frist 302, and between 1:20pm and 1:30pm on Monday, February 18 in Aaron Burr Hall. I observed students staying after lecture to ask the professor questions about logistics and content. Preceptors for a class were discussing ideas that they had during the lecture to bring up during this week’s precept. Community auditors left the lecture hall slowly, discussing plans for lunch and where they were parked. The professor mentioned that he had to go back to his office for a lunch meeting. One student without a class immediately after stayed in the lecture hall, checking his email. He mentioned that he was in fact finished with classes for the day. Outside of Frist, two students when questioned responded that they were not in fact heading to the same place, but had just come from the same class and were walking together for social purposes. Various students walking alone mentioned that they were currently desiring food or planning the rest of their day. One student was checking her email on a public computer. Many students waited on a long line to acquire coffee. Professors co-teaching a class arrived at the classroom early to prepare for the class. One student who had arrived early was doing reading for a class later in the week. Another student was sending emails. One student was eating food. One student observed me doing these observations, for her class in human-computer interface technology. Another student was actively concentrating on twiddling his thumbs. One student arrived out of breath while running into the classroom late.

2. Full list of ideas you brainstormed. Express your ideas as “headlines,” explaining the main concept in less than one line. For this brainstorm, you can work with as many people as you want (inside or outside the class). So their contribution is acknowledged, list their names. You have to complete the remaining steps individually.
Some ideas were inspired by conversations with Dillon Reisman, Valya Barboy, and Bonnie Eisenman.

  1. Healthy snack food stations or food trucks or other easily available food, with locations shown on a map
  2. Nearest free food plotted on a map
  3. After class finishes, automatically open a videoconference into the classroom accessible by students in the class, so that students who must rush off to their next class can still ask the professor questions
  4. A system that rearranges room locations after the enrollment period has ended, to decrease the time it takes to walk from one class to the next
  5. App that calculates and displays optimal route from class to class.
  6. A waterproof alarm or clock for inside the shower, so that you will not be late to class because you could not check the time
  7. An application that uses your friends’ schedules (available on ICE) to show you a map of their current and next locations, so you can meet up with them to walk from class to class
  8. App for coordinating meals with friends
  9. Collaborative music-playing devices embedded in seats in a lecture, with the center seats having a higher volume effect to encourage people to move into the middle
  10. For those professors who still require paper versions of assignments, place a printer inside every room and have an app to print to a certain room
  11. Allow students to print to printers without releasing the papers in person so they can pick it up while running past
  12. Lighted book gloves for reading on the long trek to the E-quad for a night lab.
  13. Electronic maps by the entrance to a building marking which stalls are in use in which bathrooms
  14. Social puppy locating app; tap to inform others of puppies around campus, look at a map to locate them while rushing to class
  15. An app that makes the phone make a sound in a phone call at a certain time so you know to end a phone call immediately (helpful for parent conversations)
  16. Collaborative playlists playing inside of lecture halls
  17. App that senses proximity to objects like a car’s backup sensor for when you’re reading while walking
  18. App that looks at distance to dining hall and crowded level based on prox swipes

3. One sentence each explaining why you chose the two ideas you did for prototyping.
3. I chose the professor videoconference based on observations of people annoyed that they couldn’t ask the professor something, based on observations of a lack of consistent ability to talk to the professor after class, and because it is screen-based and implementable.
7. I chose the friend schedule map app because it is feasible, useful, and based on the social interactions I observed and received interview information for students walking from class to class.

4. Photos & descriptions of your prototypes
This is the prototype for the professor videoconference. It is similar to a skype system, except that users’ classes are automatically added on the backend to allow them to enter a class’ video discussion. The user has a login screen, a class list screen, and taps a class’ name to enter the class’ video chat. If it is not available, the class will be dimmed out on the class list screen.

Class choice and video display screens.

This is the friend schedule map app. A user logs in and is shown a home screen. From this home screen, the user can logout or move to the map or add friend screens. On the add friend screen, the user can choose whether or not to show a friend on the map. Also, they can search for people by name or netid to add friends. On the map screen, the user is shown a color-coded list of friends.

Original prototype of the friend schedule map app.

Final prototype of the friend schedule map app.

5. Photos & descriptions and detailed notes from user testing

User 1: Valya Barboy
touched map on the x → created popup screen
“so they’re moving from here to here is what’s happening”
“it’s an app that lets you see where your friends are and where they’re going so if you want to meet up with them for a reason or something you can find them.”
“I’m assuming it’s bidirectional.”

Valya touches the gold x, a user action that I had not anticipated…

…so I improvised further information that appears in a modal dialog.

User 2: Silken Jones
both users tapped the gold x, then knew to touch outside to get rid of the modal dialogue
touch entire name to remove or add check
“tells you where your friends are going according to their schedule”
“you can add friends if you want.”
“almost expected a dashed line to show up between the from and to.”

Silken searched for and added a friend.

Silken adds her friend.

User 3: Mireille

“this is an app on a phone” “ohhh, ok!”
“is that like telling me like where they are?”
“so this is the only person that isn’t added, so I’ll add them – cool!”
I should have an are you sure you want to log out
“I don’t understand what it means by from and to”
<drew dotted lines connecting from and to>
seem to need to touch the x to figure it out
told her we’re in between classes
“how do they know?”
<added from ICE to add friends screen>
gasp of oh!!
“if you want to accidentally run into someone on the way to class, this is the app to do it with.”
“or if you wanted to avoid someone on the way to class.”

6. List of insights from testing

  • It is not immediately clear to users where the data is coming from. Indicating “from ICE” on the “Add friends” screen seemed to help people understand. An “about” or “how does this work” page might also be useful.
  • I should probably also add a popup to confirm logging out of the system.
  • I would definitely need to try out even more variations of the map screen, to indicate what I mean by “from” and “to.” I tried out connecting the from and to markers with a dotted line, but other variations may work even better.
  • When a person tapped one of the dots and was given more information about a friend (a feature that was added on the fly based on observed user interactions), they seemed to immediately understand what the dots meant.

Assignment 2

Part 1: Observing

In order to conduct my inquiry into the behavior of students before class, I performed a mix of passive observation – i.e., simply watching students before class, and noting the actions they performed and their apparent motivations – and active contextual inquiry; that is, interviewing students to try to get a sense for what it would be like to be in their shoes. By watching first, I was able to get a general sense for the general kinds of activities students seemed to perform most often. I then conducted three focused interviews, informed by the task-oriented knowledge I’d gained.

1. Interview: I conducted my first interview with a student whom I had observed playing a game on her iPhone. Talking to her, I learned that she was playing the popular game Temple Run, saying that she found it so addictive that she found herself playing it whenever she had a short break or waiting period conducive to playing a phone game. She told me that she had arrived early to ensure that she got a good seat for the lecture, but that otherwise she had no reason to be in the classroom before the start of lecture, and felt that she had nothing better to do than to play Temple Run. I let her get back to her game, and observed that she was quite disengaged from the activity going on around her (other students coming in, etc.)

Design Opportunity: Many, if not most, students, seek out entertainment while waiting before class. Often they do this in a solitary, non-academically-inclined way: playing videogames, browsing their favorite subreddits and microblogs, etc. Perhaps there’s a way to entertain students while bringing them back to the classroom, engaging them with each other and with the academic content of the course? It seems like a shame that the students – all of whom are bright and have a common knowledge of and interest in the course – don’t collaborate in a meaningful way to entertain themselves during this time. Entertainment value is key, though: students would resent being required to participate in an activity before class; and a boring, voluntary activity could never compete with Temple Run.

2. Interview:  I had observed my second “victim” reading what looked like a pdf of something on his MacBook. I asked him about the reading – it turned out it was course-reading for a completely unrelated class – and he mentioned that he often tries to read between classes, particularly when he gets behind on his work. However, whenever he tries to read before lectures he is much less productive than he could otherwise be, because the environment is so distracting. This, he mentioned, is a source of frustration for him; he wishes everyone would just be quiet, though he knows that’s not realistic.

Design Opportunity: Some students want to use the lecture hall as a space to study before class starts. However, with people coming, going, and talking amongst themselves, the lecture hall at this time is a busy, loud, distracting environment that is not conducive to productivity. Similar to interview 1, I wondered if the students could in some way be brought together to engage in something academic. Perhaps students would be willing to cooperate in some kind of collective studying or problem-solving process? This could turn the lecture hall from a studying-hostile to a studying-friendly environment, and might – again – help reinforce students’ understanding of the material. I asked the subject about this, and he stressed the importance of it being voluntary: students are busy enough just getting between classes, and would resent the extra burden.

3. Interview: My third and final subject appeared to be carrying out a rather extended conversation with a friend over text-messages. This conversation lasted for several minutes; for this reason, it seemed to me to be a distinct kind of activity from the aimless browsing or e-mail checking a student like Subject 1 might do instead of playing a game. This was, more than anything, a social interaction. When I spoke with him, he mentioned that he and his friend were continuing a conversation they’d had before. He said that it’s hard to resist the urge to continue these kinds of digital social interactions, even during class, though (as he acknowledged) this is rude toward the professor. For him, the urge was more about having a conversation – being continuously socially engaged – than about the particular person he was conversing with; he mentioned that he might have started a text-message-based conversation with a different friend if he weren’t already in one.

Design Opportunity: The students that do reach out and communicate with others, ironically, often do so in a way that isolates them from the others in the room, and from the in-person social opportunities present during the time before the start of lecture. Perhaps there is a way to harness this social drive – the urge for a conversation and real-time communication – in an academically productive way, that does not interfere with the room as a place to study as well.

From these three interviews, the problem (or, at least, potential problem) of isolation appeared to be a trend. Students appeared to value pursuing solitary activities – gaming, reading, or texting, in these cases – to engaging with others in the room. This seems like a waste; the group setting provides many untapped opportunities for fruitful (and, in some cases, academically valuable) interactions.


Part 2: Brainstorming

For this part, I collaborated with Clay Whetung ’13, Peter Grabowski ’13, and Andrew Callahan ’13. We came up with the following ideas:

  1. Interactive quiz show on lecture material beforehand, just for fun.
  2. Correct answers win prizes?
  3. Correct answers load funny pictures/memes/pictures of cute animals
  4. Soothing and/or energetic audio-video patterns to get you in the mood for lecture
  5. Survey about what you want to see in the lecture (or future lectures)
  6. Slideshow of interesting topics in news or inspirational videos
  7. Guided meditation
  8. Organized, guided back massages
  9. Summary of previous course content
  10. Physical art supplies, so the class can create a communal piece of art
  11. Digital doodle-board (similarly, to create a communal piece of art)
  12. Digital collaborative music that’s easy to make – like this.
  13. Parallelizable puzzles/challenges/problems for people to solve together
  14. Collaborative game for all to play
  15. Anonymously ask and vote on questions for the lecturer to answer
  16. Aggregate websites that people are looking at and show popular articles
  17. 10 minute lesson series (potentially related to course material, or not at all).

Part 3: Selecting my favorites

First, I chose Idea 14, above (course-related games students can play while they wait), since it can potentially satisfy the needs of Subject 1 (a well-designed game could provide an engaging, challenging distraction for those who want it) and Subject 2 (since the game could tie into the course material.)

Second, I picked Idea 15 – (a way for students to submit questions) because it seemed like a powerful, real-time way for students to communicate about and collaborate around the course material, making it potentially appealing to socially-oriented students such as Subject 3 and more academically-focused students like Subject 2.


4. Rapid Prototyping

1. GameClicker! (Idea 14)

Inspired by the iClickers given to students in some introductory science labs, I decided to give each user of the system a clicker-like device, but one optimized for gaming. It also has small seven-segment LED screens for displaying your score, as well as the entire class’s score for cooperative games. The buttons on the device are labeled “A”, “B”, “C”, and “D”, making the device usable as a convenient replacement for a traditional clicker as well (i.e., students submitting answers to multiple-choice questions on the board).

In addition to the clicker-controller, I also prototyped out an example game. It is a cooperative game that can be played by the entire class, using their clicker joysticks. The goal is to guide the person on the screen to the correct answer to the multiple-choice question shown, while avoiding enemies. The character moves according to the average of all the players’ inputs, making it a truly collaborative activity (and, to an extent, an exercise in group problem-solving!)

Here are some photos of this prototype (I used 3×5 index cards):

Allows students to play games and answer questions using a joystick and buttons. Roughly actual size; real device could probably be a bit smaller.

Allows students to play games and answer questions using a joystick and buttons. Roughly actual size; real device could probably be a bit smaller.

A game where the class works together to guide the character (smiley face) away from the bad guys (frowny faces) and towards the correct answer (n log(n)). Not actual size! This would be projected on the board for all students to see.

A game where the class works together to guide the character (smiley face) away from the bad guys (frowny faces) and towards the correct answer (n log(n)).
Not actual size! This would be projected on the board for all students to see.


2. Live Class Forum (Idea 15)

This product consists of two main parts – again, one that goes in the user’s hand (in this case, a smartphone app), and another that is projected onto the board. Live Class Forum enables a group of people gathered in a space to ask and answer questions in real time, with an emphasis on the in-person aspects of the situation. Used in a lecture hall before the start of lecture, it allows students to submit questions for everyone to view. Students can attempt to answer each other’s questions, as well as vote (up or down) on those that they think are the most interesting or important.

The professor also has access to this discussion, and can participate either by answering students’ questions directly within the system, or by designating some questions as “Professor’s Picks” that will be answered at the start of lecture. Having real-time access to the students’ inquiries can help professors tailor their classes toward what material the students are most interested in, and what material is most in need of review or re-explanation.

Here are some pictures of this prototype (again, I used 3×5 index cards):

(1) Main Screen
The screen that shows up when users first open the app – and also the screen that gets projected onto the board for everyone to see. Students using devices can scroll to see the questions others have asked, and the top reply for each question. The screen also shows each question’s upvotes and downvotes.
Clicking on a “+” or “-” upvotes or downvotes, respectively, the question or reply they are next to. Clicking on a question will focus the question (screen 2). Clicking a “reply” link will take the user to the compose-reply screen (screen 3). Finally, clicking “new question” will take the user to the compose-question screen (screen 4).

(2) Focusing on a Question
Students can scroll to see all the replies for their chosen question (not just the top one reply, as on the main screen). They can up-vote or down-vote the question and each of its replies, as well as writing a reply of their own by clicking a reply link (which will bring them to screen 3). Clicking the “All ?s” link returns the user to the main screen (screen 1).

 

(3) Compose a Reply On this screen, students can use an on-screen keyboard (not shown) to enter a reply to the question shown above. They can choose to post or post anonymously, which will add their reply to the thread with or without their name attached, and bring them back to the screen "focusing" on their original question (screen 2). Clicking "To Thread" at the top will also return to this "focus" screen, but without making a post. Clicking "All ?s" at the top returns users to screen 1.

(3) Compose a Reply
On this screen, students can use an on-screen keyboard (not shown) to enter a reply to the question shown above. They can choose to post or post anonymously, which will add their reply to the thread with or without their name attached, and bring them back to the screen “focusing” on their original question (screen 2). Clicking “To Thread” at the top will also return to this “focus” screen, but without making a post.
Clicking “All ?s” at the top returns users to screen 1.

Students on this page can enter a new question (using an onscreen keyboard, not shown). The page displays the user’s name. The user can click on “Post”, or “Post Anonymously”, to submit the question and return to the main screen (1). Users can also return to the main screen (without submitting) by clicking “All ?s” at the top.


5. Rapid Feedback

To get feedback, I chose to use the Live Class Forum because, of the two, it seemed like the better-defined idea, as well as the idea more easily captured by paper prototypes and Wizard-of-Oz style simulation.

1. Bonnie Eisenman ’14

This was my first test, so it was a little rough around the edges. Bonnie’s main suggestion for improvement was to make better use of the mobile UI libraries and “look-and-feel” that Android, iOS, and similar provide (for instance, overlays that slide on top of the main window for the compose screens), because this would make the application look more polished and behave in a way mobile users expect. She also pointed out that the main screen was somewhat cluttered, and that it wasn’t especially clear which regions were clickable (for instance, tapping on a question in the main screen takes you to a different screen; tapping on a question on the “focused question” screen does nothing).

Some photos:

Testing with BO

Testing “Create a Reply” with Bonnie

Testing

Testing the main screen -> create a reply workflow with Bonnie

2. Max Botstein ’14

Max had no issues with the interface itself – other than that it was a bit tight and cluttered, but not much more so than most mobile UIs that only have a small screen to work with. However, he pointed out that the question-and-answer format that this product sets up – in which the questions are factual in nature and have a clear “best” answer – tends to work better in “hard” scientific or quantitative classes than in the humanities or social sciences. As a history major, Max couldn’t picture any of the professors in his department using this product, though he does think it could work better in a department like COS. Like Bonnie and Valya, he was somewhat caught off guard by the lack of clear instructions, but figured out the gist of things pretty quickly.

Some photos:

Testing the reply screen with Max

 

Testing the focus screen -> reply workflow with Max

3. Valya Barboy ’15

Valya’s main comment was that the main screen was too confusing, and needed to be simplified – perhaps by removing or hiding the reply, up-vote, and down-vote buttons on the main screen, and leaving them on only the “focused” screen. She also was not convinced that students would use the product even if the UI were improved – she said that it seemed too unnatural and inorganic, and that inertia would draw students to doing whatever they normally do between classes, because there are seldom questions to be asked that are so compelling students will break out of their usual routines to write or vote on them.

Some photos:

Testing the “all threads” button from the “focused” screen with Valya

Wizard-of-Oz simulations can be challenging! Here I'm fumbling with the cards while testing on Valya

Wizard-of-Oz simulations can be challenging! Here I’m fumbling with the cards while testing on Valya

 


6. Insights/Conclusion

  • Even when you think you understand the potential user, you probably still don’t, especially if you’ve spent only a comparatively small amount of time getting to know them. I thought I was designing a product that would appeal to students interested in deepening their knowledge of the course material, but in the the appeal was not as strongly compelling as I had thought it would be.
  • When designing for a device or UI form factor that already exists (e.g., desktop, mobile, facebook app, …), be aware of the UI conventions that exist and follow them. A source of confusion for the users I tested on was the fact that my product differed from how typical mobile applications work, in terms of transitions between screens, title bars, and text inputs.
  • Make extra sure you’re not making implicit assumptions about your user. Two of the lectures I went to to observe (as well as most of the lectures I attend in my day-to-day life) were COS lectures; as a result, my thinking about what a typical Princeton lecture looks like was excessively influenced by what a typical Princeton COS lecture looks like. This caused me to make unconscious assumptions about who I was designing for, and I ended up designing a product that might not find many uses outside of COS classrooms.
  • It’s impossible to avoid having a learning curve for your product, but it’s important to understand why the curve exists in your particular case. Simply giving my prototype to the users to experiment with without any explanation was immensely helpful – it was a form of brutal honesty that revealed many of the un-intuitive features of my UI, such as the clutter on the main screen making it difficult to navigate, and the ambiguity in the presentation of question-and-response threads (such as only the top answer for each question being presented on the main page.)

In conclusion, if I were to continue to iterate on and revise this product, I would first reduce the clutter on the main screen; in particular, I would remove the reply and upvote/downvote buttons, keeping them only on the “focused on a thread” screen. I would also retool this thread-focus screen, to make it more clear exactly how it fits into the main screen’s big-picture view of the questions (perhaps by using overlays or other fancy mobile UI elements). I might also consider more fundamental redesigns of the product’s functionality and interface – after all, this is still the early stage of the design process where many different ideas can be explored without too much cost.

This was definitely a humbling experience. I knew that getting UIs right was difficult, but I wasn’t expecting to my interface to have so many flaws, in spite of the fact that I tried to take my users’ specific needs and situation into account. This assignment really demonstrated to me the importance of prototyping, testing, iterating, and failing fast in UI design.

HCI A2

OBSERVATIONS

I conducted two sets of observations. The first was a preliminary test, to see how the prototypes would work and practice my observation/testing techniques. The test was conducted at Terrace in the evening with Olivia, a senior EEB major. I believed a senior would be most likely to understand the potential value of the system, after many years of classes. EEB was a good major to test with, as there’s a range of question types, from memorization based to conceptual and mathematical. Finally, I chose Terrace because it provided a more casual environment, allowing us to take the time we needed (especially for me to practice my technique) without any rush.

Here are the observations I made, along with direct quotes from Olivia:

DIRECT QUOTES

  • “I thought the interface was intuitive”
  • “Why does it have to be on a phone instead of a computer? why not make it either or, like you can access blackboard either on a computer or a phone?”
  • “Maybe you could link it with blackboard and have it send you an email update of how many points you have (3-4x/semester)”
  • “Make rewards more frequent — maybe once before midterm, once before final”
  • Can you have an interface where you can participate in it, but you won’t be scored for class. Can you save the questions for later, to help you study?
  • “I like the projector idea, more engaging”
  • “What about kids who don’t bring laptops or phones to class?”
  • “Strive to answer a certain number of questions, then base reward on percent correct with minimum number to answer in the first place. This would equalize it if people can’t make every class”
  • “Offer students a chance to opt-in/opt-out at beginning a year. Some people might not be able to show up on time (class right before is far away). “
  • “I like that it’s not extra credit for the class — more fair. $10 to Starbucks is good — everyone likes Starbucks”
  • “I like phone/laptop interface — a dedicated device would get stolen too fast”
Olivia uses one of the projector cards as a phone. Next time, I should make it more clear

Olivia uses one of the projector cards as a phone. Next time, I should make it more clear

Olivia is engaging with the  asked question

Olivia is engaging with the asked question

OBSERVATIONS:

  • Immediately knew how to interact with phone/touch based interface. Big, easy to read buttons were good
  • Could accurately guess what each button would do on the screen. Having only few buttons made things simple
  • Tried to hold the “projector” cards as if they were a phone — next time, make it more clear that projector cards are up on the screen
  • Seemed to appreciate the idea, and recognize the potential for making better use of the time between classes

The second set of observations was with a group of Freshman before a NEU 259 lecture (11 am) in Robertson Auditorium. I tried to find a group with a wide variety of intended majors, including EEB, COS, and ENG, to see how the system would be perceived by people with different academic interests. I was glad to also be able to find another EEB major, to be able to compare their responses with Olivia’s. I met with Katie, Allister, and Amanda. The practice observation session paid off, as I was able to move through the real observation quickly, making the best use of the limited amount of time between classes. Again, I recorded direct quotes as well as my own observations

DIRECT QUOTES

  • “I liked the idea of it being a question that I might be able to get a better question to in lecture”
  • “Only having 15 seconds might make me more stressed than it would be helpful”
  • “I’m ambivalent about being compared to other people in the class — that could make me feel really stupid, or that other people are really smart, or that I’m ahead of other people because they haven’t been playing — I just don’t know”
  • “I don’t like it as a mandatory thing that I have to do”
  • “I suppose it’s alright that it’s competitive, because it might be a good metric of how I’m doing in the class”
  • “Definitely have score anonymous”
  • “What about extra credit — but some people can’t be here early, so maybe not?”
  • “Ten seconds is too little time”

OBSERVATIONS

  • Was visibly stressed when she couldn’t figure out the question in 10 seconds (even though the clock wasn’t actually counting down)
  • Younger students were more focused on their score being anonymous and whether they might get class credit. Older student (Olivia) was more focused on sharing feedback with professor, to get more out of lecture
  • Seemed to be still rooted in high school class mentality — asked why didn’t we just ask the professor, instead of designing a big interface for it.
  • Enjoyed the competitive nature of it — had “mock” competition of how quickly they could respond. Perhaps it could be good to play up the fun/competitive side of it?
Amanda immediately understand how to interact with the device

Amanda immediately understand how to interact with the device

Amanda and Allister begin to become a little competitive

Amanda and Allister begin to become a little competitive

Katie is visibly stressed by the time limit

Katie is visibly stressed by the time limit

Katie immediately understands how to use the prototype

Katie immediately understands how to use the prototype

Katie considers the question

Katie considers the question

BRAINSTORMING — worked with Clay Whetung, Andrew Callahan, Mario Alvarez

  1. Soothing and/or energetic patterns to get you in the mood for lecture
  2. Collaborative game for all to play
  3. Survey about what you want to see in the lecture
  4. Slideshow of interesting topics in news or inspirational videos related to the topic of the class (presumably curated by the professor).
  5. Guided meditation to relax people before class
  6. Organized back massages. Odd rows give massages to even rows, then the reverse.
  7. Summary of previous content in lecture
  8. Physical art supplies, and the class together creates a communal piece of art
  9. Digital doodle-board — let people draw together
  10. Digital collaborative music – something like .http://www.earslap.com/projectslab/otomata
  11. Parallelizable puzzles/challenges/problems for people to solve together. Multiple choice or free-form, and people in class vote for answer. Precepts compete against each other
  12. Anonymously ask questions for the lecturer to answer, Piazza-style. Vote on questions you especially want answered
  13. Aggregate websites that people are looking at (voluntarily, of course). Like this, you can see what everyone’s looking at and potentially provoke discussion
  14. 10 minute lesson series (potentially related to course material, or not at all). Could be student taught or prof taught. Consider 10 minute html, 10 minute css, 10 minute knitting, etc
  15. Performance of lecture relevant material — consider a music course, where many students are in the orchestra. One (or more) of the students could play a piece before class that would then be discussed in lecture
  16. Interactive quiz show on lecture material beforehand. Correct answers win extra fun
    1. Correct answers win starbucks gift card
    2. Correct answers load kidbleach.com (cute pictures)

TOP TWO IDEAS

  1. Interactive quiz show on lecture material beforehand. Correct answers win extra fun
    1. Potentially win Starbucks gift card — good to solve sleep problem
    2. Potentially load kidbleach.com (cute animals) — who doesn’t love cats
    3. iPhone/laptop based — people are already engaging extensively with their iPhones/laptop
    4. Allows people to review their notes on previous lectures in a guided and fun fashion
    5. Gives feedback to professor on what needs to be covered
  2. Anonymously ask questions for the lecturer to answer, Piazza-style. Vote on questions you especially want answered
    1. Professors will like it — allows them to focus their lecture
    2. iPhone/laptop based — people are already engaging extensively with their iPhones/laptop
    3. Allows people to ask a question that comes up while they’re reviewing their notes

1 — This idea incentivizes people to come to class early, but doesn’t penalize those who can’t, and allows people to engage with their mobile devices while reviewing their notes in a fun way.

2 — This idea is less fun but still provides valuable feedback to the professor and allows people to use their laptops/mobile devices, which are likely already ready to go

PROTOTYPES

FIRST IDEA

Simple home screen. Users can pick to either ask a question or browse trending questions

Simple home screen. Users can pick to either ask a question or browse trending questions

On this screen, users can ask a question. Similar questions are displayed below (stack overflow style) to cut down on redundant questions

On this screen, users can ask a question. Similar questions are displayed below (stack overflow style) to cut down on redundant questions

The user's submission is acknowledged, and they're given the option of what to do next

The user’s submission is acknowledged, and they’re given the option of what to do next

Here, the user can browse existing questions and answers, as well as upvote or downvote them

Here, the user can browse existing questions and answers, as well as upvote or downvote them

The professor's customized display, which shows the top questions for the upcoming lecture

The professor’s customized display, which shows the top questions for the upcoming lecture

 

SECOND IDEA

Users can log in using their NetID

Users can log in using their NetID

Users see this image on both the projector and their phone in between rounds

Users see this image on both the projector and their phone in between rounds

The question is displayed on both the phone and the projector, with a real time count down clock

The question is displayed on both the phone and the projector, with a real time count down clock

After students submit an answer, they can see if they were correct, and have an opportunity to flag the question as "silly" or "confusing", for later followup with the professor

After students submit an answer, they can see if they were correct, and have an opportunity to flag the question as “silly” or “confusing”, for later followup with the professor

Users see this image on both the projector and their phone in between rounds

Users see this image on both the projector and their phone in between rounds

At the end of the semester, users can see how they did overall. The top score is announced, and wins a prize

At the end of the semester, users can see how they did overall. The top score is announced, and wins a prize

 

INSIGHTS

  • Users of all ages and majors seemed to like the mobile interface, and immediately understood how to use it. Olivia made the good point that many people don’t have smartphones, and a laptop based interface might also be appreciated
  • Competition is fun. People like to compete with each other, and enjoy it. This should be leveraged in future iterations
  • Privacy matters, even if situations where you think it shouldn’t. People were worried about other people seeing their score, and either being jealous of a high score, or thinking badly of them for a low score
  • Age matters, even on a small scale (4 years). Freshman were more worried about privacy and their score, while seniors were focused on how it could improve lecture quality. Freshmen tended to become more stressed about the time, while seniors didn’t care
  • Age can influence privacy concerns. The freshman I spoke with were significantly more focused on privacy concerns than the seniors.
  • Having a small number of big, clearly labelled buttons was very well received. No one had any trouble predicting what the buttons would do, or predicting how a given task would be accomplished. No screens were ambiguous

 

 

 

 

 

 

Assignment 2 – Prerna Ramachandra

To conduct my observations, I spent a lot of time between class observing what people did. Initially, I chose to observe and talk to people in the same classes as me but who I did not know very well – Byrd Pinkerton and Kirsten Parratt in ENG 339: Jane Austen in Context; Patience Haggin and Saahil Madge in HIS 310: Imagined Languages; Stephanie He and Sebastian Gold in COS 340: Reasoning About Computation.

I found that when people had time between class, they usually answered emails, checked the day’s lunch menu or read through the notes from the previous lecture for that class to refresh their memories.

I also interviewed acquaintances and friends to ask them what they did between classes – Izzy Kasdin, Alex Kasdin, Dillon Reisman, Erica Portnoy, Bonnie Eisenman, Mengyi Xu, Michelle Yakubisin, Ballard Metcalfe, James Bedell and Alexander Patton.

For people who were running between classes in 10 minutes, their biggest concern was being late and missing the beginning of lecture which sometimes lead them to miss important assignment information or even the base of the lecture which was hard to catch up on.

People also complained about not being able to find resources such as printers, water fountains, bathrooms, etc. in time when they had class in an unfamiliar building.

Many people merely spent time playing games on their computers or relaxing between class and said it would be fun to have more recreational games before class to rejuvenate.

I came up with the following list of ideas based on the observations I made and conversations I had.

List of Ideas

  1. Legos in the classroom – fun way to keep people engaged before class (add sensors to prevent students from taking them)
  2. Magazines and newspapers in or right outside the classrooms
  3. OnMyWay: Wirelessly transcribing the first 10 minutes of lecture to your phones so you don’t miss the beginning if you’re running late
  4. Outline Transmitter: Transmitting lecture outlines to the phones before class so students can skim through them
  5. Campus wide puzzle challenge: Form teams within your class to solve a semester-wide puzzle challenge in which clues are scattered around the classroom right before the class starts
  6. Video monitoring for students who have experiments running in the lab – video feed sent live to phones so they can keep track right until class begins
  7. FindIt: Compilation of locations of students necessities such as printers, water fountains, bathrooms and prox hotspots so students know where to look before class
  8. Email Filter: App which filters only the most important emails which must be answered urgently so students don’t have to sift through tons of emails finding the ones which must be answered before class
  9. Mood-based music filtering: App which selects the right music for you as you walk to class depending on your mood – happy, sad, want to workout/ race walk, etc.
  10. QuickSnack: Snack trucks or coffee bars right outside or near classroom for a quick hunger fix or coffee boost
  11. Audio feed summary of the previous lecture for the class you can listen to before the next one so it is fresh in your mind
  12. MoodCheck : App which posts your mood – happy, sad, stressed, etc. so your friends can see it; you can check friends’ moods and offer to chat, hang out, small gift to cheer them up if they’re sad
  13. LunchMenu: App which consolidates menus from various dining halls/ eating clubs for the day’s lunch so you can pick where to eat when walking from class to class
  14. Day Progress Report: List of tasks you need to finish for the day, and how you’re keeping up, i.e. personalized day tracker to check before class.
  15. Daily Calorie Intake: What did you eat (pick from d-hall menus), how many calories, track physical activity including walking, etc
  16. TechTracker: An app which lets students who are the first to enter the class send a complaint regarding technology in classrooms which does not function.
  17. Sustainability Check: An app which informs students of all the empty classrooms in which lights are on giving students near those classes to walk in and turn them off.
  18. Best Paths: An app which optimizes your path to class and gives you the best routes by foot and by bike (taking rain/ cold weather into account).

The two ideas I chose to prototype are:

1. OnMyWay: Wirelessly transcribing the first 10 minutes of lecture to your phones so you don’t miss the beginning if you’re running late

I chose this idea because many students, especially freshmen engineers have back to back classes and invariably miss the first five or so minutes of lecture and find it hard to catch up. They also miss important homework information which professors talk about in the beginning of lecture. An app which relays this information to them while they are walking would be very useful with a simple UI.

2. FindIt: Compilation of locations of students necessities such as printers, water fountains, bathrooms and prox hotspots so students know where to look before class

I feel this is an important problem because students generally use time between classes for tasks such as filling their water bottles, printing things for class, going to the bathroom, etc. but don’t find the amenities required because of being in an unfamiliar building or part of the building. An app which helps them find these things is simple to design and very useful.

Prototypes

1. On My Way!

omw1

1. Opening screen which lets you select the class for which you are late

omw2

2. Second screen which displays the time and relays a message saying it is waiting for the class to begin before transcripting

omw3

3. Transcript of lecture begins when lecture starts, can be viewed while walking to class

omw4

4. Transcript stops 10 minutes after lecture begins – enough time to get to class

2. FindIt!

f1

1. Opening screen – option to select building manually or use GPS location

f2

Optional second screen (only if user chooses to select building manually) to choose from list of buildings

f3

3. Screen to choose item being searched for

f4

4. Screen specifying floor location of said item in the building

f5

5. Tap on each floor for further info about location or look in a nearby building

User Testing

I decided to user test the prototype for Find It!

I decided that students who test my prototype would not be Computer Science students and those interested in interface design since I believe they would not give me a completely accurate picture of the regular user. Emily Wibberley, Izzy Kasdin and Temple Douglas tested my prototype, and here are the pictures from user testing:

Emily Wibberley

IMG_1880

1. Decides she does not want to use the GPS

IMG_1881

2. Trying to figure out how the building selector works

IMG_1882

3. Selects the Friend Center!

IMG_1883

4. Looking for a water fountain

Izzy Kasdin

IMG_1884

1. Decides not to use the GPS

IMG_1885

2. In the Friend Center

IMG_1887

3. Looking for a water fountain

IMG_1888

4. Found the location! But…how to get more info?

Temple Douglas

IMG_1889

1. Decides to use the GPS

IMG_1890

2. App finds that she is in the Friend Center. Chooses to find a water fountain

IMG_1891

3. Gives the floor location…but how to get more info?

IMG_1893

4. Decides to find a fountain in a nearby building instead

Observations and Conclusions from User Testing

The initial screens seemed to be a simple enough interface for testers to figure out, especially when they manually selected the building. However, those who used a GPS locator said it would be nice to have a confirmation screen asking them if they were actually in the location it found out, which would be useful if they were outside or near a certain building.

I also observed that none of the users tried to find more information about the location after the floor locations had been displayed. They were tired of clicking through too many screens, and hence it taught me a lot about simplifying the interface so necessary information is quickly and clearly displayed. Thus, I feel having the detailed location displayed next to the floor location is a better interface than waiting for the users to tap on the floor locations for more info.

One of the users also said that having a ‘nearby buildings’ options might only be necessary if the required item is not available in the building the user is in, or is hard to find (eg. the bathrooms in McCosh are extremely hard to locate). This lessens the amount of text on the screen and prevents too much confusion.

Overall, I got positive feedback about the usefulness of the app, and users testing the prototype said they would definitely use it. The functionality is simple and some minor tweaks in UI will improve usability. I am happy with the reception of the app and gained some valuable insights from user testing.