Left to right
David Si ret senior project designer; Mar: WcxxJaye, senior, Interactive developer; Alex Lokhman, programmer analyst
Artdw Edwards, senior des:gner; Dean Johnson, creative di rtttoT; Sen McGeachie, technologist.
When asked to deliver the Guinness World Records app in time for the iPad launch, the Brandwidth team had to work in record time. Here we find out about their programme of iPad development
When Norris and Ross McWhirter were commissioned to compile a book of facts by an executive of Guinness Breweries back in 1951, they couldn't possibly have imagined where it might lead. The Guinness Book of Records was first printed in 1954 and became one of the world's best-known publishing brands. Today, what was The Guinness Book of Records is on its way to becoming a digital publishing phenomenon in the form of the Guinness World Records iPad app.
To create the app, Guinness World Records used the London-based agency Brandwidth. The agency, which has
done several projects with GWR in the past, approached the company with the concept and was tasked with creating a'lite' version in time for the iPad's launch. Brandwidth is still busy working on a full version for release later this year. "As we've worked with GWR on projects ranging from websites to cinema advertising, the client is used to giving us a project and allowing us genuine creative freedom," says creative director Dean Johnson. "This was very much the case with the app. We were given a list of all required content, from photos to video to illustrated facts. Our job was to decide which image would have the
greatest impact and how it would best fit into our 3D environments."
The project threw up many creative and design challenges. For a start, the team didn't have working hardware and had to use an emulator to test it on. They really wanted to create the effect of a 3D environment on the screen, and used a parallax scrolling technique, an important distinction for Brandwidth is that content appears'within'each page rather than 'on'it. The team aims to generate the sense that you can move around the environment and interact with it rather than passively looking at it.
01-Via an interface
that uses parallax scrolling to create a 3D environment in which to explore the imagery and facts, Brandwidth wanted to achieve real fingertip interaction
"On Thursday we had the full green light and on Friday the app finally appeared on the App Store - just in time." Dean Johnson
Then there's the matter of interacting with the iPad itself which can be twisted around to deliver the content in both portrait and landscape aspects. Brandwidth had to take a call on how best to lay out screens for one-up portrait viewing, or the wider landscape doubie-page-style option.
"Landscape wins every time for this particular content"says Johnson. "We included a portrait mode but kept the expanded bottom menu raised and the spread to the top of the page. Ideally there would have been a single full-size page visible, but this required the original assets to be artworked at double the size, and we
faced a time-versus-memory issue as launch day loomed."
The atmosphere in Brandwidth's studio was electric as time ticked away before the iPad's launch. Annoyingly, the team's iPad simulator couldn't simulate everything they wanted to achieve so their first version ofGWR Lite was rejected on a technicality. They reworked it and Johnson - along with client services director Jim Carless - flew out to New York to present the app at Guinness World Records'US offices on the Tuesday before launch. On the Wednesday it was approved and then rt had to be recompiled using a non-beta SDK.
-Idlest, fastest
or strarvgestVThieftjn pat
for Brand width was dealing with GWR's extrem a content "
GWR lite" app. Fastest was nos; pertinent, though, a? they raced to finish iheaptiin time for theiPad's launch
or strarvgestVThieftjn pat
for Brand width was dealing with GWR's extrem a content "
GWR lite" app. Fastest was nos; pertinent, though, a? they raced to finish iheaptiin time for theiPad's launch
05-To demonstrate its own prowess, B-andwidth hasaeated an environment based on Times Square. Links roinformation about brandWidth's own projects appear via g towing neon lights in prime iocations.
06-Pop-up book.
Guinness WcHd Records, kea and hteractive comic orojects can all be discovered in Brand width sown
IPad-based trailer of its work.
"On Thursday we had the full green light and on Fridaythe app finally appeared on the App Store,"Johnson recalls, "just in time for us to queue overnight outside the 5th Avenue Apple Store, to be 6th and 7th to purchase an iPad and download our app."
Brandwidth also works on websites, experiential design, branding, marketing and digital strategy, but Dean Johnson and his team clearly sense a great opportunity in digital publishing on the iPad, As though in tribute to their experience queuing at the Apple Store on 5th Avenue, they're developing a Brandwidth trailer for iPad which.
07- 08-Brandwidtn runsd' Apple-friendly office, with much of the design and development work undertaken on Macs.
09 -10-Brandwidtn's.
office environments sees developers working alongside designers, and even hanging bicycles.
The Guinness landscape
Brandwidth's GWR iPad taster features 11 spreads versions of the application this function has
and content including text, videos and been abolished. It's best viewed landscape, and
photography. The team endeavoured to make it Brandwidth has kept it that way. "The Guinness
as interactive as possible, pulling the user into World Records brand is a designer's dream client,
the content and allowing exploration. One of the says Dean Johnson. "Imagine a visual palette
key challenges is one that all iPad developers are consisting of records that can be set in
facing as they develop the'page'concept; absolutely any category, each one taken to
Brandwidth decided that landscape is the best extremes. Where else would you get to work
way to view itspresentation of the content,;® with deadly animals, Usain Bolt arid the world's
there is no distinction between the single-page most tattooed man? Again, experience stands
portrait and double-page landscape notions for a lot and we were able to include the
found in magazines, initially, you could rotate the editorial, marketing and sales teams in the
IPad and look at the landscape presentation as a development process, and will keep these
band across the portrait space, but in newer stakeholders involved."
recreates a realistic vision ofTimes series of pop-up books for the iPad. "I'm not
Square. In place of the actual neon keen to empty our bookshelves in the same
advertising you see at Times Square, the way that CD racks are now gathering dust,"
demo highlights Brandwidth's own he says. "A physical pop-up book is a great
projects, illuminated and ready for the user illustration of interactivity that has been
to tap on to find out more about the accessible and entertaining for years." individual project. For Brandwidth, it's not a case of
Perhaps because of his overall converting the format to something that
love of design, Dean Johnson's thinking is will be less than the original book - nothing
much more subtle than many in the digital can actually pop out of the iPad screen,
realm when it comes tothepaper-versus- Instead, the challenge is to find ways of
pixel debate. And this is coming to bear in a adding value to the content that the iPad
current Brandwidth project to develop a can capitalise upon. To do so, Brandwidth .
11-Imagine the Ikea
catalogue without paper, where you can see the kitchen you want in the colour you want it in, then check avai labi lity, delivery dates and price
"We'll be aiming to revolutionise the digital publishing market." Dean Johnson
12-The dessgn and development teams created apps in Photoshop oefore they were passed Through a Java environment and then on through the Xcode IDEis working with State of Play, a Flash-based games developer.
"Imagine a combination of the concepts; offering the ability to browse a beautifully illustrated children's book and po|>up animation that now allows for interaction within each spread beyond the simple pulling of tabs - we now include an educational gaming element, or an engaging animation to bring the book to life," says Johnson.
There are also some very interesting ideas being formulated in customer publishing, and Brandwidth is working on some great concepts for an Ikea iPad app. Once again, Johnson's approach has been to imagine a number of possibilities and think how each can add value the iPad way. Of course, it does away with the printed catalogue and all the waste printing and distribution entails, the customer can feel like they have a guide to thousands of products right in their pocket, and the experience can be personalised.
13-An interactive digital comic book
is in the works, where the feaders'choicescan determine how the story pans out.
14-The iPad might not quite be able to beat the sensations a child experiences with a pop-up book, but it can provide gameplay within the story that a book cant
15-Brandwidth's offices exude an air of calm creativity. echoed in its development process.
Johnson is excited about the possibilities of what it can offer to the consumer and the retailer: "We are looking at configurator options where the user is able to see not only their furniture choice, but also in the style and colour they want, on their terms. Why not add an element of fun to the whole process with a randomising function when the retailer offers a vast range that may not otherwise have been viewed? Augmented reality is another option whereby coded furniture is recognised in store and pricing is immediately displayed, then ordered with a simple tap of the screen."
Of course, there's a scramble going on right now to bring content to the iPad. Some will feel compelled to create literal translations of their book and magazine pages, or websites, directly to the iPad. 8ut for Johnson, the cleverest publishers are taking a step back, thinking about their creative property and choosing things where a'halo effect! as he describes it, can be created around the content by using the technology.
Going forwards, this emphasis on technology is definitely part of the Brandwidth plan."Multitouch will become even more widely accepted as the interactive method of choice," predicts Johnson. "First iPhone, then iPad, iMac to follow. We'll be aiming to revolutionise the digital publishing market, take experiential marketing to another level and add multi-platform portal apps to our development plan. Moving on, gestural Ul will be the new multitouch, but we've got to wait for the mass-market technology to catch up first!" www.brandwidth.co.uk
In development with Brandwidth
How unity between design and development teams helps the agency develop ideas from drawing board to App Store
Digital products frequently seem to throw up tensions between the creative vision and the technical constraints, and consequently in some agencies the content creators sit in separate rooms- sometimes even in separate buildings-from the developers who handle the code. Not so at Bandwidth, where everyone mixes it up together. The idea is that designers can constantly bounce their ideas off the developers, rather than feel stymied by code constraints.
Dean lohnson says: "For app design, the first tool is still a pad find pen, then Photoshop before handingover for optimisation in a lava texture atlas creator. This is then read by the app, wliich is written in Objective C++ using the Xcode IDE. The graphics are rendered using OpenGL ES. It's great to see everything for apps being buil I on Macs - a world away from our web team's process where PCs are still deployed to perform most of the development work."
No comments:
Post a Comment