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

Tuesday 5 May 2009

It's design time!

The blog has been somewhat quiet of late, as the Academic Networking team have been working mostly offsite through an intense 6 week user-centric design phase. Five weeks down, one (this one) to go!

Oszkar Nagy and Tjhien Liao have been working out of Flow Interactive's London offices, learning from the Flow team as they work. We have gone many phases already, which I can outline very roughly here:

  1. figuring out requirements from the user research
  2. initial ideation of many many small design concepts
  3. placing those concepts on axes of "user benefit" and "technical difficulty" (this was a tricky one!)
  4. working up over a dozen concept ideas into rich descriptions (a phase which generated such intriguing concept names as "Ballroom dancing" and "The Spy")
  5. selecting 3 concepts and refining them into extreme examples reflecting the ideas we had
  6. user testing some paper prototypes of the concepts
  7. refinement of the concepts based on user feedback, plus some work to bring them in from the extremes to something more mainstream
  8. a second round of user testing
It's been a real whirl for everyone!

We are now into a final concept refinement round, and Anne-Sophie de Baets is doing a splendid job of documenting all our work so far.

We're looking forward to some reflective time at the end of our 6-week sprint, when we'll be figuring out where to go next (including what to implement in Sakai and when) and also taking the time to wrap up our documentation effort and start to prepare user research results for publication.