Page MenuHomePhabricator

Special:Nearby lacks to show purpose of the feature to the user
Closed, ResolvedPublic3 Story Points

Description

The nearby page is a little confusing. It requests users location right away before they can work out if they want to do that.

Goals

  • Provide a purpose of the feature to the user, to set expectation of what happens when they give location permission
  • Location permission CTA should be an explicit consent

On first page load there should be a text telling the user to allow the browser to share the location with the site. T120520 is similar, but this point is a little different. This is a call to action asking the user to share their location. The aforementioned task is a general intro about the page (I think).

Design


Empty state: zpl.io/V1ZpdZ5
Flow: https://wikimedia.invisionapp.com/freehand/document/mpWCcVzXQ
Copy for confirmation/error message: You have denied access to Location Services for “https://en.m.wikipedia.org”. To change this please visit your browser or device settings.

SVG

Acceptance criteria

  • When the user has an old browser or is not running JS, the "show nearby articles" button will be disabled.
  • On a first visit 3 clicks to get to nearby results (1: click menu item, 2: click button, 3: give browser permission).
  • On a second visit it would be 2 clicks (steps 1 and 2).
  • A geolocation permission warning is _not_ printed to the console:
[Violation] Only request geolocation information in response to a user gesture. https://en.m.wikipedia.org/w/extensions/MobileFrontend/resources/mobile.nearby/Nearby.js?38c95
getCurrentPosition	@	Nearby.js?38c95:93
refresh	@	Nearby.js?38c95:265
Nearby	@	Nearby.js?38c95:32
refresh	@	nearby.js?0c69a:69
refreshCurrentLocation	@	nearby.js?0c69a:103
matchRoute	@	oojs-router.js?f0f4f:29
(anonymous)	@	oojs-router.js?f0f4f:94
each	@	load.php?debug=true&…version=09gt2zl:368
Router.checkRoute	@	oojs-router.js?f0f4f:93
(anonymous)	@	nearby.js?0c69a:115
mightThrow	@	load.php?debug=true&…ersion=09gt2zl:3583
process	@	load.php?debug=true&…ersion=09gt2zl:3651

Previous history of this task

We fixed the following things:

  • Upon visiting https://en.m.wikipedia.org/wiki/Special:Nearby you'll see a permission dialog to access your location. If you block or ignore the dialog you'll keep seeing the spinner in the middle of the page. When blocked, there should be some text informing the user about it.
  • Similarly on the desktop site the text "Loading..." shows but never disappears. The hidden class applies but there is no equivalent css rule to hide this on desktop.

Developer notes

  • Use mw-ui-icon and mw-ui-icon-large

Open questions

Event Timeline

There are a very large number of changes, so older changes are hidden. Show Older Changes
Jdlrobson updated the task description. (Show Details)Jul 10 2017, 11:35 PM
Jdlrobson updated the task description. (Show Details)Jul 10 2017, 11:37 PM
Jdlrobson updated the task description. (Show Details)
Jdlrobson raised the priority of this task from Low to Normal.Feb 22 2018, 5:29 PM
Jdlrobson added subscribers: Lydia_Pintscher, aude, Mbch331.

Would we only render the nearby results once the user clicks "Show nearby articles"?

Yes.

On a first visit 3 clicks to get to nearby results (1: click menu item, 2: click button, 3: give browser permission).
not unreasonable :)

On a second visit it would be 2 clicks (steps 1 and 2)
correct

Just need some assets nirzar!

my time to shine!!

Jdlrobson updated the task description. (Show Details)Feb 22 2018, 9:45 PM
Jdlrobson updated the task description. (Show Details)
Jdlrobson updated the task description. (Show Details)Feb 28 2018, 5:18 PM

Maybe this will side effect fix the warning in T188475.

ovasileva set the point value for this task to 3.Feb 28 2018, 5:21 PM
Niedzielski raised the priority of this task from Normal to High.Feb 28 2018, 6:38 PM

Raising to high priority since the merged in task was high.

Nirzar updated the task description. (Show Details)Feb 28 2018, 11:14 PM
pmiazga claimed this task.Mar 6 2018, 8:14 PM
Nirzar added a comment.EditedMar 6 2018, 8:45 PM

When the user has blocked permissions for providing geolocation the "show nearby articles" button will be disabled.

just curious about this point. if user not given permission, particularly blocked it, this button serves as a purpose to request for permission?

Change 417457 had a related patch set uploaded (by Pmiazga; owner: Pmiazga):
[mediawiki/extensions/MobileFrontend@master] Introduce landing page for Special:Nearby

https://gerrit.wikimedia.org/r/417457

Change 418027 had a related patch set uploaded (by Pmiazga; owner: Pmiazga):
[mediawiki/extensions/MobileFrontend@master] WIP: Introduce LocationProvider class

https://gerrit.wikimedia.org/r/418027

Nirzar renamed this task from Special:Nearby does not give correct feedback to Special:Nearby lacks to show purpose of the feature to the user.Mar 12 2018, 5:40 PM
Nirzar updated the task description. (Show Details)

no one here answered about the the first AC here!

When the user has blocked permissions for providing geolocation the "show nearby articles" button will be disabled.

This was not intended. @pmiazga @alexhollender and I talked about this just now and Alex will be adding a quick flow of this use-case

cc @ovasileva

@Jdlrobson we are okay with hiding the title on empty state. the flow should be empty page > tap button > see browser dialog (while empty state is in the background) > say yes > hide empty state, show title and list

This comment was removed by alexhollender.

no one here answered about the the first AC here!

When the user has blocked permissions for providing geolocation the "show nearby articles" button will be disabled.

This is not in the acceptance criteria. Does that not answer the question ? :)

Jdlrobson updated the task description. (Show Details)Mar 13 2018, 5:34 PM

that's cheating!

Change 419327 had a related patch set uploaded (by Pmiazga; owner: Pmiazga):
[mediawiki/extensions/MobileFrontend@master] Hygiene: Refactor Nearby.js by introducing the LocationProvider

https://gerrit.wikimedia.org/r/419327

Change 419327 abandoned by Pmiazga:
Hygiene: Refactor Nearby.js by introducing the LocationProvider

Reason:
Wrong push

https://gerrit.wikimedia.org/r/419327

alexhollender updated the task description. (Show Details)

@pmiazga I updated the copy for the message: You have denied access to Location Services for “https://en.m.wikipedia.org”. To change this please visit your browser or device settings

@pmiazga pointed out that there's another case to design for:
User taps "allow" > but we are unable to determine their location (error.POSITION_UNAVAILABLE)

I updated the designs to cover this flow. Copy for the error message is: Wikipedia Nearby cannot determine your location. Please try again with a better signal.

Change 418027 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Hygiene: Refactor Nearby.js by introducing the LocationProvider

https://gerrit.wikimedia.org/r/418027

Change 419525 had a related patch set uploaded (by Pmiazga; owner: Pmiazga):
[mediawiki/extensions/MobileFrontend@master] Show overlay when quering geolocation/mwapi

https://gerrit.wikimedia.org/r/419525

Jdlrobson removed pmiazga as the assignee of this task.Mar 14 2018, 11:37 PM
Jdlrobson added a subscriber: pmiazga.

Both patches have +2s but are blocked on my patch ( https://gerrit.wikimedia.org/r/#/c/419521 )

Change 417457 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Introduce landing page for Special:Nearby

https://gerrit.wikimedia.org/r/417457

Change 419525 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Show overlay when quering geolocation/mwapi

https://gerrit.wikimedia.org/r/419525

Nirmos added a subscriber: Nirmos.Mar 15 2018, 9:21 PM

I created T189818 about the race condition you have introduced.

ABorbaWMF reassigned this task from ABorbaWMF to ovasileva.Mar 16 2018, 7:12 PM
ABorbaWMF added a subscriber: ABorbaWMF.

Looks good to me on staging




Nirzar moved this task from Needs QA to Needs More Work on the Readers-Web-Kanbanana-Board-Old board.

  • The notifications are missing
  • I could not test the main workflow here since dev wiki can't determine location. the transition from accepting location vs not accepting

@ABorbaWMF this is not ready either

The notifications are missing
I could not test the main workflow here since dev wiki can't determine location. the transition from accepting location vs not accepting

Not sure what this means.
Are you sure you are using https? It's working fine for me. https://reading-web-staging.wmflabs.org/wiki/Special:Nearby

The notifications are missing

the notification count is missing in the header as you can see in the screenshot. I'm assuming that space is reserved for refresh icon when the permission is given but at the empty state, either the search icon should move to the right or we should show notification. the search icon looks like it's floating out of no where.

Third option is keeping the refresh button as it is but disabling it.

Are you sure you are using https? It's working fine for me. https://reading-web-staging.wmflabs.org/wiki/Special:Nearby

https! worked for me now. didn't know we need to add https for location permission to work.

the flow can be tested and looks good.

Change 420126 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/MobileFrontend@master] Remove the refresh button on Nearby

https://gerrit.wikimedia.org/r/420126

e notification count is missing in the header as you can see in the screenshot.

Ah got it! The easiest thing to do would be to remove the refresh button altogether. It's a bit of a weird button... It's only really useful if you are on a moving vehicle. That would be Remove the refresh button on Nearby .

If we want to to keep it, we'll need to invest a bit more work here and work out how it behaves when the user has shared a URL, as the workflow seems broken on https://reading-web-staging.wmflabs.org/wiki/Special:Nearby?useformat=mobile#/coord/41.383611,2.182222 and its undocumented in the code. Even if we'd that I'd prefer to remove it and then work on this next week. If it's important we'll have to revert all the changes and start this task again. @ovasileva / @Nirzar
what would you recommend.

https! worked for me now. didn't know we need to add https for location permission to work.

Yeh... geolocation now requires https. We only ever use https in production this will not be a problem.

I would be okay with removing it, but will leave it up to @Nirzar and @alexhollender to make the final call. Let's talk about this during standup today.

@ovasileva Let's get rid of it.. we can bring that feature back when we work on special pages to have call to action. as of now the refresh button is not even in the right place.

Change 420126 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Remove the refresh button on Nearby

https://gerrit.wikimedia.org/r/420126

Change 420393 had a related patch set uploaded (by Pmiazga; owner: Pmiazga):
[mediawiki/extensions/MobileFrontend@master] Hide the Landing page when presenting /page/{page} route

https://gerrit.wikimedia.org/r/420393

Change 420393 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Hide the Landing page when presenting /page/{page} route

https://gerrit.wikimedia.org/r/420393

Jdlrobson reassigned this task from ovasileva to Nirzar.Mar 19 2018, 8:10 PM

Over to you. Staging is up to date.

Nirzar closed this task as Resolved.Mar 21 2018, 6:36 AM

Macro votecat: looks good

I tested this on slow internet connection.. 3mbps. and we need a spinner while we fetch the list of articles. right now, i only see "Nearby" as a title and nothing happens for 5-7 seconds and then you see the list. let's create a followup for that @alexhollender