759831 - [AAQ Flow] Make the length of the AAQ Flow more predictable

Status: RESOLVED FIXED

(support.mozilla.org :: Questions, task, P2)

Description

[:ibai]

The AAQ flow has multiple steps and the user doesn't necessarily now how long is going to be or where they are at. This creates frustration and churn.

We can implement something as simple as a progress bar (as suggested by James) to mitigate this issue.

Comment 1

[Ricky Rosario [:rrosario, :r1cky]]

Bram, what should this look like?

Comment 2

[Bram Pitoyo [:bram]]

Attachment: Ask A Question - Step 1 with progress bar

Comment 3

[Bram Pitoyo [:bram]]

Attachment: Ask A Question progress bars

Note that we are using the same ‘thermometer’ style that we’ve used in the support forum.

Comment 4

[:ibai]

Hey Bram,

Can we reduce the size of the second step?

"Select a topic and try some solutions"

To something like

"Select a topic"

Trying solutions is desirable but not mandatory and the bar will be a little bit more balanced.

Comment 5

[Rehan Dalal (Inactive)]

Hey Bram,

Further to Ibai's point, if the labels could be roughly the same size this would be better for localization as well, because the increments of the progress bar would not be so tied to the English labels.

Comment 6

[Bram Pitoyo [:bram]]

Sure thing. When I was designing and coming up with wording ideas, I had some alternatives in mind:

* Using “pick” rather than “select”. So, “Pick a product” and “Pick a topic”

* Using “Provide more details” or “Fill in details” rather than “Ask a Question”, because saying “Ask a Question” is confusing when the page title is already called “Ask a new question”

* Rather than saying “Before you continue, we ask you to create a support account so we can contact you”, we simply say “Create an account or sign in”. We know that people don’t read long headings. But we also know that people want an explanation of why they need to create an account. So we should put these explanations on the right of the respective fields.

* In the fill-in your question details step, rather than saying “Post Question”, the button label should say “Next”, because the next step is confirmation, and we don’t want to imply that the process is done yet.

Comment 7

[Bram Pitoyo [:bram]]

Attachment: Ask A Question - Create an Account and Sign In with form labels

This is how we can explain to users how we will use their information. It is more effective than explaining things in the heading, because our prototype research had shown that users don’t like to read long heading. Just-in-time (JIT) help might do a better job.

We should not show the explanation all at once. Rather, we should only show one when the user highlights a particular field.

For example, when user highlights the “Email” form, the text saying “Never shared, only used to send you answers” appears. But the other text explanations don’t appear.

The other thing that has been changed is the order of the form. Email is first, Username is second, followed by Password and Confirm Password third.

Comment 8

[Bram Pitoyo [:bram]]

(In reply to :ibai from comment #4)
> Can we reduce the size of the second step?

(In reply to Rehan Dalal [:rehan, :rdalal] from comment #5)
> if the labels could be roughly the same size this
> would be better for localization as well

To actually answer this question, let’s use this label for now:
* Select a product
* Select a topic
* Create an account
* Fill in question
* Confirm
* DONE

I hope this will allow us to put captions on the 0%, 20%, 40%, 60%, 80% and 100% the width of the div.

Comment 9

[:ibai]

(In reply to Bram Pitoyo [:bram] from comment #6)
> Sure thing. When I was designing and coming up with wording ideas, I had
> some alternatives in mind:
> 
> * Using “pick” rather than “select”. So, “Pick a product” and “Pick a topic”
> 

Based on this http://www.english-test.net/forum/ftopic17184.html "Select" is more appropriate than "Choose" but it seems that "Pick" works in both directions and is broader. I guess either option works and Pick is shorter...

> * Using “Provide more details” or “Fill in details” rather than “Ask a
> Question”, because saying “Ask a Question” is confusing when the page title
> is already called “Ask a new question”

This is a really good point, the Ask a question level felt strange and now i get why: it feels that we are adding layers to the act that they want to do. Changing the copy creates the idea that to ask a question is not only to write it in a form. "Provide more details" feels more compelling as a substitute.


From the mock-up that you just shared, I think that removing "or real name" is a good idea. They never give us that detail and by adding those words it feel that we actually know your name...

Comment 10

[Ricky Rosario [:rrosario, :r1cky]]

Bram is done and Rehan is working on this now.

Comment 11

[Bram Pitoyo [:bram]]

Ibai,
This is the copy for the page that will appear when the user’s email is verified. Can you please review it? The general idea is to reassure the user that the step is now done, and there’s nothing else the user can do (except for log in?)

Rehan,
You can go ahead and put this HTML in the meantime, as we can tweak it later:

<h1>Done!</h1>
          <p>Your account is successfully verified, and your question is now posted on the Mozilla community support forum.</p>
              <p></p><p>See your question here:</p><p><a href="/en-US/questions/780209">Flash crashes</a></p><p>Sit back and relax. Our forum contributors will get back to you with an answer.</p>

<h2>While you wait</h2>

<p>Log in, so you can respond to your question when it is answered:</p>


Please note that between the <p> and the <h2>, we might need some vertical space.

Comment 12

[Bram Pitoyo [:bram]]

Attachment: Done, Account Verified

A mockup of what the account verified (AKA “done”) step should look like.

Comment 13

[Rehan Dalal (Inactive)]

Landed:
https://github.com/mozilla/kitsune/commit/5af6aafe678a51db66ae1e061fe6cbcbe7dc0dd6

Pushed to production by Rehan at 2012-06-19 15:52:00 EDT

Comment 14

[Kadir Topal [:atopal]]

I think this looks great. Only thing that concerns me is the "sit back and relax" part. Usually when people come to SUMO and to the stage of asking a question, they are agitated and frustrated, because they have an issue that makes their life harder, telling them to sit back and relax might sounds like we are not taking it seriously.

On the other hand, I'm not a native speaker and it might just sounds weird to me.

Let me just say it: This would not fly in Germany (but then, so many other things wouldn't either ;)

Michael, what do you think?