Latest Updates: Background ideas RSS

  • Dimensions of the Consistent UI Guidelines project

    May 27th, 2009

    After having had a chat with Helen yesterday, I recalled the importance of simple writing. I have a rather complex message which I want to make a lot of people understand: I am not just making usability recommendations to specific parts of Moodle, but trying to see patterns in the way UI’s are made and to make recommendations about those patterns.

    Later in the evening I got the idea that even though the job itself is quite well narrowed down at the moment, it still happens on quite a few dimensions, and keeping track of the different things happening on different dimensions might be the real challenge here.

    I have prioritised the dimensions (goals) here (the first the in list has the hightest priority), to give a rough idea of what will be given less attention to, in case my head starts feeling like it’s gonna blow up. (The links are to appropriate phases in the project schedule)

    1. Engaging the community. Giving them something to play with. Finding common ground. Providing services to different UI design projects within Moodle. Community discussion
    2. Writing for lightness. Making the guidelines clear, light, usable: fit for their purpose. This is critical for building engagement. Catalogue (but writing really happens throughout the project)
    3. Planning. Project management, project documentation – kind of a prerequisite for my sanity and thus, for everything else. Planning
    4. Exploring Moodle‘s functionality. There is a lot of work here for me, in both learning the UI and narrowing down what is relevant for this first round of HIG creating. Examine, Catalogue
    5. Usability tests (design, organizing to get some people to test with, usability testing) Planning usability testing, Usability testing
    6. Creating tickets for changes in tracker, implementation of  changes. Implement

    Also, I am kind of wondering about the name for the guidelines themselves. How does Consistent UI Guidelines sound to you? Seems more comprehensible to me than HIG, which is comprehensible mostly just to usability folks.

     
  • Project schedule, summer 2009

    May 26th, 2009

    As a part of the Moodle usability effort of summer 2009, I have now published a detailed project plan for the project in the Moodle Docs wiki. Comments welcome. It feels good to be in control.

    Also amused myself on Sunday (my day off) by creating this little ad, which will probably never appear anywhere else but here, now (since it is too distractive to be even here). It is the first APNG animation I ever created and should work on any decent new browser – and show just the first frame on older ones. I created the file with APNG Editor, a Firefox extension. (More …)

     
  • UI details: two-part drop down menus

    April 23rd, 2009

    “Dual” drop down menus are menus that perform a default action when the menu title is clicked, and only show the actual menu when the down arrow on the right side of the element is clicked. Usually such menus do not communicate clearly that clicking the left side of the element performs the default action, instead of showing the menu. (The expected behaviour is that of traditional drop down menus, which always show the menu whereever one clicks).

    Of course this never constitutes a fatal usability problem, if the default action is reasonable and provides the choices the menu would have on the target page. It only potentially slows down users by one page load. However, when a truly fluid user experience is the aim, details easily become a differentiating factor compared to other similar products. Today I noticed a solution for “dual” drop down menus that is aesthetically subtle and still seems to efficiently communicate the functionality available.

    screenshot 1: menu bar in default state

    Delicious has what looks like a pretty standard (and plain) menu bar.

    screenshot 2: mouse on the main link

    However, when you hover the mouse over either the menu title or the down arrow (of the ‘People’ menu in this case), the corresponding side of the element is highlit.

    screenshot 3: mouse on the menu arrow

    This effect would not be achieved if either side were highlit already. The point is that the UI gives a subtle hint to the user as a reaction to their action. The user understands almost seamlessly the fact that the element that seemed to be just one menu actually behaves differently depending on where on it you click. (This was my experience, anyway.)

     
  • Scenarios, Use Cases, Jazz

    June 9th, 2008

    Yesterday, I started to grasp more comprehensively the relationship between personas, use cases and scenarios.

    While trying to piece this together, I drew what used to be a simple diagram. But then it got a bit out of hand:

    The reality and the dynamics a UI designer observes and manipulates

    Download diagram: PDF, Openoffice ODG

    First off, there’s reality. That is to say, this is not scientific research. In a small scale guerilla usability project, we do not pretend it is, much. Still, we observe reality and gather knowledge about the users. Iteration in testing and also in interviews must serve as our backup against which we check that our conclusions are hitting their target: we take the knowledge we find to the user interface and to our generalized conclusions, and then verify with our users.

    Use cases

    In a sense, modeling use cases equals doing actual UI design: the main difference is in the abstraction level. Use cases will be the actual hard ground when drawing prototypes, representing the idea or ideal about what the UI should be like. That is, what should be possible to accomplish with it, and how.

    When designing the actual user interface, the designer takes all the use cases (=the goals), and merges them using his/her creativity and experience. As the use cases may conflict, the resulting user interface is usually some sort of a compromise between the different use cases. Also platform restrictions pose threats to the ideals: technology requirements (no dependency on Javascript in this case) and needing to conform to existing UI conventions would be examples of this.

    In the case of this project, I have so far been thinking about the word “use cases” mainly from the point of view of the old user interface – I have understood it roughly as the functionality of the UI, which is to be transferred to the new UI, just better enabling the users’ scenarios (better enabling users to do their tasks). However, this is actually an overly computer-centric approach to use cases, and basically incorrect. More importantly, as is obvious in terms of the definition, use cases take the functionality of the program and model the user in interaction with that functionality.

    There are several ways to see use cases. First, when we look at the current UI, you can see three different sets of use cases, from ideals to reality:

    • ideal use cases: how the software developers think the software should be interacted with
    • observed use cases: gathered by seeing real users (UI testing or otherwise) use the current UI. This is a subset of the next one:
    • the real-world use cases of the interaction that is taking place with real users and the current UI

    Scenarios

    When we just have the use cases of existing software, we do not get very far. At best, with testing, we see the problems users are having with the current software. What we do not see, is whether or not we are even trying to solve the right problems.

    Enter scenarios. That is: independent of the application and its UI, what is it that the user aims to achieve, and what is the way s/he does it best?

    How do we find out? Talk to the users. It may be scary at first. They are people, after all! But go ahead and try – turns out that people are actually glad if someone wants to learn about what they need to make their lives easier.

    Whenever you talk with actual users about their actual tasks and goals, you are in the sphere of scenarios. But the hard part is taking the scenarios and making them somehow digestible pieces. That is: you look at what the users tell you, and tear it in pieces until they are atomary, that is, single actions (you might want to observe this in terms of GTD’s Next Actions: visible, physical actions). It is not just the tasks you need to find out about, but what affects accomplishing those tasks: patterns, goals, skills, attitudes, and environment (as stated in Cooper’s article about personas, link below).

    Getting somewhere

    So now we have a set of use cases from the old software. Then we have a set of scenarios describing the actual environment, tasks and goals of the user. Now, we try to match them: scenario 1a fits with use case 1c, and actually, also with use case 1d (that is, the user can do the same thing in more than one way in the application). But then with scenario 1b, the user has to do a task in an unnatural order of subtasks or can’t do it at all because it is too hard for him/her or because it cannot be done at all.

    And once we get that far, we can take those differences, and start writing new use cases. That is, designing the interaction that the application should facilitate. Once sufficient iteration has been achieved or the deadlines are too close, we can state: We know – well enough – the interaction and whatever affects what that interaction should be like – now let’s get to business, the actual UI.

    Oh yeah, almost forgot – something brilliant: Perfecting Your Personas

     
  • Interviews

    May 16th, 2008

    This was written May 16, 2008 but I am publishing here today, November 25th, 2008, for archival purposes even though it is desperately late.

    At first, I planned to have four contextual inquiries. Turns out though that since I am just starting, just having preliminary interviews might work better. Anyway, I had only reserved an hour per interviewee.

    Putting it all together was kind of scary, I haven’t done actual interviews before. luckily I had a “training interview” with Saila Ovaska, who also told me a lot about what to take into accoung (note taking facilities, audio recording).

    I am pretty much satisfied with the 4 interviews I had yesterday. They were not formal and the perceptions were quite general and probably incomplete, but nevertheless each of them gave me precious insight about the lifetime of a quiz and/or what electronic exams are about for different teachers. I recorded each of the one-hour sessions and it seems now that I will need to listen them through to at least keep my thinking process going.

    next, I will proceed with gathering all my current perceptions into another prototype just to keep things concrete. But the perceptions also need to be documented as such. For this I am using a document template, will need to make sure the one I have doesnt have a retricting licence. Why does this has to be a template, why can we not have all the info built as an app that would also work out all of the references?

     
c
compose new post
j
next post/next comment
k
previous post/previous comment
r
reply
e
edit
o
show/hide comments
t
go to top
esc
cancel