Newspectives
Apr 2020 – May 2020 | Mozilla | Concept Design
In 2020, Mozilla highlighted various internet issues, with disinformation being one of our targets. To address this challenge, the Taipei team established a small and dynamic innovation squad, consisting of a PM, marketer, researcher, designer, and data scientist.
As the designer within the squad, I enthusiastically embraced the Design Thinking methodology and the Double Diamond design process. My responsibilities included designing and prototyping the UX and UI, in addition to facilitating workshops to drive innovative solutions.
Through this intensive process, we developed a concept called "Newspective" (News + Perspectives), aiming to help people receive information from different viewpoints.
Back in Early 2019
Upon joining Mozilla in 2019, my initial project involved working with another designer on a project called ChecknShare. The objective was to help senior individuals identify misinformation and empower them to share verified results with others.
The project had been ongoing for several months, with a persistent debate about whether ChecknShare should be a mobile app or a chatbot. To make progress, we conducted research to understand how senior people verify and share information. The research included 4 expert interviews, a survey with 114 responses, 19 phone interviews, and 4 in-depth interviews.
“Health misinformation is spreading quickly via senior people's LINE groups.”
“LINE Bot fits how senior people share information; it also opens the door to the ChecknShare app.”
Based on two key research findings, I suggested that both a mobile app and a chatbot were essential to create the ecosystem. We decided to implement the Line Bot as the minimum viable product (MVP) to test the waters. I defined the draft flow to illustrate how the Line Bot played a key role in bringing users to the app.
However, the project was put on hold due to insufficient team resources.🥲
Revisit the Disinformation Issue in 2020
In 2020, during the pandemic, we observed a significant demand from people who wanted to know the truth about Covid-19, while also recognizing the harmful impact of Covid disinformation. Aligned with the prevailing trend and the company's goal for 2020, we revisited the disinformation issue and established a small and agile innovation squad consisting of a PM, EPM, marketer, researcher, designer, and data scientist. Our journey began by following the Double Diamond design process to initiate the discovery phase.
Discovery and Ideation
I planned and hosted a design workshop to generate early concepts through various activities:
• Lightning demo
• Share your findings and vote
• Identify problems and vote
• Let’s Mash-up
• Bundle ideas and vote
The Lightning Demo activity genereted numerous inspirations from participants' personal experiences and the digital services they had used.
Based on the problems and insights uncovered during the research stage, we collectively defined problems and scenarios, ideating as many new ideas as possible by combining items from the two lists.
I visualized the early concepts based on the ideas we generated during the brainstorming session. Some of the concepts included:
Visualized Truth
A dashboard reporting users on disinformation and real information daily.
Firefox Check
A browser extension to verify website content.
COVID-19 Terminator
A platform for anonymous questions and answers from doctors.
Iterate the Idea
After sharing the early concepts with the engineering team and product head, we clarified most feasibility issues and recognized the challenge of verifying information. Delving deeper into the information-receiving journey and the ecosystem, we realized that a quality platform providing trustworthy information could be a game-changer.
As a result, we pivoted the Visualized Truth idea slightly. Instead of determining what is real or fake, we decided to help users receive information from different perspectives. To explore where different perspectives originated, we delved into the world of existing services. Through our research, we discovered that visualization, live-streaming, gamification, chatbots, and even Instagram Stories were being utilized to share different viewpoints and information.
I crafted a series of screen mockups inspired by existing services to enable users to consume information from diverse perspectives. These mockups included the Timeline view, Location view, Celebrity/Influencer view, and Panel Discussion view.
Validation
To understand how potential users receive and trust information from different perspectives and gather their feedback on our concepts, we conducted guerrilla usability testing. We specifically targeted the younger generation, as they are more immersed in the digital world and tend to be more open to new technologies and services.
12 females
• 4 Gen Y (1980-1994)
• 7 Gen Z (1995-2010)
• 1 born after 2010
12 males
• 8 Gen Y (1980-1994)
• 4 Gen Z (1995-2010)
I transformed the concepts into a mobile version, as that is the primary way people consume news nowadays. I also created paper prototypes (Timeline view, Celebrity view, and Comments view) to simulate the mobile user experience and facilitate the testing process.
Results
Most participants agreed that different perspectives were crucial, but they found it time-consuming to search for and filter neutral and unbiased sources. This pain point presented an opportunity for our solution.
Both A.I. curated content and crowdsourced content were questioned for authenticity. Participants expressed a desire to see neutral and unbiased sources or technology.
The Timeline view was well-received, with participants preferring it for reading history, politics, and top news. The Celebrity/Influencer view appealed for health and sports information, while the Comments view was considered for entertainment news.
We discovered that active readers, who regularly read news on quality channels and share the latest news with others, played a crucial role in spreading our service and sharing information with passive readers. While we encountered only three active readers on the street, two of them believed Newspectives was urgently needed.
Final Design
With these valuable insights in hand, we designated the Timeline view as the Minimum Viable Product (MVP) for our product launch. The team was eager and motivated to move forward. However, our plans were disrupted when the CEO announced unfortunate news – in response to the pandemic, Mozilla made the difficult decision to close all operations in Taipei. This unexpected turn of events left our mission unfinished.😢
With a passionate heart to see the concept through to completion, I devoted my spare time to continuing the design work. By analyzing the feedback from the participants regarding the Timeline view, new ideas began to emerge, inspiring me to enhance the user experience even further.
“Where does the news come from?” ➡ Adding news sources
“Comments could be manipulated to brainwash the public.” ➡ Revoming comments
“How can I quickly jump to a time point for specific news?” ➡ Adding a quick scroll feature
Keeping these principles in mind, I set out to create the new Timeline view UI:
Easy to discover
Users can effortlessly switch to the Timeline view tab while reading news on Firefox Lite, ensuring quick and seamless access.
Useful
Incorporating a quick scroll feature was an essential part of the concept. This feature allowed users to navigate to any specific time point on the timeline with ease.
Perspectives
In the new version, I introduced a subtle emphasis on different perspectives by using two distinct colors. The blue color represents news with a positive attitude towards the Covid-19 vaccine, while the red color signifies a negative attitude.
Unbiased Information
By collaborating with reputable news sources and AI companies and providing users with high-quality and unbiased information, our goal is to gain the trust of our users, encouraging them to follow and share timelines. This strategic approach is essential for expanding and growing our user base.
Key Things I Learned
Embracing the iterative design process has taught me the importance of continuously gathering feedback and refining my designs based on user insights. Each iteration helps uncover valuable improvements and ensures that the final product effectively meets user needs. It's also a unique experience to build a concept from scratch.
However, there are areas where we can improve. One aspect is a better MVP scope. We should design a "coming soon" banner in the Firefox Lite News feature for fakedoor testing and partner with News/AI providers earlier in the process to gather quantitative data.
Discover more of my design projects:
Voucher Service Design, Revamping a complex internal system and creating a new B2B web portal.
Home and Search Design, Data-driven iterations for a mature product, optimizing user experience and business metrics.