Hi all,
This is a heads up about some of the things the Growth team is thinking about and working on with mediawiki.ui.
1. We're in the process of adding optional icon support for mediawiki.ui buttons, with browser support down to IE8.[A] 2. We're going to get rid of the text shadow on the default mediawiki.ui buttons.[B] It's distracting and doesn't increase readability. We don't use gradients in the colored buttons for similar reasons. 3. We need to do some tweaking of the design of the default mediawiki.ui button.[D] We're designing the second iteration of the anonymous editor signup invitation UI to A/B test.[E] When looking at these, you can see that the default mediawiki.ui button ("continue editing") almost seems disabled. We should talk about ways to improve on this design, such as darkening the text color or giving the default button a background color.
This may come up in the WMF UX team's weekly design review as well, but I wanted to give a heads up about these issues since the library is in MediaWiki core.
A. https://bugzilla.wikimedia.org/show_bug.cgi?id=55535 B. https://bugzilla.wikimedia.org/show_bug.cgi?id=61940 C. These are viewable at https://en.wikipedia.org/wiki/Crocodilia?gettingStartedReturn=true if you're logged in D. See style guide: http://tools.wmflabs.org/styleguide/desktop/section-2.html E. https://www.mediawiki.org/wiki/Anonymous_editor_acquisition/Signup_invites_v...
FYI, there are updates to the mediawiki.ui color variables at https://gerrit.wikimedia.org/r/#/c/117105/. The change is about 3 months old, but hasn't been merged yet :( Maybe someone on the Growth team could take a look at it.
Ryan Kaldari
On Wed, Jun 25, 2014 at 6:27 PM, Steven Walling swalling@wikimedia.org wrote:
Hi all,
This is a heads up about some of the things the Growth team is thinking about and working on with mediawiki.ui.
- We're in the process of adding optional icon support for
mediawiki.ui buttons, with browser support down to IE8.[A] 2. We're going to get rid of the text shadow on the default mediawiki.ui buttons.[B] It's distracting and doesn't increase readability. We don't use gradients in the colored buttons for similar reasons. 3. We need to do some tweaking of the design of the default mediawiki.ui button.[D] We're designing the second iteration of the anonymous editor signup invitation UI to A/B test.[E] When looking at these, you can see that the default mediawiki.ui button ("continue editing") almost seems disabled. We should talk about ways to improve on this design, such as darkening the text color or giving the default button a background color.
This may come up in the WMF UX team's weekly design review as well, but I wanted to give a heads up about these issues since the library is in MediaWiki core.
A. https://bugzilla.wikimedia.org/show_bug.cgi?id=55535 B. https://bugzilla.wikimedia.org/show_bug.cgi?id=61940 C. These are viewable at https://en.wikipedia.org/wiki/Crocodilia?gettingStartedReturn=true if you're logged in D. See style guide: http://tools.wmflabs.org/styleguide/desktop/section-2.html E. https://www.mediawiki.org/wiki/Anonymous_editor_acquisition/Signup_invites_v...
-- Steven Walling, Product Manager https://wikimediafoundation.org/
Design mailing list Design@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/design
On Wed, Jun 25, 2014 at 6:46 PM, Ryan Kaldari rkaldari@wikimedia.org wrote:
FYI, there are updates to the mediawiki.ui color variables at https://gerrit.wikimedia.org/r/#/c/117105/. The change is about 3 months old, but hasn't been merged yet :( Maybe someone on the Growth team could take a look at it.
Thanks for the heads up. We'll definitely take a look.
in point 2/B you mean the neutral state buttons correct? not default=primary right? for colored buttons and non-white buttons the text shadow certainly improves contrast and readability.
*Jared Zimmerman * \ Director of User Experience \ Wikimedia Foundation
M +1 415 609 4043 \ @jaredzimmerman http://loo.ms/g0
On Wed, Jun 25, 2014 at 6:27 PM, Steven Walling swalling@wikimedia.org wrote:
Hi all,
This is a heads up about some of the things the Growth team is thinking about and working on with mediawiki.ui.
- We're in the process of adding optional icon support for
mediawiki.ui buttons, with browser support down to IE8.[A] 2. We're going to get rid of the text shadow on the default mediawiki.ui buttons.[B] It's distracting and doesn't increase readability. We don't use gradients in the colored buttons for similar reasons. 3. We need to do some tweaking of the design of the default mediawiki.ui button.[D] We're designing the second iteration of the anonymous editor signup invitation UI to A/B test.[E] When looking at these, you can see that the default mediawiki.ui button ("continue editing") almost seems disabled. We should talk about ways to improve on this design, such as darkening the text color or giving the default button a background color.
This may come up in the WMF UX team's weekly design review as well, but I wanted to give a heads up about these issues since the library is in MediaWiki core.
A. https://bugzilla.wikimedia.org/show_bug.cgi?id=55535 B. https://bugzilla.wikimedia.org/show_bug.cgi?id=61940 C. These are viewable at https://en.wikipedia.org/wiki/Crocodilia?gettingStartedReturn=true if you're logged in D. See style guide: http://tools.wmflabs.org/styleguide/desktop/section-2.html E. https://www.mediawiki.org/wiki/Anonymous_editor_acquisition/Signup_invites_v...
-- Steven Walling, Product Manager https://wikimediafoundation.org/
Design mailing list Design@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/design
On Wed, Jun 25, 2014 at 6:53 PM, Jared Zimmerman < jared.zimmerman@wikimedia.org> wrote:
in point 2/B you mean the neutral state buttons correct? not default=primary right? for colored buttons and non-white buttons the text shadow certainly improves contrast and readability.
Yeah, I am just talking about the default buttons, per our commentary on the related bug. I know some are also not a fan of the text shadow on colored buttons but I can hardly tell the difference on those, to be honest.
In terms of icons please please please collaborate on that before coding something up.
In mobile we have done a lot of this with icon classes and icons.less [1] to try to standardise on sizes and icons - it would be great to upstream that to core as a mw-ui-icon
At the very least please look at how we are doing icons in core and let's see if we can come up with some shared understanding of how icons should work.
I'm also hoping to converge on Flow with this and I tried to make a start to a mediawiki ui icon library in a patch for core to put the watchlist settings on the watchlist page which was apparently controversial [2] although to me seems like a no brainer.
[1] https://git.wikimedia.org/blob/mediawiki%2Fextensions%2FMobileFrontend.git/6... [2] https://gerrit.wikimedia.org/r/#/c/139872/
On Wed, Jun 25, 2014 at 6:27 PM, Steven Walling swalling@wikimedia.org wrote:
Hi all,
This is a heads up about some of the things the Growth team is thinking about and working on with mediawiki.ui.
We're in the process of adding optional icon support for mediawiki.ui buttons, with browser support down to IE8.[A] We're going to get rid of the text shadow on the default mediawiki.ui buttons.[B] It's distracting and doesn't increase readability. We don't use gradients in the colored buttons for similar reasons. We need to do some tweaking of the design of the default mediawiki.ui button.[D] We're designing the second iteration of the anonymous editor signup invitation UI to A/B test.[E] When looking at these, you can see that the default mediawiki.ui button ("continue editing") almost seems disabled. We should talk about ways to improve on this design, such as darkening the text color or giving the default button a background color.
This may come up in the WMF UX team's weekly design review as well, but I wanted to give a heads up about these issues since the library is in MediaWiki core.
A. https://bugzilla.wikimedia.org/show_bug.cgi?id=55535 B. https://bugzilla.wikimedia.org/show_bug.cgi?id=61940 C. These are viewable at https://en.wikipedia.org/wiki/Crocodilia?gettingStartedReturn=true if you're logged in D. See style guide: http://tools.wmflabs.org/styleguide/desktop/section-2.html E. https://www.mediawiki.org/wiki/Anonymous_editor_acquisition/Signup_invites_v...
-- Steven Walling, Product Manager https://wikimediafoundation.org/
Design mailing list Design@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/design
Correction: * please look at how we are doing icons in /MobileFrontend/
Also see discussion on external link icons which may also be relevant and good to standardise on: https://gerrit.wikimedia.org/r/141973
On Thu, Jun 26, 2014 at 10:28 AM, Jon Robson jdlrobson@gmail.com wrote:
In terms of icons please please please collaborate on that before coding something up.
In mobile we have done a lot of this with icon classes and icons.less [1] to try to standardise on sizes and icons - it would be great to upstream that to core as a mw-ui-icon
At the very least please look at how we are doing icons in core and let's see if we can come up with some shared understanding of how icons should work.
I'm also hoping to converge on Flow with this and I tried to make a start to a mediawiki ui icon library in a patch for core to put the watchlist settings on the watchlist page which was apparently controversial [2] although to me seems like a no brainer.
[1] https://git.wikimedia.org/blob/mediawiki%2Fextensions%2FMobileFrontend.git/6... [2] https://gerrit.wikimedia.org/r/#/c/139872/
On Wed, Jun 25, 2014 at 6:27 PM, Steven Walling swalling@wikimedia.org wrote:
Hi all,
This is a heads up about some of the things the Growth team is thinking about and working on with mediawiki.ui.
We're in the process of adding optional icon support for mediawiki.ui buttons, with browser support down to IE8.[A] We're going to get rid of the text shadow on the default mediawiki.ui buttons.[B] It's distracting and doesn't increase readability. We don't use gradients in the colored buttons for similar reasons. We need to do some tweaking of the design of the default mediawiki.ui button.[D] We're designing the second iteration of the anonymous editor signup invitation UI to A/B test.[E] When looking at these, you can see that the default mediawiki.ui button ("continue editing") almost seems disabled. We should talk about ways to improve on this design, such as darkening the text color or giving the default button a background color.
This may come up in the WMF UX team's weekly design review as well, but I wanted to give a heads up about these issues since the library is in MediaWiki core.
A. https://bugzilla.wikimedia.org/show_bug.cgi?id=55535 B. https://bugzilla.wikimedia.org/show_bug.cgi?id=61940 C. These are viewable at https://en.wikipedia.org/wiki/Crocodilia?gettingStartedReturn=true if you're logged in D. See style guide: http://tools.wmflabs.org/styleguide/desktop/section-2.html E. https://www.mediawiki.org/wiki/Anonymous_editor_acquisition/Signup_invites_v...
-- Steven Walling, Product Manager https://wikimediafoundation.org/
Design mailing list Design@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/design
-- Jon Robson
On Wed, Jun 25, 2014 at 6:27 PM, Steven Walling swalling@wikimedia.org wrote:
Hi all,
This is a heads up about some of the things the Growth team is thinking about and working on with mediawiki.ui.
Thanks for the heads up, which reminds me to do a heads up for Shahyar Ghobadpour's work on mediawiki.ui for Flow. It's all in the Flow extension currently but there are patches to move it into core.
- We're in the process of adding optional icon support for
mediawiki.ui buttons, with browser support down to IE8.[A]
Flow frontend-rewrite[1] uses CSS to add Wikifont icons [2] including
class="wikiglyph-pencil". I'm not sure how far back its support goes.
As for your points below (arggh, renumbered), Shahyar Ghobadpour's revamped mw-ui-button addresses them, and has a lot of other ideas for both less and more obvious buttons. You can see the CSS for a default button in an old static prototype[3], see the X button. There's a patch to move this CSS to core[4].
- We're going to get rid of the text shadow on the default
mediawiki.ui buttons.[B] It's distracting and doesn't increase readability. We don't use gradients in the colored buttons for similar reasons. 2. We need to do some tweaking of the design of the default mediawiki.ui button.[D] We're designing the second iteration of the anonymous editor signup invitation UI to A/B test.[E] When looking at these, you can see that the default mediawiki.ui button ("continue editing") almost seems disabled. We should talk about ways to improve on this design, such as darkening the text color or giving the default button a background color.
This may come up in the WMF UX team's weekly design review as well, but I wanted to give a heads up about these issues since the library is in MediaWiki core.
[1] E.g. at http://en.wikipedia.beta.wmflabs.org/wiki/Talk:Flow , click the ... ellipsis target. [2] https://www.mediawiki.org/wiki/Design/Wikifont [3] http://area51.yar.gs/wmf/flow1/ again probably old. [4] https://gerrit.wikimedia.org/r/#/c/123804/
A. https://bugzilla.wikimedia.org/show_bug.cgi?id=55535 B. https://bugzilla.wikimedia.org/show_bug.cgi?id=61940 C. These are viewable at https://en.wikipedia.org/wiki/Crocodilia?gettingStartedReturn=true if you're logged in D. See style guide: http://tools.wmflabs.org/styleguide/desktop/section-2.html E. https://www.mediawiki.org/wiki/Anonymous_editor_acquisition/Signup_invites_v...
Cheers,
Yes, please take a look at [4] https://gerrit.wikimedia.org/r/#/c/123804/ linked by S. Make sure you rebuild the style guide with that patch, and you'll see a) the styles have been improved quite a bit, and b) the documentation is better. It's awaiting further review (and has been for a very long time), so if your team is interested, it would be really nice to have someone take a look at it.
--Shahyar
On Thu, Jun 26, 2014 at 11:59 PM, S Page spage@wikimedia.org wrote:
On Wed, Jun 25, 2014 at 6:27 PM, Steven Walling swalling@wikimedia.org wrote:
Hi all,
This is a heads up about some of the things the Growth team is thinking about and working on with mediawiki.ui.
Thanks for the heads up, which reminds me to do a heads up for Shahyar Ghobadpour's work on mediawiki.ui for Flow. It's all in the Flow extension currently but there are patches to move it into core.
- We're in the process of adding optional icon support for
mediawiki.ui buttons, with browser support down to IE8.[A]
Flow frontend-rewrite[1] uses CSS to add Wikifont icons [2] including
class="wikiglyph-pencil". I'm not sure how far back its support goes.
As for your points below (arggh, renumbered), Shahyar Ghobadpour's revamped mw-ui-button addresses them, and has a lot of other ideas for both less and more obvious buttons. You can see the CSS for a default button in an old static prototype[3], see the X button. There's a patch to move this CSS to core[4].
- We're going to get rid of the text shadow on the default
mediawiki.ui buttons.[B] It's distracting and doesn't increase readability. We don't use gradients in the colored buttons for similar reasons. 2. We need to do some tweaking of the design of the default mediawiki.ui button.[D] We're designing the second iteration of the anonymous editor signup invitation UI to A/B test.[E] When looking at these, you can see that the default mediawiki.ui button ("continue editing") almost seems disabled. We should talk about ways to improve on this design, such as darkening the text color or giving the default button a background color.
This may come up in the WMF UX team's weekly design review as well, but I wanted to give a heads up about these issues since the library is in MediaWiki core.
[1] E.g. at http://en.wikipedia.beta.wmflabs.org/wiki/Talk:Flow , click the ... ellipsis target. [2] https://www.mediawiki.org/wiki/Design/Wikifont [3] http://area51.yar.gs/wmf/flow1/ again probably old. [4] https://gerrit.wikimedia.org/r/#/c/123804/
A. https://bugzilla.wikimedia.org/show_bug.cgi?id=55535 B. https://bugzilla.wikimedia.org/show_bug.cgi?id=61940 C. These are viewable at https://en.wikipedia.org/wiki/Crocodilia?gettingStartedReturn=true if you're logged in D. See style guide: http://tools.wmflabs.org/styleguide/desktop/section-2.html E. https://www.mediawiki.org/wiki/Anonymous_editor_acquisition/Signup_invites_v...
Cheers,
=S Page Features engineer
Also, as far as WikiFont-Glyphs goes, the support goes back to IE8, but I have a patch (if needed) that can extend this to IE6 with HTC behaviors.
--Shahyar
On Fri, Jun 27, 2014 at 3:51 AM, Shahyar Ghobadpour < sghobadpour@wikimedia.org> wrote:
Yes, please take a look at [4] https://gerrit.wikimedia.org/r/#/c/123804/ linked by S. Make sure you rebuild the style guide with that patch, and you'll see a) the styles have been improved quite a bit, and b) the documentation is better. It's awaiting further review (and has been for a very long time), so if your team is interested, it would be really nice to have someone take a look at it.
--Shahyar
On Thu, Jun 26, 2014 at 11:59 PM, S Page spage@wikimedia.org wrote:
On Wed, Jun 25, 2014 at 6:27 PM, Steven Walling swalling@wikimedia.org wrote:
Hi all,
This is a heads up about some of the things the Growth team is thinking about and working on with mediawiki.ui.
Thanks for the heads up, which reminds me to do a heads up for Shahyar Ghobadpour's work on mediawiki.ui for Flow. It's all in the Flow extension currently but there are patches to move it into core.
- We're in the process of adding optional icon support for
mediawiki.ui buttons, with browser support down to IE8.[A]
Flow frontend-rewrite[1] uses CSS to add Wikifont icons [2] including
class="wikiglyph-pencil". I'm not sure how far back its support goes.
As for your points below (arggh, renumbered), Shahyar Ghobadpour's revamped mw-ui-button addresses them, and has a lot of other ideas for both less and more obvious buttons. You can see the CSS for a default button in an old static prototype[3], see the X button. There's a patch to move this CSS to core[4].
- We're going to get rid of the text shadow on the default
mediawiki.ui buttons.[B] It's distracting and doesn't increase readability. We don't use gradients in the colored buttons for similar reasons. 2. We need to do some tweaking of the design of the default mediawiki.ui button.[D] We're designing the second iteration of the anonymous editor signup invitation UI to A/B test.[E] When looking at these, you can see that the default mediawiki.ui button ("continue editing") almost seems disabled. We should talk about ways to improve on this design, such as darkening the text color or giving the default button a background color.
This may come up in the WMF UX team's weekly design review as well, but I wanted to give a heads up about these issues since the library is in MediaWiki core.
[1] E.g. at http://en.wikipedia.beta.wmflabs.org/wiki/Talk:Flow , click the ... ellipsis target. [2] https://www.mediawiki.org/wiki/Design/Wikifont [3] http://area51.yar.gs/wmf/flow1/ again probably old. [4] https://gerrit.wikimedia.org/r/#/c/123804/
A. https://bugzilla.wikimedia.org/show_bug.cgi?id=55535 B. https://bugzilla.wikimedia.org/show_bug.cgi?id=61940 C. These are viewable at https://en.wikipedia.org/wiki/Crocodilia?gettingStartedReturn=true if you're logged in D. See style guide: http://tools.wmflabs.org/styleguide/desktop/section-2.html E. https://www.mediawiki.org/wiki/Anonymous_editor_acquisition/Signup_invites_v...
Cheers,
=S Page Features engineer
On Fri, Jun 27, 2014 at 12:53 AM, Shahyar Ghobadpour < sghobadpour@wikimedia.org> wrote:
Also, as far as WikiFont-Glyphs goes, the support goes back to IE8, but I have a patch (if needed) that can extend this to IE6 with HTC behaviors.
IE8 support works fine for us. Sam's SVG patch doesn't actually have 6 or 7 support, it just falls back to no icon with normal button appearance.
If this is the case, the only blocker for us to convert to it would be creating a WikiFont icon for suggestions (we're currently using a lightbulb in GettingStarted), which is an easy design task on our end. I'll make sure Sam, Matt, and Rob take a look at your patch and we come to a decision about it all.
Just get May the icon and we can get it cleaned up and integrated into the font.
*Jared Zimmerman * \ Director of User Experience \ Wikimedia Foundation
M +1 415 609 4043 \ @jaredzimmerman http://loo.ms/g0
On Mon, Jun 30, 2014 at 3:39 PM, Steven Walling swalling@wikimedia.org wrote:
On Fri, Jun 27, 2014 at 12:53 AM, Shahyar Ghobadpour < sghobadpour@wikimedia.org> wrote:
Also, as far as WikiFont-Glyphs goes, the support goes back to IE8, but I have a patch (if needed) that can extend this to IE6 with HTC behaviors.
IE8 support works fine for us. Sam's SVG patch doesn't actually have 6 or 7 support, it just falls back to no icon with normal button appearance.
If this is the case, the only blocker for us to convert to it would be creating a WikiFont icon for suggestions (we're currently using a lightbulb in GettingStarted), which is an easy design task on our end. I'll make sure Sam, Matt, and Rob take a look at your patch and we come to a decision about it all.
-- Steven Walling, Product Manager https://wikimediafoundation.org/
Design mailing list Design@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/design