This project aims to bring some of the affordances of consumer social networks to teaching and learning, and will deliver applications within CamTools, our Sakai-based VLE. This is an informal blog by the project team at CARET, University of Cambridge.

Sunday 17 May 2009

And so the design phase came to an end

Lets again summarise what we’ve done during the last months…

Creating extreme designs using personas and requirements
We focused on the concepts and requirements which we thought would be most useful and used those to brainstorm and think of ‘extreme’ designs.
This means we were using these extreme ideas to turn them into metaphors which were much easier to use during the design.
E.g. The metaphore or extreme idea of ‘ballroom dancing’ explained the idea that people sometimes spend time together during a project (so dancing together for a while), after a while they split up and work with someone else (splitting up during a dance and start dancing with someone else in the ballroom).


Extreme ideas turned into metaphors and clustered in groups which seemed to have commonalities











User testing session 1 using paper prototypes
At the end of the research phase we ended up with 3 personas. For each of those personas we created a set of frames (representing the pages within a system) so we ended up with 3 main concepts.
These frames are paper prototypes. This makes sure people will give us more honest feedback (and won’t say things like ‘Hmm, I don’t like the colour of that button’ because they’ll see it’s drawn and not finished at all). We wouldn't be focusing on that kind of detailed feedback yet anyway.
We recruited a set of people again, representing all the different people within the university (subject, age, role, etc). Whilst showing them the paper prototypes during this user testing session, we also used a set of questions so we were sure we kept focus on the right things. The location was in a usability lab, having a one-way mirror where the observers took notes on the other side of the mirror. This feedback would than be used to refine the concept.

Green concept: focusing on Isobel who’s really sociable, and outgoing. Therefore the frames of this concept focus on the extreme idea of ‘events-going out’ as this is very important to Isobel.


Green concept paper prototypes
- homepage -












Blue concept: Focusing on Peter who sometimes feels a bit lost. He doesn’t always know what to do first because he’s not always talking to the right people either. Therefore the frames of this concept show the idea of the ‘boardgame’: representing a set of steps you need to fulfil in order to reach your goal.
E.g. In order to fulfil this course, you need to go to this talk, finish this paper etc.


Blue concept paper prototypes
- homepage-












Red concept: Focusing on Kate who’s senior and just wants to save time in any possible way. This set of frames shows the extreme idea of ‘the switchboard’ which makes is possible for Kate just to see the things she’s interested in, not overwhelming her with things which just waste her time.


Red concept paper prototypes
- homepage-














Refine concept using feedback from user testing session 1
We did some brainstorming and used all the feedback from user testing session 1 to merge all the screens and thoughts from the first set of screens into 1 set of screens, representing all the refinements and usable ideas.


Example of a page which got all the feedback merged together

















Oszkar redesigning

















User testing session 2 using clickable wireframes
This phase was very similar to the first user testing session, which means it was again in the same usability room, with an observer who noted down the feedback. The difference this time was that we used clickable wireframes instead of paper prototypes. This was 1 set of frames instead of 3 because these were merged together. Further, we used again a questionnaire which guided us through the set of tasks.


clickable wire frames
- homepage -












Refine concept using feedback from user testing session 2
We used the feedback to again refine the last version of the frames.














Documents
In the text above, you can find the documents we used during the design phase which might give you a better understanding of the information above.
In case you missed out on them, you can also find them below.

User testing session 1 using paper prototypes
> General information about the concepts - This gives a general description what's meant with each of the concepts
> Green concept - This is the full set of paper prototype frames used within this concept - mainly focusing on Isobel
> Blue concept - This is the full set of paper prototype frames used within this concept - mainly focusing on Peter
> Red concept - This is the full set of paper prototype frames used within this concept - mainly focusing on Kate
> User testing guide during session 1 - This is the set of questions which we used as a guidance during the user testing session.

User testing session 2 using clickable wire frames
> Clickable wire frames - This is the full set of wire frames used within this merged concept and which we also showed to participants during user testing session 2- it contains all the merged feedback and refinements we got from user testing session 1
> User testing guide during session 2 - This is the set of questions which we used as a guidance during the user testing session.
> Sitemap - This is a visualisation of all the different main pages within the system. A sitemap helps you during designing as wel as to focus on the right tasks during the user testing session.

Refine concept using feedback from user testing session 2
> Final wire frames - This is the full set of wire frames which were the result of the feedback we got from user testing session 2

No comments: