Articles By Boris Pique

Associate Technical Director


Prototyping iOS Apps with Storyboards

A great thing about working at a digital agency like Odopod is the variety of projects that come our way. With new types of projects come exciting opportunities to explore new tools and workflows. For example, mobile projects continue to evolve and their unique requirements are driving the evolution of our internal process in interesting ways. More than ever, our projects demand a high collaboration between disciplines and a nimble, iterative approach. For this, we love using prototypes to bridge the gap between UX design (usually in the form of wireframes) and having a functioning application.

At Odopod we’ve always been big proponents of prototyping as an intrinsic part of the work we do. We continue to look for ways to make prototyping part of the fabric of our process and this seems especially helpful when designing mobile applications. It’s a fertile territory for innovation but it’s also a relatively new field which means less experience to refer to and infer from.

Additionally, our relationship with mobile touchscreen devices is very intimate. There’s something visceral about how it feels to directly interact with them. It’s challenging to visualize these experiences on paper. Touch input is still relatively new as are the fast-evolving mobile form factors. The quicker you can get something in your hands to react to and iterate on, the better the end result will be.

Continue Reading »

YouTube Trends – It’s Science!

At Odopod we love projects that challenge us to make information accessible, relevant, digestible and engaging. That’s why we were really excited when YouTube approached us to help make the YouTube Trends project a reality.

YouTube Trends allows users to get a timely view of what’s being watched around the world as well as use tools to compare viewership across cities, states, countries and age ranges. If you haven’t heard about it yet, watch this entertaining video introduction featuring the Gregory Brothers.

The project presented an interesting set of challenges. First of all, with the immense wealth of viewership data that YouTube has at its disposal, how could we slice the information to make it relevant? How could we make the data accessible in meaningful ways? What interactions could we add that would provide value without getting in the way of the experience? What existing Google tools could we leverage to get the job done right?

The vision was for YouTube Trends to become part of the YouTube brand universe and even though it couldn’t be too much of a departure from an aesthetic point of view, it definitely needed to be an exciting new product with a unique voice. So it was our goal to help define an identity and design that would remain on brand but could also stand on its own. Ultimately, the design had to serve as a great vessel for all the content to come.

More after the jump »

FITC 2010: A Design and Technology Coastal Break

Associate Technical Director, Boris Pique shares his experiences attending and speaking at this year's FITC San Francisco.

FITC had its first FlashintheCan conference in Toronto in 2002 and has since grown to become one of the most important events of its kind. What initially started as a Flash-only conference has expanded over the years to include sessions about other relevant technologies such as Processing and openFrameworks just to name a few. Even if the event is a Flash conference at its core, the broader breadth of topics is, in my opinion, a welcome approach since it’s undeniable that technologies other than Flash are better suited for certain types of work.

Read the full article »

We Love Prototypes – Part 3

Prototypes can serve a wide range of purposes. If you haven’t done so yet I encourage you to read previous posts in which we’ve looked at prototypes that help define the user experience and others that evaluate technical feasibility.

In this post we’ll look at another kind of prototypes, those that are used as a sales tool.

Prototypes as a sales tool
Sometimes clients come to us with very ambitious and exciting application ideas. At this point, their internal teams have spent some time giving birth to these ideas and are working towards getting them green lit to become actual products. In order for these projects to ever see the light of day, our clients usually need to get approval from stakeholders higher up in their organizations. These stakeholders are not designers or developers; they are business people. So for them to be able to fully grasp the value of these potential products it’s essential to present them with a visual depiction of how these applications might look and behave. It’s our goal to help these clients make a strong case for the investment that these projects will require when fully produced.

Read the full article »

We Love Prototypes – Part 2

In a previous post, we introduced prototypes and the value that they provide. Through some examples we explored how they can help define and refine the user experience. In this post we’ll look at another type of prototypes, those that evaluate technical feasibility.

In order to achieve the best possible outcome for a project, both creative concepts and technical execution need to work together and complement each other. A dialogue between designers and developers needs to be established as early as possible when ideas are still at a malleable point.

During an initial technical assessment, designers and developers can work together to decide the best approach. However, for this collaboration to be successful, it is important for both parties to be on the same page. Designers must be willing to be informed by developers of the technical complexities involved and be flexible enough to tweak the creative concepts accordingly. Developers must also approach this collaboration from a constructive point of view. They must clearly communicate what complexities exist but more importantly, offer alternate solutions when necessary.

Read the full article »

We Love Prototypes – Part 1

I am a firm believer in the fact that close collaboration is the foundation for bringing high quality work to the digital space.

Every individual brings their own talents to the table and it’s important to provide a vehicle to express them but at the same time, when team members seamlessly work together, that’s where a lot of the magic happens.

It’s in our nature - no matter how hard we try, we are always going to have a limited point of view shaped by our individual experiences and the way we perceive things around us. Innovation often comes from looking at something from an angle that we hadn’t considered before. Collaborating with talented people with different backgrounds is a great creative catalyst so why limit your creative brainstorms to designers and strategists? Why not include developers and information architects into the mix as well?

But don’t let yourself feel like this point of view dilutes your creative expression. It’s actually quite the opposite. Your raw idea can evolve and blossom into something delightful that you never expected. Just because it’s a collaborative effort doesn’t mean that you can’t feel a sense of pride, ownership and accomplishment.

Prototyping can be a great tool to spark this cycle of creativity. It can be used in a number of ways and fulfill several purposes. In a series of blog posts we’ll explore some of them and expose the value that they provide. We’ll look at prototypes that help define the user experience; others that evaluate technical feasibility and some that can be used as a sales tool or even a spec for application development.

Read the full article »

Tech Roundup 06.10.10

Interesting bits from around the web as uncovered by the Odopod Code Forum.

Adobe's iPad-izer
Adobe worked with Wired to bring a digital version of their magazine to the iPad as a native app. Here's an interesting article about how it was built.
• Cool: Nicely designed. Seeing Adobe trying to provide alternative tools to create content for iOS.
• Not Cool: A 527 MB download and being all image-based doesn't seem like a viable approach.

Exposing Audio Data to JavaScript
In a previous post we pointed out the limitations of the current html5 audio tag not having access to raw data. It turns out that a group of web audio and Mozilla developers are working on bringing audio data to audio and video elements.
• Cool: Offering a solution to bring raw audio data to the browser. This is essential to be able to create web-based audio applications or at least fully featured audio players.
• Not cool: As usual, when will we have this (or something like it) for ALL browsers?

Open-source project aimed at converting Flash to JavaScript/HTML5.
• Cool: Simplifying the conversion of Flash ads to JS and HTML (who loves making ads?)
• Not cool: We did a quick test and unless your swf is timelined and really simple it won’t work. Minimal bits of ActionScript broke it.

Web Fonts at the Crossing
A very nice and concise article about the history and current landscape of web fonts.
• Cool: A List Apart bringing great and relevant content to the web.
• Not cool: Nothing really.

Click for more...

Tech Roundup: 05.27.2010

Interesting bits from around the web as uncovered by the Odopod Code Forum.

A project dedicated to developing a high-quality, open video format for the web that is freely available to everyone.

• Cool: Creating open standards. Bringing high quality video content across all devices. That big influential companies are behind this initiative.
• Not cool: Open doesn’t necessarily mean free. Its uncomfortably close relationship to H.264 is causing some patent concerns. Also, lacking any sort of DRM might mean losing the battle since a lot of content providers need their IP to be protected.

Responsive web design
Hello CSS3 Media Queries. Creating smart and flexible grid layouts that gracefully adapt to different screen properties.

• Cool: css3 media queries and flexible-grid layouts allow you to tailor your layout to a device's physical characteristics without the need for separate stylesheets or subdomains.
• Not cool: Media queries are not supported by certain browsers (guess which!), necessitating JavaScript solutions to target the stragglers.

Dynamic Sprite
Utility AS3 Class for easy runtime asset management.

• Cool: We see this being very useful in some situations. A couple examples would be: sites that allow users to customize the UI with themes or when localizing sites with not a lot of text (and translating teams are used to changing swfs).
• Not cool: If your site has a lot of text content, this is probably not a very feasible way to setup your project. In that case, going back to having all your localized copy in XML would be more reasonable.

Click for more...

Tech Roundup: 05.14.2010

This week's discussion on technology from around the web.

Edwin – a speech-to-speech assistant (think accessibility) Android app built by one of our very own developers Carl Rice. Some cool features include asking for weather, location, translations, closest public transportation, etc. Note that the app is in an early alpha stage, this is a very early release and still a work-in-progress.
• Cool: It only took Carl under a week from downloading the SDK to publishing the app to the Android Market. Cool? More like Awesome!
• Not cool: Carl showed the app in our forum and you won’t get the full effect until you see it in person.

A Book Apart - "A Book Apart publishes highly detailed and meticulously edited examinations of single topics"
• Cool: Zeldman and company bringing insightful books to the world. We are excited to get our hands on their first published book, HTML5 for Web Designers by Jeremy Keith. Here’s an interview with Jeremy about the book.
• Not cool: We need to wait a couple more weeks. We want more!

HTML5 Doctype - "... you can write your web pages in a completely standards-based way (CSS, HTML5, JavaScript) and not have to use a single browser-centric tag in order to do so."
• Cool: New doctype will be supported by current browsers even if they don't implement the new html5 spec, they will just switch to standards mode.
• Not cool: We have to test this to believe it!

Tech Roundup: 05.06.2010

This week's discussion on technology from around the web.

Akihabara - A set of libraries, tools and presets to create pixelated indie-style 8/16-bit era games in Javascript.
• Cool: HTML5 GPL2/MIT licensed game library.
• Not cool: Still in its infant stage, no documentation, only 2D (no isometry), no audio yet, etc.

Interface - Mockup & prototyping app for the iPhone/iPod Touch.
• Cool: No coding experience needed to put together a prototype, hello prototyping designers!
• Not cool: Missing important features to be completely viable such as the ability to run on the desktop or sharing prototypes with other phones.

Volkswagen App my Ride - Contest to design car UI.
• Cool: Potentially designing a car interface that millions of people see.
• Not cool: VW trying to get design work for free.

Apps for Healthy Kids - Competition to end childhood obesity within a generation.
• Cool: Being part of a good cause.
• Not cool: Not having time for pro bono work.

Odopod is now Nurun

We're still in San Francisco, still under the same leadership, still doing great work (here are some case studies). But now we're a lot larger. We've joined a host of Nurun offices around the globe, all part of Publicis Worldwide.

Our focus remains on helping clients succeed in a connected world with products and services that transform the consumer experience.

We continue to work with forward-thinking, longstanding clients including Tesla, Google, Sony and Audemars Piguet. More recently, we've established new relationships with Dolby, the San Francisco 49ers, GoPro, and Blu Homes.

We welcome the opportunity to work with you too.

Tim, Dave, & JT

The best way to reach us

For new business, contact Allison McCarthy

For general inquiries, contact us at

For more about Nurun, visit