The story of the double hump camel

The classic story arc is often depicted in the shape of a hump, starting at the base of exposition with rising action to the climax, which falls off to the final resolution. This formula has served us well for many decades, arresting the attention of a lean back audience just waiting to be entertained.

In today’s environment, however, this model is proving less effective. Our mobile toting, easily distracted, fast scrolling, content snacking, interacting audience is a quick flick of the finger away from scrolling straight past your beautifully considered video to the adorable kitten in the next post.

The pervading wisdom to combat this trend is to make shorter and shorter content. However, the facts remain that stories need to be no longer or shorter than it takes to tell them well; and audiences will spend time with video content if it’s engaging and relevant.

One solution  is what I affectionately call the ‘double hump camel’. With this approach, the first story arc happens very quickly, capturing attention up front in the first few seconds and quickly delivering a concise brand message. Some of the audience will keep scrolling and that’s ok, you’ve achieved more than you would have otherwise. More importantly, you pique the interest of your key target audience and encourage them to stay to experience the ‘second hump’, where you can take a little more time to deliver the complete, expanded message to an engaged audience.

So, ask yourself, one hump or two?

Web design app review

Like many web designers I’ve been getting increasingly frustrated with traditional design tools and workflows, creating a static mock in Photoshop and handing it over to a developer just doesn’t cut it anymore given the demands of responsive layouts, rich interactive web applications, animation and high DPI screens.

After chatting to peers and doing some online research I came up with this short list of potential apps that are designed for the modern web. Opinions below are the result of spending about a day in each app while exploring potential article page design directions for a project I’m working on.

Adobe Edge Reflow

What is it?
A html/css design layout engine focussed on responsive layouts
The good
Part of Creative Cloud so you may already have access to it
‘Edge Inspect’ works great so you can see changes reflected on your mobile screen as you design on your desktop
There’s supposed to be an import layout from photoshop feature which sounds amazing but I couldn’t get the two apps to recognise each other, weird.
The bad
Clunky learning curve for break points, no support for animation, limited support for roll over states etc.
Feels like a beta, see above re. the photoshop integration
I think this could easily have a place in the design workflow, it wont replace photoshop but as an interim tool or one for particular types of projects it has potential. In combination with Edge animate you could produce interesting animated prototypes fairly quickly, but Edge Animate doesn’t seem optimised for developing user interfaces.


What is it?
A html/css design layout engine focussed on responsive layouts
The good
It’s pretty and has a lot of potential
Creates close to go live code
True wysiwyg, the design engine is a browser so text etc looks like it will look (on some browsers anyway)
Reasonable one off price
The bad
Sooooo buggy as to be unusable
Lack of interaction/animation tools
I really wanted to love this but it’s not ready for prime time in my experience, I had multiple crashes that made completing my project impossible. Check back again when they release v2.


What is it?
A vector based design tool focussed on creating multi resolution graphics and UI
The good
Great features like pixel view, reusable elements you can update on the fly and great exportability, individual image elements and css
Reasonable one off price
True wysiwyg, text etc looks like it will look in code (on some browsers anyway)
The bad
It’s still a static design tool, albeit one that’s much more focussed on how we design UIs today
I can see it replacing photoshop for product design quite easily, I’m keen to use it more, but it doesn’t solve the interaction issue. In situations where you’re working with a UX designer I can see this being a great collaboration tool to maintain the same files from wireframe to high fidelity comp.


What is it?
A web app focussed on creating responsive typographic led layouts
The good
Fast, intuitive interface
Baseline view & encourages good typographic practices generally
Export css
View multiple break points simulataneously to see how design changes flow over screen sizes
True wysiwyg, the design engine is a browser so text etc looks like it will look (on some browsers anyway)
The bad
Bit of a one trick pony, poor support for imagery, interaction etc. but it does what it says on the tin, well.
Great for testing font choices and creating a solid typographic system that respects baselines etc. but the monthly subscription is maybe a little steep as I can’t personally see a need for this on a weekly basis given the variety of work I do. May well be perfect for others.


What is it?
A web app focussed on creating responsive sites
The good
Solid intuitive interface
Great feature set
Support for animation and interaction
The bad
Monthly plans only
It’s a web app so there may be security issues for sensitive design projects in large organisations
A few bugs but they’re actively being squashed
This is definitely the closest to what I was looking for, really enjoyed using it and the animation/interaction support is heading in the right direction for fast/rich prototyping. Only the price is making me second guess committing when I already have Adobe CC.

Isn’t it time for responsive advertising?

Display advertising can no longer be defined by pre determined pixel based ad units. As screen sizes diversify and new devices are introduced we need to provide advertising and sponsorship solutions that deliver value to clients across all mediums.

We see these issues all the time, legacy ad units that don’t work in a mobile context so they prevent publishers from monetising the growing mobile audience and deliver a broken user experience that falls short of reader’s expectations.

Here’s an example from the not too distant future:

Sanitarium have a new breakfast product that utilises the latest scientific research to create the perfect breakfast food.

It’s 7am, your smart watch alarm is connected to speakers in your bedroom via Bluetooth. A song of your choice plays followed by the audio breakfast wrap news headlines ‘brought to you by Sanitarium, the right start’.

Sitting down to breakfast you browse a headline of interest from the breakfast news update on your tablet, on tablet articles have a time sensitive interactive ad unit that shows you how different breakfast options effect your energy levels throughout the day.

Hopping on the train you pick up reading the same article, on your mobile the sponsored ad unit is a follow on article that has 5 quick tips for the best start to the day. You notice another article of interest and save it to your reading list.

Later at work, you grab a coffee and take a quick break to read the article you saved earlier. On desktop breakfast wrap articles have a sponsored video billboard that gives an inside look at the science behind Sanitarium’s new product.

4 mediums, 4 appropriate, in context sponsorship incarnations that add value to the reader and advertisers that would command premium rates & generate true engagement.

By developing responsive ad solutions publishers can create a strategic advantage over competitors and position ad solutions for future growth instead of relying on ageing formats that are decreasing in value.


ReadrBoard captures reader reactions to any phrase, image, video, or whole page.


A few of my favourite tions


An interactive conversation is always going to be more satisfying than being talked at. Sure there are times just listening can be engaging, but more often than not being participatory adds to the experience. Interaction, when it comes to communication and advertising, adds so much potential for engagement, personalisation, self expression and brand development. With the digitalisation of more and more media (TV, radio & even print if digital paper progresses) the potential for interactivity will only increase and along with it the expectation of customers that they will be able to influence and customise how, when & with who they engage with. Best start practising now then.


It should be so obvious shouldn’t it? Unlike those of us in the industry, the public are only occasionally exposed to a brand amongst many, many thousands of other advertising messages. Given this, shouldn’t it be pretty clear that the right hand needs to know what the left hand is doing and that the messages need to be integrated? Disparate messages from one brand will just be further diluted in the mass of information we all encounter every day. I’m not suggesting it should be the same message, but it absolutely needs to be communicated with the same voice. Like the arc of a good novel, a brand’s story should build over touch points to communicate an integrated message.


it absolutely needs to be communicated with the same voice


Change is good. Embrace change. Change is progress. Like stagnant water, without movement and forward progress we wither and die. Without constant renewal all things naturally move towards decay. Technologically we’re living with the fastest rate of change in human history and no where is this more apparent than in communications and access to information. For brands this means that what worked last year isn’t necessarily going to work this year. We must innovate to survive.


Collaboration makes us smarter, it’s crowd sourcing, it’s open-source, it’s learning and sharing with each other, across disciplines, across generations, across cultural and physical divides. Humanity coming together to solve issues is inspiring and rewarding for all involved. Of course we’ve all experienced the singular vision of a great idea be corrupted by group consensus but it really doesn’t get any better than when like minded individuals with diverse talents and experience collaborate towards a common goal.

Here is today

A lovely interactive timeline

Autocratic, democratic, it’s problematic

“I’m a creative. I’m autocratic.”

It was Henry Ford who said, “If I had asked my customers what they wanted, they would have said a faster horse.”

I understand your needs better than you do, and I understand your customers’ needs better than they do. I’m all about following my gut feeling and relying on my instincts; about applying my knowledge, talent and experience to a problem.

“I’m a creative. I’m democratic.”

I understand that the end user is an expert in his or her own life. I know that a design will only be successful if I truly understand the individual’s life, their wants and needs; I know that I need to understand this context to create a relevant solution.


Opposites perhaps, but both are important. Did consumer research tell Apple the public wanted a phone with no keyboard and a multi-touch interface? On the other hand though, if Ford had understood the changing needs of its customers, they may have switched to producing smaller, more economical cars (instead of trucks) in time to ensure the company’s future.

The trick is to know how much of which approach to apply when – when to watch and when to ignore, and when to fight and when to learn. If we always take the autocratic path we risk creating irrelevant white elephants. Similarly, if we always play it purely democratically we’re guaranteed to produce mediocre solutions in bucket loads.

It’s all about balance.