Prototype 1
Prototype 2 (Substantially Different Screenshots from Prototype 1)
Prototype 3 (Substantially Different Screenshots from Prototype 2)
One of the big problems teaching assistants of programming courses have is communicating with their students on the internet. There have been features such as the MSN Messenger’s Whiteboard, but they have proven to be unstable and inefficient in serving as a robust communication tool between the two groups. In this project, we explored and designed user interface prototypes that would seem intuitive and easy-to-understand in exchanging ideas for the users. We have focused on teaching assistants and students of an introductory programming course.
The overall process consisted of two main parts. First, user studies were run
to learn about people exchanging ideas on and offline (more details in the following section). Then, based on the information found in several user studies, an iterative design was done on prototype designs. These prototypes were used in the following user studies to make further improvements.
Demographics: Undergraduate students with various levels of programming knowledge participated in the user studies.
In total, 12 people participated in the user studies. Each user study session consisted of two participants, one with a semester or more experience in programming and the other with no more than one semester of experience in programming. In the beginning of each session, both participants were given several topics in introductory programming and were asked to discuss those topics in person. This gave me a chance to observe what two participants found most intuitive and easiest when discussings. Then they were asked to discuss more topics using an online instant messaging application. This gave me a chance to observe how two people would communicate online and also the possible obstacles when doing so. Then each participant asked to answer a paper questionnaire that will ask about their experience from the online instant messaging application. Lastly, the participants wereasked to use several paper and/or software prototypes and talk about the prototypes.
a. Exchanging Ideas in Person:
In this part of the study, a participant with more programming experience was asked to teach one or more programming concepts in person to the other participant, whose programming experience was minimal. The reason being this was to see what would be the most intuitive way for people to accomplish this task, since tutoring in person has proved to be more efficient in the past than online tutoring.For all the participants, talking was the main method of communication, and they used paper and diagrams to supplement what they were teaching. Out of the concept covered (arrays, binary search tree, and linked lists), all the symbols used were simple geometrical figures already provided by the existing paint program or keyboard input; e.g. rectangle figure, “[ ]” figure, and so on. Some participants also wrote pseudo-code or simple examples to bring their explanation to a more concrete level, rather than describing everything at an abstract level using simple diagrams. Giving a pseudo-code or example definitely seemed to help the other participant learn better, and it showed when the other participant was asked to explained the concept that was just taught to him/her.
b. Exchanging Ideas Online using MSN Messenger:
In this part of the study, a participant with more programming experience was asked to teach one or more programming concepts using an instant messaging application to the other participant, whose programming experience was minimal. I chose to use MSN Messenger for this part of the study as the instant messaging application, because it had a richer set of features compared to AOL Instant Messenger and a big user population. During the study I allowed the participants to take advantage of any feature available in MSN Messenger and Tablet PCs.One of the big problems found here was that voice conversation feature wasn’t as apparent to the users as it should have been. All the participants were everyday MSN Messenger users, and only two participants knew about the voice conversation feature. So except that group, all other participants used text conversation as their main method of communication. When I told them about the voice conversation feature after their study, all of them said they would use voice conversation instead of text conversation, because it seemed the most natural to them.
All participants either used the pen input feature in chatting box or the whiteboard feature along with their text or voice conversation. Each feature had its pros and cons. Some participants preferred pen input in chatting box because it wouldn’t break the flow the chat conversation. But they didn’t like the fact that the input wasn't visible until the sender presses enter of “send” button, and they found it annoying that they couldn’t make annotations/mark-ups/correction to their own or the other person’s previous pen input message. On the other hand, other participants used the whiteboard feature because everything was being displayed almost real-time (each component displayed after every stroke). Also, the whiteboard gave them a very simple features to make annotations, mark-ups, corrections, and/or changes to previous posts. One disadvantage was that participants had to constantly switch between the whiteboard screen and the chatting box (if it was being used). Another usability problem participants found with the whiteboard was that there were scroll bars. So if one participant wrote something, the other participant might not see it unless they scroll over to the right area.
Prototype 1
Prototype 2 (Substantially Different Screenshots from Prototype 1)
Prototype 3 (Substantially Different Screenshots from Prototype 2)
The final prototype turned out to be more collaborative environment focused than existing instant messaging programs. While the most apparent mode of communication is the whiteboard, which is visible to all users in the current session, there are other ways of communication such as voice and a private chatbox with one or more users. A big feature is the "Replay" feature that will allow the user to play back what went out throughout the current session. This seemed useful, because it gave users (usually students) the ability to review an idea or a concept explained by another student or one of the staff members. The user can have multiple pages open by using the page tabs at the bottom row of the screen.
This semester, the project focused primarily on the user interface design. In the future, I am hoping to run more user studies for an another round of refinement, and begin on a fully functional demo afterwards.