Interactive content cards — a great way of keeping up with rapid prototyping.

In my previous post I talked about rapid prototyping and some of the things I’ve learned as a designer to help keep pace. In this edition I would like to introduce a new technique that will encourage timely feedback from your team, which is based on helping them make sensible decisions during a simple exercise.

The Problem

I had reached the point in a recent project where I had to have a look at quite an important page. This wasn’t the most important section, however we knew it would need more attention to make sure it reached the required level of design. It can be hard for designer to admit this, but I did not feel one hundred percent comfortable in making a decision about how we layed things out. The simple act of thinking about how to get this to the next stage — one that I and the rest of the team (including the client) are happy with. This meant pushing myself to actually talk about the problem with my project team as well as the wider design team, which of course helped a lot.

The problem is quite complicated to convey here in a post, but here is the summary. Design for this page was done. Kind of. The Product Owner had some time to re-think the aim for this particular product page, and whist flagging some of the commercial issues around the design, we slipped into ‘solutionising’. This is the dreaded scenario of the team diving straight into solutions, before first diagnosing and clarifying problems and the challenges of delivering the objective. After a round of ‘on the fly’ solutions, we agreed to park this page for now, as we knew the final layout/content will be influenced by decisions we will make around the more important aspects of the product.

A few weeks later I revisited this page again, but took the opportunity to approach it in a different way.

The Concept

As we took a component based approach to this particularly project, I started to explore everything that we had put on this page at the beginning. I identified and named all the components, and whilst reviewing this page with a second designer, we came up with an idea on how to improve the quality and usefulness of whole team feedback — avoiding the ‘whirlwind of solutions’ situation which had occurred previously. As our project team was very passionate about this product, I wanted to make sure that team members felt more involved in the design process. Therefore we thought we can run through a new take on the classic card sort exercise.

How it works

As I named all the page components I wrote them down on separate paper cards. The aim was to get a team of two to look at these cards and organize them in sensible order, keeping the various elements in mind whilst scrolling down the page.

The fun part however was revealed afterwards.

When the team was happy with their component order, I then turn those cards over. As most of our components have been already designed, prior to the order sorting element of the exercise I draw them on the reverse of the cards, so eventually when I turn them and expose the final order, the team could see what it was that they have designed.

This is always met with excitement, as going into the exercise nobody expects this little trick!

Cards example


Running through this exercise I have identified few interesting things

  • As a designer, it was very exciting to observe the team as they think about the actual component order, as it gave me valuable insights into their thinking and what they would like to see on this page
  • The excitement on my colleagues faces after turning the cards, and the realisation they had unknowingly contributed to the design thinking was great and I was very interested to see and hear if they are happy with the final order
  • Feedback from the team was that they felt that this exercise helped them be involved in design process more, and meant that they felt they had contributed to the final results

This idea came to me from a simple sentence I heard whilst watching one design talk: Visuals distract. Documenting the outcomes from this fun exercise reassured me how much is this true, and how easily we can all forget about this.

I have done this exercise few more times just to confirm my original findings. I’ve found that after I collect all the data and colour-code all the components, I start to see some reoccuring patterns, therefore it was very easy to make a decision about the structure. This exercise works especially well with rapid prototype projects as the simple reusable components that we work with are very easy to reorder. We can then use this as a starting point for further (and more robust) user testing if needed.

The process of refining and delivering this exercise gave me a deep appreciation of how how valuable thinking outside the limits of the traditional approach can be. Gathering information by using something new gave us positive results. This reassured me I will use this approach again.

What do you think about this kind of collaborative, but fun, approach to content prioritisation? Have you ever used the classic card sort exercise in a different way?