Millennial News | UX Case Study
Android Native App
During my time at DevMountain, a UX Bootcamp, I designed a news app that was targeted towards millennials. My team and I presented news in a way that removed initial bias and gave the reader the ability to choose for themselves.
The Problem
Millennials are always on the move and because of this, they don’t have a lot of time to sit down and read a newspaper. Most of the news they receive comes from social media and unverified sources, which needs to be taken with a large grain of salt. It was also noted that most millennials avoid watching the news, due to a large amount of negative and depressing news that is reported on a daily basis.
Team
Nathan Maus (me)
Tara Shipp
Micaiah Buttars
Research
We surveyed 46 millennials between the ages of 18 and 28 to understand the issues they have with the news.
These are the pain points that stood out to me:
- Millennials don’t like watching the news because most news stations focus on ‘depressing’ news.
- Millennials are on the move, now more than ever, and they don’t have a lot of time to read long articles.
- To check the validity of a story they will check the same news coming from different sources. Making it tedious to learn what the facts are.
After gathering that data I wanted to validate it by reaching out to a local expert. I got us an interview with the head of digital solutions at KUTV, a local news station in Salt Lake City.
This is what we learned:
- The average time a millennial spends with their news station is 6–7 minutes
- Millennials are visual learners
- Based on KUTV’s internal research, millennials love live footage; KUTV even has tools to track social media posts so they can present information as it comes through. Making every citizen a live reporter for KUTV.
The biggest insight that we gained from KUTV was the realization that millennials love live footage. In our initial survey, we weren’t aware of this fact so we didn’t explore it too much. After learning about this from the news station we were able to dig a little bit deeper and improve our focus.
Ideation
Now it was time to create a solution. We weren’t here to recreate the news, just present it in a different way. We decided to pull content from the top networks, and weed out any click-bait sources.
During our process, I kept asking myself, “How do we present news in an unbiased way?” At first, we thought to create our own content that would list our “facts” from both sides of the story. But how do we stay unbiased? Obviously, we will have our own opinions and that will show in our writing even if we try to be neutral.
Everyone has a bias, no matter who you are or what you do. It’s human nature. It’s how we’re raised, our parents have their ideals and push those onto us. We can’t get rid of bias unfortunately.
We want a way for users to consume the content, and make their own decision about the information…
What would you think of the news if you didn’t know which station it was coming from?
This question helped us create a very unique experience for our user, and could change their biases completely. We removed the source from every article to give our users the freedom to consume the information with an open mind. Once they have finished the article, they could check the source to see which station wrote it.
Users had a fun time with this. They would guess which station wrote the article before checking the source. We also give them a quick, yes or no, question to see how they feel about the topic. Once answered, it would show them how they compared to everyone else that read the article.
Now, how can we solve the issues that millennials have with the current way the news is shown to them?
Pain Point #1
Millennials don’t like watching the news because most news stations focus on ‘depressing’ news.
We gave the user a ‘My News’ section. This section would be their homepage, so when the app launched they wouldn’t be overwhelmed with depressing news. Here they could follow topics, specific issues, or stories they’ve researched and they would only see news based on what they follow. This allowed them to only see the news that’s important to them.
We decided to present news within topics. On our homepage, it would show you topics such as gun control, Facebook privacy, autonomous cars, etc based on current news articles. Once you found a topic you wanted to explore you would tap that topic and be presented with relevant articles and videos.
This prevented users from seeing ‘depressing’ headlines right off the bat. This also helped users dive deep into a specific topic instead of browsing through tons of articles to find more similar content. Our users didn’t have time for that.
Pain Point #2
Millennials are on the move and they don’t have a lot of time to read long articles.
Once you’re within an topic you had the ability to quickly tab between all content, articles, and videos; this gave the user a quick way to choose the format of the news.
With every article or video we post, there is a time tag near the headline that will tell the user the approximate time it will take to get through the content. Providing this time tag allowed our users to quickly find the news that they could consume at the moment.
Based on what I learned from KUTV, I knew that our users enjoyed Live news. This is a quick way they can learn what’s happening right now. We added the Live feature to our bottom navigation bar, so they could access this content from any page in our app.
Last but not least, some users don’t have enough time to read any articles. To solve this, we give the user an overview of the topic with quick facts from all sides of the story.
Pain Point #3
To check validity of a story they will check the same news coming from different sources. Making it tedious to learn what the facts are.
This was very surprising and sad to me. We live in a culture where this is the norm. A place where we can’t even trust the media; we have to check multiple sources and jump through hoops, just to try and understand what’s going on.
We have an advantage here. Since we aren’t a single media source, we have the ability to compile information from multiple sources. Once the user explores a topic they will be shown multiple articles about the same topic or story. These articles will be from all the top news stations so our users don’t have to hunt them down. They can quickly flip through each article and understand both sides of the story.
Implementation
Now it was time to start wireframing, and testing our app. Our first iteration of wireframes had a few problems that we discovered during testing. Initially, when you selected a topic a drawer would drop down and give you our quick facts on the topic. If you wanted to explore more, you would click an ‘Explore’ button and it would take you into the articles and videos for that topic.
Our biggest concern during testing was that users were getting confused with this drawer. They didn’t know they were quick facts, a lot of them thought they were headlines and tried clicking them to go to those articles. That gave us the idea to change that drawer to include headlines instead of facts. This helped a little, users understood this but it was still clunky. The more I thought about this feature the more I knew it had to change. Micro-interactions need to withstand time. I knew that after the 100th time opening that drawer before exploring an topic was going to be a problem.
This led me to think of a different way to present the overview of the topic. We removed the drawer so that once you click a topic, it would take you right to the relevant articles. Then, if you wanted the overview we created a selection at the top of the screen that would show you those quick facts on this topic.
This resonated really well with my testers. They were happy that they weren’t forced to read those quick facts/headlines or make 2 clicks to get to the articles and videos.
Based on our research, we know that millennials are visual learners, so I wanted to present most of our content with pictures and videos. Each topic is designed with a photo representing the topic and the title of the topic on a card. This creates a very appealing visual design which is easy to use and navigate.
I chose to follow Material Designs guidelines for this project because, in my opinion, their navigation options work really well when you have a lot of content to show on a small screen. It helped to keep my design clean and easy to navigate.
Visual Design
Now that our wireframes and testing were finished, it was time to add visual aspects to the design. At this point in the project, our instructor split us up so that we could explore our own visual style. I was excited to tackle the visual aspects myself but was glad that I could still get feedback from my team to improve my design.
Colors were difficult to choose for this project. I knew the tone of this app had to be strong, trustworthy, and young. Two colors came to mind: red and blue. Red represents strength, leadership, courage, and determination. While blue represents: intelligence, communication, trust, and inspiration. These are great attributes for a news station, that is why almost all news stations are an iteration of these colors. But they also represent the Democratic and Republican parties… which we don’t identify with because we are trying to bring all relevant news to our users no matter what party they are affiliated with. I still wanted to keep within these two colors but I didn’t want it to look affiliated to either party.
I chose the main color of my app to be a shade blue, but I wasn’t sure what shade. So, I mocked a few palettes and asked some of my peers their opinion; I used a navy blue, cobalt blue, and baby blue for this test. The feedback was that the navy blue looked old and very much linked to the democratic party. The baby blue wasn’t serious enough. But the cobalt blue still communicated trust, and it drew in a younger crowd. Cobalt Blue it is! I also ended up using red as an accent color. It compliments the cobalt blue really nicely.
Again, I followed the guidelines from Material Design for this project because they are very successful at presenting information in a clean and precise manner. They do this with the use of cards and their elevation guidelines help create a recognizable visual hierarchy.
Below is a link to my InVision prototype. Please go through and play around. Feel free to let me know if I missed anything or if you have any comments on the project.
Success
Once the visual design was finished I tested it one more time to make sure I didn’t miss anything. The people I tested it with, loved the concept and the flow of the app. I presented them with the task of finding and reading the article “They led a national march. Now Parkland Students return to a school they say ‘feels like jail’.” (shown above) During this final testing, users an easy time completing the tasks. They also said that they would use this app as their main source of news if it was ever developed. Overall I was very pleased with the final product.
Retrospective
There were a few design challenges available that really resonated with me… The Millennial News app was not one of them. I don’t follow the news and politics don’t interest me, so I didn’t even know where to start with this project.
After starting this project I really started to enjoy it. What I loved most, was using my skills and applying them to a topic I didn’t know much about. I got to explore and learn more about something I wasn’t initially interested in. This may be the most exciting thing about working in design.
Lessons Learned
Don’t just put a Band-Aid on and expect the issue to be fixed, find the deep reason that is creating the issue. For example, this is what happened in our earlier design with the opening drawer. At first, we had quick facts located in the drawer and expected this was the issue users had and didn’t dig deeper. So we changed quick facts to headlines… That didn’t work either, so we stylized it more. We were stuck on that idea because we didn’t want to let it go. Once we dug a little deeper and really explored the issue, we realized it wasn’t the right fix and we had to scrap that design.
Thanks for reading! If you like it, clap away! If you want to talk further, connect with me on LinkedIn or go visit my portfolio page at nathanmaus.co.
