DATE
2020
ROLE
UX/UI Design
Frontend development
TEAM
Federico Cella
Francesco Puddu

Netflix Comments

Context

Netflix Comments is a Chrome extension that adds a comments section to the Netflix user interface. I started the project following the rough ideas about asynchrounous watch parties that I had already explored in the Teleparty project. After documenting myself about Chrome Extensions I reached out to Francesco, a long-time friend of mine who is studying Software Engineering, to seek help for the backend part. I knew I would have had to make a database and access that database through an API from my extension, however I had no idea where to start. Not only did Francesco answer my queries, he set up a MongoDB database and hosted a .NET app to serve the API. In just a few days we were able to make a functioning, although rough, prototype. In the following months we added the basic features to make it into a market-testable MVP.

Comments and Activity tabs

Design choices

Log-in

There is no log-in required to use the extension. When the user installs the extension, they are assigned a unique name made of two words and a number, which is then saved into their Google account, or locally in their browser if they dont have one. This is to avoid an extra barrier.

Showing comments

I conceived the idea of Netflix Comments as a way for users to discuss movies and TV shows similar to what they would do in a YouTube Live or an Instagram Live. It seemed obvious at first that comments would pop up at the point in the timeline where they were written, exactly as it happens on YouTube and Instagram. However, such a design risks ruining the normal watching experience when the user just wants to be immersed (which doesn't happen on Instagram and YouTube), so I opted for a design where the user has to hover on the comments icon to show the comments section. Moving the mouse out of the tab makes the comments section disappear. This way, there is continuity with the rest of the Netflix UI, to which the user is already used. And making the extension inobtrusive can potentially increase user retention.

Spoiler protection

The spoiler protection feature is similar to what was originally imagined for Teleparty. Comments that were posted at a later point in the show's timeline are blurred out, unless the user clicks on "Show More". Some people like and seek spoilers, so I decided to make that an option. If a comment is in fact a spoiler, it can be reported by other users. This, for the time being, sends an email to me and Francesco from which we can examine the comment and delete it if it's the case. Or, if the comment gets reported by five different users, it gets automatically deleted.

Comments and Activity tabs

User growth

I thought I would start with a group of friends or a small community of people who knew each other. In order to make the product usable at early stages, I thought about an MVP "Activity" tab which shows the latest comments made by anyone on the extension. Clicking on the name of the name of the show leads to the episode where the comment was made.

Development

Because of limitations set for extensions, I couldn't use frameworks like React or JS bundlers because that would have created more problems than it would have solved. I had to write vanilla JavaScript. The biggest challenge was manipulating Netflix's DOM – which is actually built by React – without breaking it. This required writing some slightly awkward code, but resulted in an interesting excercise.

Learning from feedback

The extension got some visibility after I posted on Reddit to promote it. This allowed me to validate some assumptions about the design.

  • First of all, a big assumption was related to the interaction model of time-based commenting. This seemed to be not very intuitive for most users. Most users commented at the start of the episode, either because they didn't understand it or because they simply ignored it.
  • Most comments were the "review" type of comments. This makes the previoius point even more understandable.
  • No one seemed to care about the "Activity" tab, or they didn't understand its purpose. The latter hypothesis is supported by the fact that a common first-time-user behavior was clicking on a lot of different shows looking for comments, when really all the comments of the extension appear in the "Activity" tab.