User Experience (UX) Design Case Study by Joni Gutierrez
Many of us who have been on lockdown due to the COVID-19 pandemic have taken refuge in watching movies at home. This has provided us an unforeseen but welcome opportunity to be exposed to a wider range of movie ideas, filmmakers, styles, and techniques from around the world. In addition to the entertainment and artistic gratification from these creative works, we have been developing a renewed sense of connection with our fellow human beings who we know and feel are in the same boat. Through our shared experience as film spectators, we realize that the enjoyment of films is an essential part of what it is to be human. This resonant condition presents us with the insight that the entire library of cinematic media – now made more easily accessible through online streaming – is an integral part of the heritage of humanity.
Concept: Energy Sharer
When people watch movies, they are sometimes struck with an idea for a new film. Unless they are filmmakers who have suddenly come up with a new story concept for their next work, regular film viewers who do not have practical use for these gems usually just forget about them immediately. Though they are fleeting, having these “idea lightnings” makes people happy because through these, we feel as if we are starting to have a deeper relationship with the source of all creativity.
One of the values that the pandemic has brought out of us is that of sharing. During the quarantine when our access to physical resources has become limited, we have realized that there is another thing that we can freely share, that is, our energies as humans who care about our fellow experiencing beings. The source of this energy is the Universe and is therefore unlimited. We transform this energy and share it with others, for example, through our comforting words to the afflicted or the posts that we share on social media to make sure that frontliners receive our sincere appreciation for the heroic work that they are doing. This shared energy multiplies with every exchange and inevitably actualizes into acts of kindness such as people sending food to the nurses and doctors who save lives everyday.
The “idea lightnings” that sometimes strike us when we watch movies are also forms of energies that come from the unlimited source. For a moment, we become vessels of the creative energies that want to manifest themselves into new cinematic works. What if we could grasp these ideas a little bit longer, enough for us to share them with others who might draw inspiration from them? What if, collectively, we could create a hub of these movie ideas that could help us come up with new film projects which would eventually contribute to the library of works in world cinema? This has inspired me to conceptualize and plan for “Energy Sharer,” a free digital platform where we can freely share movie concepts to others while also inspiring ourselves with the ideas that our fellows are also openly giving. Figure 1 presents the logo, color scheme, and typography to be used for both the website and the app versions.
The primary objective of the project is to design the Energy Sharer platform in such a way that the user experience would flow easily with the spirit of sharing. The user interface should match the mental model of the users, that is, of coincidentally receiving inspiration from random strangers or even from nature. The user experience should facilitate the easy transformation of creative ideas from one’s mind, to the digital interface, to the minds of other people who yearn for inspiration, and then back to Energy Sharer which is essentially a digital exchange of creative ideas where this cycle repeats and organically makes new branches.
Understanding the User
The prospective users of this online service are (1) those who want to give ideas to others who might find use for them, and (2) filmmakers or even regular movie lovers who want to receive sparks of inspiration for new movie ideas.
To understand the users of Energy Sharer, interviews were conducted amongst potential givers and receivers of movie ideas. This resulted in the two personas identified in the UX case study. Figure 2 illustrates their respective short biographies, characteristics, motivations, use-case scenarios, goals/interests, and pain points/concerns.
The prototypical user primarily approaches Energy Sharer’s gallery of movie ideas. Here, the website visitor or app user gets an impression of the wide range of movie ideas in the hub while establishing a sense of rapprochement with other human beings sharing their creative sparks. Figure 3 maps out how this primary motivation organically flows to the next three activities in the website/app: (1) modulating or refining the possibilities of the available concepts by commenting and rating them, (2) submitting one’s own movie ideas, and (3) deepening their engagement with the larger, worldwide community of energy sharers.
Design & Research Process
I have executed a four-phase design process to build a user-centric interface and user experience for Energy Sharer: (1) empathize & research, (2) design & prioritize, (3) ideate & prototype, and (4) iterate and validate.
Empathize & Research
As a movie lover and filmmaker hunkering down during the COVID-19 pandemic, I have empathized with other people who have also taken comfort in the power of creative inspiration. This prompted me to conduct interviews and surveys which formed the basis for the Energy Sharer concept, its corresponding user personas and user flow as discussed in the previous section, and finally, this online service’s ultimate goal of facilitating and nurturing a sense of interconnectedness amongst energy sharers. Figure 4 shows the homepage which immediately communicates that aside from giving and receiving movie ideas, Energy Sharer also looks forward to reinforcing this sense of camaraderie by having online forums, organizing/publicizing member events, and exhibiting media that result from creative collaborations amongst energy sharers.
Define & Prioritize
The Energy Sharer project is indeed quite extensive so for this particular UX case study, I have focused on only a couple of main functions, namely, Gallery and Submit. The mockups in Figure 5 illustrate the primary use-case pattern that connects the Gallery (receiving movie ideas) to the Submit (sharing “idea lightnings”) pages in the website version.
In addition, Figure 6 documents the low-fidelity wireframes for the Gallery (and item details), Submit, Forum, Events, and Media sections for the app version of Energy Sharer.
Ideate & Prototype
Based on the user research and a fine-tuning of the scope as discussed in the previous sections, the present UX case study has explored several ideations of Energy Sharer. Figure 7 exhibits high-fidelity wireframes of the Gallery and Submit sections in the app version of the digital platform, plus the loading screen that features the animated brand logo.
Iterate & Validate
Driven by data from usability tests, A/B testing, and interviews, the study has executed an iterative design process. Figure 8 shows versions one through three for the submit section of the Energy Sharer app.
Figure 9 summarizes the multi-device interfaces that resulted from this UX case study.
To conclude, since cinema is an affirmation of life, survival, and creative transformation, engaging with the movies meaningfully during this period has been a way for us to cope with our shared anxieties as we are faced with uncertainties about the future. It is fervently hoped that Energy Sharer, by connecting movie lovers through a kaleidoscopic mirroring of creative inspiration, can help us imagine a post-COVID-19 future when we will have learned significant insights about our shared experience and humanity’s common destiny.
ACKNOWLEDGMENTS: Freely usable photos by Bhavya Shah, Obi Onyeador, Elijah Flores, Maddy Baker, Guilherme Stecanella, Steven Kamenar, Zane Lee, David Clode, Hal Gatewood, and Bangkit Ristant on Unsplash.com