UX Workshop

Posted on in Web

After sampling the infamous coffee and sitting in on the Monday team meeting, I kicked off my time at Clearleft with a fascinating ‘Rough guide to UX’ workshop led by Andy. It was a fortuitous day to start, not only did I get to learn UX techniques from the very best, I got to know six of my new colleagues in a great environment.

I arrived a little late (the new laptop took a while to set up!); they’d just finished running through the history of UX, and discussing user-centered design. This led on to the first activity, the interview.

Empathy mapping

We interviewed each other to find out more about our holidaying habits, how we decide when and where to go, and what informs our plans. As the interviewer, we categorised answers into four categories:

The empathy map template, Say/do, See, Think/feel and Hear

This empathy map helped disseminate the information, tailor our questions, and sift through the noise. The type of questions were crucial. A ‘closed’ question would often resolve in a yes/no answer, and would run the risk of introducing interviewer bias. “Do you gather holiday inspiration from Instagram” offers little insight. “Do you gather holiday inspiration from Instagram or Pinterest” gives the interviewee two choices, neither of which may be correct.

‘Open’ questions reveal more useful information, but require greater trust between the two parties. Asking the ‘why’ questions is where the real gold lies.

Coming to the table with a beginners mind keeps your interviewing bias to a minimum, even if you are an expert in the field. The whole exercise really brought home what a great skill interviewing is.

Keeping focus on past and current experiences was a theme that persisted throughout the day. Questions about a previous holiday will yield more accurate answers than those about a potential future holiday.

Jobs, pains & gains

We split into two groups and picked a scenario that we wished to improve with UX techniques. Our team chose ‘improving the new starter process’, which was suitably meta on day one! It turned out to be a great choice - I learned a bunch about what’s coming up for me in the next couple of weeks!

The task was to outline the following aspects of the new starter experience:

  • Jobs: Goals, and things one wants to achieve
  • Gains: Opportunities, practical outcomes, and soft feelings
  • Pains: Challenges and obstacles

It was interesting to see how many jobs could also be gains. ‘Doing’ is such a positive thing for a new starter, so many goals blended between the two. We finished by ordering the post-its in each column by importance. The ‘time’ factor made a large difference to the order. Short-term goals tended to place higher, but longer-term goals led to more gains overall.

Our jobs, pains and gains model

These two tasks were part of the problem definition phase of the heralded double-diamond.

The UX double diamond

Story mapping

The next task was to story map the current process for new starters. Again, the onus was still to focus on what’s happening now, not our desired outcomes (yet). We broke it down into a filmstrip:

  • Chapters: high-level themes
  • Scenes: Categories of events
  • Actions: Individual events

The general rule of thumb was if it can’t be broken down into smaller chunks, it’s an action. We started with scenes and worked down to actions and up to chapters. The scenes act as a time-based narrative and help pin down what happens day-to-day.

Story map model with chapters, scenes and actions

Again, as we discussed each scene in detail, we found that some scenes became actions, and others became chapters, or even multiple scenes.

The next step was to mark high and low points of the experience. This provoked much discussion on character, introversion and public speaking. Many of the actions initially marked as green by our team’s extrovert were red in my introverted eyes! Clearleft run regular ‘brown-bag’ lunches where members of the team share their experience, or something of interest. This is also part of the induction process, and for those less excited by public speaking, that prospect can be pretty daunting!

Our jobs, pains and gains model

The story map can also be extended to become a helpful tool in planning the whole project. Chapters become epics, scenes become stories, and actions become tasks. We can even draw sensible ‘release lines’ across our model!

The peak-end rule suggests that humans remember the highs/lows and the end of an experience, so that’s where we should be focusing our attention. If we identify the lows and mitigate them, we can make a dramatic difference to the view of the overall experience!

Explore ideas

With those lows in mind, it was time to find some solutions.

We began with a task to lower the barrier to sketching. Drawing is often seen as a scary and vulnerable task for those less creative, and a point of pride for those who regularly sketch! Both can get paralysed when asked to create a one-minute sketch in front of others.

This icebreaker came in the form of squiggle birds, yes, you read that correctly. The premise is as follows:

  1. Draw a bunch of squiggles on the page!
  2. Add a beak to one of the edges
  3. Now an eye
  4. And some feet
  5. Maybe a tail if you’re feeling adventurous!

Give it a go - it’s a lot of fun! I’ve also made a little JS squiggle bird to demonstrate, have a click through below!

The human brain is brilliant at finding meaning from noise, if we can create birds from squiggles, we can do some rough sketching!


So, to the task itself…

We creased our paper into six sections and had one minute to draw a solution to one of the problems brought to light from our story map. When the timer went, we moved onto the next section and drew another solution to a different problem. Six run-throughs later, and we had six (quite poorly drawn) ideas on paper! We kept those ideas to ourselves and moved onto the next task.

Taking another sheet of A3, we spent 15 minutes on one idea, going into a lot more detail. The previous task, although fleeting, was a great precursor to this activity. I ended up taking two or three ideas from it, and combining it into one main proposition.

The suggestion of brown bag preparation If you couldn’t tell, I fall into the ‘not overly keen on sketching’ camp!

Feedback & Critique

Andy then walked through a few stumbling blocks to critiques, including GroupThink, an idea that in a desire to reduce conflict, a group will often reach a compromised decision without properly evaluating the matter. I thought back to attending jury duty. Dropping a group of strangers together and asking them to come to an informed, and ideally unanimous decision, is a tricky task indeed.

To alleviate this problem, we put on thinking hats. Six distinct roles were spread around the table and we were to all assume the respective personas:

  • Blue: facilitator, the individual presenting their idea
  • White: objective, data-focused
  • Red: feelings, hunches and emotion
  • Green: creativity, building upon ideas
  • Yellow: positivity!
  • Black: negativity, ‘devils advocate’ and caution

The simple act of pinning a coloured post-it and becoming that persona took all the pressure out of presenting to the group. We all outlined our ideas and had genuinely good discussions about each one. When the ‘black hat’ brought up issues, the green and yellow were right beside you to defend and build on your idea. It was fun, safe, and productive.

Testing and learning

The final part of the day went through some processes for testing our solutions. It was mostly theoretical, but super interesting.

By structuring our work as experiments, we reduce the cost of failure. It’s a great way to propose new features or ideas to a manager or stakeholder. The key is to only test one thing against your hypothesis.

This fits nicely into a ‘Observe’, ‘Hypothesise’, ‘Test’, and ‘Theorise’ model, and can lead to great, data-driven results. Sounds a little similar to red, green, refactor!


I was so fortunate to kickoff my time at Clearleft with such an informative and interesting day. I learned a ton about UX, how Clearleft go about workshopping, and how the new starter process will work itself out over the next few weeks!

Posted on in Web