Xtandi Detail Aid - An iPad app - B2B, Vanilla JS, HTML5, CSS3, PhoneGap - Selected Works & Case Studies by João Pescada

Selected Works & Case Studies

Pharmaceutical sales delivered in a box.

Xtandi Detail Aid

An iPad app.
September 2013

While working for VCCP, we were tasked with building a digital detail aid, a document containing product information that is used by pharmaceutical sales representatives to engage physicians in a productive dialog about a drug.

As the campaign for this drug involved an old man sitting on a crate as a metaphor to containing the problem, we picked up from there and followed with the idea.

Since the content was required to be always available offline and preferably presented in a familiar way, we decided to package it as an iPad app.

Starting from the campaign video, we used the exterior faces of the crate as a base to display the information. For navigation (besides the menu), we allowed rotating the crate right and left as a linear back and forth navigation and up and down to dig deeper in the content.

To enhance the experience, we also added little details like shadows and other free elements moving slightly as the user moved through the content and tilted the device.


This mobile app was built in HTML5, making a good use of CSS3 transitions and animations and enhanced with a Javascript foundation to handle user interactions and communicating with the Phonegap framework in which the web app was wrapped.


Account management, UX and UI design by VCCP
Client: Astellas Pharma

Need help with your idea?

If you have an idea for a digital product, no matter how big or small,
I would really love to hear from you.

Even if it’s still very abstract, a little chat won’t hurt.

Let’s get in touch