This is a breakdown of my mobile application, Setlife; which I created for media production professionals like myself. Every year studios and production companies lose millions of dollars to time that is wasted on sets. Additionally, productions are plagued with a myriad of other issues, which make it difficult for production professionals to do their jobs effectively and retain their sanity in the process.
My goal for this project was to speed up the pace of productions and alleviate some of the major frustrations that production professionals face while working on set. I served as the sole UX Researcher and UI Designer for this project, though I occasionally bounced some ideas off of a friend of mine who works as a graphic designer.
The UX Research Phase
The research phase of this project began with the creation of a screener survey. The primary goal of which was to find production professionals who were willing to be interviewed regarding the most common frustrations they face while working on set. I received interest from a wide array of media professionals and was able to pick out a nice mix of job types (from various production departments) for the interviews.
In my interviews, I found that most of the common frustrations that production professionals face seem to stem from a breakdown in the current communication channels that are used on set. Miscommunication of specific tasks between departments, plans changing on the day of production and problems with walkie talkies were just a few of the major frustrations that were commonly mentioned. Another significant problem that kept popping up in the interviews was difficulty accessing production files, most of which are currently sent as google drive links or as PDFs through the crew member’s personal and/or professional email addresses. This can lead to a whole host of accessibility issues (especially at scale on larger productions).
Following the interviews I created a few deliverables to help me better understand my target audience and core users… namely, empathy and affinity maps, as well as user personas (see the images below; click to enter expanded view).
The UI Design Phase
I began the design process by creating user flows (aka red routes) for each of the major functions I knew that I wanted to include within the application. From there, I had a pretty good understanding of the pages I needed to design, so I began creating sketches.
Once I had all of my primary screens sketched out, I then created wireframes for each of my screens; adding in new screens and making small iterations as I went. At this stage, I also completed a heuristic analysis of the designs of my closest competitors. This helped me to pin-point the shortcomings in my competitor's designs and provided me with some much needed inspiration for the user interface of Setlife.
Following the creation of my wireframe designs, I used them to create a series of low fidelity mockups, which I then adapted into high fidelity mockups that I could use to create an interactive prototype (complete with approximated screen transitions and some basic animations).
I also created edge cases and wire-flows (using the low fidelity mockups) to illustrate all of the various ways that users could choose to navigate throughout the application.
Before I could create my high fidelity mockups and interactive prototype, I needed to create a company for my proposed application, so I designed and created a logo, mood board, brand platform and complete style guide; so that future designers would know how to make changes, iterations, and new pages for the application while staying within the pre-established aesthetic.
Usability Testing & Iterations
Following the creation of the prototype, I conducted two rounds of usability testing and iterations; each of which contained a total of 5 test subjects. During these usability tests, I was able to find and fix a few major and critical issues, as well as, a number of smaller quality of life user experience issues.
Click the image below to access the basic interactive prototype of Setlife.
Project summary & Key Take-Aways
Throughout the design process I struggled with feelings of inadequacy. I was worried that I just wasn’t a good enough designer to make something that users would genuinely enjoy looking at, let alone, interacting with. But I was pleasantly surprised to receive overwhelmingly positive responses during the usability testing of the interactive prototype.
One user went as far as to claim the application would be, “an absolute game changer to the industry”. While another stated, "I wouldn't be shocked if HBO or Netflix started using this on all of their productions".
This experience has really helped me improve my confidence in myself as a designer, while also helping me realize the benefits and importance of having/working with a team. I found that at a certain point in the design process, the only way to continue to improve your designs is by getting a fresh set of eyes to look at them. A team member or even just random bystander may be able to spot key oversights that you may have missed. After spending a considerable amount of time with your designs, I believe that any designer would run the risk of becoming blind to their own faults and/or mistakes.
I will be conducting a few more usability tests and making some final iterations. That being said, I am pleased to report that this project is nearly ready to enter active development and I could not be more excited to do so.
While the designs have continued to evolve and grow throughout the iterative process, I now feel confident that we have successfully achieved our initial goals for the project (e.g. improving and simplifying on-set communication and alleviating many of the most common frustrations that production professionals face while working on-set). There is no denying that this is something that is truly unique within the space and stands to completely change how we manage and interact with others while working on set.