Movie Night App: Research & Testing

Part 1: A one week sprint for week one at General Assembly

6 min readJun 13, 2018

--

1. The Why

During the first week of the UXDI course at GA London, we were tasked with identifying and solving an issue for one of our classmates.

The one week timeframe meant that we would have to cover a wide variety of both research and ideation methods, without diving too deeply into any one in particular. This would give us a solid overview of the UX process while exercising our critical thinking skills in order to meet the deadline.

2. The Who

Once paired up with my user it was time to find out what his interests and frustrations were through an initial interview. It quickly became apparent that Julien (my user) was an avid movie fan and enjoyed watching movies with his girlfriend; however, they have differing tastes, so the process of choosing a movie can be lengthy and frustrating!

“Sometimes I’ll want to watch a classic movie, while she might want to watch a lighter, more recent film, so we go back and forth for a while and end up watching something neither of us are really happy with!”

Now that I understood the problem it was time to put some context around my possible solution.

An initial storyboard used to visualise the problem statement and hypothesis

With the problem visualised, it was time to dig deeper and get to grips with the key issues Julien faced when it came to choosing a movie with his girlfriend.

Synthesising information I had gathered in the user interview into a preliminary concept map allowed me to start making connections between underlying elements of the problem. It became clear that TIME (the time it takes to choose a movie) CHOICE (the criteria used to select the movie) and COMPROMISE (the process by which they agreed on what movie to watch) were the key factors to focus on if I was going to help solve the problem.

Concept mapping the underlying relationships of the problem

Solution

Armed with a clear problem statement and an understanding of the frustrations felt by Julien with this process, I could now start implementing a possible solution.

I began to form an initial outline of the solution with some preliminary sketches and flows. I made sure to document my thinking behind each element and step of the process to be able to revisit my ideas and improve upon them.

Incorporating user feedback throughout the process was extremely important in order to keep the solution focussed and efficient at solving Julien’s problem. Talking to Julien about my user and wireflows revealed that one of my main screens could be served as an option and wasn’t necessarily required as part of the primary flow. This kind of feedback helped me to pare down my solution further and would help Julien reach his goal more quickly.

Wireflow iteration based on user feedback

3. The What

With a firm grasp of the problem and a possible implementation it was time to start thinking about the interface and testing its usability.

My idea was to have a mechanic that would allow Julien and his girlfriend to pick a ‘lead’ user to be in charge of setting the criteria for the film they would watch. This could include filters such as genre, movie length, ratings, release date etc. As they usually make this initial decision in person there would be no need for messaging functions at this stage; however, if they were unable to agree on who would be the lead user I added a ‘randomise’ button where the app would pick the lead user for them.

Version 1 of the interface plus amendments from user feedback

The app would then offer each user five random movies from within those criteria, each user can then independently rank them based on preference, the app would then show each user the other user’s choices, which they would then also rank. Upon completion the app will calculate the highest ranked movie overall and display that as the winner.

With some feedback from Julien, changes were made to this process (by offering the same five movies to all users, this eliminated the need for step 4 in the image above) allowing for a much simpler and less time consuming process than having to rank each other’s choices, this made much more sense!!

Design & Prototyping

I could now begin sketching the final design in preparation for paper prototyping.

Some initial sketches of the interface and flow

After a few iterations of the rough interface and some user feedback I began to realise which UI elements and functions would be necessary for this application to work in the simplest way possible. As can be seen in the image above, I am still trying to figure out the best placements for buttons, which format search filters should take and the possible mechanics for re-ordering the movies. From these semi-rough sketches I asked Julien to help me understand how he would prefer to interact with the application and some further refinement lead me to a slightly more user-optimised set of sketches with which I could begin testing.

Final sketches for my V1 prototype

Once the V1 interface had been finalised it was time to start testing with a paper prototype. This allowed me to test the screen flow, UI elements and layout in a very fast and efficient manner without having to be too precious about my design.

Initial testing with Julien was very successful, he seemed pleased with the mechanic for democratising the selection process and said that the screenflow and design was simple and easy to navigate.

Layout for the paper prototyping stage

Feedback, feedback & more feedback

During the paper prototype Julien noticed a couple of elements that could be improved, such as the slightly ambiguous ‘home’ button on the final page, the fact that the ‘thumbs up’ & ‘thumbs down’ icons felt more natural with their positions switched and a more simple ‘back’ icon. Other than that, the testing was smooth and overall the implementation seemed to be very successful at solving Julien’s problem.

Implementing the CTA & UI changes after feedback from the paper prototype

With everything in order I could now create the clickable prototype to test the solution on an actual device.

Clickable prototype V1 made in Marvel

Link to clickable Marvel prototype

As with the paper prototype the clickable prototype proved to be intuitive and efficient at achieving the user’s goal, in large part thanks to the constant user feedback and iteration up to this point. This has proven to be a valuable lesson for me on just how important it is to remove your own biases and preferences almost entirely and focus solely on the wants and needs of your user!

Read Part 2 Here

Conclusion

Ultimately I feel that the goal I set out to achieve was accomplished and a useful solution with a simple and efficient interface was the result. The user, Julien, was very pleased and stated that it was something that he would actually use.

“It’s cool, very straightforward and all of the screens make sense, I can see myself actually using this!”

This was a great introduction to the basic UX design process and while challenging in parts, it was an extremely rewarding process! To be able to help people solve their problems through good design and even better research is something I look forward to doing much more over the rest of the course.

--

--