My CS222 (Advanced Programming) students started their two-week project on Monday. It's essentially the same project I assigned last Fall: a Mad-Libs application to demonstrate model-view separation, test-driven development, pair programming, prioritizing tasks based on a provided user story analysis, and basic competency with a UI widget library.
My intention for Wednesday's meeting was to start by asking what questions or troubles they are having as they start, expecting to transition into a discussion about domain modeling via TDD. In fact, I said aloud, "My first question to you is going to be, 'What questions do you have for me?'" My intention was to take as many questions as they wanted to throw at me, and then transition into an introduction to user-centered design and design thinking.
As I was saying this, I brought up Blackboard, in order to show the list of user stories that describe the project's functional requirements. Here's a screenshot, reproduced on my desktop, although I was on my laptop at the time.
Note the significant are used by the "Ball State Blackboard" banner. I said, partially to myself but loud enough for all to hear, "Why is that there?" I paused for a moment, constructing a few plausible explanations, and I saw an opportunity, so while many of the students were still chuckling—knowing full well my dissatisfaction with Blackboard in general and accustomed to the occasional rant—I repeated, "No, seriously, why is that there?"
One student quickly mentioned university branding. This is a good answer, if a bit cynical, but I pointed out that neither the font nor the colors matched university branding efforts, and that this was enough to rule out the heavy hand of University Marketing and Communication. I moused around a bit and discovered that clicking on the "Ball State" part (but not the "Blackboard") part takes you back to the main university blackboard page. A student pointed this out, that it's a feature allowing you to get back to the main page.
What an opportunity! I turned the question back to the students, asking them to consider how people use blackboard. They answered, well and predictably, general use cases such as "checking to see if there's homework," "reading a discussion," and with a bit of leading from me, "a professor posting a new assignment."
I pointed out that these were all very general uses, and I led them into the creation of a persona. "John," they named him. John is a first-semester freshman taking History 150 (the general history course required in the core curriculum), and it's the fifth week of the semester. On Friday, from exactly 1:00PM to 1:05PM, he has to sign in to Blackboard and take an exam about underwater basket-weaving. After sketching this on the board, I introduced another persona, Jackie, a senior social work major who has to sign in to blackboard to submit a self-evaluation of her immersive learning capstone experience. We talked briefly about how John and Jackie have very different needs, and that by specifying these details about them, we got a better idea of how to design an experience for them.
Back to the banner. In what circumstances, I asked, do John or Jackie need to return to the main blackboard page? We concluded that there were none, or at least, no circumstance that required investing 1/8 of the screen to a feature more easily conducted through the browser's "back" button.
So, why was the banner there?
One student suggested that it's there because a superior told the designer to put it there. That's possible, of course, but it doesn't lead us to understanding the process by which this decision was made. Then we talked about the sales of systems like Blackboard. A salesperson sitting across from the Vice President of Information Technology is likely showing off Blackboard features on a snappy laptop or the VP's large-screen monitor. "We think you should buy this product. Look, it already says 'Ball State Blackboard' right on it!" However, what looks great on a large-screen monitor or even a relatively nice laptop does not scale well to classroom projectors that are locked into 1024x768 resolution!
Then a student brought up a very important point, that it was probably a template. I suggested that the more one works with a template, the less one sees it and the less one thinks critically about it. I badly paraphrased Edsger Dijkstra, which I quote here correctly: "The tools we use have a profound (and devious!) influence on our thinking habits and, therefore, on our thinking abilities." As Web developers and designers customized Blackboard for local implementation, they probably did not even think about that banner.
There was a consensus on this point: the banner that wasted about an eighth of my screen was there by accident. That means, by definition, a complete failure of human-centered design.
This segued into a more formal introduction to user-centered design, using Wikipedia's summary of the ISO standard as a springboard. I presented the students with a challenge: in fifteen minutes, design a physical prototype of the Mad-Libs application interface, following the principles of user-centered design. The results were fascinating: the students immediately began sketching designs, including details such as titlebars and platform window manipulation widgets, or annotating the UI with technical notes such as "JPanel" and "JTextField." These provided a perfect springboard to point out that no one had considered the user—not in a real, explicit, user-centered design sense. I think, or maybe I hope, that from this experience they realized how easy it is to say "user-centered design" but how it's a different issue entirely to integrate it into practice. Next time, we'll pick up the discussion by having them consider for whom they are designing.
And thus was a momentary frustration with a bad interface decision turned into an impromptu learning opportunity.
Author's note #1: It turns out that there's a bit more functionality in that banner than just "click to go home." On a wider screen, you get a few more options, as depicted below. However, that control panel on the right does not float with the window size, and it was completely hidden on my 1024x768-clamped projector display. Note in the previous screenshot that there's actually a scrollbar under the banner so that I can slide it to the right and get to those options. Ugh.
Author's note #2: I realize I'm not doing so well with my "reflective practice blog post once a week, or at most one every two weeks" goal this semester. I have several half-written posts that I've abandoned and a few research inquiries that are not quite ready for prime time. You probably don't care much about the periodicity of my posting, kind reader, but by putting this in writing I make myself feel a bit more accountable to my personal goal of reflective practice through blogging.
Funnily enough, I did contextual inquiry last year when we were developing the outline for the system that now runs the Digital Media Minor (which isn't blackboard).
ReplyDeleteWe found students wanted a web-based interface that looks like a website, a few basic tools, and workspaces. We are keeping it very simple + using interactions (real-time and asynchronous) to build our courses and not relying on heavy-handed LMSs.
What kind of backend did you end up running? I knew the online DM minor was something you were working on, but I don't know much else about the project.
DeleteThank you for sharing. It is important when creating user interface design to focus on the end user experience.
ReplyDelete