top of page

MoJo: The News Van in Your Hand

An upcoming journalistic livestreaming app - tailored to help journalists succeed in the field

mojo_header_3phones_black.jpg

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

Mojo_header_5phones_black_shorter.jpg

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.

Survey Equipment setup_edited_edited.jpg

Lengthy Setup Process

We discovered more than half of journalists in the field miss recording breaking news due to the lengthy equipment setup process.

Survey_ Use Phone_edited.jpg

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.

Survey_ news platform_edited_edited.jpg

"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. 

interview_male_blazer_edited.jpg

Journalist #1

“Everything is moving towards the phone.”

interview_female_vneck_edited.jpg

Journalist #2

"We don't use news vans because they are a pain in the a**."

interview_male_sweater_edited.jpg

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.

P5PersonaHarmonyHall.jpg
P5PersonaLanceLancaster.jpg
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.

p5_journey_map.jpg
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.

P5 Feature Prioritization.jpg

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.

p5_design_studio_cg_edited.jpg
carissa_design_studio_edited.jpg
p5_design_studio_combined_edited.jpg

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.​

p5_low-fi_usability-testing1_smaller_edited.jpg

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.

p5_logos.png
P5_style_guide.jpg

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 High Fidelity Intro.png
MoJo High Fidelity Content.png
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.

More projects

bottom of page