Interactive HyperLocal News Mockup

Balsamiq is a great tool for quickly mocking up an interface, and you can even add interactivity, and my embedding a PDF export, you can have an interactive mockup running in your browser.

Try clicking on the map pins in the PDF below:

Great 404 page design from balsamiq

2013 Mac Book Pro Reset button is pressed a bit too easily ...

So in what may hopefully be an ongoing series of design bloopers here's something from my 2013 Mac Book Pro.  The reset button was previously completely separate from the keyboard, but has now been placed just above the delete key, so that I accidentally hit it a few times a week.

It does have a confirmation dialog to prevent me immediately shutting down my computer when I'm typing, but it seems like a bit of a hack.  I guess there must be some strong technical reason for having changed this around, but I'm not seeing much in the way of improvement in terms of user experience here ...

This seems to fit well with some of Nielsen's usability heuristics.  It does well in terms of "Help users recognize, diagnose, and recover from errors", but perhaps not so well in terms of "Error Prevention"

Error prevention
Even better than good error messages is a careful design which prevents a problem from occurring in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action.

They've got the confirmation action, but better to design to avoid error occurring in the first place, and Raskin hates confirmation dialogs ... It's particularly odd since the previous mac book pros were designed such that this was never an issue - the reset button was out of reach in a silvered portion of the body of the MBP in the top right, and was set into the frame so that it was difficult to press accidentally ...

How NOT to do email notifications

So in an effort to collect user interface (UI) bloopers, here's a pet peeve of mine.  Google Plus notifications.  This is how they look in the subject line view of Thunderbird.  Look at this awful replication of information.  The From field is telling me who it is from and that it's via Google+.  The last thing I want is the same information in the subject line.

I don't think anyone could argue (in the context of this interface) that the subject line should be anything other than something about the contents of the post - the first sentence perhaps?  The title of an associated URL that was being shared.  Anything to let me know something more about what I might discover when I click through.

Perhaps the problem is that the Google plus notification team hasn't optimized for Thunderbird?  Fair enough - I can see Thunderbird users as a bit of a niche group, perhaps they are thinking in terms of the gmail interface:

It would appear not - exactly the same problem in gmail.  Although to be fair when I haven't searched for Google+ the faded out text on the right hand side does have a small amount of text from the actual post.  Although if we are on search in gmail, why isn't there a sensible way for me to get back to the full inbox other than clicking inbox after a search - if I delete the search term in the box and press search shouldn't I go back to my full inbox?

Anyway maybe these Google plus notifications are designed for viewing on a mobile device?  This is what it looks like on my Nexus:

Come on Google - this is really simple stuff no?  I know I couldn't pass your complex engineering exam, but when are you going to hire me to sort out these UI issues for you ...

Harrow Local Support StakeHolders

Image by Jurgen Appelo thru CC BY 2.0

One of my continuing posts related to the Systems Analysis / Software Engineering class I'm teaching this semester.  Here's a list of stakeholders for a "Harrow Local Support" website/directory concept I've been working on with Voluntary Action Harrow (VAH) an umbrella group for local charities and non-profits.

Harrow residents

• Looking for support
• Looking for volunteering opportunities

Harrow Charities

• Trustees - who oversee the actions of a charities
• Administrators - who run the charity
• Staff - who work for the charity
• Volunteers - who devote their time/resources for free

Harrow Non-profits (groups without charitable status, and also ???? unclear if there is a legal definition)

• Administrators
• Staff
• Volunteers

Voluntary Action Harrow (VAH)

• Administrator
• Staff
• Volunteers

Other organizations

• Harrow Businesses
• Harrow Council

Stakeholders sounds a bit management faddish, but I guess it's a reasonable term that distinguishes itself from alternatives such as "people" and "users", which can lead one down the path of imagining a queue of people lining up to use whatever system one happens to create.  Realizing that everyone is busy playing parts and roles in all sorts of other groups is important, and stakeholders captures the idea that individuals (and perhaps organizations) will have varying degrees of "stake" in whatever project you are developing.

Eternal Independent Learning (using blogs and peer review)

Image by Wesley Fryer thru CC BY-SA

I was very impressed with the Peer Review framework Scott Klemmer had in his Coursera HCI classes last year.  I'm implementing simpler versions of that in my own online classes, but with all the student work submitted and reviewed through student blogs (I recommend, but don't require, using Google's http://blogger.com ).

https://sites.google.com/site/hpumobilespring2013/blogs

I really like the blogging in the wild approach since it ensures that when someone is commenting on their peer's work, they can (at least in principle) see the full history of the project being worked on by their peer, and if they are interested in can keep coming back to it, offer to collaborate etc.

I think this at least partially addresses some issues I encountered in the Coursera peer review system such as not being able to see the broader project context of peer work, and not being able to follow the development of peer projects, however it raises a number of new issues:

1) Are students happy with blogging in "public"?

2) How to scaffold the peer review process in public blogs

Addressing point 1) I explain to all my students that they can set the blogger to:

a) Full Public - appears in Google search results

b) Accessible to all by link

c) Private

And I explain that even with option b that in principle anyone can come through my public class site and find their blog unless it is explicitly set to private; but I encourage everyone to take the b) option.  I'm a bit of a sharing nut :-)  And I hope all my students can turn their projects into part of their professional portfolio.

Regarding point 2) I find myself equivocating on how much structure should be imposed on students both for assignments and peer review.  Too strong a structure and some student creativity is inhibited, too loose a structure and perhaps some students are left unsure how to proceed; not to mention the added concerns of encourage positive helpful feedback during pair review.

Any which way it makes me imagine an "Eternal Independent Learning" system in which individuals would be working on projects, posting them to their blogs and receiving feedback from each other.  Clearly this is what actually happens in the real blogosphere itself to some extent :-) But I'm imagining a little bit of scaffolding using the blogger API could create a sort of queue of people waiting for feedback on their projects and do something like http://www.fivesecondtest.com/ except on a larger scale so that arbitrary project components (rather than just landing pages) could gain reciprocal feedback, while also allowing individuals to establish mutually supportative relationships with each other.

One could even go further to imagine a StackOverflow/Quora type points system that gave individuals a score based on their contributions to other blogs, and the positive feedback they attract on their own blogs, peer's setting each other challenges etc. 

Comedy Faqbot Project

Image from Public Domain

So this is the final of three project brainstorming posts related to the Systems Analysis / Software Engineering class I'm teaching this semester.  I've been wrestling with a chatbot that can answer some useful questions about online classes (and tell a few jokes) for some time.  This project is also bundled up with my student work assignment tracker.

Problem Description:

Courses that are run year after year build up a set of previously answered questions that it would be great if current students and alumni (and instructors) had access to.  One form is just to display these in static text, but another form would be to provide a chatbot interface that could participate in IM discussions.  Boredom is the mind killer when it comes to learning, a little bit of quality comedy might help?

System Capabilities:

• Answer simple questions relating to an online course
• Provide students with information about which assignments they have completed
• Tell the occasional joke, riffing off what the student is asking

Benefits

• Handle much larger number of students for a single instructor
• Provide an alternative form of access to a large repository of information
• Provide some occasional light relief

Prototype open sourced here:

https://github.com/tansaku/faqbot