We're changing the Thank You page for people who leave sad feedback such that they get a list of suggestions from SUMO. This helps users who are leaving feedback about problems for which there are solutions, but the user might now know about them. This bug covers creating mockups for how that would look. We'll need mockups for "desktop view size" as well as "mobile view size".

I attached 4 PDFs of wireframes that I created with the "smart phone" ones being for a mobile view size. My initial thought was to put a copy of the user's feedback on the page as that would give some context to links given by the SUMO api. It could also be useful for when people walk away and then come back to the computer/change tabs. That said it creates an issue for mobile viewing and I'm not wed to the idea. The files marked "no response" are versions without the user's feedback included.

Cheng, Matt: What do you think of the mockups? Are we moving in the right direction? What can we change to make them better?

This looks great. Thanks for working on it! Just a couple of very small suggestions/comments: 1. We should change "Suggestions from Support Mozilla" to "Suggestions from Mozilla Support" or something similar. 2. When the user does not leave feedback, how are we sourcing the article list? It would be great if we could get a list of most visited articles over the last week (in case we create new content for a specific new issue) or we could use the articles from https://support.mozilla.org/en-US/products/firefox/fix-problems which seem the most likely candidates. 3. What is the flow for the "need more help" section? Are we dumping users to support.mozilla.org or are we doing something more robust, like dropping them into the ask a question flow with their comment pre-populated? Think that's it from me. Cheng? What are your thoughts?

Hi, I was asked to give some UX feedback. Here are some additional thoughts: Seems like bad feedback will fall into two big buckets: Feedback that seems to be about a problem which has some corresponding support articles and everything else (no comment, indecipherable comment, comment about something that isn't actionable, etc.) For feedback where we have support suggestions, the suggestions are the most important part of the page. In that case: * Five support links feels like too many. If we're searching support (or using recently popular) we should be able to find something related in the first two or three results. If we are curating a list then Refresh Firefox, the "Fix slowness, crashing, error messages and other problems" page and a link to the Ask A Question flow probably cover it. * We don't need a helpful survey here. The user probably hasn't had a chance to read or try the solutions and the linked articles have their own helpful surveys. We can track effectiveness of the suggestions via their click-through rate. * Instead of a general link to support, include a link to the ask a question flow for the particular product (e.g. https://support.mozilla.org/en-US/questions/new/desktop ) * If you include a link to the ask a question flow, the second box (need more help, shape the future, contribute) probably isn't needed and may not even be desired. * I don't think we need to show the users's input. This page confirms that we recieved the feedback, the feedback is no longer editable, and displaying it above the CTA just makes the CTA less likely to be seen. Alternatively, you could try hiding the text and displaying it on user action ("see the feedback you submitted"). Other solutions could be to allow the user to send themselves a copy via email when submitting the feedback or providing them with a permalink after submission. For feedback where we can't provide support links: * The second box (need more help, shape the future, contribute) is probably all that we can do. This is basically the current page. In this case we should also use the ask a question link instead of the general support link as we'll still suggest plenty of articles to the user there and they get a more direct link to 1:1 support.

Moving things out of the input.adam sprint.

I'm going to backtrack a little and spend some time restyling the existing Thank You page to match the rest of the feedback flow (bug #1149517). That work will probably affect mockups for this bug. Clearing the needsinfo here.

Grabbing this one to finish up what Adam did. I just restyled the Thank You page, so I'll be tweaking the mockups based on that work.

Oops--grabbing this for realz.

I restyled the Thank You page to match the rest of the feedback forms. Now it looks like this: https://input.mozilla.org/en-US/thanks It's responsive and I've got it working on mobile (320px wide view) through desktop. That's the new baseline. The content is identical. Except that I have a pending change to the url for the "Having problems? Get help." link to point directly to the AAQ page on SUMO. Then I rethought a lot of how we were architecting this and instead of doing a bunch of Thank You page specific things I wrote a general suggestion system that allows for multiple providers providing links. One of the providers hits up the SUMO Suggest API for kb articles related to the feedback. We can add other providers later. For the first phase of the Thank You page fixing project, the sumosuggest provider only generates suggested links for feedback that meets the following criteria: 1. Firefox product 2. en-US locale 3. has 7 or more words in the feedback We'll probably change that criteria in future phases. For feedback that doesn't meet the criteria, the user sees the existing Thank You page. For feedback that does meet that criteria, they'll get the new Thank You page which shows suggestions from SUMO. Now to specific points.... Comment #7: > 1. We should change "Suggestions from Support Mozilla" to "Suggestions from Mozilla > Support" or something similar. I agree. We should use the correct name. > 2. When the user does not leave feedback, how are we sourcing the article list? It > would be great if we could get a list of most visited articles over the last week (in > case we create new content for a specific new issue) or we could use the articles > from https://support.mozilla.org/en-US/products/firefox/fix-problems which seem the > most likely candidates. If the user doesn't leave feedback that matches the above criteria, we'll show them the existing Thank You page. We can change that later, but to keep the scope of this project as small as possible, I want to do nothing new here. > 3. What is the flow for the "need more help" section? Are we dumping users to > support.mozilla.org or are we doing something more robust, like dropping them into > the ask a question flow with their comment pre-populated? After my pending link fix lands, then the "Having problems? Get help." link will go directly to the AAQ flow. We can't currently populate the question. Even if we could, I'm not sure we'd want to since I claim the kind of text users write when leaving feedback is almost certainly different than when asking a question. We could look into whether that claim is true or not as a different project if that seems interesting. Comment #8: > * Five support links feels like too many. If we're searching support (or using > recently popular) we should be able to find something related in the first two or > three results. If we are curating a list then Refresh Firefox, the "Fix slowness, > crashing, error messages and other problems" page and a link to the Ask A Question > flow probably cover it. I agree. I changed it to 3. We can change it if we discover 3 isn't a hot number, either. Relatedly, I think it's interesting to look at the links we'd get from searching support vs. recently popular kb articles vs. a canned list. I think that's an experiment we'd want to run for a future phase. > * We don't need a helpful survey here. The user probably hasn't had a chance to > read or try the solutions and the linked articles have their own helpful surveys. > We can track effectiveness of the suggestions via their click-through rate. I agree. I'll nix this. > * Instead of a general link to support, include a link to the ask a question flow > for the particular product (e.g. https://support.mozilla.org/en-US/questions/new/desktop) I can definitely point the user to the AAQ flow, but I'm not sure if I can or want to point them to a specific product in the flow. I claim people leave feedback for the wrong product enough that it's probably better to present them with the list of products they want to ask a question for. Also, I think I'd have to maintain a mapping of Input product -> SUMO product and I'm not sure what we'd do in cases where Input has one product that's covered by two in SUMO. e.g. sync. > * If you include a link to the ask a question flow, the second box (need more help, > shape the future, contribute) probably isn't needed and may not even be desired. I'm not sure how to determine whether it's needed or desired. Not everyone leaving sad feedback has a solveable problem. Some feedback is political or related to problems with what Mozilla is doing. It's probably important to have these additional links. I think it's worth measuring the engagement rate for all the links and figuring out what to do based on that data. For now, I think I want to leave them there. > * I don't think we need to show the users's input. This page confirms that we recieved > the feedback, the feedback is no longer editable, and displaying it above the CTA just > makes the CTA less likely to be seen. Alternatively, you could try hiding the text and > displaying it on user action ("see the feedback you submitted"). Other solutions could > be to allow the user to send themselves a copy via email when submitting the feedback > or providing them with a permalink after submission. I agree. I'll nix that. I think everything else is covered. I'll post another set of mockups this week. Verdi, Matt: Thank you so much for your thoughts!

Thank You page with suggestions "phone-sized" (320 width).

Thank You page with suggestions "desktop-sized".

I attached two mockups. I'm not crazy about either, but I think they meet my minimum requirements. Namely: 1. The intro text is sufficiently vague that we can support multiple suggestion providers without having to change it. It's "Having problems? Suggestions from your feedback. Based on your feedback, Input has the following suggestions:". We'll probably need something different for positive feedback. That's a problem for a different day, but it'd be nice to have text "good enough" to be able to push that problem out a ways. Any ideas for better text would be super. 2. The suggestions are "grouped" together and follow a common format. I did this by indenting them a tad and then putting them in a white box. I'm not crazy about the white box, though. Any ideas for separating the suggestions from the other things would be super. Generally this page has a hierarchy where the "Having problems? Suggestions from your feedback" is a top-level item and the suggestions are "under that". I think that format lets us scale better. Later on if we end up with more suggestion providers, we can show the first x and have a "more suggestions" thing which reveals the rest. 3. The hit target for each suggestion is big and far enough away from other hit targets it's easy to click/tap on. I used the convention that SUMO search results uses where the hit targets are the suggestion titles. Having said that, I'm not wild about it being the titles since it doesn't follow the conventions of this page where the hit targets are text buried in paragraphs. Maybe a better idea is to have the title, description and then have a "Read more..." be linked? Michael, Matt: What do you think?

This looks awesome. Thanks again for tackling this! Here's my thoughts: 1. I think this text is good. My suggestion would be to take out the bold "suggestions from your feedback." We explain that where the suggestions come from right below so it seems redundant. We could also lead with: * Something wrong? * Ooops, looks like something went wrong * Have a problem with [Product Name] * Having problems with [Product Name] I don't really have a favorite. Maybe verdi does though. 2. I am not a designer, but I think a background color that has a higher contrast to the rest of the page might make them stand out better. I would also see us putting a small border around each of the search results boxes. Multiple boxes in the middle of the page seem like they would draw your attention. We could also include the Forum/KB icons indicating what type of result it is. They make nice bullet replacements. 3. I am fine with following the SUMO conventions. Again, verdi or another designer may have stronger feelings here and I will default to them. I personally think it's great.

Rehan said: > the only thing i would suggest is maybe grab the document icon from sumo and > add that next to it just to visually make it more apparent Also: > yeah i think also a little reword to something like "based on your feedback > we think these KB articles might help you"

Good feedback from Matt and Rehan. I've attached a quick mock of those suggestions. One thing that's a little different here is I combined the sumo search results styling and the category page styling. Thoughts?

I like that a lot!

Thank You page with suggestions "phone-sized" (320 width) top part.

Thank You page with suggestions "phone-sized" (320 width) bottom part.

Thank You page with suggestions "desktop-sized".

I made a bunch of changes largely from Verdi's suggestions and then spent some time trying to get weights to a good enough point. In order to make it work on mobile, I reduce the size of the icons and the space it takes up. I also kept the "Suggestions from your feedback:" text. I thought it was important to communicate to the user what these things are based on. I'm still not sure about the "Have a problem with Firefox?" text. While these specific suggestions are all of the "we think you have a problem and maybe one of these articles can help" variety, we're going to add suggestions at some point that aren't. Is there a more generic heading we can use? Maybe promote "Suggestions based on your feedback" to the heading and not indicate we think that the user has problems at all? Verdi, Matt: Thoughts? Suggestions?

This is hot! Great work everyone. I like that we are thinking about the future here as well. My vote would be to do as willkg suggests. Let's move "Suggestions based on your feedback:" to the heading and remove the text stating you have a problem. I'll defer to the experts here, but that's my vote.

I'm going to close this out and use the last set of mockups for bug #1133771. Thank you everyone!