Behind The Scenes with Fantasy Interactive

As one of the world’s most important agencies enters the world of social networking, Web Designer was lucky enough to talk with the team about how they managed to Kontain themselves

Fantasy Interactive, or Fi, has gone from garage to design agency greatness in less than ten years. CEO David Martin set out with a goal to create interactive experiences to satisfy his own expectations and an elite list of clients has vindicated his determined vision. However, with the companies digital experience it decided it was time to branch out. Latest project Kontain.com is the result of years of hard work and is described as the ‘easiest and most beautiful way to blog, upload photos, videos and audio’. This month we speak with David Martin, Executive Producer Stephen Martin and System Architect Thomas Prommer to find out more about the site and how it was created.

DM: David Martin – CEO
SM: Stephen Martin – executive producer
TP: Thomas Prommer – system architect

WD: To kick things off, could you tell us about Fantasy Interactive (Fi) and the type of creative work you do at the agency?
DM: The answer to that question is constantly evolving, but this year I feel we have become the company I envisioned since opening our doors in 1999. My goal has always been for Fi to be considered the Pixar/Rolls-Royce of interactivity. By delivering extremely polished and well-executed results over the years, we have attracted the brands we love as our clients. Fi is always about the work, which has won us some important awards and attracted top talent from around the world. The scope of our portfolio ranges from small to enormous. We jump at the chance for small to mid-sized projects, such as widgets like the Wacom Desktop Application (http://fi. com/work/wacom/bamboo-dock) and microsites like Mario Kart (http://f-i.com/work/ nintendo/mario-kart), to keep the creative juices flowing on a cycle. Larger projects, such as entire websites receiving millions of monthly visits, require larger teams to complete the design, technology and business strategy and development for the site. Our enormous projects often combine community initiatives and robust three-screen cross-platform syndication. Having concurrent micro and macro production cycles has proven to be a successful combination for us. It’s surreal to receive a call from a brand I grew up worshipping, requesting to work with us. Across the board, our clients approach us for our quality focus and execution in the disciplines of information architecture, design, technology and business strategy.

WD: Kontain is a subsidiary of Fantasy Interactive, so how did the Kontain project come about?
DM: The concept of Kontain was a major motive behind starting Fi. Fi spawned from my solo efforts in building a series of funny pictures, jokes and conspiracy theory sites. These sites offered me something I have always craved – absolute content control. Soon these pet projects took a back seat and Fi formed, taking on clients as a service-based interactive advertising firm.
Back in 2000, I pitched an early iteration of Kontain called ‘ProPod’ to Starbreeze Studios and Ubisoft as a community site for gamers. ProPod offered instant messaging, online friend status updates and the ability to upload photos. This large-scale initiative was the logical next step for me; designing a site is one thing, building one from scratch is another entirely. However, for the better part of the Noughties, ProPod was turned down numerous times. Community and UGC proved too controversial for many of our clients, therefore Fi’s focus remained on its core digital services. In 2005, Fi – New York opened just as MySpace, Flickr and the like really took off. Honestly, it was more than a little disappointing to see the popularity of those sites growing enormously. One thing that buoyed my spirits was that these sites only appeared to be catering to a market that required the functionality; there was a lesser focus on visual execution, which left an opening for Kontain.

WD: What was the original brief for the Kontain site, and how close did/will the finished site adhere to this?
DM: Unlike our client work, there wasn’t so much a brief in the beginning, but goals and passion. The main objective was to release a beautiful and easy-to-use site, enabling the general public to contain and share their life with others. Kontain was built to fill a void I noticed on the web – a social utility and destination, focused first on usability and pure good looks. Riding high on winning FWA’s Site Of The Year for both Road Runner and Starbreeze, we confidently set out to develop the front-end entirely in Flash – a vehicle built for our media focus. In 2006, we took our first prototype and launched a blog for Fi, called ThinkSwedish. com. This had the mission of visually sharing the ongoing story of what Fi does, and how we do it. Over the course of Kontain’s long history, we created several project briefs for clients, such as AOL, AT&T and Road Runner. We even licensed an early version of ProPod (Think Swedish) to AOL, which it used for its tech blog. In mid-2006, the ‘total media platform’ push came into focus, with ProPod drilling into the challenge of aggregating a large number of users accounts and content. The alpha launch of Kontain in November was referred to as the “iPod of blogging” by CNET. So far, the reviews are highlighting Kontain’s ease of use and good looks, which is a great start. The formula of beauty plus user experience we applied to Kontain has been a hugely successful business model for Fi. We met some major goals with the alpha launch, but there is much to accomplish as we barrel towards beta.

WD: As an effectively in-house project, how often did the Kontain team have to provide updates on progress, and who did they have to report to?
SM: Our executive producer, Stephen Martin, spearheaded Kontain from the start, with the support of the senior technical manager. The collective efforts of the team have taken Kontain from paper to reality. The ability to communicate, update and prioritise tasks for Kontain has been paramount. Tasks are tracked in a backlog, estimated and prioritised. Iterations, which we call ‘sprints’, would be set up at regular intervals to help keep the goals clear, realistic and not too distant. Using a burn-down chart, we frequently kept ourselves apprised of Kontain’s progress, identifying if we were on track or not, to ensure the development progress was transparent to management.

WD: When the Kontain project initially came to fruition, what design assets were provided? Or was it simply a matter of everyone involved pitching their ideas and taking it from there?
DM: Besides the original design exploration, Kontain began where all Fi projects begin – as wireframes in Visio. Simultaneously, the creative team began to comp up ideas in Photoshop, getting a general visual feel. At the end of this initial exploration, the information architects and designers came together to merge both disciplines. Next, we shifted our focus to creating small prototypes of key interaction points, which we call a ‘bluebox’, or interactive wireframes. Blueboxing is essential for our process. Minimising development changes to quickly and clearly identify how things will feel for the user, and how design will complement the interactive flow and usability is critical. Our blueboxing process is very similar to the way car designers mould a car from clay and simulate braking and adaptive cruise control paths in their computer simulation models before they go into production. Our director of information architecture has a saying around these parts: “bluebox early, bluebox often.” Holistically, throughout the process for a project of this magnitude, there are three creative teams at play: design, IA and the front-end tech teams. As a collective working organism, each team is aware what each other is doing and will provide advice, critique and guidance. This structure encouraged the proposal of features and functions from each group. Conversations often got intense, both in agreement and otherwise, but in the end we all gained a great deal of value from the process.
The team worked successfully to ensure the IA didn’t hurt the designers or the developers, while the developers did their best to accommodate every pixel tweak to satisfy the designers. Once we compiled all of our findings and were satisfied with the level of execution in our master prototype, large-scale production finally began. From 2005 to the alpha launch in 2008, Kontain went through several redesigns and major tweaks. Today, we continue to chase down the goal of making Kontain the easiest way to ‘Kontain’ your life, online or otherwise.

WD: How big was/is the team working on the project, and what are their roles?
SM: While the Kontain team has included many people across multiple areas, the seven core disciplines were as follows: • Front-end development • Back-end development • Business management • Legal • Public relations • Administration • Media team The front-end development team consisted of developers, designers, information architects and producers. There are consistently ten front-end people involved in Kontain at any one time. The back-end team worked decoupled from the front-end development team for most of the work cycle, which aided our planning and integration process. Each team consists of senior personnel, ranging from senior technical managers and Java developers, to system architects and back-end producers. The business tasks were handled by our core management talent, who were in charge of overseeing Kontain’s partnership deals, legal and public relations matters. Our administration team is in charge of all the IT and system administration. This team is led by Kontain’s systems manager, whose team maintains the platform at all times.

WD: What are the core back-end technologies that bring the  site to the masses?
TP: Kontain’s back-end is a fully Java-powered software component that is built based on state-of-the-art enterprise technologies. The system is comprised of a core data processing module, as well as a custom-built, highperformance image transcoding component. Considering Kontain’s ambitious goals, the system has been designed from day one to accommodate maximal scalability, robustness and extensibility, all of which motivated our choice for Java. To optimise development efficiency and ease the platform’s evolution, we are using cuttingedge programming techniques, such as aspect-oriented programming, dependency injection as well as objectrelational mapping throughout all system tiers. An efficient client-server communication is achieved through the usage of data transfer objects, which are communicated to and from the client using the compact AMF remoting protocol. Our quality assurance, build, release and deployment process is supported by modern continuous integration tools. Currently, the back-end component is deployed in a distributed server cluster, which consists of a large array of boxes. However, there are already now plans for migrating our current server infrastructure to a more scalable cloud computing architecture. All static application assets and media material are delivered by our premium partner Akamai, and its industry-leading CDN infrastructure.

WD: The design is clean, simple and colourful. Who designed the branding and what drove the decision on the layout?
DM: From the outset, we laid down some strict design guidelines. Since Kontain had to look gorgeous and be really easy to use, its look and feel required a life span similar to a logo. In fact, I set the goal down for the creative team from day one that magazines should herald Kontain as the nicestlooking and easiest-to-use UGC site they have seen. Fi has been successful with the model of creating applications and sites that are notably beautiful and well executed. Our most experienced designers took on the challenge – I took on the challenge. We concluded that simplicity is key. We avoided grey as much as we could, because while it is a fantastic neutral colour, it can make things feel old. Designers worked closely throughout the blueboxing process to ensure design was a complement to the
usability. Realising the users’ content would bring colour and life, our focus was to set up a framework to showcase their contributions, while paying close attention to avoid negative space and providing an organic, neat overall look and feel.
A strong platform requires a strong name, which we were lucky to find in Kontain. We identified over 300 available options. To make the final decision, we created a short list of the top choices and presented them to the team for a vote. Ultimately, we wanted a name like Facebook that tells a user what the platform does, as opposed to a Web 2.0 name that doesn’t really make much sense. To complement the name, the Kontain logo had to own strong colours to appeal to the mainstream. Its three icons were essential to give users the impression what the site was about by just looking at the logo. It had to say “media here!” The branding came from the simplicity of the layout, but the colourful waves you see in the ads and the front page were added to give the feeling that life is good to live and to Kontain.