Hello!
As the final part of the implementation of Campaigns (see: https://www.mediawiki.org/wiki/User:Yuvipanda/Campaigns_namespace_proposal), I've drawn a small wireframe that seems to meet general approval of the few people I've shown it to so far:
https://www.mediawiki.org/wiki/File:Campaign_page_wireframe.png
The idea is that if you go to a page like http://commons.wikimedia.org/wiki/Campaign:Wikimania2013, you will see the page as in the mockup, rather than what you see now (which is quite useless for anyone who isn't an organizer)
Thoughts?
Hi Yuvi,
Thanks for taking the lead on this, at the moment my team is very busy with Flow, VE, and Mobile, it might be good to have a short meeting with a few of them during the tech days proceeding the all hands for a concentrated burst of design thinking about campaigns.
* * * * *Jared Zimmerman * \ Director of User Experience \ Wikimedia Foundation M : +1 415 609 4043 | : @JaredZimmermanhttps://twitter.com/JaredZimmerman
On Tue, Aug 27, 2013 at 12:10 PM, Yuvi Panda yuvipanda@gmail.com wrote:
Hello!
As the final part of the implementation of Campaigns (see: https://www.mediawiki.org/wiki/User:Yuvipanda/Campaigns_namespace_proposal ), I've drawn a small wireframe that seems to meet general approval of the few people I've shown it to so far:
https://www.mediawiki.org/wiki/File:Campaign_page_wireframe.png
The idea is that if you go to a page like http://commons.wikimedia.org/wiki/Campaign:Wikimania2013, you will see the page as in the mockup, rather than what you see now (which is quite useless for anyone who isn't an organizer)
Thoughts?
-- Yuvi Panda T http://yuvi.in/blog
Design mailing list Design@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/design
On Wed, Aug 28, 2013 at 2:23 AM, Jared Zimmerman < jared.zimmerman@wikimedia.org> wrote:
Hi Yuvi,
Thanks for taking the lead on this, at the moment my team is very busy with Flow, VE, and Mobile, it might be good to have a short meeting with a few of them during the tech days proceeding the all hands for a concentrated burst of design thinking about campaigns.
Hmm, I was hoping to get this done to a point where I can show it off during the Tech Days, actually. Most of the backend work required for this is done, and just this part remains. I have other work on my plate as well, so I could try delaying this - but will still work on getting some of this merged.
Will keep the list updated as things go along!
I think this looks like a great idea AS LONG AS you use comic sans EVERYWHERE.
I also discovered that, even as +staff, I do not have the ability to edit in the Campaign namespace.
On Aug 27, 2013, at 12:10 PM, Yuvi Panda yuvipanda@gmail.com wrote:
Hello!
As the final part of the implementation of Campaigns (see: https://www.mediawiki.org/wiki/User:Yuvipanda/Campaigns_namespace_proposal), I've drawn a small wireframe that seems to meet general approval of the few people I've shown it to so far:
https://www.mediawiki.org/wiki/File:Campaign_page_wireframe.png
The idea is that if you go to a page like http://commons.wikimedia.org/wiki/Campaign:Wikimania2013, you will see the page as in the mockup, rather than what you see now (which is quite useless for anyone who isn't an organizer)
Thoughts?
-- Yuvi Panda T http://yuvi.in/blog
Design mailing list Design@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/design
--- Brandon Harris, Senior Designer, Wikimedia Foundation
Support Free Knowledge: http://wikimediafoundation.org/wiki/Donate
On Wed, Aug 28, 2013 at 3:23 AM, Brandon Harris bharris@wikimedia.org wrote:
I think this looks like a great idea AS LONG AS you use comic sans EVERYWHERE.
Sure, I hear it is great for dyslexic people :)
I also discovered that, even as +staff, I do not have the ability to edit in the Campaign namespace.
Hmm, it is a separate right, I will check if it isn't bundled into staff.
responding again...
On Wed, Aug 28, 2013 at 3:23 AM, Brandon Harris bharris@wikimedia.org wrote:
I think this looks like a great idea AS LONG AS you use comic sans EVERYWHERE.
I just used Pencil[1], and it suggested using this (+ puke green!) for mockups to help people not get stuck up over small details, because wireframe.
I also discovered that, even as +staff, I do not have the ability to edit in the Campaign namespace.
Me and Jamesofur spent some time looking at this, and apparently it is not possible to easily add this right to the staff group. However, he's added the right to your user account on both commons and testwiki, so everything should be okay for now :)
There's now a patchset implementing this: https://gerrit.wikimedia.org/r/#/c/81453/
Needs a lot of improvement before it can be merged. Will put it up on some labs instance at some point, though :) Still hoping to get this merged in a week or so.
Added a couple brief notes on gerrit.
-- brion
On Tue, Aug 27, 2013 at 8:03 PM, Yuvi Panda yuvipanda@gmail.com wrote:
There's now a patchset implementing this: https://gerrit.wikimedia.org/r/#/c/81453/
Needs a lot of improvement before it can be merged. Will put it up on some labs instance at some point, though :) Still hoping to get this merged in a week or so.
-- Yuvi Panda T http://yuvi.in/blog
Design mailing list Design@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/design
On Wed, Aug 28, 2013 at 8:42 AM, Brion Vibber bvibber@wikimedia.org wrote:
Added a couple brief notes on gerrit.
To separate out the design comments with the implementation issues.... here's the design notes :)
- portrait-mode images appear really small and their titles get squished in the gallery - there's no link back to the campaign page when you're done uploading - when there are no images, something should be shown like 'no media uploaded for this campaign yet! will you be the first?' call to action :D
Portrait issue is with the separately-implemented gallery code, so that needs some thinking but shouldn't block this patch so far.
Link back.... would be easier after a major overhaul of UploadWizard's UI. :)
Showing something clearer when there's no images is actionable.
-- brion
-- brion
On Tue, Aug 27, 2013 at 8:03 PM, Yuvi Panda yuvipanda@gmail.com wrote:
There's now a patchset implementing this: https://gerrit.wikimedia.org/r/#/c/81453/
Needs a lot of improvement before it can be merged. Will put it up on some labs instance at some point, though :) Still hoping to get this merged in a week or so.
-- Yuvi Panda T http://yuvi.in/blog
Design mailing list Design@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/design
The current state of the patch can be seen at:
http://blue-dragon.wmflabs.org/wiki/Campaign:show-off-campaigns
I'll keep that labs instance up to date with the patch as it moves forward.
On Wed, Aug 28, 2013 at 9:36 PM, Yuvi Panda yuvipanda@gmail.com wrote:
The current state of the patch can be seen at:
http://blue-dragon.wmflabs.org/wiki/Campaign:show-off-campaigns
I'll keep that labs instance up to date with the patch as it moves forward
I'd suggest putting some more space around the Upload call to action and try to emphasize it some more, but otherwise this is great stuff.
Honestly all Commons Category pages should look this way.
On Thu, Aug 29, 2013 at 11:12 AM, Steven Walling swalling@wikimedia.org wrote:
I'd suggest putting some more space around the Upload call to action and try to emphasize it some more, but otherwise this is great stuff.
Yeah, I definitely want to emphasize it a lot more. Will play around with it some more :)
Honestly all Commons Category pages should look this way.
If bawolff has his way, this might be reality soon :)
Hey Yuvi,
As the final part of the implementation of Campaigns (see: https://www.mediawiki.org/wiki/User:Yuvipanda/Campaigns_namespace_proposal), I've drawn a small wireframe that seems to meet general approval of the few people I've shown it to so far: https://www.mediawiki.org/wiki/File:Campaign_page_wireframe.png
I used your wireframe and https://www.mediawiki.org/wiki/User:Yuvipanda/Campaigns_namespace_proposal as a starting point. The images on top aren't solving any purpose as there *will* be more images on bottom. It was also looking pretty messy as you had warned me on IRC. Can the thumbnails at the bottom be sorted on the basis of popularity/votes?
You mention in the proposal that the page is meant to give an overview of the campaign. I thought mentioning some important stats might help. Check out the mock up that I've made - http://f.cl.ly/items/1U240I3O2O0J3J3u431P/campaigns.png - please ignore the typefaces and their anti-aliasing (or lack of it). What do you think?
Regards, Prateek Saxena http://prtksxna.com
On Fri, Aug 30, 2013 at 8:34 AM, Prateek Saxena prtksxna@gmail.com wrote:
I used your wireframe and https://www.mediawiki.org/wiki/User:Yuvipanda/Campaigns_namespace_proposal as a starting point. The images on top aren't solving any purpose as there *will* be more images on bottom. It was also looking pretty messy as you had warned me on IRC. Can the thumbnails at the bottom be sorted on the basis of popularity/votes?
I like the idea of a rating-based or views-based display, but we'd have to devise something... currently no voting system in place. :)
You mention in the proposal that the page is meant to give an overview of the campaign. I thought mentioning some important stats might help. Check out the mock up that I've made - http://f.cl.ly/items/1U240I3O2O0J3J3u431P/campaigns.png - please ignore the typefaces and their anti-aliasing (or lack of it). What do you think?
I like the giant numbers. :)
Oh while we're thinking of it -- we should also make sure we have a good display on mobile web. We should probably think about alternate sizing/positioning for small-screen display...
-- brion
On Fri, Aug 30, 2013 at 9:12 PM, Brion Vibber bvibber@wikimedia.org wrote:
I like the idea of a rating-based or views-based display, but we'd have to devise something... currently no voting system in place. :)
Hm. I think Yuvi is planning to do it. He did mention something while we were discussing the Android application.
I like the giant numbers. :)
Yay! Me too :)
Oh while we're thinking of it -- we should also make sure we have a good display on mobile web. We should probably think about alternate sizing/positioning for small-screen display...
If we go ahead with this, I could mock-up some HTML/CSS that'll be responsive. Is the gallery part already responsive?
Regards, Prateek Saxena http://prtksxna.com
After the discussion on #wikimedia-dev it seems that putting the call to action along with the gallery might be a little tricky. We could do something like this - http://f.cl.ly/items/0B2l2I2K1L0W161k1V3Q/campaigns-2.png - but I'd like to think about it a bit more :)
Regards, Prateek
On 13-08-30 08:49 AM, Prateek Saxena wrote:
On Fri, Aug 30, 2013 at 9:12 PM, Brion Vibber bvibber@wikimedia.org wrote:
I like the idea of a rating-based or views-based display, but we'd have to devise something... currently no voting system in place. :)
Hm. I think Yuvi is planning to do it. He did mention something while we were discussing the Android application.
The Multimedia team has been brainstorming a feature like this, see https://www.mediawiki.org/wiki/Multimedia/Feature_ideas#File_feedback https://www.mediawiki.org/wiki/Multimedia/File_feedback https://meta.wikimedia.org/wiki/Roundtables/Roundtable_2#File_feedback and contact them with any ideas. (also the new-but-quiet https://lists.wikimedia.org/mailman/listinfo/multimedia
Thanks for the mockups, Pratheek! They are far better than what I came up with :D
And they're now implemented! http://blue-dragon.wmflabs.org/wiki/Campaign:show-off-campaigns is the latest revision of the patch, and implements the second mockup.
It is missing the 'Contributors' number because I've not found a way to extract that in a performant way (Yet!). I'm currently trying to implement proper squid cache handling, and will look at extracting Contributiors numbers after that.
Thank you!
Just a note -- we've had some friction with some of the folks maintaining the WLM campaigns about this planned UI change; it's taken a while to figure out exactly what they want, but I think we're figuring it out. :)
It sounds like we may need to devise a Special: page with an administrator-oriented interface to make sure campaign administrators are happy and productive as well as the user-contributors we're aiming for with this UI on the actual Campaign: pages.
I'll send some mockups and ask for comments once I have a better idea of the requirements -- we can probably get away with something relatively simple that uses the JSON-table-structure pretty printer and lets you quickly switch and compare items.
-- brion
On Fri, Aug 30, 2013 at 2:51 PM, Yuvi Panda yuvipanda@gmail.com wrote:
Thanks for the mockups, Pratheek! They are far better than what I came up with :D
And they're now implemented! http://blue-dragon.wmflabs.org/wiki/Campaign:show-off-campaigns is the latest revision of the patch, and implements the second mockup.
It is missing the 'Contributors' number because I've not found a way to extract that in a performant way (Yet!). I'm currently trying to implement proper squid cache handling, and will look at extracting Contributiors numbers after that.
Thank you!
-- Yuvi Panda T http://yuvi.in/blog
Design mailing list Design@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/design
Update: I think the caching issues have been resolved, and I also managed to implement the 'Contributors' count. This patch is pretty much ready for final CR / testing / merging, I'd like to think!
Thanks to everyone who helped out! \o/
(http://blue-dragon.wmflabs.org/wiki/Campaign:show-off-campaigns is the link)
On Sat, Aug 31, 2013 at 3:21 AM, Yuvi Panda yuvipanda@gmail.com wrote:
Thanks for the mockups, Pratheek! They are far better than what I came up with :D
You're welcome :)
And they're now implemented! http://blue-dragon.wmflabs.org/wiki/Campaign:show-off-campaigns is the latest revision of the patch, and implements the second mockup.
Looks great! :D There are a couple of things that did catch my eye. Can you please make the `letter-spacing` of `mw-campaign-number-desc` around 1px? Also, do you think it'll be possible to make the the "View all Images" link like I have made in the mockup?
Regards, Prateek Saxena http://prtksxna.com
On Sat, Aug 31, 2013 at 11:19 AM, Prateek Saxena prtksxna@gmail.com wrote:
Looks great! :D There are a couple of things that did catch my eye. Can you please make the `letter-spacing` of `mw-campaign-number-desc` around 1px? Also, do you think it'll be possible to make the the "View all Images" link like I have made in the mockup?
Will change letter-spacing. And for 'view all images' - can you send me the icons you used for the chevrons that point downwards? Thanks!
On Sat, Aug 31, 2013 at 6:05 PM, Yuvi Panda yuvipanda@gmail.com wrote:
Will change letter-spacing. And for 'view all images' - can you send me the icons you used for the chevrons that point downwards? Thanks!
Cool. You can get the icon from here - http://f.cl.ly/items/0C2l0X0n0T201s1c0W3G/arrow.png I think you'll be able to get the needed colors using the 'Digital Color Meter', if they still ship it with Mountain Lion.
Regards, Prateek Saxena http://prtksxna.com
On Sat, Aug 31, 2013 at 6:12 PM, Prateek Saxena prtksxna@gmail.com wrote:
Cool. You can get the icon from here - http://f.cl.ly/items/0C2l0X0n0T201s1c0W3G/arrow.png I think you'll be able to get the needed colors using the 'Digital Color Meter', if they still ship it with Mountain Lion.
Thank you! I've updated both the spacing and the view all link, and deployed to http://blue-dragon.wmflabs.org/wiki/Campaign:show-off-campaigns.
I've also added a slightly more straightforward workflow for logged out users - directly taking them to create account rather than having them click on upload and then have it say 'you need to log in!'. I would want to put a log in link there too, perhaps - thoughts on where to put that welcome! :)
This was deployed!
https://commons.wikimedia.org/wiki/Campaign:wlm-in \o/ :) (No 'title' and 'description' added yet for the campaign, but I guess someone will, at some point)
On Mon, Sep 9, 2013 at 2:09 PM, Yuvi Panda yuvipanda@gmail.com wrote:
https://commons.wikimedia.org/wiki/Campaign:wlm-in \o/ :) (No 'title' and 'description' added yet for the campaign, but I guess someone will, at some point)
Nice work Yuvi and all. :)
Very cool!
Does the campaign format support human-readable names for the campaigns? That'd be nicer than something like "wlm-in".
On Mon, Sep 9, 2013 at 2:15 PM, Erik Moeller erik@wikimedia.org wrote:
Very cool!
Does the campaign format support human-readable names for the campaigns? That'd be nicer than something like "wlm-in".
It does! You can add a localizable title and description ("title" and "description" fields in the JSON). I'm afraid to touch it myself, mostly because I don't trust myself to come up with good enough descriptions :) I'm adding titles now, though.
Got a build i can play with ?
On Mon, Sep 9, 2013 at 2:20 PM, Yuvi Panda yuvipanda@gmail.com wrote:
On Mon, Sep 9, 2013 at 2:15 PM, Erik Moeller erik@wikimedia.org wrote:
Very cool!
Does the campaign format support human-readable names for the campaigns? That'd be nicer than something like "wlm-in".
It does! You can add a localizable title and description ("title" and "description" fields in the JSON). I'm afraid to touch it myself, mostly because I don't trust myself to come up with good enough descriptions :) I'm adding titles now, though.
-- Yuvi Panda T http://yuvi.in/blog
Design mailing list Design@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/design
2013/9/9 Yuvi Panda yuvipanda@gmail.com
It does! You can add a localizable title and description ("title" and "description" fields in the JSON). I'm afraid to touch it myself, mostly because I don't trust myself to come up with good enough descriptions :) I'm adding titles now, though.
Where can I add the title and description (or suggest the change if I don't have the rights)?
On Mon, Sep 9, 2013 at 2:24 PM, Jan Ainali jan.ainali@wikimedia.se wrote:
Where can I add the title and description (or suggest the change if I don't have the rights)?
https://commons.wikimedia.org/w/index.php?title=Campaign%3Awlm-in&diff=1... was me adding the title to the India campaign.
Right now you need to be an admin on commons to edit that page. Don't touch the other properties, though :)
Cool, awesome to see that we can already do proper titles.
If it's not too tricky it might be nice to inject that into the <title> tag as well so the browser tab shows something more friendly than the campaign ID.
On Mon, Sep 9, 2013 at 2:46 PM, Erik Moeller erik@wikimedia.org wrote:
If it's not too tricky it might be nice to inject that into the
<title> tag as well so the browser tab shows something more friendly than the campaign ID.
Done! https://gerrit.wikimedia.org/r/#/c/83568/
Awesome Yuvi! Thanks a lot.
It does! You can add a localizable title and description ("title" and
"description" fields in the JSON).
Just to make sure : you mean by that since wikitext is parsed, we can use every bit of template magic we want, right? (Like, no special system I may have missed)
(All folks : don’t forget to get the messages translated on TranslateWiki! [1])
Where can I add the title and description (or suggest the change if I don't
have the rights)?
I put a title for Sweden using some template magic [2]. Feel free to ask for edits on the talk page (you can use {{edit request}} to draw sysop attention)
[1] < https://translatewiki.net/w/i.php?title=Special:Translate&group=ext-uplo...
[2] < https://commons.wikimedia.org/w/index.php?title=Campaign%3Awlm-se-bbr&di...
On Mon, Sep 9, 2013 at 3:44 PM, Jean-Frédéric jeanfrederic.wiki@gmail.com wrote:
Just to make sure : you mean by that since wikitext is parsed, we can use every bit of template magic we want, right? (Like, no special system I may have missed)
Indeed! It is just plain Wikitext. Nothing more.
Thanks for setting up i18n! That is awesome! :) Should probably also set one up for description.