Lemon Digital

Project: Tweet to Help a Heart

2011-03-01T22:26:00.000Z

This week (Feb 28 - Mar 11) it's Heart Radio's Have a Heart appeal and our client, More Than, are joining in the fundraising by asking everyone to tweet a pledge of support - for all those that tweet #HaveaHeartWall, a donation of £2 is made.

Lemon built the 'wall' - a microsite that displays a mosaic made from the avatars of all those that participated.

More Than hope to raise £20,000 by the end of the week. Get tweeting at www.morethanfreeman.com

Marvel at Podge in 3D

2010-12-08T14:46:00.000Z

Each year the brightest and the best in the UK digital industry get together for an annual networking event (ahem…piss-up) called Digital Podge.

Hosted by a very popular chap called Phil Jones, the Podge events have become so big each one warrants its own theme and website. Back in September Mr Jones passed the honor for creating the theme, website and print for Digital Podge 2010 to Lemon.

We were thrilled obviously, but we had a tough act to follow. Last years agency, Line, had raised the bar high by developing a rather clever theme and website which had been collecting awards left, right and centre.

So what should the theme be this year…hmmm? It had to clever, current and fun. We had a few ideas, but one rose to the top; this year Podge would be presented in glorious, eye-popping 3D!!!

We decided to take Podge back to where it all began for 3D - back to the 1950’s and the era of the 3D terror movie. Forget all your high tech Avatar crap, much better to have a dinosaur rampaging through the streets of London with some nice B-movie styling in the background (nothing to do with budget you understand).

So please put on your anaglyph glasses and marvel at Digital Podge in Natural Vision 3DIMENSION

Project: Despicable Me Desktop App

2010-09-22T15:53:00.000+01:00

Our first project for new client Universal has just launched! It's a desktop app (built in Adobe Air) for new film, Despicable Me.

The concept for the game centres around the user training and working their five Minions to build as many machine's as possible each week. Over-worked Minions faint with exhaustion though, so you need to keep an eye on them. To help, we built extra functionality so users' could check the progress of their Minions through Facebook. The app posts updates to users' walls, letting them know when a machine is built or when the little fellas need a bit of love and attention.

If you fancy looking after some Minions of your own, you can install the app here.

BBC Dimensions

2010-08-23T12:11:00.009+01:00

Nice example of data visualisation done by BBC using Google Maps:
http://howbigreally.com/

Lemon needs a Junior Designer!

2010-08-11T10:11:00.002+01:00

We're hiring again. This time we're looking for junior digital designer.

This is a great opportunity for an individual with real drive and commitment to constantly develop their creative skills. Primarily you will support the team with your skills in flash and motion design to deliver big brand work for our clients, but you will also get a chance to experiment with new technologies through our Labs projects.

If you are looking for a position where you will have an opportunity to grow quickly, receive direct mentoring from an experienced creative and have the opportunity to work on experimental projects with cutting edge technologies then this is the job for you!

The ideal candidate will have at least 1 years experience working in a digital agency and should be able to demonstrate (through a portfolio) their ability and skills in flash and motion design.

Specific skills required:

Flash, Photoshop and Illustrator
Basic After Effects skills
3D and/or craft skills is a bonus
At least 1 year proven experience as a flash designer in a digital agency
A graphic design or related degree
Meticulous attention to detail and an understanding of the quality our clients expect

THIS POSITION IS NOW CLOSED

We're hiring!

2010-06-16T17:23:00.002+01:00

We need a new digital producer to join our small but perfectly formed team.

Are you passionate about digital, obsessed with producing work to excellent standards and have a determined attitude that means you always deliver to deadlines?

We need a talented and enthusiastic producer with a can-do attitude. You must be comfortable with taking the lead, owning projects and will enjoy the challenge of growing our accounts. You will be a natural problem solver, highly organised and calm under pressure and have excellent client-facing skills, coupled with a proven track record of delivering digital projects to time and budget.

Experience managing digital banner campaigns, microsites, social networking and mobile apps is a must and ideally you will have at least 2 years experience working within a fast paced digital agency environment.

Your responsibilities will include, but are not limited to:

Day to day management of digital projects / accounts
Supporting the team in retaining accounts and building new client relationships
Interpreting client briefs and requirements
Scheduling and assigning relevant resources
Briefing in designers and developers within the Lemon team (both in-house & external freelance network).
Co-ordinating the delivery of multiple projects at one time.
Quality control of all work that leaves Lemon and reporting back to the team where applicable.

Specific skills required:

At least 2 years proven experience as a digital Producer (or similar) in a respected integrated or digital agency
Excellent communication and interpersonal skills
Good understanding of the technical and creative production process
Meticulous attention to detail and an understanding of the quality our clients expect
Ability to multi-task, prioritise and work to deadline under pressure
Basic hands-on experience with Photoshop, XHTML, CSS, Fireworks, Dreamweaver, Flash and other is advantageous

If you are interested please apply to sarah@lemondigital.com

NO AGENCIES PLEASE!!! I will ignore you...

Augmenting Reality

2010-06-14T10:40:00.001+01:00

After augmented reality was made available for web platforms such as Flash, it became quite popular to build such AR capable apps. It looks as if what started as a revolutionising way of interacting with virtual interfaces is now as repetitive and pointless as QR codes came to be.

But have we explored all that AR can bring us? As for most "new" technologies, it's not what it does, but how we use it.

In my simplistic mind I separate AR projects like this:

By definition AR is the act of augmenting or enhancing reality. But when all this means is printing a piece of paper and looking at a 3D model on a monitor, it just makes me think: why not just put the 3D model in the monitor in the first place? The answer to which would be the interaction capability provided by the ability of physically handling the virtual model. But then again, it all depends on what you do with it.

Rubbish

If you just want someone to visually explore a 3D model/environment, making them go through the trouble of downloading and printing something is just not the best way. Don't take me wrong though, it's really amazing! But it gets old pretty fast. Also the fact that you have you to keep changing medias can be quite confusing for the user.

If you can eliminate the printed tracker you start making things easier for the user and ultimately creating a fun experience.

Fun

This example, done by Total Immersion, doesn't make use of any printed tracker instead it uses face tracking. This allows you to instantly engage with the AR experience. Only negative side here is that you have to download a special plugin since it doesn't support flash. But they have several other examples that definitely show that not using a printed tracker is the way to do it. For example:

It's definitely amazing and really engaging. But what can be done with it?

Functional

Even though the AR tracking is what makes it really fun to interact with, AR shouldn't be limited to it. This is a nice example of augmenting reality with no real need of tracking in order to convey a powerful message.

Fun and Functional

This card game offers extras and a new interaction with the cards. What's really good about this example is that it doesn't need a tracker, instead uses the actual card.

I'd say there's much to be explored and, as some of these example show, we'll probably still be seeing a lot more of AR.

Project: Starbucks

2010-04-29T15:25:00.005+01:00

Word of how great we are at localisation has crossed the water!

For the past week Prash has been burning the midnight oil with BBDO in New York to complete a series of localisations for Starbucks. We were tasked with design and localisation amends for 5 international sites.

Check out the site and make a pledge.

Project: Sony 3D TV ads

2010-04-28T15:08:00.019+01:00

Over the past few weeks we've been busy producing a global ad kit for the launch of Sony's 3D HD TV. It’s been fun, especially for Rodrigo as it features his fellow countryman, Brazilian footballer Kaka.

We were commissioned by creative agency Anomaly to concept and build standard and rich media formats for the campaign. The concept centred around the 3D viewing experience with Kaka coming out of the TV and into the viewers living room.

Below is the final video used in all rich media formats. Lemon were responsible for delivering all post production, re-creating the ball in 3D, adding 3D elements to the scenario as well as visual effects to give maximum impact. The final interactive banners can be viewed in our portfolio section on the website.

Sony 3dTv Banners / Post Production from Sarah Evison on Vimeo.

Bye bye bowling

2010-04-23T15:54:00.003+01:00

Today is a sad day. Anne has left to go back to Germany and finish her studies. Boo...so we took her out last night for a bit of bowling and apparently a LOT of food! We'll miss you Anne, you've been awesome.

More pics on Flickr

An amazing paper animation

2010-04-20T12:08:00.004+01:00

This is a really cool film produced by Colenso BBDO for NZ Book Council (Animated by Andersen M Studio). I hope you like it too :)

Former Lambada King joins Lemon

2010-04-07T15:05:00.028+01:00

Like our new website? The pixel landscape, complete with twitter bird (watch out for the poop!), are thanks to the talents of our new creative lead, Rodrigo Mattioli.

Rod hails from Brazil where he won awards working with Publicis, Agencia Click and TBWA. His creative interests are many; a major love being photography - he recently spent (and survived) 3 months on the road with truckers documenting their journeys across Brazil.

But it's another talent we're really interested in....apparently our Rod used to be a Lambada champion in Brazil! We're yet to see evidence of this, but a few beers on a "Lemon night out" should soon sort that! Come back soon to see the video!

Design insight - 5 Super-Cool Making Of.

2010-03-18T14:12:00.151Z

1 - Nuit Blanch

Described as "a fleeting moment between two strangers, revealing their brief connection in a hyper real fantasy" by it's producers, the film directed by Arev Manoukian is breathtaking.
Check it out:

And the Making Of:

2 - Teamgeist

Check the Website

Northkingdom created this interactive graphic novel to promote the new German Federation Kit by adidas. It's a nice and engaging way to tell more about the story of German football national team jersey. You can check the making of here

3 - Three designers decided to recreate one of the "Saving Private Ryan"
Scenes by themselfs.

Check the video on youtube

4 - Michel Gondry Videos

If you like music, french people speaking english with strong accent and handmade stuff you've just landed in a gold mine.

Michel Gondry has a lot of making ofs on you tube.

Daft Punk - Around The World Video

Video
Making Of

Kylie Minogue - Come Into My World

Video
Making Of

5 - Extracts of Local Distance

Those pictures are the result of an amazing mixture between code and architecture photography. There is a nice making of on the project's website.

Opportunities to earn revenue with photo tagging service

2009-11-25T10:41:00.012Z

Google-backed startup, Pixazza, has announced it's opening up it's photo tagging service which means very soon any website can be turned into an online store.

Seizing on the global thirst for everything celebrity, the Mountain View based company has recently trialled their technology on a handful of celebrity gossip sites like Just Jared and Celebuzz. For example, on Just Jared you can see a photo of singer Rhianna wearing the latest outfit and instantly "Get the Look". You simply roll over the image and links appear to similar clothing products which you can then go and buy.

Pixazza has a team of taggers standing by, going through the photos on popular websites like Celebuzz, identifying the products contained in them, and 'tagging' them with information about those products.

Every time someone clicks on a link or makes a purchase, Pixazza and it's partners earn money. It's a simple, obvious affiliate marketing idea, and if it takes off could be something that we see elsewhere -not just on celebrity gossip sites. After all, there are literally billions of photos on the web today and millions more get uploaded every day. Many of these photos show something that somebody somewhere might be interested in identifying and for which there’s a related product or service that can be purchased. So there's virtually no limit to the number of websites that Pixazza and similar services could be applied to.

James Everingham, Pixazza's CTO, has stated that thousands of websites have asked to use Pixazza, although it is currently being tested on about a dozen. If those websites find that they can make money connecting web surfers and retailers through their photos, there may come a day when you no longer have to scour the internet to identify the product you want in some random picture. It might be 'tagged' for you, with a convenient link that screams "Buy me!"

Microsoft gets involved with HTML 5

2009-11-18T19:35:00.002Z

HTML 5 is coming. It won’t be here tomorrow but the HTML 5 specification that has been ‘under construction’ since June 2004 could be more than just the next major revision of the hypertext markup language – it could be a game-changer that makes rich internet application (RIA) plug-ins like Flash, and Silverlight and JavaFX unnecessary.

As the web has evolved from a collection of “pages” to a collection of “applications”, RIA technologies like Flash have grown in prominence because the functionality and user experiences required to create increasingly sophisticated internet applications surpass what can be done with basic HTML. HTML 5 is being designed to change that and is expected to provide new capabilities, including:

The native display of audio and video content through a standard interface.
A “canvas” that supports 2D drawing on a web page.
Drag-and-drop support.
Support for running scripts in the background.
Local data storage permitting applications to “work offline”.
New form controls for common elements such as dates, times, emails and URLs.

If everything goes according to plan, supporters say that HTML 5 will not only bring HTML into the 21st century, it will reduce our reliance on proprietary technologies like Flash and Silverlight and make it easier for developers to develop sophisticated applications that work across browsers.

Of course, to accomplish this, all of the browser makers will need to play along. Earlier this month, Microsoft signaled that it’s taking internet standards more seriously as a posting it made to the W3C mailing list indicated that the Internet Explorer team is reviewing the HTML 5 specification and would “share...feedback and discuss this in the working group”.

Whether Microsoft’s participation in the HTML 5 working group truly evidences a willingness to work for standards remains to be seen. Indeed, Microsoft’s posting noted that “At this stage we have more questions than answers”.

Right now, HTML 5 is years away and therein lies the problem. By the time the HTML 5 specification has been finalized, it’s almost certain that the market will have evolved even further.

Already, proprietary technologies are entrenched. Companies have made significant investments in RIAs like Flash and Silverlight and in the case of Flash in particular, penetration is so high as to make the technology ubiquitous.

Because of this, the question for consumers, developers and technology companies is whether the HTML 5 specification really matters. While its virtues are very appealing in theory, the slow speed at which the HTML 5 spec is being hammered out demonstrates that building a specification and doing it with broad-based consensus is a time-consuming process that really can’t keep up with the commercial needs of the web.

While we can hope for the best with HTML 5, the reality is that business will go on as usual and proprietary technologies will continue to be developed and adopted because the individuals and companies that use the internet can’t wait around.

Real-time on the web: addressing performance, scalability and availability - 1 of 4

2009-11-18T17:54:00.007Z

The web is abuzz over 'real-time' -- the concept of websites and web applications providing instantaneous response to online interaction and access to streams of constantly-updating data and information.

Today's focus on real-time services is a reflection of the evolution of interactivity on the internet but applications that are heavy on interaction present unique challenges for developers when it comes to performance, scalability and availability. While simple applications that primarily pull content from a database and display it to users are can be made highly-efficient using techniques such as caching, interactive applications that are designed to be used in real-time can be much more difficult to maintain and scale.

Twitter, arguably the purest example of a popular 'real-time' internet service, is the perfect example of that. It has been plagued by performance and downtime issues for some time now and it's not hard to see why: at any given moment, there are thousands upon thousands of Twitter users posting and pulling content, with constant polling to the web servers for updates from Twitter clients, the website and through the API. This means lots of database reads and writes and a mountain of HTTP traffic. It's a developer's worst nightmare: a steady flow of resource-intensive database writes coupled with an almost never-ending flurry of database reads.

When it comes to dealing with performance, scalability and availability for real-time web applications developers now need to think about the following key issues (amongst others no doubt, but these are the ones I am focusing on) when designing applications:

HTTP polling and providing a real-time experience for users will increase the number of requests to to the server unless a connection can remain open. Traditional web servers don't provide a solution for this and opening socket connections are not really a viable solution as firewalls will typically block this from within corporate networks.
Database read and write performance and avoiding the locks that will ensue as a result of the high volume of writes to tables. Typical RDBMS databases are simply not ideal storage solutions when high volumes of read and write requests are required.
CPU or IO intensive operations that need to be queued and processed separately to ensure the web servers remain responsive to "normal" requests.
Autoscaling to support unexpected loads in a cost effective manner.

I have decided to address each of the issues in separate blog post, so in this blog post, I will aim to talk about concurrency, HTTP polling and providing a real-time experience for web visitors over an HTTP connection.

HTTP Push - Polling, Streaming and Sockets

The issues we have with why web servers struggle with real-time lie primarily with the antiquated HTTP protocol which is unfortunately a legacy we're going to be stuck with for some time. Google and others are fortunately looking at solutions. Google has recently published a proposal for a new protocol called SPDY, which seems to address some of the biggest faults of HTTP's suitability to today's web applications. With the current HTTP protocol, connections are not persistent (meaning every interaction with the server requires a new request, new headers, new response headers, authentication etc.) and most of the communication is typically uncompressed. SPDY sets about addressing these two key issues, with the persistent connection being the one relevant to HTTP polling.

Currently, when a user visits a web page which provides a real-time experience, what is typically happening is that the web browser is in fact polling the web server every second or so to say "is there an update?". These requests are pretty lightweight, but immediately present a massive problem when thousands of visitors use the website at the same time. Assuming you poll the server every 2 seconds, and you have 1,000 visitors on your site at any one time, the server(s) would receive approximately 500 requests per second asking "is there any update?"
Whilst 500 is a digestible amount of requests, increasing the number of visitors to 50,000 during a peak period meaning 25,000 requests per second would quickly bring down any small web farm. The issue again lies with the fact that HTTP does not allow data to be pushed back to the browser, so the browser has no option but to keep polling and overloading the server with unnecessary requests.

A number of approaches have been taken to solve this problem, with Google's recent suggestion being the most sensible way of fixing this without "hacking" the HTTP protocol, however SPDY protocol is a long way away and is not something we can rely on. The common ways to work around the HTTP issues are as follows:

Long Polling allows the browser to open a connection to a web server and keep the connection open for an extended period of time waiting for data to be sent to the browser. As as data is sent, a new Long Polling request is opened to the server waiting for the next event to be sent from the server.
Tornado is a web server built specifically to provide this type of long polling functionality and was built by FriendFeed which is now released as an open source server. For those of you using Nginx, you can configure Nginx as a Comet server using this beta plugin. The plugin allows your standard web application to pull and push content, and let the plugin do all the hard work distributing data to the clients.
Streaming allows the browser to open the connection to the web server and keep it open for as long as the user is on the website. This solution has numerous problems around browser support and the inability to detect the state of the connection. Whilst this is an option using the iFrame or XMLHttpRequest method, we do not recommend this approach.
Socket Connections are achieved through the use of a plugin such as the common Adobe Flash. Flash has complete support for raw socket connections providing a facility for your application to open a bi-directional asynchronous connection to a server, however this is not done over HTTP. As a result of this being a raw socket connection, users behind strict corporate firewalls will often not be able to connect using these socket connections which means a socket connection is probably only viable for consumers using the application at home. Server solutions, commonly used by Flash based game developers include ElectroServer and SmartFoxServer (which is based on Red5 which is the open source alternative to Adobe Flash Media Server)

Concurrency

Once you've figured out your solution to support push from the server to the browser, your next challenge may very well be how to allow your website visitors to experience a truly real-time experience and interact with other visitors. A great example of this is Google Spreadsheets which allows you to work with your Google Doc in real-time, updating the document and receiving updates in real-time (e.g. if you update a formula, you see other cells update once Google pushes the changes back to you), and also to chat to other users editing your document at the same time. Providing an application which allows this type of message queuing and dispatching between users can be extremely difficult and is typically addressed with languages that are more adept at handling concurrency.

Erlang, a language developed by Ericsson way back when to help them with virtually unlimited scale and conurrency, is designed from the ground up to deal with concurrency. There are no shared variables which ensures there are no locking issues which is the typical hell that developers need to deal with when trying to write applications that handle concurrency gracefully. Erlang avoids locking issues by supporting the idea of messages so that each function or method simply passes messages to other functions or methods. Using this message passing and queuing system as an integral part of the language, applications can easily scale by dding more servers capable of receiving and dispatching messages, and issues around concurrency will never materialise. However, saying all this, Erlang is not ideal as a web server and typically Erlang based solutions use a proxy server to handle HTTP requests and push HTTP requests back to the browser. See Alexey's post on how he is trying to build a system which can cope with a million long poll requests using Erlang and Nginx. You'll also need to learn a language and syntax so have fun ;)

Facebook use Erlang to drive their chat along with a Comet solution, if it works for them I'm sure it will work for you.

Scala is another functional language which is also more suitable for concurrent programming, and has been employed by Twitter to help them scale their concurrency issues.

Summary

Whilst there are numerous ways to address the inadequacies of the HTTP protocol and the inevitable and complex concurrency issues with most programming languages, building true real-time solutions is not easy and it's not likely to be easy for some time to come. New methods to address all of these issues are constantly being discovered and suggested, and even Google who are clearly fed up with the restrictions imposed upon them by the protocol are trying to find an alternative solution. If anyone is driven to make it work they are fortunately with their entire business relying on an increasingly usable web experience.

Building Twitter Apps with PHP and the Twitter API

2009-09-08T17:09:00.011+01:00

Twitter's popularity can be attributed to a number of factors. One of those factors is the Twitter's open API. From desktop clients to web-based management tools for brands, Twitter's open API gives every developer the ability to develop cool and useful applications that enhance the Twitter user experience and extend Twitter's utility.

One of the nicest things about Twitter's API is that, like Twitter itself, it's pretty darn simple. In this post, we'll discuss how you can get started developing for Twitter using PHP and a handy PHP class.

Requirements

Before you begin developing, you'll need a few things:

A Twitter account.
A development server.
Knowledge of a programming language.

Given Twitter's popularity, it's not surprising that there are many client libraries available that eliminate the need for developers to reinvent the wheel. From ActionScript to Ruby, The Twitter API Wiki lists libraries for a variety of programming languages.

For the purposes of this post, we'll be working with PHP and the easy-to-use PHP Twitter class. To use this class, your server will need PHP 5.2 and the lib_curl PHP module installed.

Getting Started

Once you've downloaded the PHP Twitter class, upload it to a directory your server. Since I like to place classes in their own directory, we'll assume that the PHP Twitter PHP file has been uploaded to a classes folder in your HTTP root.

When creating a PHP script that interacts with Twitter, the first thing you'll need to do is create an instance of the PHP Twitter class. Here's the code for that:

require_once('classes/class.twitter.php');
$t = new Twitter;
$t->username = 'twitterusername';
$t->password = 'twitterpassword';

Now that you're officially instantiated, the Twitter API is your oyster. Let's look at some of the things you'll probably want to do.

Retrieving Tweets

The following code will retrieve and echo your own tweets:

$tweets = $t->userTimeline();
foreach($data as $tweet) {
echo $tweet->text . "<br />";
}

Sample output:

Working with the Twitter API!
This is amazing!

Not all that interested in yourself? Find out what your friends are up to by retrieving your friends' tweets:

$tweets = $t->friendsTimeline();
foreach($data as $tweet) {
echo $tweet->user->screen_name . " tweeted: " . $tweet->text . "<br />";
}

Sample output:

someuser tweeted: Going to the beach!
anotheruser tweeted: Working late (again).

Each of the methods used above (userTimeline and friendsTimeline) allows you to pass in a number of parameters. Be sure to check out the Twitter API documentation for information on these.

Sending Tweets

Listening is important on Twitter but tweeting is probably more fun. Using the Twitter API, it's easy to send tweets:

$tweet = $t->update("If a tre falls in the forest and...");

The above code will post a tweet stating "If a tre falls in the forest and..." to the timeline of the authenticated user.

Of course, there's a typo in the above tweet. Fortunately, there's a method for deleting tweets. So let's go ahead and delete our tweet before anybody sees our typo. First, we have to know the ID of the tweet we just sent. The update method returns the ID of every new tweet that has been posted so we can retrieve the ID of our typo tweet with the following:

$tweet_id = $tweet->id;

Now that we have the ID of the tweet to delete, we can get rid of it using the destroy method, which is called as follows with Twitter PHP:

$tweet_delete = $tweet->deleteStatus($tweet_id);

Putting It All Together

To put it all together, let's write some simple code that will take the most recent tweet from the authenticated user's friends' timeline and retweet it.

$tweet = $t->friendsTimeline('', '', '', '1');
$retweet_string = "RT @" . $tweet->user->screen_name . " " . $tweet->text;
$retweet = $t->update($retweet_string);

Obviously, it's always good to do some error checking. Here, for instance, you may want to know beforehand whether your tweet is going to exceed 140 characters and deal with it if it is.

Taking It to the Next Level

As you can see from these simple examples, it's quite easy to retrieve and send tweets with Twitter's API using the PHP Twitter class. Tasks such sending direct messages, retrieving information about users, pulling followers and accessing Twitter's search functionality are equally easy to perform using other API methods Twitter provides. These generally work in the same fashion as those methods discussed here.

For a complete list of the API methods Twitter offers and more detailed information about the API, be sure to check out the Twitter API Wiki. You'll find that the most important methods are accessible through the PHP Twitter class.

By combining these straightforward methods in creative ways, building fun and useful Twitter applications can be done in very short order.

History of Graphic Design

2009-07-06T12:26:00.006+01:00

Sometimes Twitter could be really inspirational.

I've just read a tweet about this fantastic website - a visual history of Graphic Design.It is missing a few things but I think the idea behind it is just great!

So I thought to share it on this blog.

Check it out: http://www.designhistory.org/

Please support fixoutlook.org

2009-06-24T10:54:00.008+01:00

Outlook 2010 is in beta but Microsoft has not added support for Email Standards. Which means we'd be creating HTML emails using table layouts with non-semantic markup well into the future.

Microsoft has indicated they would listen to feedback. So please help the cause by joining the rally and tweeting your mis-givings (if any).

Remember to link to fixoutlook.org in your tweet.

Zend Framework and AMF

2009-06-17T03:45:00.015+01:00

Zend Framework (ZF) has a handy component called Zend_Amf which provides a means for your PHP to communicate with Adobe's Action Message Format (AMF).

Serving AMF data from ZF is plain easy, it's also very simple to integrate into your existing website. As ZF is a component based framework you could simply pick out the Zend_Amf and related classes and use them. But obviously the integration is better if you have a full ZF stack.

For renault.tv we had setup an AMF API. Since we wanted to serve both HTML and AMF from the same backend we opted to setup the AMF server as a controller under ApiController.php:

class ApiController extends Zend_Controller_Action
{ 
public function preDispatch()
{
$this->_helper->layout()->disableLayout();
$this->_helper->viewRenderer->setNoRender(true);
}

public function indexAction()
{   
// instantiate server
$server = new Zend_Amf_Server();

// set production mode to true to suppress debug messages
$server->setProduction(false);

// handle request
$response = $server->handle();

echo($response);
}
}

We started with Matthew Weier O'Phinney's pastebin application which we found to be an excellent starting point for the structure of our boostrap and initialization code.

During development we quickly found the AMF response times to be slow, especially as the data size returned grew larger. The following .htaccess conditions helped improve performance drastically:

# Set some default PHP values
php_flag zlib.output_compression 1
php_value zlib.output_compression_level 2

# Gzip CSS, JS and AMF
AddOutputFilterByType DEFLATE text/css application/x-javascript application/x-amf

Here are a few best practices we picked up during development:

All API functions receive an object pass back an object - this proved to be a very extensible approach and seemed to work well with Flash.
Unit test all code. We setup unit tests for both PHP and Flash. As you may soon realise debugging AMF is very hazardous. To help easy the pain we use jQuery's qUnit test suite to mirror AMF calls issued from Flash. More on this in a future post.
Use a HTTP Proxy to inspect your AMF output. Charles is highly recommended if you're on a Mac.
Make sure no trailing spaces are left in your code output - editors tend to do this a lot. A good way to avoid this is to not close your PHP tags.
We found associative arrays very problematic as the keys get lost in translation. So try to avoid them. Passing back objects is a good way to avoid this issue.

Go crazy!

The Internet is Video

2009-06-16T11:00:00.002+01:00

We all know online video is big. Despite the fact that there had been plenty of premature hype surrounding online video for years (remember Broadcast.com, anyone?), by the time Google acquired the wildly-popular YouTube for $1.65bn in 2006, it was pretty clear that the time was finally right for online video.

Since then, the market has only become more robust and competitive. BBC's iPlayer, which streams BBC programming to Britons over the net, started streaming high-definition video a couple of months ago. And Hulu has brought Americans high-definition television programming on the PC.

The message is clear: online video is here, it's getting better and it's going to play a prominent role in the future of the internet.

How big is online video today? In April 2009, Americans viewed 16.8 billion videos online. Over 6 billion of those were viewed on YouTube, which served 107.1m viewers.

These numbers are impressive but they only scratch the surface of what some believe the online video market will become. Cisco, the hardware giant whose wares support the backbone of the internet, is gearing up for a future in which the internet is essentially video.

It estimates that by 2013, global IP traffic will grow to 56 exabytes per month. Over the course of a year, that's two-thirds of a zettabye. Moreover, it expects that video will account for over 90% of the traffic.

The message for anybody with a presence on the internet is clear: if you want to succeed online, video is going to be a big part of what you do.

For businesses and brands that don't see how video fits into their plans and that can't imagine YouTube and streaming being of much use, the proliferation of online video means more than just 'video'. It means multimedia content and richer user experiences.

In this motion-centric internet, brands will need to think more about what opportunities they have to:

Produce visually-compelling content. We recently worked on RenaultTV. Renault is one of a growing number of brands that is thinking about how it can create and leverage content.
Create richer user experiences using technologies like Flash. Polaris, which manufactures various types of vehicles, makes great use of Flash on its website to engage visitors.

Multimedia content and experiences like Renault and Polaris are offering are going to become far more commonplace. The only question for brands that haven't jumped in is will they do so before their competitors.

The iPhone: Now with More Developer Opportunities

2009-06-16T10:00:00.006+01:00

Apple's release of the iPhone 3G S was, not surprisingly, big news at WWDC 2009. While many believe that the iPhone 3G S is not a game-changer like the iPhone 3G was, the release of the iPhone 3G S and this week’s upcoming release of the iPhone 3.0 OS are important events for developers.

Here's why.

What’s New in the iPhone 3G S and iPhone 3.0 OS

First, the insides of the iPhone 3G S are beefier. At the heart of the new iPhone is a CPU based on ARM's seventh generation Cortex-A8 core. There's also a PowerVR SGX graphics core and support for the Open GL ES 2.0 3D graphics API. And to boot, Apple has given the iPhone 3G S more RAM than its predecessor.

What's this mean? The iPhone 3G S is much more powerful; Apple claims it can perform up to twice as fast as the iPhone 3G in a real-world setting. That in turn means that the iPhone 3G S is capable of delivering a much richer multimedia experience. Thus, it's no surprise that game makers, for instance, are sensing opportunity. The gaming category is already the top category in the App Store.

Second, Apple has added some hardware niceties that have give developers more capabilities. There's a new camera, which offers 3MP of resolution and can capture VGA video at 30 frames per second. And there's an Accessories API that makes it possible to develop apps that interact with third-party hardware.

Finally, the iPhone 3G S will come equipped with the 3.0 OS, which is set for release on Wednesday. The iPhone 3.0 OS will feature a number of updates of interest to app developers, including:

Mapkit - gives developers the ability to use Google Maps within their apps
Dynamic Map Markers - enables map markers in map-based apps to be updated in real-time.
In-application purchases - make it possible to purchase additional content and features from within an app itself
Push notifications - permit apps to receive notifications even when the app itself isn’t running

While it's possible to argue that all of these things are incremental improvements and some of the most requested features, such as the ability to run an app as a background process , aren’t (yet) being provided, Apple’s updates do offer a wealth of new opportunities for app developers.

Improved performance will no doubt give developers the ability to do more with their apps. The iPhone 3G S upgrades will be especially useful to developers whose apps can benefit from third-party devices. And the iPhone 3.0 OS could boost the App Store economy. With in-application purchases, developers can create new revenue streams and with push notifications, developers can build apps that users interact with more frequently.

Into the Wild

Let’s take a look at how some of these things are going to be used in the real world.

AirStrip OB
AirStrip’s app makes use of the new push notification functionality to give medical practitioners the ability to monitor in real-time the vital health information of a patient. As data, which includes heart rate and blood pressure, is streamed from the patient, the practitioner can receive notifications based upon it.

ZipCar
US-based car sharing service ZipCar has built an app that not only lets users find ZipCar locations but also gives them the ability to reserve available cars at those locations and to unlock the cars they rent using the iPhone.

PASCO Spark
Science education company PASCO has developed an app called Spark which enables the iPhone Accessories API to connect to PASCO-built sensors. This enables students to measure and analyze data collected from the sensors directly on their iPhones.

Star Defense
Star Defense is an iPhone 3.0 OS gaming app that enables players to purchase new content/features directly from within the game using the iPhone 3.0 OS’s in-application purchasing functionality.

Challenges
The improvements seen in the iPhone 3G S and iPhone 3.0 OS come at a cost. As Engadget points out, for instance, the iPhone 3G only supports OpenGL ES 1.1 graphics API. It appears that developers will have a choice: they can build apps that support both OpenGL ES 1.1 and Open GL ES 2 or they can support only one. Apps that only support Open GL ES 2 will therefore be available only to iPhone 3G S owners.

Obviously, the specter of a splintered app ecosystem could be problematic but as Engadget also notes, it’s somewhat expected given the rapid advances in hardware today.
Regardless of compatibility considerations and the impact they have on the development process, the opportunities for iPhone developers are only growing in number and that’s a good thing that will drive further innovation.

Will you Bing?

2009-06-12T16:22:00.015+01:00

On May 30, Microsoft launched Bing - its latest effort to catch up to Google in the search engine wars.

Previously, Microsoft’s search product was Live Search and the company had been all but written off as a search competitor. Its only obvious hope: acquiring Yahoo. But that was then and this is now. Bing is here and is definitely worth a look.

Microsoft is branding Bing as a “decision engine” as opposed to a search engine and is investing $100m in an ad campaign to introduce consumers to its new product.

Initial reactions to Bing from the media and blogosphere were positive. Some cooler stuff to take note of:

Bing automatically provides filters and links based on the nature of search results. If you search for a movie title, for instance, it knows to provide links to Images, Soundtrack, Cast, etc.
When a video is listed in the search results, Bing displays a thumbnail that, when rolled over, actually plays a preview of the video itself. Interestingly, Microsoft is using Flash instead of Silverlight to do this.
A history of recent searches (which can be cleared or turned off altogether) is kept handy on the left-hand navigation bar.
By rolling over the area just to the right of each search result, Bing displays a more detailed synopsis of the content on the page, including, where available, contact information and links.
Bing offers RSS feeds for any search. Just add the URL of your search to an RSS reader and viola!
Thanks to Microsoft’s ownership of Farecast, Bing Travel is already a pretty comprehensive travel search engine.

While none of these features are going to be called revolutionary (and some of them were actually present with Microsoft’s old Live Search), it’s hard to argue that Microsoft hasn’t done a good job of “putting it all together”.

Early indications are that this has been enough to spark interest. Last week, comScore reported that Microsoft’s share of search results pages increased 2% to 11.1% market share. And Microsoft has done enough with Bing to get the CEOs of Yahoo and Google to comment on it.

Obviously it’s way too early to tell if Bing is going to help Microsoft compete with Google (and Yahoo) but while we wait to see how Bing does over the long haul, you might want to find out how well your website is Binging. Just in case.

Twitter for Brands

2009-05-20T07:30:00.007+01:00

The world is atwitter. Twitter, one of the fastest-growing websites on the internet, has captured everyone's attention.

Like most hot internet properties before it, the original purpose of Twitter was simple: give people a way to keep family members, friends and colleagues up-to-date with the latest happenings in their lives. In 140 character bite-sized status updates.

From its humble beginnings, Twitter has evolved into a flexible communications platform that is being used in a wide variety of ways. Every day, brands and prominent individuals are joining the Twitter bandwagon and looking to engage with their stakeholders and fans using the popular microblogging service. Even brands that you wouldn’t expect to have an interest in services like Twitter are getting involved. Case in point: Louis Vuitton is now on Twitter.

The appeal of Twitter for big names is easy to understand: some of the most popular Twitter users household names. Starbucks has over 180,000 followers, the CEO of online retailer Zappos has over 610,000 followers and Hollywood celebrity Ashton Kutcher recently beat out CNN to reach the 1 million follower mark.

But despite its popularity and the fact that just about everyone seems to be joining, Twitter largely remains an enigma for brands. How can it be used? How should it be used? What's the pay-off for the brand?

Key Considerations

Before you jump into the Twitterverse, there are number of key items to consider:

Goals. Do you want to use Twitter to market your brand, communicate with customers or acquire consumer feedback? There are lots of different ways that Twitter can be used and your strategy should be based on what you expect to achieve.
The stakeholders. Before setting up shop, you should identify the employees or groups within your organization that will need to be involved in order to achieve your goals. Simply delegating Twitter to a single employee probably isn’t a good idea.
Metrics. Do you Twitter goals dictate that you acquire a significant number of 'followers'? Or are you far more interested in how many interactions you engage in? Whatever the case, by choosing the right metrics to measure your goals, you ensure that you'll be able to monitor the progress of your Twitter efforts.
Your desired level of involvement. Twitter is 'real-time': everything moves quickly and what happened an hour ago is usually old news. As such, you should consider how much time and energy you can invest in your efforts to make sure your strategy is sustainable and doesn't fizzle out.

Getting Started

Despite the rush to get involved on Twitter, there's no reason your brand shouldn't feel comfortable standing back and observing for a while. Observing is a great way to get the hang of the service without risk and to see first-hand the ways that individuals and businesses are using it. What are other brands doing? What are your competitors doing? A little bit of research is a good idea.

Once you're ready to join the party, signing up for a Twitter account is simple. You'll be asked to provide some basic information, such as your name and email address. When it comes to picking your username, be sure to use something descriptive (eg. your brand name).

Since all content (including your bio) is counted in characters on Twitter, be sure to maximize what you convey by customizing your profile. Specifically, you'll want to fill in your bio, upload a background image and add an avatar. Like Twitter as a whole, this is all free and is crucial for establishing an effective and engaging brand presence.

Getting Involved

They key to success on Twitter is participation. While your goals will dictate how you participate, make no mistake about it: you have to participate to get the most from the exercise. This is not a passive endeavor.

Here are some good ways for a brand to start:

Follow a few people. Make your presence known by following a few interesting people. You can be strategic here by following people who have lots of followers, have influence within your target market, etc. Don't go overboard, however. Mass-following is a no-no.
Engage with users who are talking about you. Using Twitter's search functionality, it's easy for brands to learn what Twitter users are saying about them. This can often provide perfect opportunities to start conversations with those users.
Twitter is really all about sharing and one of the best ways to build a following is to share information that other users will find interesting and valuable. Tip: it doesn't always have to be about your brand. Consider chiming in on other topics or providing a broader perspective. Chances are your brand has a lot to say.

For brands looking to take their Twitter involvement to the next level, here are some other things Twitter can be used for:

Contests and promotions. Italian restaurant chain Maggiano's boosted its brand profile on Twitter by running a simple giveaway for a $100 gift card.
Couponing. Coupons.com recently got into the act on Twitter by tweeting up coupon deals.
Direct sales. By tweeting what it has available for sale in its outlet, Dell has added over $1m in revenue using Twitter.
Charity. Twitter can be an effective tool for assisting charitable causes your brand is involved with.

Putting it All Together

Twitter is a lot of different things to a lot of different people and there's no right or wrong way for brands to participate. Success comes down to planning, setting strategy based on clear goals, getting the right people involved, measuring and monitoring and, finally, making the commitment to stay involved.

"Have you done an iPhone app before...?"

2009-05-19T15:33:00.013+01:00

We've been asked that a lot over recent months. Everyone wants an app, but are we all suffering app fatigue?

All told, apps have been installed billions of times on Facebook and the iPhone combined. Given this, it's not surprising that brands are going app crazy. When done right, it can be a good strategy. After all, the costs of producing an app are typically quite low and apps have the potential to drive significant exposure for the brand through one of the the most powerful means possible: brand integration.

Thanks to the developer programs that Facebook and Apple have created, thousands upon thousands of "applications" have been produced that enable Facebook users and iPhone owners to do everything from the important (track UPS shipments) to the trivial (throw virtual sheep).

Here are some examples of brands that have used apps to gain exposure:

Burger King. The fast food chain's Whopper SacrificeFacebook app, which rewarded users with a coupon for a free Whopper when they deleted 10 Facebook friends, was eventually shut down by Facebook but not before more than 230,000 users completed the task and Burger King received significant press.
Audi. Want to take an Audi A4 for a test drive on your iPhone? Thanks to Audi's A4 Driving Challenge iPhone app, users can create a car, select a course and race away from the comfort of their own phone.
Chanel. The famous fashion brand's brings the fashion show to the mobile phone with its iPhone app. Instead of offering up a game, Chanel uses its app to deliver content, including video, news, fashion information and a store locator.
Sony Pictures. When it came time to promote a new movie called 30 Days Night, Sony Pictures took a different approach to apps. Instead of building its own app, it struck a deal with the owner of a popular Facebook app called Vampires and took rebranded the 30 Days Night app for 3 weeks. The results: exposure via the tens of millions of visits the app received during that period of time and 59,100 sweepstakes entries.

As with any campaign, app marketing should be thoughtful. Brand integration should be done tastefully and users need to be provided with real value. Given the number of apps out there to choose from and the risk of app fatigue, they also need to be given an incentive to keep using the app.

While not every app is a success story, given the massive number of consumers that are using them and the relatively small costs of creating and distributing apps, app marketing is certainly worth a look.

Lemon Digital

Project: Tweet to Help a Heart

Marvel at Podge in 3D

Project: Despicable Me Desktop App

BBC Dimensions

Lemon needs a Junior Designer!

We're hiring!

Augmenting Reality

Project: Starbucks

Project: Sony 3D TV ads

Bye bye bowling

An amazing paper animation

Former Lambada King joins Lemon

Design insight - 5 Super-Cool Making Of.

Opportunities to earn revenue with photo tagging service

Microsoft gets involved with HTML 5

Real-time on the web: addressing performance, scalability and availability - 1 of 4

HTTP Push - Polling, Streaming and Sockets

Concurrency

Summary

Further reading

Building Twitter Apps with PHP and the Twitter API

Requirements

Getting Started

Retrieving Tweets

Sending Tweets

Putting It All Together

Taking It to the Next Level

History of Graphic Design

Please support fixoutlook.org

Zend Framework and AMF

The Internet is Video

The iPhone: Now with More Developer Opportunities

What’s New in the iPhone 3G S and iPhone 3.0 OS

Into the Wild

Will you Bing?

Twitter for Brands

Key Considerations

Getting Started

Getting Involved

Putting it All Together

"Have you done an iPhone app before...?"