— Drew Hajduk: UX Designer

BBC_logo

Role:

Lead User Experience Architect

The brief:

Lead the UX on a project Code Computerlove carried out for CBBC & Cbeebies exploring the evolution of thier mobile and tablet offerings, investigating oportunities for both app and future responsive websites.

What we did:

Understanding the audience & stakeholder needs

First we ran a series of workshops with the key stakeholders from CBBC and CBeebies to establish the goals & KPI’s for the project. Once we had established the business needs we needed to understand the audience.

This was a first time designing for children for most memebers of the team. To help us understand more about childrens behaviour, we conducted extensive desk research. We also carried out ethnographic research at our offices where we observed children aged between 3 and 12 naturally interacting with a range of different devices.

Ethnographic research

Ideation facilitation

With such a breadth of experience among the stakeholders at CBBC and CBeebies it was of vital importance to keep them involved throughout the project.  As lead UX I faciliated two all day multi-disciplinary ideation sessions bringing together team members from both Code Computerlove and BBC.

BBC Ideation

The teams worked through out the day to create ideal future scenarios, user jouneys as well as prioritised content.  The posts it’s were out in full force!

BBC Ideation

It’s always nice to get some nice feedback from workshop atendees!

Twitter : TomBradley: Great workshop hosted by ...

Concept exploration

The workshops gave us exactly what we needed.  At this stage we had agreed the user journeys through the sites, prioritised content requirements and a had the future vision from the CBBC and CBeebies staff.

The next stage of the project was to work directly with the design team to skamp out design ideas reflecting our thinking so far.

BBC Sketches

Concept Visualisation

Once the user experience and design teams had agreed the initial concepts, the design team with guidance from UX created a full set of visuals demonstrating how both CBeebies and CBBC could approach a responsive future.

Please note BBC have asked us to keep this stage of the work confidential.

BBC interactive prototype

Interactive prototyping

Once we had design visuals signed off by the BBC we worked to create fully funcioning interactive prototypes to take through to user testing using Axure.  The BBC team then took these through to lab testing with brilliant feedback, the result of which is a large chunk of the conceot work now being implimented across the CBBC & CBeebies sites.

BBC_interactive_prototype

Results from testing

Once BBC were happy with the prototypes they took them to an external agency for testing.  Here are some of the results:

This ‘next game’ link was well-placed on the screen, and aided the typical navigation of children (onto another game, almost at random)

The ‘More’ buttons at the bottom of long lists of games and shows worked well. This again reflects younger participants’ willingness to scroll through a lot of content

“This error page was laid out in the right order to match both adult and child needs. CBeebies children went straight to one of the other suggested games. They didn’t try again, or try to find out why it wasn’t working.”

When they needed it, they noticed the A – Z, and it worked well. They appeared to be able to scroll down the page to find the specific content they wanted.

Find out more

Want to know more about my work, my design process or just want a general chat?.  Please get in touch with me by phone on +44(0)7986 513187 or email me.

Read More

Oxfam_logo

The brief

Create a site campaign site that ranks the social and environmental policies of the world’s 10 biggest food and beverage companies (that together make $1 billion a day) with a scorecard – naming and shaming firms failing the millions of people in developing countries who supply land, labour, water and commodities needed to grow their products.

My Role

User experience architect

What we did

This was one of those projects where the UX designer gets called in a bit later on.  The campaigns team at Code had worked hard to create a concept that Oxfam loved, however having started to design the site they where struggling to establish the user journeys through the site as well as creating a responsive design methodology.

I worked with the design team to create user journeys, sketch up responsive designs and raise awareness of usability issues throughout the creative process and development phase of the site.

Oxfam_grow

Oxfam Grow Homepage

Oxfam Grow Screenshot

Read More

Travis Perkins Logo

My Role

Supporting senior user experience designer

The Brief

The main Travis Perkins was showing drop off at the checkout stage of purchases on the site.  As part of Code Computerlove’s work with Travis Perkins we developed and tested a number of interactive checkout journeys to establish a more effective solution.

Interactive prototypes

Based on the user testing scripts created by the senior UX architect I created a number of high fidelity interactive prototypes in Axure.

Travis Perkins Checkout Protottype

Lab Testing

These prototypes were tested with a range of Travis Perkins customers in order to find the most efffective solution and create more suitable user journeys. I assisted the senior UX architect observing the user testing sessions and taking detailed notes.

User testing

Solution design

Once we had some conclusive results we prototyped solutions for Travis Perkins through sketching a range of page and interaction designs. If needed these were again taken through to Axure to demonstrate more complex interaction patterns.

Solution sketch for the Travis Perkins checkout

 

Wireframe solutions

 

Find out more

Want to know more about my work, my design process or just want a general chat?.  Please get in touch with me by phone on +44(0)7986 513187 or email me.

Read More

benenden_logo

Lead UX creating a mobile web experience for the Benenden Healthcare Society.

Beneden mobile homescreen sketch

 

Benenden mobile sketches

Benenden Mobile Site Map

 

Benenden_mobile_home_screen_1

 

Benenden mobile hospitals screen

 

Benenden mobile contact us screen

 

 

 

Read More

“The world is more malleable than you think and it’s waiting for you to hammer it into shape.”

- Bono

(via http://www.one.org/us/)

Read More

At Code we use PET (persuasion, emotion & trust) in most of the projects we carry out.  Oglivy’s new campaign for Expedia makes great use of a few techniques using those all to familiar three letter airport tags.

Visual imagery

The design makes good use of instantly recognisable visuals to create an emotional response and speed up response time.

Priming

The advert uses images and words that users associate with a specific concept, travel.

Story telling

The adverts tell a story that includes the users. They use words that suggest a number of different narratives that we are all familiar with whether this is humorous situation, asking our parents for money or missing a loved one.

Triggers

The advert places a small nudge at the end of the page stating “stop wishing, start searching”. This is a nice reminder that the user should search for a holiday on Expedia.

Oglivy Expedia advertising campaign

Oglivy: Expedia advertising campaign

http://www.ogilvy.co.uk/

Written while listening to

Jon Hopkins ‘Light Through The Veins’

Read More

Twitter : TomBradley: Great workshop hosted by ...

Yesterday I ran an ideation workshop with the CBeebies design & editorial team as well as some peeps from Code.  It’s always nice to get some positive client feedback!

Read More

Yesterday I went on a little photography mission around Manchester city centre with my good friend Dom. We didn’t have any specific themes in mind when we set off, but the light was pretty awesome with the sun just starting to drop below the horizon. Here are some of the photos I have developed so far, you might notice I have a new found interest in shadows.

A shadow from a tree in manchester city center

A shadow of a tree in China Town Manchester City Center

Architectural Lines

Isolation

Read More

47 Mind-Blowing Psychological Facts You Should Know About Yourself

First in the series of 100 things you should know if you are going to design an effective and persuasive website, web application or software application

Ten laws to design by

A list of ten clear and effective design laws designers can use as proven formulas for better design. Very useful and definitely one to add to your favourites.

Dieter Rams: ten principles for good design

Is my design good design? Dieter Rams asked the very same question. Good design can not be measured in a finite way but here are ten principles for what Rams considered to be good design. It’s a pretty good list!

What passbook is and isn’t
A good explanation of what Apples passbook is. An interesting development when it comes to designing websites and servies for companies who use tickets.

Read More

I come alive in the night time
Creative Commons License Photo Credit: Shandi-lee Cox via Compfight

One of the projects I am working at the moment is heavily driven by photography.  While doing some research  I came across a theory called Line Of Site.

If you want someone to take action, say donate to your charity, then the user needs to be made explicity aware that they can donate. Online this means that users need to clearly see the donation form. Often as designers we think these things are painfully obvious, but as we all know this is often not the case for a first time visitor.  Line of site is about directing visitors attention toward what you want them to do!

Chemistry.com is a well know and great example of how line of site can be used effectively

Derek Halpern gives a good example of how line of site effects us in everyday life

“Imagine you’re walking down an empty city block and you spot someone curiously looking up at the sky. Would you quickly glance up to see what has their attention?

Absolutely! Now you’re wondering, what does this have to do with websites?

Let’s say you’re going to use a picture of a person on your website. Keeping line of sight in mind, you should direct their gaze the direction where you want your visitors to look.

Guess what happens? People will follow the gaze of the person in the picture because a human gaze is like a big red arrow pointing in a specific direction.”

In other words, line of site is a really good way of getting people to focus on important bits of information, whether you are designing a website, or a poster for print. The good news is that research shows that using graphics such as arrows is just as effective as photography.

Read More