1/ Research and discovery

Each chapter of "El Helicoide" gives you a 360-degree scene to explore, by clicking, swiping or using your phones gyroscope to open up a window into the jail. It's a combination of a long-read, a documentary film and a point-and-click adventure.

"Explore the IS tunnels" was built differently with only one 3D model. The user has to navigate through it.

Through my research, I discovered that the user can get easily frustrated or confused when using 3D. Therefore it was essential to test usability throughout and use an agile methodology.

Usability Testing

We conducted eight tests on two existing 360-degree experiences. We had a range of users from different nationalities, between the age of 24-45. Four users tested on desktop, while the others tested on mobile.
‍

‍
How do they navigate between scenes?
How do they use the 360-environment scene?

‍

‍

One of the testers had his phone on the table, the screen was white. He thought there was a bug, but it wasn't. It was the floor of the 360 environment.

‍

Take away

We found out a lot of people weren't that familiar with VR/360 experiences, especially on their phones. They also weren't reading the tooltips and didn't know how to navigate. As a solution, we added a chapter navigation to guide them through the 3D scenes. We also created a slight span of the camera when the user first lands. It helped considerably to engage the user with the interaction. They understood they could spin their mobile and see the scene as if they were there.

‍

2/ Product and 
design decisions

Wireframes

As a result, I created hi-fi wireframes. To help users interact with the product, I added a menu, navigation tool and introduction. Depending on the users internet connection, the 360-scenes could be quite slow to load, so I created an entertaining animation to keep users in engaged. For "El Helicoide", we added a quote from the main character and a B&W animation for "Explore ISIS tunnels".

‍

‍

‍

Right to left language interface

For “Explore the IS tunnels”, we had the additional challenge of adapting the interface for the Arabic market.

We didn't need a menu as the story was less complex and without different branches. Instead, we focused users going directly through the tunnel. I added a map to help the user understand how the tunnel was built.

‍

‍

Take away

I completed usability testing with Right to Left speakers on mobile and desktop. The experience was smoother for them compared to before. The bottom navigation helped considerably for them to explore the tunnel. Without it, users were confused where to click and would get lost in the 3D model, especially on mobile.

‍

3/ Result

Award and recognition

"El Helicoide" was viewed more than two million times within its first week of publication. It was shared widely, notably by the British Foreign Secretary, the Secretary General of the OAS and the former Colombian President.

2019 Nominee Webby Awards: Best Individual Editorial Feature
Human Rights award (digital) and Silver award in the innovative format category at Malofiej

"Explore the IS tunnels" was also a success.
2019 Nominee Webby Awards VR: Cinematic or Pre-Rendered
Malofiej Infographic World Summit: Bronze award in the innovative format category

‍

‍

See the projects live here:
ISIS Tunnels
El Helicoide

‍

‍