CANVASSING APP
OVERVIEW
Data for Social Good (DfSG) provides valuable tools in the form of dashboards to monitor campaign results. The organization offers various platforms that aid in targeting voters, interpreting data, and achieving better campaign outcomes. Our project specifically focuses on two crucial applications offered by DfSG for the canvassing process: the director portal application, accessible through the web, and the canvassing application, designed for mobiles and iPads.
Team
Maryam Habibi, Shreya Ravi, Poornima Jhanji, Derrick Treul, Saniya Arora, Christine Hong
Role
UX Design, User Research, UI Design
Project Focus
Project Focus
Designing an app for canvassers
Duration
22 Weeks
Director's web portal and mobile application. Due to limited time for this project we only focused on the canvassing mobile app in the Ideate, testing, and design phase.
Problem
Tools
Figma, Dovetail, Basecamp
Create concept for redesigning of the web portal and mobile application while addressing usability issues and ensuring a user-friendly experience.
Phase 1 : Discover
Dedicated a span of 8 weeks to research the problem space. We performed a literature review, competitive analysis, and heuristic evaluations. Additionally, we conducted multiple interviews and analyzed the findings.
Literature Review
We focused on barriers of voting and community engagement throughout our literature review research.
-
Minorities are disproportionately affected by the law due to socioeconomic factors
-
The younger generations lack the knowledge and significance of voting due to lack of scalability in many communities
-
Face to face canvassing is successful due to personal connections
Competitive Analysis
Competitive analysis allow us to develop effective strategies and recommendations for our stakeholders to differentiate and amplify their business and products from others in the market.
-
Offer consulting on social media engagement
-
Include a blog section with case studies of clients
-
Add donor management section on portal
-
Incorporate FAQ section to answer common questions
-
Create video walkthrough of the portal on website
-
Include Canvasser management section to the web portal to allow Directors organize volunteers
Heuristic Evaluation
We conducted a comprehensive evaluation of the existing applications, focusing on identifying usability violations using Nielsen's standardized usability principles.
Director Portal
-
Aesthetic & Minimalist Design: The interface contains unnecessary information that competes with important components, reducing their visibility.
-
Match Between System & the Real World: The design lacks effective communication with users using familiar language and concepts. Information is not presented in a natural and logical order.
-
User Control & Freedom: Users are not provided with a quick way to abandon unintended actions, leading to frustration and inefficiency.
-
Recognition Rather Than Recall: Certain components are not clearly visible, causing users to rely on memory recall, leading to cognitive burden.
Canvasser App
-
Flexibility & Efficiency of Use: Experienced users lack accommodation for completing tasks faster through shortcuts, hindering their productivity.
-
Visibility of System Status: The design fails to provide timely feedback to inform users about the status of their actions, leading to confusion.
-
User Control & Freedom: Similar to the Director Portal, users lack the ability to quickly abandon unintended actions, impacting their overall experience.
-
Recognition Rather Than Recall: Users experience cognitive burden due to certain components not being clearly visible, forcing them to rely on memory.
User Interviews
Interview with Directors
We conducted interviews with 4 Directors; 45 minutes with each Director. Here are some of our interview session goals:
-
Understand their background and day to day responsibilities
-
Gain insight into goals, challenges, and motivations
-
Obtain an understanding of their canvassing process and the canvassing tools that they use
-
Learn about the specific data collection objectives they seek to achieve through the canvassing process
-
Validate assumptions and research-based insights
Interview with Canvassers
We conducted interviews with 6 Canvassers; 30 minutes with each Canvasser. Here are some of our interview session goals:
-
Understand their canvassing experience and day to day responsibilities
-
Gain insight into their goals, challenges, and motivations
-
Obtain an understanding of their canvassing process, resident’s interaction, and the canvassing tools that they use
-
Learn about the specific data collection they seek to achieve and success in canvassing
-
Validate assumptions and research-based insights
Affinity Map
To analyze our findings, we clustered common themes from our user interviews. This allowed us to pull key insights.
Key Insights
-
Technical challenges & tools:
App loads slow, freezes, connectivity issue, and delays. The map does not provide enough information about physical barriers and location details. PDI doesn’t offer features regarding language barriers. Canvassing scripts can be hard to read on phones.
-
Canvassing process & planning:
Canvassers personalize their conversations with residents, similar to an elevator pitch. They always go in groups of at least two for safety reasons. Canvassers view their assignments before starting their canvassing trip in order to plan their route.
-
Canvassing Features:
Canvassers want better color coding for houses on the map
-
Canvassing challenges:
Canvassing is highly reliant on external conditions such as the weather. Canvassers experience rude interactions with residents. Maintaining resident's interest or sign up for different events is difficult.
-
Director planning:
Directors provide canvassers with training and role playing activities to prepare them for their canvassing trips
-
Director features:
Directors want to integrate their commonly used applications with DfSG’s portal. They also want to keep track of residents' interest levels, including attendance at monthly meetings, volunteer interest, interest while canvassing, etc. Directors want a way for Canvassers to take quick note on the application for any extra or specific details from their trip. Directors would like to assign people to new areas in the app if they have time left on their schedule, unfortunately the app is slow.
Phase 2 : Define
Developed user personas and priority matrix to define the problem statement.
User Persona
Based on our user interviews, we created two user types, Canvasser and Director. We created two user personas from our research and interviews.
Focus Area
After conducting our research and hearing from the users, our team decided to focus on the Canvassing App in the next phases of our project over the Director Portal. Our main reasons behind this decision were:
-
Canvassers face more challenges in comparison to directors
-
There are more users exposed to the canvassing app than the director portal
-
Directors receive direct training from DfSG for their tools while canvassers don’t
Priority Matrix
We prioritized features and functions most to least important to our users based on our research.
Phase 3 : Ideat
Sketched and produced an interactive, low-fidelity mockup.
Sketches
We did a sketching workshop within the group in order to visualize the takeaways we got during the user interviews and research. Our sketches showcased our creativity and thought process of what the canvassing mobile application should look like.
Low-Fidelity Prototype
Our team used Figma to develop low fidelity mockups for our wireframes. We wanted to test our high-level concepts, visual design and layout including intractability and user experience.
Phase 4 : Test
Assess design solutions with the help of users.
User Testing
We conducted user testing with 3 DFSG users and one outsourced canvasser.
User Testing Goals
-
A/B Testing for homepages
-
Map vs. List view for pending assignments
-
Filtering and sorting on assignments
-
Completing a script page
-
Assignment actions for specific resident
-
Completed Assignments page
User Testing Analysis
To analyze the user testing sessions, we used Dovetail, which helped us easily transcribe the interviews, create tags from the transcripts, and group all of our tags. Later, we created an affinity map using the follow steps:
-
Coding transcripts
-
Group similar quotes
-
Generate key insights from groupings
User Testing Findings
-
Users preferred the homepage with a dashboard view as opposed to the homepage that directly took them to their assignments
-
Using the bottom navigation was confusing for the users
-
The users resonated well with the new features such as note sections, and filtering/sorting
-
Users wanted to be able to see their filtered results in the map view as well as the list view
-
Multiple filtering drop-downs on top was confusing to users
-
Users preferred seeing the map and list view of their assignments on the screen at the same time
-
Users wanted a quick and easy way to mark all residents in a house as ‘not home’
-
Users didn’t find the ‘resident details’ label to be intuitive
-
Users were interested to see the overall numbers of how many contacts they had at the end of their day as opposed to specific details of the assignments they completed
Phase 5 : Design/Deliver
Designed and polished High-Fidelity prototypes and presented the final product.
Design System
We created our styleguide and design system for high-fidelity prototype which included font family, color palette, buttons, grid system, iconography, etc.
High-Fidelity Prototype
Based off of our user testing using our low-fidelity prototype, we were able to develop high-fidelity mockups by using Figma. After reviewing the findings, our team was able to create a few iterations and build off of our low-fi wireframes.
Here is our clickable prototype
Next Steps
Mobile app for canvassers
-
Test the high-fidelity prototype with users
-
Improve the map experience by Allowing canvassers to see useful information such as bathrooms, physical barriers, and tracking their partner's location
Web portal for Directors
Because we had limited time, we were only able to design prototypes for Data for Social Good’s canvassing application. Through our competitive analysis as well as user interviews with Directors, we identified a few areas where DfSG’s web portal can be improved.
-
Enhance the web portal for directors to integrate with other applications that they are using
-
Better tracking for residents after initial canvassing interaction such as attending community meetings, volunteering, or any interactions over the phone.