An iOS companion app for politics - Powered by CNN
4 UX Designers
- Project Management
- Competitive Analysis
- User Interviews
- Research Synthesis
- Paper Prototype
- Usability Testing
Sketch, InVision, pen, paper
CNN is among the world's leaders in online news and information delivery. In the US, the company is well known for its concentration in political coverage. However, many political activists and users rarely visit CNN.com or use the app to consume political news, learn more about their local and state representatives, or involve in politics-related events.
CNN Connect (CNNCT) is is a companion iOS app to CNN that provides users a dashboard of political updates, facts, and information. Its goal is to enhance the experience while consuming news and encourage users to get involved with local politics. Main features include:
- Get updates on bills and legislations
- Learn more about local and state representatives
- Compare and contrasts election candidates
- Access to local voting schedule
UNDERSTAND POLITICAL CONTEXT
Before diving into the research process, our team sought to understand the political context in order to approach the problem in a mindful way. We achieved it by coming up with a set of questions to help us organize our thoughts and plan a direction:
- What kind of language and tone we should use and avoid in the political context?
- What do users want to know about their representatives and appointed officials?
- What do users want to know about the election candidates?
- How do users want to be engaged with the government?
- How can CNN connect this engagement tool to their news content?
We also attended an event, listened to industry professional, and asked questions to explore the research that has been done on voters
- Color, language, and tone are critical in a political context
- Research result depends heavily on location of users
- Users want to know how what's coming and how it affects their lives
- CNN is a well-established brand with clear design guidelines
- Integrating this political engagement tool into an existing app could face featuritis problem & change the balance of CNN’s news content
ASSESS COMPETITOR PROFILES
Countable is the winner and is leading the market with the number of active users and its app concept. Countable provides users with a variety of useful features. Its main weakness is information architecture as it is hard to navigate and find information while using the app.
This is where my role started to emerge in the process. At this phase, I identified 3 direct competitors for CNN: Involved, Countable, and Facebook-Town Hall. I then created competitor profiles with these criteria:
- User Flow
- Pain Points
- Features Assessment
- Heuristic Evaluation
- Strengths & Weaknesses
LISTEN TO USERS
Our goal for user interview is to identify pain points and to validate which features would help users find political updates and get involved with local politics better.
We recognized that the scope of this project is big and it is best to execute with a user pool across different states and counties. However, in order to deliver result in a 2-week sprint, we narrowed the scope and picked New England region as a start point. To minimize bias, we diversify our user pool, conducted 12 interviews with users from various backgrounds and experience. For example, some users:
- Immigrated to the US, lived abroad, or relocated to Massachusetts from another state
- Work in different professional settings and industries
- Actively involve in community building and local politics
MINE FOR INSIGHTS
Our team then did an Affinity Mapping exercise, color coding user interviews with stickies where each color represents a unique user. This exercise helped us see the trends and patterns of insights and organize them into different categories.
The synthesis process allowed us to connect all the dots, take a deep look into users' perspectives and we started to see the main challenge:
CONNECT THE DOTS
Our team then segmented all insights and developed 2 user personas: Kelly Clarke & Luis Genera
Goal: To contact representatives and go to Town Hall meetings
- Town Hall & Voting schedule
- Event sharing
- Contact Representatives
Goal: To get updated with issues, bills, and legislations and learn more about election candidates
- Fact-check candidates
- Compare & contrast candidates
- Identify local Representatives
IDEATE INITIAL CONCEPTS
During the ideation process, our team tried to engage users by including them into the creation process. We did it by hosting a Participatory design workshop in which we asked users to visualize their thoughts and ideas. We also conducted a design studio as a team to collaborate and brainstorm effectively.
Participatory Design Workshop
VALIDATE WITH USERS
As soon as we made design decisions, I ran usability testing to gather feedback as early as possible to identify issues and concerns for iterations. My goal for this process was not yet to worry about visuals but to make sure CNNCT had a functional structure. For the paper prototype, I created 4 scenarios, observed and listened to users as they go through the process.
I then went over users feedback, did some iterations on whiteboard, fixed the paper prototype, and re-tested with users until all problems were sorted out.
REFINE APP STRUCTURE
After testing with users, we felt more confident in our design decisions for CNNCT, we then focused on refining the flow of the app, making sure CNNCT and CNN were well integrated.
- Get Involved = Find town halls, voting, community events to attend
- Polling = Interact with other users
- Elections = Learn more and fact-check candidates
- Voting Schedule = Schedule and reminders
- Representative = Find and contact officials
Why a companion app?
- Allow integration between CNN and CNNCT (just like Facebook and Messenger)
- Maintain the balance of CNN news contents, avoid dominating the platform with political news
INTEGRATE VISUAL ELEMENTS
At this phase, my role started to shift; as the app structure became more refined, another team member took the lead to integrate visuals into the digital wireframes, making the app become more realistic.
The Final Product
- More usability testing & iterations
- Continue to interview users and evolve personas
- Potential on-boarding process for new users
- Recruit users as early as possible
- Move quickly, research can't be 100% confident or accurate
- Spend less time discussing low priority problems