MoJo: The News Van in Your Hand
An upcoming journalistic livestreaming app - tailored to help journalists succeed in the field
MoJo is an iOS application tailored for journalists to use in the field. They add B-Rolls (short video clips), Interviews (long video clips), Photos, and Maps to a project, and then merge it all together while livestreaming to create a professional news story. This app helps prevent journalists in the field to miss important breaking news footage: sometimes their equipment setup takes too long and by the time the equipment is setup, the news has already passed - a good example is a fire that gets put out before the journalist can cover it.
Steps we took to achieve this design.
The Problem
Journalists are consistently missing breaking news coverage due to the delay in equipment setup. Sometimes they just need to cover news quickly but are missing the tools to help them create a professional looking video that does not compromise quality and reaches a wider audience.
The Design Challenge
When journalists are out in the field, they need to be able to record, edit, & access their gathered information to provide a seamless news report when equipment setup takes too long. They typically have 4 main segments that need to be added to create a livestream that looks like it was professionally made - B-Rolls, Interviews, Photos, and Map Location. Journalists need to be able to seamlessly combine these sections, start livestreaming, and then play each section as they talk over the segments added.
Our Solution
We first conducted user research, talking with potential users of this app, all of whom are journalists who have worked (or are currently working) in the field. Based on the research, we designed an app that allows journalists to create a new project, then add individual elements (B-Roll, Interviews, Photos, and Maps) and customize those. They can add them as previously taken from their camera roll or cloud, or they can take them directly in the project.
We began the process in the Discovery phase.
-
Competitive & Comparative Analysis
-
User Surveys (featured)
-
User Interviews (featured)
-
Analysis of Existing App
User Surveys
We conducted surveys to understand the feelings of journalists in the field towards mobile journalism. With 107 participants who all have experience working in the industry, we were able to get some high quality data to further gauge their opinions on the future of mobile journalism.
Lengthy Setup Process
We discovered more than half of journalists in the field miss recording breaking news due to the lengthy equipment setup process.
Professional Usage of Phone
Those who answered no are mostly worried about quality - shaky video, wants brand to look polished while recording, worried about professionalism and looking cheap.
"Go-To" News Platform
This shows that Social Media is of high-importance to journalists, both to get their news and to share the news they broadcast.
User Interviews
To understand the experiences of a field journalist, we interviewed 7 journalists who are currently working or recently worked in the field. We dove deep to understand any setbacks journalists face in the field, if they ever use a phone to broadcast live, and learn about any tools that are most helpful to them. We also wanted to understand their thoughts on how they see the future of journalism changing.
Journalist #1
“Everything is moving towards the phone.”
Journalist #2
"We don't use news vans because they are a pain in the a**."
Journalist #3
“Using the phone is much more immediate & easier to get in touch with a wider audience.”
Primary Findings
Journalists are very interested in mobile journalism, but not complicated apps. Things need to be saved on the Cloud, in case their phone is broken or lost. They also constantly utilize social media to discover potential news stories and to share news.
Phase 2
Define the problem.
After working with the research, we were able to take a step back and define the problems users face as they go along this journey. We used some key tools to help us define this.
-
User Personas
-
User Journey Map
-
Prioritize Features
Understanding how this app will improve users lives
We developed two user personas: Harmony Hall and Lance Lancaster.
Based on the research we previously gained, we created a persona who is a seasoned journalist as well as a newcomer persona who is just starting her career. We created these personas to identify how our average user behaves as well as help us empathize with them by giving them a real face. This helps us to keep the user at the forefront of the process because we can continually see them as real humans.
Harmony & Lance's Experiences Pre-App
Through making a user journey map of the high and low points of our persona’s experiences before they started using the app, we can further understand where they are struggling the most, helping us to prioritize the right features.
Feature Prioritization
Based on the research we gathered about our users needs and pain points, we ordered which features should be prioritized according to what the app must have, should have, could have, and will not have. This helps prevent feature overload, so we can keep the focus on what is most important for the users.
Re-defining the problem statement
When journalists are out in the field, they need to be able to record, edit, and access their gathered information to provide a seamless news report. Both Harmony & Lance are having trouble reporting and delivering breaking news in this area in a timely manner.
How might we offer our users a solution that streamlines this process while not compromising quality and reaching a larger audience?
Phase 3
Time to start Designing.
-
Design studio
-
Paper sketches
-
Rebranding
-
Style guide
-
Prototype
-
Usability testing each prototype
Collaborative Design, a Team Effort
We started with a design studio to get the creative juices flowing
Before we started designing, we each took 5 minutes to draw out our ideas for individual pages. After each page, we grouped together and discussed each idea, then combined the best suited ideas and had one person on our team draw it out into one cohesive flow. In this way we were each able to get our ideas out there and then agree on how to best move forward with the initial design.
Key Takeaways from Design Studio:
During this stage we found ourselves thinking deeply about each possible scenario that could take place while a user is putting together a video on this app. While this step took some time, we were able to create a more thought-out product that included:
-
Being able to trim a clip from B-Roll or Interviews and what that process would look like.
-
How to rearrange the clips.
-
Where all of the buttons should be placed to minimize chaos and maximize productivity, specifically the "end livestream" button.
Paper Sketches
Initial Prototype - 10 users tested, 2 iterations
By incorporating the research and prioritized features we previously developed, we sketched up and tested 2 low-fidelity prototypes. At this stage, we started mimicking iOS interactions, such as popup modals and sliding components.
Key Findings:
-
After going live, there should be a button clickable at all times to exit the broadcast
-
During onboarding, there should be an option to skip
-
There are too many options for drawing & adding text to maps
-
Going Live ought to be in the carousel
Features Implemented After Testing:
-
Record, play, & live buttons clear & consistent throughout
-
Option to exit live stream available throughout
-
Separate play button for B-Roll/Interview clips
Medium Fidelity Prototype
No branding & lacking stylization - 3 users tested
This prototype focused on layout and how clear it is for people to use when it is cleanly made on Sketch. We didn’t yet put any emphasis on branding, though we played around with the idea of a black, red, and neutral color scheme.
Key Findings:
-
Option to capture/import/save photos necessary
-
Thumbnail clips and play buttons are too small
-
Volume toggle options to use during B-Roll footage missing
Features Implemented After Testing:
-
Photo function added to carousel menu
-
Larger, more accessible thumbnails and play buttons on various screens
-
Ability to change levels of volume on B-Roll & Interview screens
Rebranding & Name Change
Originally, the name of this application was called “VOSOT.” This is a common journalistic term that means Voiceover/Sound on Tape. During usability testing, we asked users about their opinion regarding this name. They consistently said that while they recognized the term and used it often, they felt that this was an inadequate representation of the app’s capabilities.
MoJo is another journalistic term that stands for “Mobile Journalism.” The term describes the purpose of this app and the users we tested, as well as our clients, loved it.
High Fidelity Prototype
For this final iteration, we incorporated the new branding and color scheme, a modal for orientation selection incorporated when starting a project, and an option to re-click thumbnail to close trimming function.
Mojo Intro
This intro will only show up the first time a user opens the app, although they can always find it again in the help tutorial in settings.
Hi-Fi Content
This intro will only show up the first time a user opens the app, although they can always find it again in the help tutorial in settings.
Hi-Fi Content
This intro will only show up the first time a user opens the app, although they can always find it again in the help tutorial in settings.
Results & Takeaways
This hackathon project was an invaluable learning experience for me and my team. We ended up winning all the awards at the presentation, which made us super proud. LAHSA incorporated some of our designs into their update, which is incredibly awesome. Yet there is always room for learning, iteration, and improvement! If I had more time to work on this project, here are some things I would like to update.
