Designing a calendar for school

Question

Problem: Develop an easy to use school calendar for web + print.
Prerequisites:

1. School has several teachers. Currently 7 but grows. 
2. Each teacher can have multiple groups (average 1-5).  
3. Each group contains multiple students. (average 3-8).  
4. Groups usually have no meaningful name at this point. (Name = names of students).  
5. Currently 4 classrooms available. (Will grow approximately +3 per year)  
6. Teachers can teach the course outside of the classrooms on client’s site.   
7. There are ~10-30 classes during the day.

Calendar should have the following abilities:
1. Add, Edit, Delete existing event. (Assign group, timeframe, recurrence).
2. Add recurring event.
3. You can add as many classes for the same timeframe as you want, but only 4 classes(= number of classrooms) can be held in classrooms. Everything else must be a “client’s site” class. (Should be easily identifiable).

Standard empty calendar looks like this:

Current ideas:

1. Assign a color to each teacher. This way we can easily distinguish
on the calendar grid what teachers are going to teach what.  
2. Add views “Per teacher” and “Per student”. This way we can show only filtered data. I think this is a good approach, since “Show
all” is going to cluttered. (Although we still need “Show all”).  
3. Only allow view by week and by day. I do not see any reason to view this calendar on a monthly basis.  
4. Show “client’s site” classes as semitransparant.  
5. Show details of the appointment on hover.

Again, I don’t think that my ideas are close to the right answer, but maybe there are some calendar design guidelines? Or some smart approach that will make things look nice?
Current ideas will fail on print, especially in black and white. (Maybe use pattern filling for print?).

One more idea is to rotate calendar, so the times are on X axis, while days are on Y axis.

I will appreciate your input.

I was thinking that my color code calendar will look something like this(Rough): but It will become cluttered very fast, I think.

Answer 1

I think part of the problem is that you are trying to cram three dimensions of data (Day, Time, Teacher/Classroom) into two dimensions of the view.

The way around this is to only show two dimensions per view.

So for example, you can show:

1. All teachers and their assigned classes for a single day, or:
2. All classes for a single teacher for the whole week

So the daily and weekly views could look like this:

^{download bmml source – Wireframes created with Balsamiq Mockups}

Clicking in an empty slot on the calendar area would start a new "appointment" a la Google Calendar. It would be pre-populated with (for example) the teacher who you were currently viewing.

One last comment: The combo-box to select who/what you are looking at in the weekly view can be laid out like a mega drop-down:

^{download bmml source}

This keeps the "Teachers/Students/Rooms" selection order consistent across daily and weekly views.

EDIT:

To account for a large number of students (as per comment below) I have updated the weekly view slightly. On clicking one of the "Teachers/Students/Rooms" buttons, a select field with search box displays:

^{download bmml source}

Answer 2

Do you need your calendar to show all data at the same time?

I can imagine a solution where you can select what aspect of the planning you'd like to view, and you center your view based on that.

So, if you choose that you want to view the classroom use, you will see the calendar with either a row or a column per class room, and the time on the other axis so you can quickly spot gaps or worse, overlaps in the use. If you want to view the teachers schedules, you do the same, only you put the teachers at the spots where the classrooms used to be. The same goes for student groups.

I assume that a student is only in a single group? If so, then you don't need to worry too much about a view per student, as long as you can quickly match a student to a group.