In this project you will create an interface for pedestrians in Chicago. The concept (and the conceit) here is that the city of Chicago and the Chicago Transit Authority decide to install large touch-screen panels on the streets outside every major El stop in the city to help people navigate around the city sucessfully and replace the current model of "if you don't know where you are, then you shouldn't be here."

The goal here is to work through the process of creating a user interface fhat 'regular people' can use sucessfully.

The display is a large touch-screen display

• 40" diagonal (plasma or LCD)
• resolution of 1024x768 (so we can show it in class using the projector, though realistically it should be higher resolution)
• portrait or landscape mode (your choice)
• it has a cover to block direct sunlight, snow, and water
• it is pressure sensitive so it does not need direct skin contact to work (good for winter)
• the computer driving it is modern with a good graphics card
• it has bluetooth/802.11 to talk to other devices the user might have on-hand
• it has an unbelievably tough surface to survive Chicago winters and summers and vandalism

My expectation here is not that you will produce something that looks as good as a professional graphic designer, but that you will apply the basic rules of visual design to design an effective interface to communicate with the user.

This project has two phases:

1. the sketch phase
2. the implementation phase

You will be working in groups. Due to the class size, the group size will be 2 or 3 people. The goal is to have at most 12 groups. You will need to choose your team and email me the members by 2/9, or I will randomly assign people teams. The requirements remain the same no matter how many people are in the group.

Here is a link with some good hints on sucessfully working in groups. You might also find some good ideas in Chapter 3 of the Schneiderman textbook.

This project has two major due dates: one for the sketches, one for the implementation. Both are due at the beginning of class on the due date.

Sketch phase - in this phase your team will choose a local Chicago area El stop exit and tell me which one you want to pick as soon as possible through email, at the latest by 2/14,  e.g. Red Line Stop exit at Jackson and State. I need to approve your choice. At most one group will be able to work with the same exit and if two groups ask for the same one, then the arrival time of the email in my mailbox determines the winner. So please do not wait until the last minute to choose, or you may find your choice has already been taken. Each chosen stop must be at least one block away from the nearest already chosen stop, i.e. the red line stop at Jackson/State can be chosen as well as the blue line stop at Jackson/Dearborn, but only one of the Jackson/State exits can be chosen.

The chosen El stop also must have:
        a major attraction within 4 blocks
        at least 4 places to eat/drink within 2 blocks

If possible, pick a place that you are familiar with or that is near a site that interests you. 

Then your group needs to collect information. Some information can be found on-line but the group should also visit the site and take some photographs and note down what things (shops, museums, theatres, tall buildings with skydecks on top, etc) are in the area.

The final interface you create should have the following features:

• support for multiple languages
• should allow user to choose from at least 10 languages
• need to implement English and one other language
• swedish chef or klingon are acceptable as the second language if your team does not have a member that is fluent in another language        
• where am I? what is this corner      
• simple compass
• ability to call for fire or police in an emergency  
• ability for the display to tell you about any current emergencies
• ability to call for a cab
• El train schedule information for this station
• if there are multiple train lines here then you only need to show one in detail but the user should be able to select any of them
• local area map
• showing detail of what is in the next 2 blocks (or 1/4 mile, whichever is larger) in each direction
• street numbers for the streets
• larger lower detail map showing where this area is in the city
• information on where this El line goes   
• local restaurants, businesses, city offices within 2 blocks
• major attractions/museums/theatres within 4 blocks (or 1/2 mile whichever is larger) in every direction  
• people should be able to bring up more information on the local establishments:
• restaurants (menu with prices, hours, phone number to call for reservations)
• theatres (what is currently showing at what times and at what ticket prices)
• museums (hours, ticket prices, phone number, and current attractions)
• city offices (hours, phone number)
• You should try to use real data for this, but if that's not possible for the restaurants then you can substitute a real menu from a different restaurant
• current events in the area and big events in the city going on today/this week.
• you can pick 'today' to be the day the assignment is due or pick a day of your choice for the 'current events'
• since this system is expensive the city will probably want to sell ad-space using either banners or the corners of the display
• some kind of screensaver mode highlighting major events in the city
  

Its important to think of this system from the point of view of the person who is going to use it. This person has just come out of the El, or is just about to go in, or is just walking around the streets. What information are they most likely to need and how can they get to it easily.

This person might be a native, or a visitor. You should support both. Depending on the area that you chose there may be more students, or more business people, or more tourists, so you should take that into account when you design your interface. Who are the most common users? Who is there during the week? Who is there on week-ends? Who is there during the day? at night?

Here is also a nice link on suggestions for the design of public access terminals.

There will be several different ways to accomplish this task, so one major feature of the sketch phase is to for your group to create and evaluate multiple designs. I think the easiest way to do this is to have each of the three members of the group design a version of the interface completely on his/her own and then bring these three designs together in a meeting and create your final (4th) proposed design that you will implement. All three designs must be significantly different. The idea here is to get many ideas out and on the table so you don't converge on a sub-optimal solution too early. With multiple independent starting points it is more likely that you will see options that you didn't initially think of.

Each design should be composed of sketches showing each of the screens that the user will be confronted with and text explaining what this screen shows, and what the user can do at this screen. I would expect there to be at least 20 pages per design. I would prefer that the designs are done on a computer, but if you draw _neatly_ making use of a ruler then that is also acceptable. Anything that remotely looks like it was done at the last minute and scribbled on a set of pages torn out of a notebook will get no credit.

In this phase you should turn in the following in a folder:

• information on who is in your team
• photocopies of the information you have collected on the area (CTA schedule, restaurtant menus, screendumps from google maps, photos you have taken, notes on who the people are that walk through this area, etc)
• photocopies of the 20+ pages (each) that describe each of the three initial designs
• photocopy of the 20+ pages that describe your 4th and final design

Members of the audience get points for asking good questions or making good comments about the interface presented. Each group can ask at most one question or comment per presentation. When asking a question or making a comment the groupmember should identify their group - this is like in a press conference when the reporter says what paper he/she works for.

Three groups will present each day for four days. Each group will also get together and type a one page critique of each of the two other projects presented on their day.  The goal here, again, is to see different possible design alternatives and to get new ideas to improve your own design and implementation. As such the goal of the question and answer session is not to pick on people and rip their design apart, but rather to give constructive criticism on how to improve the design. The goal is for everyone to come up with a really good interface for the given problem.

The critiques are currently available at ftp.evl.uic.edu/pub/INcoming/andy/422

MODIFIED REQUIREMENT - by 3/30 I would like each group to create a web page showing the final design (several screens) that you plan to implement - including revisions based on the comments from the class.This replaces the 1 page response to the critiques from the other groups, so instead of writing about your response to the critiques, you will show me what your response is.

Implementation phase - in this phase you will implement your interface. You should make use of the techniques discussed in class as well as the feedback from the sketch phase to come up with a good solution. You can use a language of your choice, as long as you can demonstrate it in class, and I will be able to run your interface on the CS linux machines or the public ACCC windows machines on the 2nd floor of SEL.

Your sketches from the first phase should allow you to divide up the work in the implementation phase, but I highly advise that the entire group hold regular meetings to look at the current state of the entire integrated interface. Trying to put components together at the last minute is a really bad idea. It would also be a good idea to test your intermediate versions out on your friends, parents, or other novice computer users to see if it actually 'works.' Having first time users talk aloud about what they are thinking when confronted with your interface and a given task (ie find a given restaurant) can be extreemly helpful in giving your assumptions a reality check.

In this phase you should turn in the following:

• a web page showing a series of screen shots, highlighting all of the features of your interface, with descriptive text and a link to the source code.
• an executable version of the interface
• email with the names of the members of your group and the link to the web page

Any code, images, or other elements borrowed from others must be cited clearly in the interface itself and in the documentation.