1. ESM Interface Re-Design HCI Undergraduate Project Team Bei Yang Derek Parham Wenyao Ho

2. Our Goals Identify the needs of different broadcast users (i.e. novice, advanced) Redesign the broadcasting process to incorporate the needs of those users Design a new broadcaster interface to match those needs

3. What the users wanted We questioned a number of users and created user profiles based on the information. We created different Intents and Expectations that Novice and Advanced users would have.

4. Basic Users IntentExpectations Setting up a broadcast “I want to broadcast my video easily and as quickly as possible (or now!).” Communicating the broadcast to others “I want to tell my family and friends about this video that I am broadcasting (through phone, email or IM).” Monitoring broadcasting “I want to see if everyone can view the video successfully.”

5. Advanced Users IntentExpectations Setting up a broadcast “I would want to set the video/audio output options.” “I want to set my video to be broadcasted every hour.” Communicating the broadcast to others “I want to advertise (on posters, billboards, television, radio, Internet, etc) this event that will occur next Saturday at 3pm.” Monitoring broadcasting “I want to view statistics (e.g. number connections, QoS, etc) about the people tuning in.”

6. Our first concepts We started out by creating a ‘ticket’ metaphor: The ESM config file was called a ‘ticket’, like you get at the movie theater You could e-mail tickets to friends You could e-mail tickets to friends You could put the ticket on a webpage You could put the ticket on a webpage From the broadcaster, you would ‘publish’ tickets after setting up a broadcast. The ticket file was generated The ticket file was generated The user would be responsible for sending the files out (e-mail or webpage), or they could be put on the ESM main server. The user would be responsible for sending the files out (e-mail or webpage), or they could be put on the ESM main server.

7. Basic user The basic user had a step by step wizard to configure the broadcast. These windows were sequential and only basic settings could be set

8. Basic user - Publishing The ‘Publish’ screen gave options to the user to either: Publish through ESM Publish through E-mail Publish to other site Export File

9. Advanced user The Advanced interface used a MDI interface so multiple events could be viewed Configuration could be done fast and easily using tabs in each of the windows

10. Basic + Advanced Connections screen When an event was broadcasting, a connections screen is shown, which lists details like how many people are watching, and allows the user to start/stop the video

11. Progress After user testing, we found that users did not understand the ‘ticket’ metaphor easily Users did not understand what exactly happened when they published an event, or what their responsibilities were There was a large gap between Basic and Advanced users where two different interfaces were used.

12. New Overall Interface We wanted one interface that both could be used by Basic as well as Advanced users. The Basic interface would allow easy setups with few clicks, and very little technical knowledge. The Advanced interface allows for complex tasks and configuration of every variable.

13. Changes - Publishing Instead of publishing, we changed it to ‘Invitations’ An invitation is now a text message containing a URL that links to the ESM config file, This link can be placed in e-mails, AIM msgs, websites, posters This link can be placed in e-mails, AIM msgs, websites, posters The link can point to the host (broadcaster) or to the ESM website

14. Changes – MDI to Multiple Windows with Tabs Instead of using MDI, we change it so that each event is a separate window. Instead of having 2 types of windows for Basic or Advanced interface, both are accessible by tabs at the top

15. Changes – Streamlined Advanced options Instead of using tabs to access different settings pages, we now use a list. The clicking list brings up the config panel to the right of it This allows for a simple view of the options with out congesting the top of the window

16. Putting it all together We have created a prototype from all the research we have done. Event Manager was created to be the Main ESM Interface It is used by both the viewer and the broadcaster. It is used by both the viewer and the broadcaster.

17. Event Manager It displays upcoming events (to view, or to broadcast) Allows anyone to start a broadcast. Clicking on the button pops up a new window…

18. New Broadcast Screen

19. Starting Screen

20. Event Setup

21. Video Source

22. Scheduling

23. Publicizing

24. Invitations

25. Advanced Summary

26. Quick and easy setup

27. Broadcast Screen Lastly, we have the Broadcast screen. All users (Basic and Advanced) will see this When the broadcast starts. Users can see statistics, Start the video, or change Options on the fly.

28. From here on… We are going to perform user test for the next few weeks to see how well users are able to perform using this interface. Specific tasks will be given and users will ‘talk aloud’ while they are performing them. We will be looking for areas where users get confused, tripped up, or make a mistake.