[03:36:18] Heh. [03:36:24] "Getting Invovled" on the Usability Main Page. [03:37:49] thedj: ^ [07:49:58] hello all [14:18:30] Danny_B ? [14:18:55] or someone else :) [16:47:10] morning nkomura [16:48:20] good morning werdna [16:49:28] good night from france [16:49:37] nkomura: sending a guy who wants to talk about upload UIs in here [16:49:43] pm27: it's only 7pm :) [16:49:44] bon soir pm27 [16:50:36] yes werdna [16:50:47] morning [16:50:54] :)) [16:51:43] does it possible to me to explain my big problem that be solve by usability [16:51:45] ? [16:52:23] or where could i explain the problem [16:52:34] pm27: sure [16:52:39] You can try French if you like [16:52:54] I understand it a little, may or may not be enough :D [16:52:55] hey brion [16:53:09] Has the improved UI for Uploads ever gone anywhere? http://lists.wikimedia.org/pipermail/commons-l/2008-May/003862.html (hehe- old post coming back to haunt you brion) [16:53:17] je maintiens les moteurs de recherche externes [16:53:45] sur les diff?rents projets de la fondation [16:54:01] pm27: improvement of image uploads is in the pipeline [16:54:07] we don't have the timeline yet [16:54:34] nkomura: not him [16:54:35] jdpond [16:54:38] but it is in the high-priority, and will be addressed in multi-media usability project [16:55:24] He maintains the external search engines for different projects of the Foundatin. [16:55:30] Foundation* [16:55:44] pm27: et...? [16:56:50] voit un peu ce qui se passe ? chaque modification de mediawiki : http://toolserver.org/~luxo/contributions/contributions.php?user=Pmartin&lang=fr [16:58:18] l'id?e werdna c'est de mettre des liens sur les pages de recherche directement dans le mediawiki [16:58:34] See a little what happens with each change to MediaWiki.. [16:59:02] http://fr.wikipedia.org/w/index.php?title=Sp%C3%A9cial%3ARecherche&search=v%C3%A9lo&fulltext=Rechercher [16:59:16] au dessus des projets fr?res [16:59:46] He wants to put links on the search pages of MediaWiki to sister projects.. [17:00:01] et ces moteurs de recherches pour ne pas ?tre en contradiction avec les principes fondateurs seront ceux en opensource [17:00:57] And the search engines to not be a contradiction of our founding principles, which are open-source? [17:01:10] Global WP [17:01:16] mon francais ne suis pas tres bien :) [17:01:17] Wikiwix [17:01:59] Okay I think I get it [17:02:25] so in short, search function for history pages? [17:02:30] no [17:02:34] nothing of the sort :) [17:02:42] " He wants to put links on the search pages of MediaWiki to sister projects.." not really to sister project but like [17:02:45] He wants to put links to WikiWix on our search pages [17:02:54] directly in MediaWiki [17:03:33] The problem being he currently does so in site JS [17:03:39] not only Wikiwix but opensource search engine [17:03:46] and so a single change in MediaWiki means he has to update all across sites [17:03:52] that's what the link was for, showing all the times he updates [17:04:30] pm27: vraiment? [17:05:15] the current usability focus is how a user can get to an article s/he is looking for, [17:05:26] how a user can edit easily [17:05:50] we worked on search result page because most users couldn't get to the articles they are looking for [17:06:04] oui werdna et ?? sur les wikitionary, ... [17:06:18] cross-project support is something we want to look into in the future [17:06:29] oui, tout les projets de la fondation. [17:06:36] but we have high priority features we need to implement [17:07:42] oui mais je travaille sur wikiwix et okawix [17:07:43] i think the proposal makes sense, but i think it is more for general MediaWiki enhancements than usability focus, as far as the current project objective is concerned [17:07:57] et un simple lien me rendrait beaucoup de service [17:08:14] pm27: je pense tu devres poster au wikitech-l [17:08:36] ok werdna [17:08:40] ou peut-etre foundation-l [17:08:41] :) [17:09:41] http://www.okawix.com/ werdna [17:10:03] ok i will post to wikitech-l and fondation-l [17:10:45] pm27: c'est un point de mise general, pas de le projet usability [17:11:08] ok werdna [17:11:18] :) [17:15:04] werdna: what happened to the icons on LQT? [17:15:49] they are chopped down.. was there a reason to reduce the size? [17:16:12] and also.. sizing the icons as 1.3em is strange.... :) [17:16:34] TrevorParscal: the size? [17:16:48] http://wiki.werdn.us/test/view/Talk:Main_Page?useskin=vector [17:17:02] so I see that you have changed the icons a bit [17:17:31] mouse over them [17:17:35] and the monochrome/color on hover thing - where did that come from? [17:18:31] Brion suggested it [17:18:37] What do you think? [17:18:40] yes? no? maybe? [17:18:43] well, we've had allot of meetings about that effect, and we have always seemed to land at the conclusion that them being grayed out makes them look disabled, so we have not been doing that on the toolbar and probably shouldn't do that here... [17:18:56] mostly right now I'm prototyping random stuff [17:19:09] what do you suggest I do about the menu? I'd like to put the same corners on it I think [17:19:09] if it looks disabled nobody will mouseover it to find it's not - is the logic ... [17:19:19] brion: pinging you, see above :) [17:19:41] ok, so the menu, yeah you need some graphics there I guess... [17:20:21] more pressingly it runs off the screen [17:20:22] if you want to make the menu with rounded corners - that could look nice but I will warn you it may take allot of divs and funky layout to get it to work reliably in all browsers [17:20:25] I've spent ages trying to fix that [17:20:26] I would recomend [17:20:43] getting it to be in the right place first, then we can take a look at the corners :) [17:20:51] I can help with that btw :) [17:20:52] yeah [17:21:01] wanna take a peek, mr. css ninja? [17:22:07] i'll read backscroll in a minute; multitasking :D [17:22:22] thx :) [17:22:33] we need to be using a UL here [17:22:42] I already am for the menu [17:22:44] just not for the icons [17:22:59] ok, so yeah, we're just going to take that to the next level I guess... [17:23:46] so you can use the left side as the background color for the outter div which contains the list of icons [17:24:05] then use the right side image as the background of the actual UL [17:24:39] then make each LI inside the UL (each of which is an icon) float left inside the UL [17:24:48] in fact, if you aren't dead set on that reply text being there [17:25:04] you can save yourself a ton of browser headaches by staticly laying the whole things out using pixels [17:25:05] that was also brion's suggestion, I think I agree with him [17:25:18] we need to make 'Reply' very prominent. [17:25:25] Also, statically laying out is awful [17:25:26] ok - so I'm not opposed to it, just saying, adding in text makes things get much more complex [17:26:07] static layout is not my ideal solution or anything, but where you can get away with it, it's very realiable and easy to do [17:26:43] ok - so the thing is, if we have text in this thing, when you scale the text up or down, it's not responding well cause it's got a fixed height [17:27:21] the reason it had a fixed height is because we aren't scaling the icons, so there's no need to scale the container they are in [17:27:38] however, when there's text in there, it must scale or it will break [17:29:11] at least we have a vauge idea of how large it may get before we can just say nothing else on the UI will work at that size so whatever.. [17:29:22] let me get you some images to to this trick - one sec [17:32:30] ok what am i looking into again? :D [17:33:17] brion: 17:17 < TrevorParscal> and the monochrome/color on hover thing - where did that come from? [17:33:20] 17:18 < TrevorParscal> well, we've had allot of meetings about that effect, and we have always seemed to land at the conclusion that them being grayed out makes them look disabled, so we have not been doing that on the toolbar and probably shouldn't do that here... [17:33:24] 17:19 < TrevorParscal> if it looks disabled nobody will mouseover it to find it's not - is the logic ... [17:33:29] Wondering what you think :) [17:33:30] ohai parutron [17:34:08] ok lemme whip up a quick mockup of what i was thinking :D [17:34:28] yeah when the monochrome goes this far it looks grayed out and gets a little confusing :( [17:34:46] well we can always tweak the numbers [17:35:13] and we gotta fix that dropdown so it doesn't trigger horiz scrolling ;) [17:35:20] yeah I know [17:35:24] make its right edge aligned with the box maybe? [17:35:28] is there a reason we are working on a mouseover effect before we have a layout handled properly? [17:35:42] well, it's developed in dribs and drabs :) [17:35:49] :D [17:35:50] that's been there a long time [17:36:04] *brion wishes gradients were standardized in css back in the 90s [17:36:17] *werdna isn't really sure how to align the right edge of the ul with the right edge of the box. [17:36:18] god there's like a 1000-post thread about gradients on the css list on w3c [17:36:38] There's a family fun event with karaoke in my nearby park [17:36:39] position: absolute; right: blah; ? [17:36:41] driving me crazy :) [17:36:49] or is that too scary :D [17:36:50] heh [17:37:10] brion: havent' done it before, guess that works [17:37:11] lemme try [17:37:13] werdna: set your line-height to 1em on that thing [17:37:17] the UL that is [17:37:36] it's set to 1.5 by default and it causes issues with layout [17:37:51] o-o position: absolute; right: 100%; is freaky [17:38:27] TrevorParscal: which ul :) [17:38:42] the bigger one? [17:39:01] the outter one yes [17:39:04] If I do that, the icons cut off the top border, guess I have to move them down or something [17:39:13] yes [17:39:53] vertical-align: bottom doesn't do anything [17:40:18] padding-top does scary things [17:41:13] never use either of those for this kind of thing [17:41:15] always use margins [17:41:34] padding has lots of problems between box models [17:41:54] and vertical-align is totally broken almost everywhere [17:42:40] margin-top on the ul moves the whole box down, on the items moves the sides down [17:43:27] http://usability.wikimedia.org/wiki/File:LQT_thread_tools_mouseover_mockup.png <- ok this is kinda crappy looking but i think maybe shows what i'm thinking :D [17:43:38] CSS is nice in theory, but it has so many annoying limitations [17:43:53] we could maybe keep the link & usable icon tools fully visible/saturated but have the background fade a bit when not mouseovered [17:44:06] so more brightening than desaturating [17:44:08] might be too crackolicious though ;) [17:44:13] mm maybe yeah :D [17:44:18] and brighten the edges too [17:44:29] whta i really want in css sometimes is "align this thing to THAT OTHER ELEMENT" [17:44:31] well Trevor's idea was to have it appear on mouseover [17:44:43] totally invisible when you don't mouseover the most [17:44:45] post* [17:44:55] my main problem with stuff that's totally invisible until i mouse over it is that i may never realize it's there :) [17:45:00] but I think at least the reply link has to be visible all the time [17:45:01] yeah :D [17:45:17] if we do try that then yes, the reply button at a minimum should stay visible [17:45:25] then the other tools pop up as well [17:45:29] what brion is talking aboout is doing a 50% transparency of the whole thing unless you mouse over it [17:45:33] which you can do in jquery [17:45:43] and it will always be visible as a fallback [17:45:48] yay jquery [17:46:02] well we want the reply link fully visible no matter what [17:46:45] I really think the way that wave does it provides plenty of visibility to the reply link.... [17:46:53] I have no idea how wave does it [17:46:59] tomas hasn't got back to me :) [17:47:01] actually he has [17:47:07] but his google cotnact hasn't got back to him [17:47:20] when you mouseover the actual post, the tools apear [17:47:23] *appear [17:47:50] then how do you know it's there :) [17:48:38] which give the user 2 kinds of feedback while reducing clutter... 1. that these tools are available (animation is more eye catching than just more stuff on the screen) 2. that you can only perform these task one at a time (since there's only one set of action buttons on the screen at any given time) [17:49:53] the design (mistake) that to make something visible it must always be on the screen is not really a very good one... [17:49:56] look at twitter [17:50:09] when you mouse over a tweet, what happens? [17:50:42] we need to be much more aggressive about reducing the clutter on this UI [17:54:12] hmm [17:54:53] brion: shall I at least mock something up to see how it works? [17:55:43] brion: might try getting a few things together so I can show a few mockups in BA [17:55:46] sure, give it a try [17:56:08] if the invisibility->mouseover works cleanly enough that may allay my fears :D [17:56:26] :) [17:58:39] werdna: also, the mouseover thing needs to be done with jquery, so the stuff is always visible without js, but then jquery says "make all the action boxes hidden. attach a mouseover function to each post which makes it's own action box show and hide accordingly." [17:59:01] then, people without jquery support just have tons of buttons [17:59:12] werdna: i sent some more images [17:59:23] TrevorParscal: why not .lqt_thread:hover .lqt-thread-toolbar { display: block; } [18:00:08] werdna: that's possible to [18:00:22] I use a .htc file for Vector to do such a thing [18:00:25] I like jQuery, but maybe we should stick to plain CSS if it does the job [18:00:29] htc? [18:00:40] to get IE to respect anything:hover [18:00:46] otherwise it won't actually work in IE [18:00:51] oh [18:00:56] ugh [18:00:58] which is another reason to do jQuery, it's more predictable [18:01:34] predictable failure is a good thing, it helps you to build good degredations when you are able to calculate who will have what support [18:01:34] hmm, it'd be short [18:01:45] it's like 3 lines of jquery code [18:02:18] $j('.lqt-thread').hover( function() { $j(this).find('.lqt-thread-toolbar').fadeIn(); } ); [18:02:21] or something like that [18:02:30] and the other one [18:02:44] plus the degradation setup [18:02:50] $j( '.action-box.class' ).hide(); $j( '.post-class' ).hover( function() { $j(this).find('.lqt-thread-toolbar').fadeIn(); }, function() { $j(this).find('.lqt-thread-toolbar').fadeOut(); } ); [18:03:04] thats it [18:03:10] <3 jQuery [18:03:11] they are visible when that code can't work [18:03:37] what about the menu, then? I want to make that a click-menu instead [18:05:52] yeah, you can do something cool with that too [18:06:05] so, those links can be outside the toolbox initially [18:06:09] I'd use slideDown() and slideUp() [18:06:14] as a list of links [18:06:18] ew, and then move them inside with DOM manipulation? [18:06:22] yes [18:06:23] that sounds insanely evil :P [18:06:29] it's quite awesome really [18:06:31] but i guess it works [18:06:43] yeah jQuery seriously rocks [18:06:45] because what happens is the user with a crappy browser gets all they need [18:07:18] and the dom manipulation tucks it all away in a cleaner UI for people who have decided that modern browsers aren't just hype :) [18:07:18] You'd think that I'd be accustomed with crappy hacks working with MediaWiki for like 4 years :P [18:07:25] he he he [18:07:28] seriously [18:07:30] amirite brion [18:08:13] haha [18:08:40] what scares me is when people come up to me and tell me how clean mediawiki's code is compared to the php they're used to work with [18:09:12] ask nimish about Yahoo's code :) [18:53:07] TrevorParscal: still not getting any love with setting position: absolute; right: 100% [18:53:10] on the dropdown [18:53:33] wanna make it actually sit correctly before I do fancy stuff :D [18:56:15] do right: 0; [18:56:23] 100% doesn't really make sense there... [18:56:49] Better [18:56:55] if left: auto (or just not set) and right: 0 then it will make the right side of the box on the right side of it's parent [18:56:56] :) [18:57:05] yay for boxes! [18:57:20] *werdna grumbles [18:57:25] what now? [18:57:44] about how that fix works :P [18:57:49] oh [18:58:00] also, setting line-height to 1em still cuts off the top of the fancy outline [18:58:04] need to push the images down [19:00:36] hmm [19:01:07] not working well there, if I push the images down, the sides also go down [19:01:10] which is a bit weird [19:01:17] ok [19:01:27] so I think there's 2 problems [19:01:41] 1 is that the global UL attributes are screwing with you [19:01:59] happened when it was a div, too [19:02:54] 2nd is that your lqt-toolbar-lhs and lqt-toolbar-rhs approach to adding in the sides is probably not very stable [19:03:10] what would you suggest? [19:03:24] I sent some images for making a rounded corner box that scales [19:04:56] yeah [19:05:00] I'm writing some HTML to go with it [19:05:09] you will have it in a min [19:05:10] okay, cheers, let's see how it works [19:34:33] TrevorParscal: you have a look at that? Haven't received anything [19:34:38] maybe it's stuck in my junk folder [19:34:51] almost done [19:34:56] pulling ninja manuvers! [19:34:59] okie dokie, cheers [19:57:32] OK [19:57:34] sent! [19:57:41] going to lunch [19:57:43] brbr [19:58:28] cheers [20:21:17] back from lunch [20:24:23] \o/ [20:25:00] haven't poked that yet [20:26:46] no worries [20:26:52] just let me know if you need anything at all [20:59:15] TrevorParscal: sure, thx [22:35:06] TrevorParscal: the box corners don't appear for me when I open box.html from the archive, other images load fine [22:35:19] oh wait, maybe I moved the files [22:37:37] you get it? [22:44:51] still not getting the borders right [22:45:09] hey we're interviewing another dude today right? [22:45:14] did we get resume etc for him? [22:45:30] TR, BR appear correctly, TL and BL seem to have moved to under the icons [22:47:10] ah, they've all moved to outside the ul with the box-c.png [22:47:58] bad interactions with the old stuff [22:48:31] aha found it [22:58:25] TrevorParscal: ugh, wrong element nesting order [22:58:33] hate to say it, but that's some ugly markup :P [23:45:09] TrevorParscal: getting there :)