Case Study

CNN Connect

iOS Application
App Development



CNN Connect is a concept derived to help keep the public informed and engaged at every stage of government. The application would serve as an additional source of information to guide the public throughout the year in order to actively participate in local, state, and national democracy.

UX/UI Designer
Project Manager
2 Weeks

Users need a better way to obtain information on local ballot measures and candidates so they can make informed decisions during all elections. They need this because there is a shortage of concise, consolidated information available to the public.


While studying potential users, it was clear our team needed to create a mobile application which allows users to stay up-to-date on current political issues, keep the users avidly involved with political knowledge and allow for an overall optimal user experience.


Interviews, Affinity Mapping and Results

One important factor was the timeline: with just two weeks, how do we have a thorough understanding of the user and their needs while building out of this new App?

Our team interviewed a total of seven individuals to gain more insight into our users. We asked broad questions like, “What would you want to know about candidates in any specific race?” and “What would motivate you most to engage with officials on a local, state, and national level?

Once we gathered basic information, we dug deeper by asking questions like, “How would you like to interact with your government? Local, state, or national?” and “What would motivate you most to engage with officials on a local, state, and national level?” Our results were interesting, which lead to multiple rounds of affinity mapping. The categories formed then resulted in our main "How Might We..." statements.



Of the users interviewed wanted to focus more on local elections and local measures/bills.



Of the users interviewed expressed an interest in viewing candidate and bill information with ease and efficiency.



Of the users interviewed felt it was important to be able to see a candidate’s previous experience or their history.
How might we...
Be able to get to know the candidates history and experience while not having to navigate multiple sights?.
How might we...
Create a better platform to connect with our local candidates and representatives?
How might we...
Encourage voters to participate in voting polls, both before and after voting?


Forging personas

Who participates in “The Great Experiement”? Creating a new app that would parlay with the main CNN App for information and news, would be difficult. As a team, we needed to thoroughly understand who would be using this separate app and how we would design/test for their wants, needs and pain points. Let's meet our two main personas for this project.

“We all need to be the change we want to see in the world.”
“I’m not into politics unless it directly impacts my life on a daily basis.”

User Flows and information Architecture

Solidifying the User Experience

Determining the Task Flows first would clarify how our users would be using/interacting with the app. From there, creating the full User Flow and Information Architecture were vital for establishing screens for development.  

Task Flows
User Flows
Information Architecture



After three design studios, the team was able to establish specific pages to build out in the next phase. This would allow us to create templates to be used throughout the app and create a cohesive look. Once, the team agreed on preliminary sketches, we dove deeper and created detailed low-fidelity sketches.

These would serve as a guide for me while developing the mid-fidelity mockups.

Wireframing & Testing

Mid-Fidelity Prototype

The first renderings of the new app were focused on usability and integration. The team really focused on the necessity of making the prototype workable and making it feel part of the Apple HIG Guidelines. The wireframes showcase scroll and swipe interactions, a cohesive flow in design from page to page and an overall template to be used for future build-outs.

Once all wireframes were built out in order to accomplish both user task flows, it was time to get necessary feedback in order to progress into Hi-Fidelity. Therefore it was time to create a prototype for our first round of Usability Testing.

User testing

Testing and Findings

Utilizing Figma, a prototype was configured to match the task flows of both personas. Our team was able recruit five individuals for initial usability testing. Since all testing had to be done remotely, our participants went through the process via Zoom.

We specified the testing to be focused on the main two task flows we generated for the two Personas earlier in the process, while promting our participants to do additional tasks here and there.

To get specific qualitative feedback, we made sure to guide the participants as little as possible. The following are some of the specific feedback from the participants.

Completion Rate


3 out of 5 users were able to complete both User Tasks without any major issues or any clarifying questions.

Average Time

~2 min

All users were able to complete both User Tasks in less than two minutes without any guidance or additional prompts.



All users were confused whether or not their participation in the poll was tallied due to a lack of visual cues.
Register to Vote

100% of participants found the initial Call to Action button, "Register to Vote," too distracting and thought it was the main purpose of the app. The team wanted to make sure every user has the ability to register to vote within their city. So, it was a team decision to keep the CTA prominent on the main Home Page of the app.

We did, however, add verbiage and an icon to add some description of the action. This allowed for clarification and in the second round of user testing 80% of participants found the section helpful and informative.

Search Optionality

60% of participants found the search option awkward to start their navigation throughout the app. To add extra guidance, we added the quick filters at the top of some of the main pages to allow for an easier experience.

These filters would allow users to filter by Political Party, Measures/Bills/Propositions, and their location (Local/State/National).


100% of participants were able to navigate through the prompted tasks. A small issue we found was the visual aesthetic of the contact icons (email, phone and twitter). Following Jakob's Law of Internet User Experience, we wanted to make sure the visual cues were simple and familiar from other applications users use daily.


50% of participants found the Donut Chart in the Mid-Fidelity Prototype confusing and lacking gamification. There was no prominent visual cue to give immediate gratification. So, we changed the visual aids to show the positive or negative affect the user was able to have on the polling feature.

This feature was controversial during our first round of user testing. Our team found that 80% of participants didn't want to participate in the polling action unless they knew what their engagement meant for the app. We explained these polls would be used for CNN to predict more accurate polling statistics.


High-Fidelity Prototype

With changes made and more fine tuning established, the research phase was complete for the time being. Therefore Hi-Fidelity Mockups were next to be completed. There were multiple areas of improvement, but nonetheless I was able to make necessary changes to get a prototype ready within a matter of hours. The Hi-Fidelity mocks and prototype were done in Figma to allow a quick turnaround.

We were even able to do some additional A/B Testing to land on specific design decisions for another round of iterations.

Take a look for yourself...

Reflection and Next Steps

What’s next?

The CNN Connect app design was a large task. Our team was able to divide and conquer while still working in an agile product management environment. Working within the two-week time frame gave a lot of obstacles. With an additional two weeks our team would have been able to go into greater depths with building out a multitude of other pages needed to make this a minimal viable product (MVP).

In order for this to be a MVP, the mobile version would need to be built out for Android as well. Through the final round of user testing we came to the conclusion that some of users were caught off guard with an Android version being unavailable.

Other Projects

More To Peak Your Interest

Kuda Vana Partnership

View All Projects


Want to join forces?

Think I have that "special sauce" your company or team needs?
Let’s get in touch!