811149 - [FTE] Getting a better feedback in the process of connecting to a Wifi network

Status: RESOLVED FIXED

(Firefox OS Graveyard :: Gaia::First Time Experience, defect, P4)

Description

[Tony Chung [:tchung]]

When in First Time Experience, connecting to a wifi network is not always easy to connect.  And even if it's connected, there's no clear and obvious indication it's connected because the SSID's jump around the order.

See Screenshot for the unclear experience:  http://youtu.be/IBMnExpnnPs

Repro:
1) install 11-12-2012 daily unagi build
* gaia: 92b7a950de3ec1cdecd90fb9d2cd7f930bb1f227
* gecko: 11e6372e034f7f19ad0b39749b48425a462120af
2) on FTE screen, go to wifi selection page
3) Verify clicking on a open Wifi network does not always connect right away.  Instead, it reorders the selection, and doesnt even clearly connect.

Expected:
- connection on first time click.  And a clear indication which Network you're on!   (eg. why not show the connected SSID name at the top)

Actual:
- no clear selection for connecting to wifi

Comment 1

[Naoki Hirata :nhirata (please use needinfo instead of cc)]

Borja made a fix for bug 811761, which basically is blocking in today's build.  11/15

Comment 2

[Borja Salguero [:borjasalguero]]

[:tchung] As Naoki said the problem that you reproduce in your video was that 'connecting to Wifi network' was not working (Open, WPA, WEP... it doesnt care). This bug is fixed and landed, so now you will receive feedback with a label which will change between 'connecting', 'associated', 'connected' status. So this bug is fixed.

On the other hand it's true that probably we could create a better way for showing this feedback to the user, but this is not a blocker bug. We could ask UX people how to implement this behaviour in order to get the best user experience. Thanks for your suggestion!

Comment 3

[Borja Salguero [:borjasalguero]]

What about renaming this bug to 'Getting a better feedback in the process of connecting to a Wifi network' or something like that?

Comment 4

[Fernando Campo (:fcampo)]

I really don't see why a better feedback issue should be blocking, for me is just a UX improvement, but maybe is there something I am missing?

And if it's just about better feedback and not a blocker, maybe someone from UX can take a look? I'm putting josh but not sure if he's the one should take a look
For me would be enough if we change the background color of the connecting/connected network (orang-ish, green-ish?)

Comment 5

[Rafael Rebolleda]

I agree this is a small improvement. Talked to Sergi about it, and we could change the color of the text and perhaps have a checkmark to the left, similar to the phone icons on the call log.

Comment 6

[Borja Salguero [:borjasalguero]]

Is a bb+? IMHO It's only a polish.

Comment 7

[Rafael Rebolleda]

Yup, definitely not a blocking issue.

Comment 8

[Sergi]

Attachment: WiFi :: Improving Connection Feedback

Comment 9

[Sergi]

I've added an attachment explaining how we can improve feedback when the user connects to a WiFi Network. I think making some color changes and adding a little animation to the "Connecting..." text under the SSID might do the trick, so we don't have to make huge changes to the current implemented solution. 

The example in the attachment is for the FTU, but i recommend to use the same approach when the user selects a network from "Settings".

Comment 10

[steve]

That looks great sergi. Just suggest that the word connected is also blue. SO network name, word connected is blue and icon is blue.

Comment 11

[Sergi]

I've added the "connected" label in blue.

Comment 12

[Sergi]

Attachment: WiFi :: Improving Connection Feedback V2

Comment 13

[Sergi]

I still think it would be better to use the progress bar instead of the spinner. We can use the progress bar together with the info on the total size of the packet to be downloaded.

Anyway i keep this issue on hold from a visual point of view until we have the feedback on whether it's technically possible to use the total size of what's the user downloading (which i also think is the best) or not.

Comment 14

[Sergi]

**** The above comment doesn't go in this thread. Sorry for the error :P

Comment 15

[Josh Carpenter [:jcarpenter]]

(In reply to Sergi from comment #12)
> Created attachment 684649 [details]
> WiFi :: Improving Connection Feedback V2

Looks great Sergi.

Comment 16

[Sergi]

I think we're missing 2 scenarios to improve WiFi selection user feedback:

- What happens while the system is loading to retrieve available networks?
- What happens if the system doesn't retrieve any network?

Any suggestion?

I was thinking on using a blank screen with a loading spinner for the first case, and a message with an image similar to those we're using in contacts and call log apps when there's no content.

Comment 17

[Rafael Rebolleda]

Sounds good to me :)

Comment 18

[Sergi]

Find attached a couple of screenshots to showcase the two scenarios i talked about in Comment 16

Comment 19

[Sergi]

Attachment: Loading Network List

Comment 20

[Sergi]

Attachment: Network List :: No Results

Comment 21

[Josh Carpenter [:jcarpenter]]

Mockups look great, Sergi. We should definitely implement for v1, given this is in a prominent place (FTE), and in a target market where connectivity will be spotty.

Marking UX-P2 and renominating. 

What's the status here? Is anyone workig to get this in for v1?

Comment 22

[Fernando Campo (:fcampo)]

I'm on it at the moment, will see some results later today

Comment 23

[amiller]

UCID: ftesetup-006
https://moztrap.mozilla.org/results/case/62327/

Comment 24

[Sergi]

Regarding the process of loading the list of available networks, i recommend you to check the new design for Progress and Activity in Mozilla's wiki: https://wiki.mozilla.org/Gaia/Design/BuildingBlocks#Progress_.26_Activity_Indicators.

This component has been adapted in order to provide a consistent experience throughout the system.

Comment 25

[Lukas Blakk [:lsblakk] use ?needinfo]

Will track but not blocking.

Comment 26

[Sergi]

Attachment: WiFi :: Improving Connection Feedback V2

Comment 27

[Fernando Campo (:fcampo)]

Attachment: link to PR: https://github.com/mozilla-b2g/gaia/pull/8084

Comment 28

[Axel Hecht [:Pike]]

Comment on attachment 713450 [details]
link to PR: https://github.com/mozilla-b2g/gaia/pull/8084

I'm surprised about the amount of "TODO UX" comments in the patch.

The strings look OK, but you should not put them in innerHTML, but explicitly make them text content, unless you need html markup. That's safer in case someone has the idea to embed a script tag into the localized string.

Comment 29

[Fernando Campo (:fcampo)]

(In reply to Axel Hecht [:Pike] from comment #28)
> Comment on attachment 713450 [details]
> link to PR: https://github.com/mozilla-b2g/gaia/pull/8084
> 
> I'm surprised about the amount of "TODO UX" comments in the patch.
Well, the TODOs were there before, I just moved the methods around for consistency, should be probably treated on another bug. But basically, you are right, still many of them (I actually didn't pay attention to them when refactoring :D)

> The strings look OK, but you should not put them in innerHTML, but
> explicitly make them text content, unless you need html markup. That's safer
> in case someone has the idea to embed a script tag into the localized string.
Agree on that. I can change them in here, but after checking the files, I see there's many of them also outside the context of the bug. Maybe would be good if I open a new more general bug to change innerHTML for textContent when dealing only with strings??

Comment 30

[Borja Salguero [:borjasalguero]]

Great job Fernando! Please copy & paste the commit here and ask for gaia-approval-v1. Thanks! Gracias!

Comment 31

[Fernando Campo (:fcampo)]

Finally erged https://github.com/mozilla-b2g/gaia/commit/7d6c46344f6f89bc4b7232450bf5cdce8ba30982

Comment 32

[Fernando Campo (:fcampo)]

Comment on attachment 713450 [details]
link to PR: https://github.com/mozilla-b2g/gaia/pull/8084

NOTE: Please see https://wiki.mozilla.org/Release_Management/B2G_Landing to better understand the B2G approval process and landings.

[Approval Request Comment]
Bug caused by (feature/regressing bug #): 
User impact if declined: a bad user experience when connecting to wifi
Testing completed: 
Risk to taking this patch (and alternatives if risky): low, mostly UI changes
String or UUID changes made by this patch:

Comment 33

[John Ford [:jhford] CET/CEST Berlin Time]

Uplifted commit 7d6c46344f6f89bc4b7232450bf5cdce8ba30982 as:
v1-train: 4846f80b313b241431c4842114287e1edc036051

Comment 35

[buri.blff]

Dear John Ford:
   can you add the commit to v1.0.1??

Comment 36

[Axel Hecht [:Pike]]

Given that this patch adds new strings, we shouldn't take it on 1.0.1 anymore.

Comment 37

[Jason Smith [:jsmith]]

A non-blocker doesn't have value to get a check for reproducibility.

Comment 38

[Julien Wajsberg [:julienw]]

given comment 36 and the fact that this is not tef+, this patch won't land on v1.0.1.

Please ask tef? if you think that's wrong.

Comment 39

[buri.blff]

The bug 863536 on v1.0.1 is similar with this bug, should we use this patch or need to wait for another patch??

Comment 40

[Julien Wajsberg [:julienw]]

Bug 863536 is not tef+.
Plus, this bug deals with only the Wifi screen and not the other screens.

I think that in Bug 863536 we can do an adhoc patch for v1.0.1 without new strings, ie with only a "loading" image.

Comment 41

[buri.blff]

Dear Wajsberg:

   Is there any path for bug 863536 on v1.0.1???

Comment 42

[Julien Wajsberg [:julienw]]

From comment 35, asking tef? here. Based on comment 36, we should have an ad hoc patch for 1.0.1 so that we don't add any new l10n string.

Comment 43

[Daniel Coloma:dcoloma]

Moving this to Mozilla queue

Comment 44

[buri.blff]

The BUG 863536 (In reply to Julien Wajsberg [:julienw] (PTO until Monday 13th May) from comment #40)
> Bug 863536 is not tef+.
> Plus, this bug deals with only the Wifi screen and not the other screens.
> 
> I think that in Bug 863536 we can do an adhoc patch for v1.0.1 without new
> strings, ie with only a "loading" image.

Bug 863536,  in step 2:
 Enter First time experience to check "Your privacy",tap B2G
OS/Marketplace/everything.me, there display black space, no prompt when page
loading.  


should we add some prompt to these not only wifi screen.

Comment 45

[Alex Keybl [:akeybl]]

(In reply to buri.blff from comment #35)
> Dear John Ford:
>    can you add the commit to v1.0.1??

buri - is this actually a hard blocker for you all? This has major change for being a couple of weeks from our final deadline.

Comment 46

[Alex Keybl [:akeybl]]

Please renominate if this should be considered a hard blocker.