Pop-Up Surveys

[neom500]

Overview

Requirements (Functional/Nonfunctional): Surveys will capture a wide variety of feedback such as how users discovered our site or what improvements they wish to see. The first live survey will ask users why they came to our site and how they discovered our site. Cookies will be used so users who aren't using Incognito mode won't be asked to take the same survey they've already completed. However for every new survey, all users will see a survey message each time they visit our site until they complete it.

User Story: As a food seeker, I want to submit my feedback to help improve the site's user experience.

Acceptance Criteria:

• The pop-up survey message appears as soon as the results page loads in the bottom right of the results page (desktop/tablet) or bottom of the results page (mobile)
• A method, i.e. X button, of closing the pop-up survey message
• Survey UI resembles Qualaroo screenshots in Figma
• Users who have already completed a survey will not see the pop-up survey message unless it's a new survey iteration or they return using Incognito or a different web browser
• The pop-up survey message will include the following:

1. If they'd be willing to take a 2 question survey
2. Inform them the survey will open up in a new browser tab
3. Yes or No buttons. Selecting "Yes" takes them to the Google Forms survey. Selecting "No" closes the pop-up survey message. Alternatively they can close the survey with another method i.e. X button (mentioned in the 2nd Acceptance Criteria bullet above)

Feature specfications

Figma: https://www.figma.com/design/9hPmNSsyaH2VMGNz5mffmI/FOLA-Design-%232?node-id=8417-41698&t=xztMUBTZbvJWRUkc-4

Action items

• Get MVP survey working
• Design revisions with research team to refine/enhance the quick-and-dirty version that we have up now
• Developers build new version
• Ask assignees to review prototype or staged version
• Revisions as needed
• Push to live

Discussion

During the 8/17/23 Leads and PM meeting, we discussed the FOLA site's retention rates with surveys being one tool to help capture user experience feedback. First steps would be for Design and Research teams to create a survey for users asking questions such as "Are you a FOLA volunteer?" or "This is the nth time you've used this site, what draws you back to our site?"

Google Forms could be used to draft those questions. Additionally, Design/Research should be able to create/edit surveys without involvement from development after initial development phase of implementing survey is completed. Design/Research will share updates on 9/21/23 PM and Leads meeting.

Please refer to the links below for further context:

• 8/17/23 Meeting Notes (Under PM Team): https://docs.google.com/document/d/1uPO0_AJ1zn3IZXrhHBXub-ZfakIsx34jKHK3LIB8VmM/edit.
• Survey PRD - https://docs.google.com/document/d/1mFbh3-30JjwguLOc-3cHZTyFI-TSsTduvJXeMKKHSH4/edit
• Research Plan for Pop-Up Surveys

Link to first survey and its results:
https://docs.google.com/forms/d/116paExG_ySSqmUJliUxmGZMEUWYmSyApu4iRA3rJ1XA/edit

Figma whiteboard:

• UI sketches
• Survey comparisons
• Competitive / Industry audit (seeing other people's examples)
• UI designs
  https://www.figma.com/file/9hPmNSsyaH2VMGNz5mffmI/FOLA-Design-%232?type=design&node-id=640-122&mode=design

Related issues

Dev team's issue for this feature

• Feature: Toast prompt for user feedback form #2165

Future development

• An admin control panel for easy changes to pop-up surveys #2373

[fancyham]

Here are some quick sketches:

Figma: https://www.figma.com/file/9hPmNSsyaH2VMGNz5mffmI/FOLA-Design-%232?type=design&node-id=640-122&mode=design

[neom500]

One option is to have a survey, or popup asking the user if they wish to take a survey, generate when completing a call to action i.e. clicking details. Another could be a popup that generates if a user has spent a certain amount of time on our site.

[fancyham]

From a user-experience perspective, That coule be annoying to have a survey pop-up interrupting you when you're taking an action to do something else — it would also make me forget what I was in the middle of doing :)

I'd prefer we make it so that it's more 'ambient' — visible but also ignorable. 'non-blocking' is another way of describing that.

Can you pull together some ideas for that direction? You might also google around or screenshot non-interupting surveys (let's all do the same)

Example:

[fancyham]

Talked with Nate —

Nate will aim to put together a 1-2 page PRD describing the tool (what is it, why, audience, outline/vision of functionality) by ~Nov 20.

I'll use that to hand off to a designer on design team to work with Nate on how the UI looks and feels and works.

[fancyham]

Natalie (desiger) has joined the team - will be doing research into systems we might use, uis that are out there.

nate is working towards a PRD draft on Mon Nov 20.

we'll sync up on skack

thanksgiving break,

then check-in thurs nov 30

[GigiUxR]

I completed the sketch for the survey content flow, continuing off of @fancyham 's sketch in Figma. See here

Please note: Languages question will soon be added to this.

[fancyham]

Research Team’s survey plans are now linked in the issue description above: https://docs.google.com/document/d/18pzn3OMbDqXKmiTlO9EVS0zUQuadPtharKjMuyacvlU/edit

[fancyham]

Had a great talk with Nate today about a shortcut to a MVP (minimal viable product) — one of the roadblocks we're up against right now is 'which survey tool?'

To streamline, while we're still researching and deciding, we can simplify the problem by using Google Forms as a starting point. Google Forms is easy since we all have access to it, including being able to edit and view results.

As this is built, we'll learn what's possible, what's valuable, and add useful features and functions, but the goal is MVP

Once something is up and running, other survey tools we're considering can be plugged into what's already built pretty easily.

Here's what we discussed:

Concept

1. Link in bottom right corner of map or screen that asks user to take a survey: “Could you answer 1 question for us” (do something shorter). Could even be small animated thing.
2. Link links to a google form. Google form asks some question like “How many times have you used this site in the past 30 days?” And pick an option. This needs to work on mobile and desktop, can be in a new window or in an iFrame (that appears on top of our site)
3. When finished filling out form, display a thank you, and give option to close window or automatically close survey to return to what they were doing in FOLA

Requirements:

1. Display link on FOLA site. (optionally but ideally, display it randomly to 1/10(?) people to get a random sampling)
2. Link should disappear if it’s not answered after 15 seconds
3. Simple Google Form
4. iFrame or Window with ‘close’ button(?), or auto-close

People involved:

• Developer
  • Contact them with sketch of functionality, requirements (listed above)
  • Getting someone assigned to work on it with you
• Design
  • Make sure it looks and works good
  • To work with dev, also
• Research
  • What question to start with?
• Someone to create Google Form (someone on this team and/or research team — this is a good skill to know)
  • Single question survey form that feeds into a Google Sheet
  • Can make simple survey first, then ask Research to respond

Process (will depends on everyone's schedule):

A) Talk to design, bring a simple design or show them the above (a few days to a week?)
B) Create a simple Google Form (2 hours)
C) Sketch out minimal functionality with designer (a couple rounds of back and forth)
D) Show to Dev, get feedback and revise with designer (1 week to find dev and talk to them)
E) Ask Dev to build it and get it on to the private “dev site” (not live to the public yet) (2 weeks?)
F) Test it and revise if necessary on the private site (1 week of everyone playing with it)
G) Launch to public!

This is similar to what Nate was already planning, so consider it as an input to the product management process as a possible streamlining option!

[neom500]

List of survey tool options Natalie Kiwan has researched:

https://www.figma.com/file/9hPmNSsyaH2VMGNz5mffmI/FOLA-Design-%232?type=design&node-id=640-122&mode=design&t=5m9XwV2dYfmWISkw-0

[fancyham]

Adding updates from last meetings:

Pop-up team has added 'competitive audit' and added it to Figma file: examples of surveys in other apps. Thanks everyone. Very helpful.

Re: which survey tool to use —
Short term and for MVP and alpha testing: Google Forms seems like a MVP and a benefit is that it's available to all FOLA volunteers
Longer term: an ideal would be to show survey questions atop our interface as a layer, rather than in a new window, and two of the survey services that Natalie Kiwan put together seem to support this. This would be similar to other surveys out there. Google Maps did this particularly well, and could serve as a design pattern for us in the future.

Decided on User Interface

@ihorng has put together four design options, based on discussions with @neom500

@GigiUxR, research lead (and basically, the client for this feature), would like #4, but with an added time component — to have the prompt appear after X seconds so that it gives users time to get some of their task done first. Dev team thought this should be doable, and would take about a month, and would be lower priority than fixing any serious bugs with recent UI update.

@neom500 and @GigiUxR will determine that time delay based on looking at Microsoft Clarity, with the goal of getting good results but also not preventing people from accomplishing their task.

Gigi would also like to only allow a user to take a survey once, and if a user says 'No thanks' to the survey, that we'd ask them again on a future visit. Qiqi @qiqicodes and John @entrotech said that should be possible using cookies. Bryan @fancyham suggests possibly using the survey URL as the unique identifier, and if that doesn't work, serialize the surveys (1, 2, 3, etc.)

The surveys will link out to a Google Form in a separate window/tab for now, but a future ideal may be to have the survey appear on top of our UI in the same window.

Next steps

• Please also consider a user interface to set up the prompt — this could be really useful for Research to change the prompt and survey link without putting in a request to the dev team and waiting for the next push to the production server. @neom500, you might want to recruit someone like Ingrid and Gigi to flesh that out with you.
• Devs please review the designs/specs and get back to Nate and Gigi and me with questions and/or if you need more specificity/design documentation.