_MG_9024.JPG

Rae Sremmurd/Doritos - Over Here

overhere_mockup.png

RAE SREMMURD & DORITOS

Lead UX/UI Designer: Mobile Website and Desktop Splash Page


The Ask

Goodby Silverstein & Partners approached STOPP with the idea of creating a "one-of-a-kind, interactive,
multi-screen music video" sponsored by Doritos and starring the Hip Hop duo, Rae Sremmurd for
their new single "Over Here". With this music video, fans would link their phones together to
|make the video bigger and wilder, making it the first music video that gets better the more friends
you invite to link up. There was no limitation to how many phones could be used. Our challenge was
to develop a creative concept that not only captured the insanely high-energy and surreal
nature of Rae Sremmurd but also a concept that could function and evolve as
more and more devices were added.


The Approach

Upon the debrief, questions instantly began flowing like, "what would it look like if only
one phone was being used versus 2 phones or 12?" And the most important question, "what would
be the incentive for fans and viewers to add more and more phones? There really wasn't any limit
to how far we could push this visually so initially we considered heavy interactive ideas, like choosing
your own adventure, hidden mini-games or being able to steer the spaceship in different direction.  

This however is when we came to a technical crossroad... Do you want to interact with the actual
information in the video and risk losing audio sync from one phone to the next OR do you
want to create a preloading video that is completely synced without physically interacting with
the video. In the end this is a music video and if the sync was off from phone to phone then it
would be so distracting to the users, that it would be unwatchable. We decided on the preloading
direction. This now meant that we would be pre planning all of the action within the video
and depending on the amount of phones that were linked up would determine
how much of the video would be revealed to you. 

With that we decided that the main meat of the video would exist within six-screens. It allowed us
to create a story that could exist in six "stages." When each new stage was activated, more content
would be revealed until ultimately, the viewers would get the full experience of the video. This also
opened up a fun Easter Egg that when viewing on phones 1 through 5 there is a section
missing and only triggered when the 6th phone is added. 

The first user to start would become the administrator. This user would receive a personal URL
that could be shared with friends. In the waiting room, a users would see their friends joining in
and an animation of the phones appearing and aligning with every added user. The backgrounds of
each user waiting room would include a piece of the logotype OVERHERE, and in alignment they
would form the full logotype. This gave the user a hint up front of where to place their phone
once the video starts. Once the administrator hit start, the OVERHERE logotype lit up
|across all devices and gave the users time to place their phones in the right position. 

videosdoritosraesremmurd.gif
raesremmurdphones.gif