Last modified: 2014-11-17 21:22:52 UTC

Wikimedia Bugzilla is closed!

Wikimedia migrated from Bugzilla to Phabricator. Bug reports are handled in Wikimedia Phabricator.
This static website is read-only and for historical purposes. It is not possible to log in and except for displaying bug reports and their history, links might be broken. See T65978, the corresponding Phabricator task for complete and up-to-date bug report information.
Bug 63978 - replace ≡ (hamburger menu) with W symbol for site drawer.
replace ≡ (hamburger menu) with W symbol for site drawer.
Status: NEW
Product: MobileFrontend
Classification: Unclassified
Feature requests (Other open bugs)
unspecified
All All
: Low normal
: ---
Assigned To: Nobody - You can work on this!
:
Depends on:
Blocks:
  Show dependency treegraph
 
Reported: 2014-04-15 23:17 UTC by Jared Zimmerman (WMF)
Modified: 2014-11-17 21:22 UTC (History)
7 users (show)

See Also:
Web browser: ---
Mobile Platform: ---
Assignee Huggle Beta Tester: ---


Attachments
W icon (1.82 KB, image/svg+xml)
2014-04-15 23:58 UTC, May
Details

Description Jared Zimmerman (WMF) 2014-04-15 23:17:16 UTC

    
Comment 1 Bingle 2014-04-15 23:20:08 UTC
Prioritization and scheduling of this bug is tracked on Mingle card https://wikimedia.mingle.thoughtworks.com/projects/mobile/cards/1929
Comment 2 Jon 2014-04-15 23:53:42 UTC
Please provide an svg asset to make this easier.
Also note we will want this to be configurable per project.

Initially do we want this to only apply to English Wikipedia or all Wikipedias?
I assume Wiktionary/Wikivoyage/MediaWiki etc will be left alone.
Comment 3 May 2014-04-15 23:58:05 UTC
Created attachment 15116 [details]
W icon
Comment 4 Jon 2014-04-16 00:02:21 UTC
Just for clarity sake:
(I know we previously discussed a hamburger/W hybrid icon)

Are we confident that people will know this is a button that they can click on?

When we released the hamburger for the first time there were various reports of us adding a random feature that had been sitting there for a year or so. We previously had a W icon.

That said there have also been reports the hamburger is not clear as an icon.

It would be good if we had some user testing data to back up this change so it's not just for the sake of change and we don't revisit it yet again later. We are already seeing lots of icon changes (currently the mobile team is having to redo the notifications icon to be a bell icon) and I'd hate this to continue the trend of changing icons willy nilly.
Comment 5 Jared Zimmerman (WMF) 2014-04-16 00:25:03 UTC
Current users will likely use the access point in the same way they are now, I don't think the change from ≡ to W will affect discoverability there. This is a common pattern both on desktop and mobile for the site logo to go home, or have menu-like functions

ok

Yes, ≡ is not an obvious thing to click on for many users, I think W has the benefits of being both "about the site (branding)" and used in a way that is consistent with other mobile patterns, while avoiding the ≡ that is unclear to many

Testing can be done, but I think that it will be inconclusive (e.g. ≡ and W will test the same in a small sample size), if we can make the change on Beta now it would allow for some quick guerilla testing of the production code rather than a lot of mockups. Sound reasonable?
Comment 6 Jared Zimmerman (WMF) 2014-04-16 00:25:57 UTC
also as far as the SVG, don't we prefer to use the new wikifont for this?

and yes for now this is a xx.wikipedia only change.
Comment 7 May 2014-04-16 00:34:13 UTC
http://bit.ly/WikiFont

.WikiFont-w:before {
  content: "\e400";
}
Comment 8 Arthur Richards 2014-04-16 17:18:14 UTC
I've created a story card in our backlog to capture this https://wikimedia.mingle.thoughtworks.com/projects/mobile/cards/1932
Comment 9 Jared Zimmerman (WMF) 2014-04-16 19:02:04 UTC
Jon asked for some rational, user research, etc. Here is some interesting reading on the subject.

http://exisweb.net/mobile-menu-abtest
http://exisweb.net/menu-eats-hamburger
http://exisweb.net/mobile-menu-icons
http://www.ericmobley.net/the-ambiguous-hamburger-icon-is-the-icon-mystery-meat-to-users/
http://www.getelastic.com/dont-make-these-mobile-menu-mistakes/

I also don't think we should downplay the benefit of having some small amount of branding on the site to identify users what site they are on, which we don't currently have other than the name of the site in text.
Comment 10 Jared Zimmerman (WMF) 2014-04-16 19:03:55 UTC
Also if we have worries about people not knowing to interact with the button, we could do something like this.

https://github.com/facebook/Shimmer

possibly a bit goofy, but if done subtly it might be interesting.
Comment 11 Jared Zimmerman (WMF) 2014-04-16 19:05:33 UTC
I know that the code above is for native apps, but it illustrates the idea of subtly drawing attention to the element
Comment 12 Jared Zimmerman (WMF) 2014-09-10 05:53:18 UTC
this should still happen even without wikifont, title updated.
Comment 13 Florian 2014-11-16 02:28:30 UTC
But it should be configurable. There are a lot of third party users for MobileFrontend. A W icon isn't the best there :)
Comment 14 Jared Zimmerman (WMF) 2014-11-17 21:07:12 UTC
(In reply to Florian from comment #13)
> But it should be configurable. There are a lot of third party users for
> MobileFrontend. A W icon isn't the best there :)

This change is only for foundation wikipedias.
Comment 15 Jon 2014-11-17 21:20:41 UTC
Jared yes but as Florian states it should be configurable so that any project can use it and should have a default icon for projects such as Wiktionary or Wikivoyage where a W make no sense.
Comment 16 Jared Zimmerman (WMF) 2014-11-17 21:22:52 UTC
I just want to balance (swap a single asset on a subset of sites) with (make a configurable system where site admins can change the menu access icon) those are totally separate tasks, and I think we should keep them as such rather than muddying them together as one.

Note You need to log in before you can comment on or make changes to this bug.


Navigation
Links