The organisers of the FullCodePress international site in a day competition asked me to interview some of the team members about their experience and the process they followed, and to share some of my thoughts on how the two sites were judged in this competition.
My first interview was with the teams’ designers: Sarah Peeke, from the Australian team who came runners-up, and Steve Dennis, from the winning New Zealand team — the CodeBlacks.
Interview with Sarah Peeke (designer for Team Australia)
Matthew Magain: How did you tackle the hurdle of creating your client’s visual identity in only a few hours?
Sarah Peeke: I came into this competition thinking the organisation would already have an official logo in place. Once we agreed that there was a need to create one, it certainly presented a further challenge.
The name of our charity was The Ripple Effect (an organisation that helps change the lives of Thai children and their communities). I wanted to steer away from the cliché of water drops, and the client had mentioned that they wanted to incorporate the children’s hands into the branding, so that was what I focussed on. In the end, though, there were many design elements and other finishing touches that I had ready to implement which, unfortunately, we didn’t have time to include.
MM: Did you follow your usual design process? Any shortcuts taken?
SP: My preparation for the event involved analysing what I could do to become more efficient. It really helped me to question my normal design process, and I’ve actually come away from FCP with a more efficient design strategy. I guess time constraints meant that the creative process was limited. I would normally spend a lot longer on a client’s identity/branding for example.
MM: How did you find the sleep deprivation, and how did you deal with that?
SP: Actually, surprisingly well. I deliberately ate fresh fruit and salads during mealtimes so I didn’t feel too sluggish, and avoided indulging in too much coffee and chocolate etc. It was only once the event was over that I felt like I’d been on a flight to the UK and back. It took a couple of days to feel human again.
MM: What tools did you use to stay organised?
SP: Well, I spent a few days prior to the event developing a new tool called myColorizer, which incorporates all my favourite color tools into one browser-based user interface. It includes a color mixer, harmonizer, converter and template simulator. But best of all I can store client identity colors and other colors to be used in the web site in palettes on the same page. There is also a built in color contrast analyser which uses the AERT color contrast algorithms and luminosity contrast ratio. I’m hoping to make a “lite” and “pro” version available in the near future. Other than that, I made up some mock illustrator/photoshop templates in various resolution widths to help save time on the day.
MM: What was the biggest hurdle for you personally, and how did you tackle this hurdle?
SP: Not knowing the client (obviously), and not having met the other team members — we’d only had the opportunity to chat/email on a few occasions. Otherwise, I’d have to say, from a design/coding perspective, that it was somewhat frustrating trying to wrangle our “CMS of choice” to output clean, effective results efficiently. In the end, I think what got us over the line was the fact that we all really respected one another’s areas of expertise, we communicated freely, were flexible and really enjoyed working together. Would I do it again? Now that I’ve caught up on my sleep, you bet!
Interview with Steve Dennis (designer for CodeBlacks)
Matthew Magain: How did you tackle the hurdle of creating your client’s visual identity in only a few hours?
Steve Dennis: It’s probably fair to say that our client (Grampians disAbility Advocacy Association) didn’t really have a clear vision for what they wanted out of the site, or a real appreciation for what was possible.
We spent the first two hours working through what their organisation was about, trying to bed down exactly what the site should try to achieve. When it became clear that there were three main target audiences for the site (people with disabilities, carers, and agencies) we decided that the site needed its own brand. Because a significant portion of the audience may have vision or reading problems, we kept the name short, bold, and used Helvetica Neue as the typeface for legibility.
It wasn’t an ideal situation certainly. Being able to easily draw visual parallels from what the GdAA do sped things up a lot, as did the lack of client revisions. My only requirements for the logo was that it was colourful, exceptionally easy to read, and simple, without seeming patronising. The whole thing was a bit of a gamble at the time, because if they didn’t go for it, I would have just wasted more than an hour. It worked out in the end though.
MM: Did you follow your usual design process? Any shortcuts taken?
SD: I didn’t have any plans going in about what kind of process I was going to follow. I tend to work in a pretty ‘agile’ (unorganised) way to start with, as I find I can come up with more creative ideas when I’m not limited by organisation. Then i’ll kind of take those ideas and tweak them to fit the requirements. The first concepts I came up with were pretty much what we ended up running with, so I didn’t have to worry about doing multiple concepts, or having too much in the way of client revisions and changes. They were shown what we were doing a few times during the process, but they loved what we were doing and didn’t have any changes really. It was actually one of the easiest designs I’ve done all year because of this.
MM: How did you find the sleep deprivation, and how did you deal with that?
SD: It was actually a lot easier than I expected. Once you’re focussed time goes really quickly, then you get your second wind. I didn’t end up sleeping until about 7pm on the sunday night. I tried energy drinks early on, but I think I had a few too many and my tongue started hurting… I don’t reccommend that at all. Coffee and lots of laughs were the key to success.
MM: What tools did you use to stay organised?
SD: The biggest thing was really just communicating well at all times, and having a good project manager like Thomas on hand to help solve any problems we ran into.
MM: What was the biggest hurdle for you personally, and how did you tackle this hurdle?
SD: Definitely using the existing GdAA logo. I think branding the web site differently was an absolutely essential step in creating a great community-focussed site. Luckily it’s a hurdle I’m used to — I was just lucky they were receptive to the idea.
My judging comments on visual design for Team Australia’s site
One of the biggest strengths of The Ripple Effect’s design is the attention to detail — the drop shadows and gradients are subtle and don’t fight for attention. The recurring elements of handprints is a nice constant reminder of teamwork and the nature of this charity’s work, too.
My criticisms pertain to the logo and the colour scheme. The logo doesn’t feel fully developed to me — the single handprint works well, but there’s something about the type that feels a little too generic. Whether the kerning between letters is not quite right, or possibly there is not enough contrast between the top and bottom lines. I’d also suggest that a font like Century Gothic is maybe better suited to a different type of organisation, like an art gallery or a fashion house.
My other comment is that the green/grey colour scheme results in the pages feeling a little cold, and easily mistaken for a charity that is involved in environmental campaigns. For a site that is trying to attract enthusiastic volunteers who want to get involved and get active, some warmer colours might have been more appropriate (possibly drawing upon some of the rich colours available in Thai culture, especially given that the logo reflects nothing about Thailand). It also feels to me like the site’s header drops away to nothing at the edges. A sharp border alongside such solid whitespace gives a feeling of incompleteness, although it’s possible that this is one element that was not completed due to time constraints.
However, overall the attention to detail and subtle touches still make this a really effective, clean design.
My judging comments on visual design for the CodeBlacks’ site
I think from a visual design and general identity angle, the CodeBlacks definitely had the more difficult challenge to tackle. The client had an existing logo that is, well, obviously not something that was designed by a graphic designer. Having to create an identity that was both new and supplementary must have been very difficult and risky, but the logo and colour scheme works really well — I like the hierarchy reflected in the colours chosen, and I like the fact that, even though the main colours are bold and bright, they are not default pantones but instead slightly muddier shades of the primary colours. The combination of rounded corners and rough, grungy lines is effective at portraying the organisation as being modern, without being too clichéd.
My main criticism is that the hierarchy created by the colour scheme (red for people with disabilities, yellow for carers/families and green for agencies) that is terrific for users to orient themselves gets lost once you leave the home page, although this is possibly more an IA issue.
Matthew MagainMatthew Magain is a UX designer with over 15 years of experience creating exceptional digital experiences for companies such as IBM, Australia Post, and sitepoint.com. He is currently the Chief Doodler at Sketch Group, Co-founder of UX Mastery, and recently co-authored Everyday UX, an inspiring collection of interviews with some of the best UX Designers in the world. Matthew is also the creator of Charlie Weatherburn and the Flying Machine.
