Assignment: Redesign Malmö University course catalog
Time: 3 days

Process document

Our main focus was the idea of the desktop metaphor in the website, namely the drag-n-drop function. In this way we thought that the user, who uses the function from working in the computer environment, would recognize the system and therefore the tasks could be executed in a fairly easy way. The system works with relations and metatags to rpovide the visitor with alternate, perhaps even new, direction for the higher studies.

We wrote three different user scenarios to find a proper user focus of the site, meaning how three different users would behave using the same website?

Initial sketches of relation based navigation

Initial feature list

In the left field of the website we added a field which was filled with different keywords, for example: interaction design, art, programming, faculties etc. The keywords are based on two things: one is that the university wants to present not so “popular” courses and programs and the second is that it is based on previous users. So when the user is visiting the site she can see new keywords as soon as another user browses for a keyword because they are updated frequently. The thought here is that the user finds keywords that she wasn’t looking for at all and maybe becomes interested and wants to know more about it.

Sketch of "magnet" based navigation trail. Later discarded

The intention is that the user will drag a keyword to the centerfield and the information of the keyword is presented. For example if the user chooses the word interaction design all the courses and programs concerning interaction design is presented.

Sketch first screen for navigation. Later discarded

The next step for the user is to drag one of the “bubbles” centered above the information now presented. There are three different “bubbles” containing the words faculties, courses and programs. If the user drags the “courses bubble” to the information field only interaction design courses will be left on the screen. Of course if the user knows from the beginning what she is looking for there is a search function available.

After this the user picks out which course in interaction design she wants to read more about and drags the course name down to the bottom field and there the details of the course is presented. When the user wants to read about another course the user simply drags a new course name to the bottom field.

Initial sketch of concept of shopping cart. The user can only add a certain amount any type of course

On the top of the screen there is a dynamic shopping cart where the user drags the specific course or program that she wants to apply to. In this way the user can keep track of the different selections she have made and at the same time see how many credits she has gathered and for how log she will study. The users choices is presented in a “time-line” that is “intelligent” to the extent that if the user puts the course interaction design 21-40 credits it automatically picks the course interaction design 1-20 credits. If the user has already taken the first course she can delete it in the “check-out”.

Paper mockup and screen based mockup

Project members:

Fredrik Johnsson (fredrik dot johnsson at interactiondesign dot nu)

Daniel Karlsson (nickvanorten at hotmail dot com)

Pietro Desiato (pietro dot desiato at fastwebnet dot it)