Christian Diaz

Christian Diaz

Tadeo Jones

About the Project

I designed a Facebook App based on Tadeo Jones, an animated movie from Paramount Pictures. It contained information and mini-games.

Company

Digimedia Shop 

Client

Paramount Pictures

Disclaimer

To comply with my non-disclosure agreement, I have omitted and obfuscated confidential information in this case study. The information in this case study is my own and does not necessarily reflect the views of Digimedia Shop or Paramount Pictures


The requirements

 

Tadeo Jones is an animated movie that premiered in Mexico in 2013, so Paramount Pictures Mexico reached out to Digimedia Shop to develop a mini-site inside Facebook Apps.

The client provided all the assets, videos and information for the characters and the movie, but they wanted us to come up with a good idea for adding gamification using only those resources.


 

My Role

 

I was in charge of designing the whole user experience, information structure, graphics and gamification. Since this was going to be a web app inside Facebook Apps, I made a research about how I could propose an optimal experience using that platform.


The Approach

 

I proposed an informative mini-site with the movie synopsis, character bios, videos, downloads and mini-games. Since this was going to be oriented to kids from 5 to 13 years old, I designed a fun UI with jungle and rockish visual elements, to give them the idea that they were «exploring» the site.

I also came up with three good ideas for mini-games:

  • A sliding puzzle, with difficult levels
  • A scene maker, where they could place characters on a background
  • A game in which the user had to drag the name of a character into his/her portrait


Publication and Feedback

The mini-site was successfully published on Facebook and got good feedback from both the client and the users:

The client said that it was a gorgeous product that would appeal to both kids and their parents, convincing them to go and see the movie.

From the user side, the feedback from them was mostly positive, reaching thousands of visits on its short time period.

 

Los Coscorrones

About the Project

Originally planned as an unlockable mini-game inside the Chavo-Album app, Los Coscorrones was a whack-a-mole inspired game for the iPad based on the El Chavo characters.

Company

Digimedia Shop 

Client

Grupo Chespirito 

Disclaimer

To comply with my non-disclosure agreement, I have omitted and obfuscated confidential information in this case study. The information in this case study is my own and does not necessarily reflect the views of Digimedia Shop or Grupo Chespirito


The idea

The Chavo-Album iPad app was about to be released on the AppStore, and we were planning the Phase 2 of the app. Aside from adding more pages and more stickers, we decided to develop an unlockable mini-game that would appear when someone completed a certain sticker page.

I was commissioned to come up with a good gameplay mechanic that would be fun, challenging, and flexible enough to be implemented also on the iPhone version of the sticker album.


 

The Planning Stage

 

The Phase Two planning was a team effort, so we decided to have a couple of brainstorming sessions. Someone from the team suggested that the gameplay should be addictive (Angry Birds was the example we wanted to follow), and then we noticed that El Chavo, the main character of the franchise, used to live inside a barrel so we agreed that a «whack-a-mole» game style with barrels should be a good starting point.

We pitched the idea to the stakeholders and they agreed that it was very good, so I proceeded to detail the gameplay mechanics and features.


The Gameplay

I started to detail the gameplay from the most simple concept: the user had to tap on the characters as soon as they appear on the screen, and before they went back into the barrel. Depending on the timing, the user would earn different amount of points based on their reflexes and precision. To unlock a new stage, they should get a high-score on the current stage.

We tried to implement a timer, but we felt that it was not challenging enough so I came up with another idea: to give them unlimited time to earn more points, but implement «lives». So this brought another mechanic into the mix: to have characters that the user shouldn’t tap, or he will lose a «life».

Finally, we thought that the difficulty level should be increased as the player unlocked new levels, so we added more barrels and we increased the speed on each one.


Lives, Power-ups and Business Model

The gameplay was defined, but I still had to refine the business model. I knew that we will let the user to continue playing by buying more lives, but we wanted to add more microtransactions that were useful and attractive to the user.

Then I had the idea of adding power-ups that the user could use when he needed:

  • The «Amplifier» would allow the user to tap on a barrel, and make it count like if he tapped all the barrels on the same row at the same time
  • The «Lifesaver» would allow the user to tap an «enemy» and not lose a life
  • The «Mutipler» would allow the user to multiply the points earned for a certain amount of time
  • The «Snail» would cut the game speed by half for a ceratin amount of time
  • The «Precision» would always grant the user the maximum points that he can earn when tapping a character

But here was another thing: the user should be able to use one power up on each stage, so we implemented more «power up spaces» to buy, up to 5.



Testing and Development

 

The game was completed on a 70% before the company had to close, but there were a couple of demos that we shown to some potential users. The feedback that I had from them was that this game was really addictive and fun, and that it could have a lot of success as a standalone app on the AppStore.

Unfortunately, this game was never implemented neither inside the Chavo-Album or as a standalone game. It’s a shame because we knew that it was really funny and challenging to play, and that it would add a lot of value to the sticker album.

El Chavo Álbum

About the Project

In 2013, Digimedia Shop released an iPad Sticker Album App based on the popular mexican franchise of El Chavo. The opportunity was to take advantage of the growing smartphone market by releasing an iPhone version.

Company

Digimedia Shop 

Client

Grupo Chespirito 

Disclaimer

To comply with my non-disclosure agreement, I have omitted and obfuscated confidential information in this case study. The information in this case study is my own and does not necessarily reflect the views of Digimedia Shop or Grupo Chespirito


The Challenge

When I arrived at Digimedia Shop, they were developing an iPad App based on El Chavo, a very popular franchise in Mexico. The User Experience was already defined: it should feel like a real sticker album for kids, but taking advantage of the added value than an iPad can offer, by allowing the users to unlock sounds, videos and games by completing certain pages.

So the real challenge was: how can we implement the same experience that a big screen offers, in a smaller form factor like the iPhone 5?


 

The Mission

I had the mission of fitting all of this sticker album experience onto a mobile screen. This was my first UX assignment in the real world, so it was quite a challenge. And because we were a really small company at the time, I had to do all of this on my own, from sketching to Pixel Perfect screens, to assets delivery.

But apart from maintaining the core experience, there were more precise requirements:

  • Maintain the same pages that exist in the iPad version
  • Maintain the same layout for each one of those pages
  • The stickers should look visually stunning, like in the iPad version
  • Each feature available on the Pad should be available on the iPhone: friends, messages, sharing, trade stickers and of course, the store.

Quite a challenge, indeed.


 

The First Approach

I started by sketching some potential solutions that didn’t take me anywhere. How can I integrate an app that makes a lot of sense in an iPad form factor to a smaller screen?

Then I tried a different focus: What if we offered a complementary app instead of a fully functional sticker album? you know, and app where the user can buy, trade and manage all of his stickers. That sounded good but it didn’t resolve the main issue, which was to take advantage of the fast-growing mobile market.

In a good case scenario, this approach would be useful as a marketing tool for the iPad app, so the goal was clear: I had to find a way to create a mobile sticker album, without compromising the core experience.


The inspiration and the solution

I had an iPhone 5 at the time, and the AppStore was growing bigger each day. Like most of the first time iPhone users, I was fascinated by discovering new apps, so one day (a free comic book day), I downloaded a Comic Book reader app. I was really surprised when I found out that they resolved the small screen issue by using zooms and motion, so I tried a similar approach for the album:

 

  • I proposed to use the landscape view, that way we will have all the space available
  • I defined that the best sticker layout would be 2×2 stickers, that way the stickers would look big enough
  • What about the pages with 6 stickers? I proposed to use a scroll for those pages, so the user can see 4 stickers at the same time, but scroll if he wants to see more
  • About the core experience (hold & drag a sticker to place it on the album), I proposed to use a right drawer menu, in which the user will have the stickers available only for that page that he is currently viewing.
  • The rest of the features would be available using a hamburger menu, so we can make the user to focus on one thing at a time

 



Focus group and implementation

We showed the screens in an iPhone device to a group of potential users, and their response was really favorable. They couldn’t believe that the full sticker album experience was successfully ported to a small device, without taking away the fun of dragging and placing the stickers on each page.

The stakeholders were really pleased with what we achieved, so they greenlighted the development of the iPhone (and Android) version of this product. Unfortunately, there some circumstances that forced the company to close before this was released.

I’m really proud of how I was able to resolve a big UX challenge, but I’m most proud of the feedback that the current and potential users gave to me: most of them couldn’t believe how easy and fun was to have a mobile sticker album, without taking away the fun of dragging and placing stickers in the pages.