Rolf van der Steen

Mobilism 2011

2011-05-13T13:45:00.000-07:00

On May 12 and 13 I visited Mobilism 2011. Quite an inspiring event; nice presentations and great discussions. Here are links to most presentations and comprehensive notes of the presentations.

UPDATE: Mobilism also offers full coverage page on the site.

Thursday May 12

Mobile first!, by Luke Wroblewski - presentation video
The Future of the Mobile Web, by Peter-Paul Koch - notes by Luke Wroblewski
Beyond the Mobile Web, by Stephanie Rieger, presentation slide deck
After HTML5: Mobile Device APIs and PhoneGap, by Brian Leroux, presentation slide deck - notes by Luke Wroblewski
Devices, designs and enabling behaviours, by Antony Ribot - notes by Luke Wroblewksi
Mobile Browser panel, Nokia, RIM, and Opera, moderated by Jeremy Keith, video - notes by Luke Wroblewski
Notes of day 1 by Lammert Postma (in Dutch)

Friday May 13

High Performance Mobile, by Steve Souders, presentation (pptx file)
How to put the Mobile in the Mobile Web, by Jen Hanen - presentation slide deck - notes from Luke Wrobleski
Meta layout: a closer look at media queries, by Stephen Hay - presentation slide deck - notes by Luke Wroblewski
jQuery Mobile: Building tools for a changing web, by Scott Jehl - presentation slide deck - notes by Luke Wroblewski
Muddling Through the Mobile Web, Designing for rapid change and increasing diversity, by Bryan Rieger - notes by Luke Wroblewski
The hitchhiker's guide to mobile development, by Nikolai Onken
Mobile and UX: Inside the Eye of the Perfect Storm, by Jared Spool - notes by Luke Wroblewski
Notes of day 2 by Lammert Postma (in Dutch)

Enjoyed it.

Content Industry Trends in 2011

2011-01-11T15:17:00.000-08:00

As we start a fresh new year of Web Content Managment, I was wondering what the analysts predict to be the trends in the Content Technology industry in 2011 year? Here's a collection of predictions I've found.

David Hillis - 10 Predictions for Web Content Management in 2011:

Mobile Will Accelerate Web Content Management Adoption
Deployment will be King
Structured Content will be Queen
Mobile Pushes Adoption of HTML5
Content Moves to the Cloud
Back to Basics
Got Apps? Welcome to the CMS App Store
Meet the Social CMS
Mobile Changes Web Expectations (Death of Brochure-ware)
MVC Disrupts .NET CMS Marketplace
Importance of privacy will disrupt personalization and “experience” strategies
Mobile payments will enable true content monetization.

Jarrod Gingras - 2011 Content Technology Predictions:

"Bring Your Own Device" policies will push HTML5 adoption for mobile access to enterprise applications
Content-rich customers will rebel against Web CMS marketing spins
Microsoft will turn to partners to fix SharePoint shortcomings
The top end of the Web CMS market will be redefined
Intranet community managers will adopt public social functionality
SaaS vendors will try to separate from "The Cloud"
Buyers will have a greater acceptance of newer standards
Case Management will become the leading application from high-end ECM vendors
Digital Asset Management vendors will greatly expand video management capabilities
E-mail will remain the world's de-facto enterprise document repository and workflow system
Portal software will increasingly produce services for other portals
Specialized talent around managing content will begin to migrate out of large corporations

Barb Mosher - Emerging Trends in Web Content Management:

Platform vs Specialization
Integration of Web Analytics
Tightly Integrated Search
Cloud Hosted vs SaaS
WCM Gets Social and Social Gets WCM

Stéphane Croisier - Top 10 Trends for the Content Industry in 2011:

Rise of Composite Content Platforms
From Open Source to Open Data
Smart Content
Personalization and Curation
Renewed Interest in Search
Never Easy Enough
Managing, not only creating, compelling User Experiences
Social as a standardized Service
Business Solution Accelerators and Cross-Over Technological Suites
User-Centered Design and Integrated Collaborative Development Environment

Joe Shepley - Enterprise CMS Trends for 2011: A Business-Centric View:

Business value will be king
ECM will become increasingly concerned with managing content within cross-functional, value-chain activities
Organizations will address the people and process dimensions of ECM in order to get more out of their current (and future) investments in technology
The seeds of SharePoint’s demise are already sown

Phil Wainewright - Six big trends to watch in 2011:

Mainstream means mobile
Fake cloud #fails the crowd
IT management gets wired to the cloud
Data just wants to be mined
Social technologies remake enterprise apps
Business transformation becomes the big story

Free UX advice for AH

2010-11-08T06:53:00.000-08:00

Some time ago I wrote about bad UX at Albert Heijn (jul 2010). In short my complaint was that the check out system - on approach - very much emphasized the second step of the check out process. The first and mandatory step in the process is presented very inconspicuously.

Apparently designers at Albert Heijn are aware of this issue but unfortunately they solved it by showing a big red error message if the user accidentally scans his/her bonuskaart before putting the scanner back.

IMO this is the wrong solution for the design problem (being the user has to execute two actions in a specific order). It would be better to change the visual hierarchy of the 'welcome screen' to help users execute the actions in the right order.

Or even better, make it 2 screens; the first saying 'put your scanner back', the second 'scan your card'. I think this would very much reduce confusion and nearly eliminate the need for the big red error meesage.

But the best solution would be to design the system in such a way that the 2 actions don't have to be executed in a specific order. From a user-perspective there is no logical reason why he/she has to put the scanner back before scanning their bonuskaart!

Good UX at BOL

2010-10-15T04:47:00.000-07:00

Okay now this is an example of good UX!

Yesterday I complained about the address removal interaction at bol.com by posting a tweet (with a link to my blogpost).

And today already I got a mention from @bol_com, in which they say they understand the problem and will see what they can do about it. Now that is some excellent user experience! They actively approach me and even are willing to try and solve the problem.

Big thumbs up for bol.com!

Bad UX at BOL

2010-10-14T13:10:00.000-07:00

Recently I ordered a book at bol.com (Information is beautiful, recommended!). While doing so I thought why don't I change my adress (I moved some time ago). Then I ran into an example of bad design: it was impossible to remove old address directly from my account.

I can see where this is coming from; obviously an account should have at least one address, but unfortunately BOL does not allow me to remove just any address (up until one address is left).

Apparently the first entered address cannot be removed, which is very illogical because this will almost always be an old address. To make it worse; changing my old address into my new one is not allowed because the address already exists.

So to actually remove my old address I had to first remove my new address and then change the old address into the new one (and of course all the steps above to figure this out). Cumbersome interaction!

Results Usability Test: Right Click

2010-09-28T00:53:00.000-07:00

Here's a quick update on the usability test on right click functionality in Hippo CMS 7.

The results show that roughly 2/3 of the participants would like to see right click functionality in the CMS.

Many participants mentioned that right clicking would be good, but should not be the only way to reach certain actions; right clicking should be additional / redundant interaction.

I would also like to point out that I suspect the participant group to be largely developers, thus real power users. I think actual CMS users will be less technical oriented and thus have a lower 'expectancy' for right clicking in a web interface.

So a premature conclusion from this test is that users tend to be ready for right clicking in a web interface, but that it is still to early to use it as sole interaction pattern.

Note: the test is still running. So if you are a Hippo CMS user, let us know what you think about right mouse clicking in a CMS interface? Please vote on http://usabilla.com/rate/7772163384c9c

Usability test: Right Click Functionality

2010-09-24T03:55:00.000-07:00

A call to Hippo CMS7 authors, editors and admins! Please join in on the next usability test. This one is about right click functionality. Use the following URL to start the test:

http://usabilla.com/rate/7772163384c9c

Please don't hesitate to join in and speak up. Your opinion is much appreciated!

Note on Usabilla (the tool used for these tests): Participating is anonymous; It is not possible for me to see who has participated. If you like to get in touch personally, please state your email in a note in the test.

Design by Fire Café - Design in Open Source

2010-09-21T14:36:00.000-07:00

On Monday 20 sep I attended Design by Fire Café, which is an informal gathering for (interaction) designers. Each café features a short, inspiring presentation as food for discussion. Last Monday Bojhan Somers presented "Design in Open Source". Bojhan works at User Intelligence and is UX manager for Drupal.

To start of, Bojhan named some examples of successful open source projects such as Firefox, Ubuntu and Wordpress. Despite these projects having little dedicated designers compared to the amount of developers and users, they are able to create a successful UX. According to Bojhan it is the culture within these projects which is the major success factor in creating good UX.

Side note, some nice examples of gathering / dealing with UX issues from these projects are
Planet Firefox and Ubuntu 100 Paper Cuts.

Next Bojhan went into more detail on Drupal. From a major usability test in 2007 at the University of Minnesota it was clear Drupal needed UX improvement (later on more usability research followed). Drupal's UX team started the UX project to get these UX improvements into version 7. Just to make it clear: Drupal's UX team is not a full time dedicated team, its members are people who have the Drupal design role besides their everyday job. Bojhan mentioned he spent about an hour a day in his UX role. So it was a real challenge for the UX team to change the culture in the community and thus get the UX improvements realized.

UX design challenge

Here's a summary of their 'lessons learned'.

Their was a shift of focus in the design; traditionally Drupal focused much on the technically oriented users (site admins). Now they are focusing more on the user group who uses Drupal extensively (authors and editors).
The UX team formulated core UX principles; these were 4 high level principles which helped to maintain the focus in discussions instead of getting lost in details.
The UX team introduced an iterative design process which contained "explore", "discuss" and "design" cycles. Designers were encouraged to be as visual as possible (use visuals and mockups) in the discussions to make problems more visible and better discussable. The team also noticed the issue queue was thé tool developers worked with. So they made sure the design discussions took place IN the issue queue.
Developers needed to learn; developers were used to start coding right away. They had to get used to this new process with its iterations and mock-ups before coding (you know, "Plan to throw one away").
Designers needed to learn too: designers were used to creating a near-perfect design before 'releasing' it. But this is impossible in the open source world. Designs need to be released early and should be more about showing the line of thought (thus educating other contributors).
Initially there were concerns that the 'design by committee' process would be slow and result in mediocre solutions. It turned out this was not the case; 'thought leaders' (mostly designers) arose and were the ones making design decisions.

Iterative design process

All in all I think it was a really nice presentation containing valuable lessons which we can learn form at Hippo.

Usability test: Tab Management

2010-08-27T03:09:00.000-07:00

A call to Hippo CMS7 authors, editors and admins! Please join in on the next usability test. This one is about Tab management. Use the following URL to start the test:

http://usabilla.com/rate/8190903884c76

Please don't hesitate to join in and speak up. Your opinion is much appreciated!

Note on Usabilla (the tool I'm using for these tests): Participating is anonymous; It is not possible for me to see who has participated. If you like to get in touch personally, please state your email in a note in the test.

Results Hippo GetTogether Usability Sidetrack

2010-08-26T06:21:00.000-07:00

Last friday (20 aug 2010) was Hippo GetTogether. Right after lunch, while the Cool vs. Hot tech-talks were being held in the Zuilenzaal, I ran the Usability sidetrack in the Teekenzaal. About 15 people attended and gave me really valuable feedback on Hippo CMS 7.

The sidetrack consisted of two parts. First I presented a brief introduction on usability. Most of the sidetrack however was a practical workshop. In this workshop participants gave me feedback on Hippo CMS 7. For those interested; you can find the entire presentation on http://www.slideshare.net/rolfvandersteen/hippo-get-togehterusabilitysidetrack (yes, I know, it contains a typo).

Check out the presentation if you'd like to know a bit more on usability. Here I like to go into more detail on the workshop and the results from it. For the workshop I had prepared three exercises; “Top 10 Improvements”, “Personas” and “Today's Design”, so that I had at least enough to fill the planned time (13:30 - 15:30). But in the end I used all the planned time and about an hour extra on the first exercise only; creating a decent most-wanted improvements list.

Top 8 Improvements

I used focus group methods to create the improvements list. First I asked all participants to write down their most-wanted improvements on post-its. This could be things like frustrating interaction, bad graphical design or missing features. Then we went through these improvements one-by-one; the 'owner' explained what he/she meant, and we put all the post-its on a flip-over functionally grouping them as we went along. This resulted in approximately 20 improvements. Next we prioritized the improvements. Everyone got to make two votes by placing stickers on the flip-over: one big sticker for the most-wanted improvement (2 points) and one small sticker for the second-most-wanted improvement (1 point).

This resulted in the following top 8 improvements*:

Rich text editor (Xinha): frustrating to work with, doesn't give users true text-editing functionality they expect from Office applications they normally use like MS Word.
Performance: Bad performance influences the user experience, users get frustrated, start clicking more than needed, thus creating more errors.
Document presentation: bad typography, unusable alternating color coding, 'technical' design.
Template creation: current way of creating document type templates is too rigid / clunky.
Workflow: communication possibilities between users in the workflow are missing / too little.
Dashboard: perceived as useless because presented information is not relevant to users.
Tab behavior: frustrating interaction.
Drag & drop: missing functionality.

* The top listing is composed of voted improvements and improvements that are mentioned more than once. All other improvements are left out of the top listing.

Hackathon input

After creating the top listing we came to the conclusion there was too little time left to pick up one of the other exercises. We then had a short brainstorm on input for the hackathon, using the top listing as a reference. We decided improvements for the Dashboard nicely fitted the hackathon goals and could be feasible within a couple of hours.

From this brainstorm the following improvements for the Dashboard arose:

History improvements: make the history list more relevant, show publication, show take offline show requests and their comments, don't dhow login/logout actions, allow user to hide (some) actions, and group actions per user (within a certain time frame).
Chat functionality in CMS: allow logged in users to chat with each other, on dashboard, but eventually across entire CMS, one-on-one chats, but optionally also one-to-many.
ToDo improvements: Group per action.
Change order of history and todo; to do is more important, so should be on the left.

Structured feedback

Another very interesting point which became clear from the usability sidetrack was a clear need for more frequent and better structured ways for Hippo clients/users to provide input/feedback like in this sidetrack. I pointed out that we're running usability tests and that I would like as many participants as possible to join in. I also mentioned that I'm very much interested in additional feedback and like to enable structured ways of exchanging this. Participants responded enthusiastically to that.

What's next?

I've discussed results from the Usability sidetrack at Hippo internally and these are the steps we're going to take:

The upcoming release (7.5) is already fully planned and there are little resources available to pick up additional design and development. However we can fit Tab behavior improvement within this release.
For the next releases we have appointed key usability improvements: Dashboard, Rich text editor, Performance and Document presentation.
Also we're going to create a 'UX channel'. We want to satisfy the need of sharing thoughts and ideas on user experience (and separate these from technical discussions). We have to give it some thought on how we are going to do this, but most likely we'll be opening up a UX forum.

Well, that’s it in a nutshell. I'll keep you updated and hope to see you at the next GetTogether!

Hippo GetTogether Usability Sidetrack

2010-08-17T23:47:00.000-07:00

This Friday is Hippo GetTogether. Parallel to the Cool vs. Hot tech-talks I will be running the Usability sidetrack.

The Usability sidetrack is scheduled for form 13:30 until 15:30*. In this time I will give a glimpse into how we create the friendliest CMS around.

First there will be a brief introduction on usability; what is it, what is our vision on it and how do we apply it at Hippo.

Most of the sidetrack however will be a practical workshop. In this workshop you can give us your feedback, directly to me! The feedback will be used right there and then to collectively design and evaluate new and better solutions.

Your input is valuable here! Since the workshop is based on your feedback, please bring your issues, examples, comments, etc.

* There is room and time to continue an extra hour if desired.

Hippo GetTogether T-shirt poll

2010-08-04T04:38:00.000-07:00

To all Hippo GetTogether attendees; now is your chance to determine the looks of us hippotizers. We want you to choose your favorite T-shirt for the Hippo GetTogether (majority rules).

Vote on: http://usabilla.com/rate/19475236134c5

Bad UX at Albert Heijn

2010-07-22T00:22:00.000-07:00

Since some time Albert Heijn has introduced self-scanning of groceries. When you go into a store you can use your "bonuskaart" (customer card) to grab a scanner from a rack. Although I needed some time to get used to scanning my groceries while putting them in my cart, I like the whole concept. However there's a design flaw in the check out process which annoys me very much.

When checking out the order of things is:

First put the scanner back in the rack - the system won't do anything until the scanner is replaced
Then scan your bonuskaart
And then the rest of the check out procedure follows.

Now look at the picture below, which is what the screen of the check-out-system looks like when you arrive at it.

Why-o-why is the instruction for the PRIMARY and MANDATORY user action - putting the scanner back - so poorly visible???

I mean, first there is a big image and huge dark blue text line explaining the SECOND instruction. And then all the way at the bottom of the screen is a small light blue hard-to-read text line which is actually the most important instruction. In fact it is the ONLY instruction needed at that point. The rest could be displayed only when a scanner is placed in the rack.

To make things worse, there is an auditory instruction every 10 seconds or so saying to "scan your bonuskaart".

Come on Albert Heijn, you can do better than this.

Usability test: Insert / Modify Image

2010-07-08T06:57:00.000-07:00

A call to Hippo CMS7 authors, editors and admins! Please join in on the next usability test.

This test is about inserting and editing images while editing a document. Please use the following URL to start the test: http://usabilla.com/rate/5077836124c35

Please don't hesitate to join in and speak up. Your opinion is much appreciated!

Note on Usabilla (the tool I'm using for these tests): Participating is anonymous; It is not possible for me to see who has participated. If you like to get in touch personally, please state your email in a note in the test.

Results usability test: Done vs. Save and Close

2010-06-17T00:12:00.000-07:00

To all participants: thank you!

After just 2 days I've already got a really good amount of feedback.

As can be seen in the results above there is a very strong preference for the "Save & Close" button, as opposed to the "Done" button. We'll be changing this soon.

I also received some suggestions for a "Close without save" button, which would discard changes since last opening a document. We are looking into that.

Usability test: Done vs. Save and Close

2010-06-15T01:08:00.001-07:00

For those of you who don't know me; I'm Rolf van der Steen, User Experience designer at Hippo. It is my responsibility to ensure our products are easy to use and understand, and users will have a excellent experience when using them.

To achieve this I would like to ask for your help. From now on I'll be regularly posting usability tests. These are quick tests focussing on (small) parts of the user interface. The tests will take no longer than a couple of minutes to complete.

I gladly like to invite you to participate in these tests. At this moment the tests will be focussing on Hippo CMS7. Also I'm primarily interested in the opinion of actual end users.

So, are you using Hippo CMS7 as an author, editor or admin? Please don't hesitate to join in and speak up. Your opinion is much appreciated!

And to start of right away; here's the first usability test already. It is a fairly simple test asking wether you prefer a 'Done' or 'Save & Close' button for closing your document. To start the test, please use the following URL:

http://usabilla.com/rate/13889265014c1

Designing Complex Applications

2010-05-27T23:35:00.000-07:00

From 16 to 18 may I was in London for the training 'Designing Complex Applications'. This training is part of the Usability Week by the Norman Nielsen group.

For those interested; more information on the training:
http://www.nngroup.com/events/tutorials/complex_apps.html
http://www.nngroup.com/events/tutorials/complex_apps_2.html
http://www.nngroup.com/events/tutorials/complex_apps_3.html

I would like to share my two most important insights from this training.

1. Do More User Centered Design

Hippo's development process is very much technology-oriented and requirements are mostly based on internal vision only. The level of UCD should be higher. There are two key elements in this:

Design research (usefulness). Truly getting to know and understand our users; what is the value of our software to them, what is important to them on a deep level addressing feelings and concerns.
Usability testing (usability): once useful functionality has been determined and designed, we should test whether it is usable (before developing it). Note: designed means 'draft design' here; testing with paper prototypes, mockups, partial clickables etc. There are some good methods to do 'guerilla' usability testing (=fast and low cost).

Get out of the building! Do design research to make design decisions data-driven. Without it, we're just guessing. This is all about aligning the users mental model and the designers (and hopefully developer's) conceptual model to create a consistent 'system image'.

This will result in better adoption, higher customer satisfaction, higher ROI, etc (although it is difficult to put some hard numbers on this).

My goals:

Set up methods for design research / usability testing which fit within the Agile process: set up user group, stakeholder interviews, domain investigation
Deliver design artifacts: personas, use cases, mental models, sketches, wireframes, prototypes

2. Make Design Artifacts Tangible

Design is not a 'black art'; transforming data from the design research into 'bits and clicks' can be broken down into distinct tools and steps that anyone can learn and use to improve. I want to make these design artifacts more tangible (to Hippo developers, management and user group) by having it centrally available on our Confluence-wiki. This will help:

Communicate designs and open up design discussions internally
Do remote usability testing
Align stakeholders and end-users concerns/goals, preventing people filling in the gaps with their own different assumptions.
Secure design knowledge
Shorten design process (by means of reusing patterns from a central library)

My goals:

Create a 'UI-place' on Confluence and start filling it in. Note that this will be an ongoing thing (so-called 'living specifications').
Try-out Balsamiq, which is a wireframing/prototyping tool which integrates with Confluence.

Furthermore the training provided a lot of patterns and examples - specifically for complex (web)applications used by domain experts - which are useful to me as source of inspiration / to be in the library.

Hope this gives you some idea of what I've been up to in London and like to hear your opinion on this.