Making a mobile OPOPO
Story Behind This Shot
The goal was to design a mobile version of the movie card for Frequently Asked Questions About Time Travel on ororo.tv. This platform lets users watch movies in their original language to improve their language skills, but it currently lacks a mobile app.
While analyzing the movie card, I identified key information elements and user scenarios. Then, I categorized them to determine which belong to the system as a whole and which are specific to the movie card. This process was based on an object-oriented approach (OOUX).
For this project, I had two options: designing a mobile app UI or creating a responsive web version. I decided to go with the mobile app because I found it more interesting.
I transferred all the key scenarios and information entities to the layout of the mobile screen. Additionally, I added the function of changing the subtitle language using a drop list. In the desktop version, this functionality was not explicitly indicated — perhaps it is hidden behind the icon. In any case, this feature improves the user experience.
The mockup below showcases the initial stylistic direction, which I later refined. It also introduces a previously overlooked element — comments. I decided that placing this feature in a tab would be the most logical approach.
After assembling the initial interface, I reviewed it to ensure all key scenarios from the desktop version were accounted for. Since this concept was designed as a mobile app, some global actions were moved to higher-level screens.
In the final stage, I merged the "Like" and "Add to Favorites" actions into a single element — an interactive like icon with a counter. I also replaced the subtitle dropdown list with a swipe-based control, making the interaction smoother and more intuitive. However, this approach would need usability testing to validate its effectiveness.
The final mockup of this concept is presented in the first image of this case study.