| Summary: | Interface improvements | ||
|---|---|---|---|
| Product: | openclipart.org | Reporter: | Jonathan Leighton <j> |
| Component: | website | Assignee: | default user for a product <clipart> |
| Status: | CLOSED FIXED | QA Contact: | |
| Severity: | normal | ||
| Priority: | high | ||
| Version: | unspecified | ||
| Hardware: | x86 (IA32) | ||
| OS: | Linux (All) | ||
| URL: | http://openclipart.org/ | ||
| Whiteboard: | |||
| i915 platform: | i915 features: | ||
| Bug Depends on: | 4134 | ||
| Bug Blocks: | 3599 | ||
| Attachments: |
Updated mockup.
Download button buttons idea Download button 2 Mockup with Jonathan's download button, similar browse button, and sample Inkscape affiliate button Mockup with buttons based on Benji's. Revised mockup again; buttons now have blue background, red/orange/yellow gradient text Another mockup |
||
|
Description
Jonathan Leighton
2005-08-04 05:13:56 UTC
Created attachment 3243 [details] [review] Initial proposed patch Okay, here is a mockup. I've tried to think what tasks people are likely to be trying to achieve when they visit our site; what they are thinking. The first time visitor is likely to be thinking: * What the .. is this??? * Okay, cool, free clipart * Where the .. is it??? The download and browse buttons are really, really small and unobvious. I'm speaking from personal experience here -- when I first came to OCAL I *could not find the clipart*. Hence I put in those massive buttons. This is also our chance to show off visually, it would be lovely to have some really bold, graphically interesting buttons. Anyone want to volunteer? As you can see, I removed the light blue bar completely. All useful functionality from it has been moved elsewhere, such as the search. There's no point having a search box in two places so I removed it from the main part of the page and put it at the top in the left (which is perhaps more obvious anyway). Also, I removed the submission box. I'm thinking it's unlikely that this is really important functionality -- submission is the first link on the left anyway. This is good because it gets the News up a bit, so you can actually read something before having to scroll! Another minor thing is that I removed the screenshots. In an application like Inkscape or GNOME, screenshots are important. But we're producing art not screenshots and I think they are distracting. If we're going to have anything there, I would think a random bit of clipart would be more appropriate. Then there's the header. I've integrated a rotating affiliations logo into the header, with bug 3599 in mind. Our logo is moved to the left -- before you object, bear in mind that the top left is the MOST prominent position on any web page (at least for societies that read from right to left). Maybe people will disagree with having an affiliations logo in such a prominent position though, I dunno, what do people think? No doubt I've missed something but I think that's about it. I'll put up the SVG after this as well so people can make modifications if they want. Created attachment 3244 [details] [review] Z Axis scrolling with inverted directions Suggestions for improvement:
* Unify the sidebars, creating one sidebar with several sections.
(The one on the left already has two sections; adding a third
section for incoming would not be a major change, and we could then
do away with the right sidebar.) I don't care which side the
sidebar goes on, but it should be on *one* side, not both. The
number of "recent images" should perhaps be reduced from 15 to
eight or ten, to make that section of sidebar similar in size to
the others, and to keep the sidebar from running too long.
* Roll the contents of the navbar across the top into the sidebar and
eliminate the navbar, leaving only the banner at the top.
* Move both search features into the sidebar, with a more clear
explanation of the difference, or else dump whichever one is less
useful and have just one search feature. This makes the search
available from every page and simplifies the layout of the main
page considerably.
* Remove the submit form from the main page; it's redundant, as
there's already a link in the sidebar, on every page, that points
to the main submit form.
* Submit Clip Art and Submit Screenshot should not have something
else in between them, so Join Discussion should be either before or
after both of them.
* Simplify the footer. Currently there are at least three lines, and
the middle one frequently runs over into two, depending on your
resolution and font sizes and things. The first line has the
little icon-button things, but the other lines have text. There
are two different links to the Creative Commons. First off, the
links should either all have the icon-buttons (all the same size
and shape), or else they should all be text, styled the same way.
Second, they should all be in one block-level element. Third,
there are entirely too many of them, given that this is a footer
that goes on just about every page on the site. Most of those are
affiliate projects, and they should be listed on one page, probably
an Affiliate Projects or Links page existing especially for that
purpose, with *one* link on every page pointing there. As an added
bonus, this would allow for a little blurb about each one,
explaining what it is and why we're affliated. Finally, the footer
contains validator.w3.org icons, but have we checked that the pages
that include the footer all validate?
For the new and rearranged sidebar, I'm thinking something like
the following...
Available Clipart:
* Statistics: over
4300 clips by over
400 contributors.
* Browse Online
* Download Releases
* Search by Keyword:
_____________ [Find]
Contribute:
* Submit Clip Art
* Submit Screenshot
* Join in Discussion
* Report a Problem
* Request Clipart
Information:
* News
* Branding & Logo
* Questions & Answers
* Contact & Feedback
* View Screenshots
* Planet (weblog)
Developer:
* Roadmap
* Tools
* Wiki
Incoming:
* There are 101 files
incoming, of which
97 are svg.
* View Submissions
Created attachment 3253 [details] [review] HEAD patch 1/2: Fix locking in cairo_scaled_font_reference/destroy Something more along these lines, perhaps. In my mind, the four most important things we want visitors to gain from the site: * Understand what the project is about and just how much clipart there is * Search/browse for clip art * Upload their own clip art * Feel welcome to get more deeply involved These four things should be covered by the middle area of the page, where people are looking. Note that a block of text is probably less useful than something visual (such as a search input widget, an upload form, a chart showing how many items are in the library, etc.) Beyond this, simpler is better. We're always going to have a lot of links we'd like to include in the site, but too many links will just be overwhelming. Here are some things I think we could simplify: * News - A link to a news area may be enough; no need to have a huge amount of news filling the bottom of the page. Or perhaps limit it to just 1 news item, plus the announcement of the latest OCAL release. * Submit Screenshot - I'm tempted to suggest just hanging this off of the submit clipart page instead of in the main nav bar. It's a useful tool but the casual submissions we've gotten to date have been less than useful. It needs less visibility IMHO. * Join in Discussion / Report a Problem / Contact & Feedback - These all feel like aspects of the same thing (communication), and may not be worth having 3 separate links... Each is for a different type of communication, though, so I'm not sure what to suggest... Might be worth some thought, though. * Roadmap probably isn't worth having as a top level link. * Wiki should probably go under Information instead of under Developer. * Branding & Logo is a subtopic of 'Questions and Answers' I like the idea of eliminating the right link bar, as it simplifies the site. Bryce Okay... I have lots of things to say : ). Yes, I think one single sidebar is a good idea too. I pondered suggesting this myself but thought I might hit quite a bit of resistance. I'm glad we all agree on that : ). Do we actually *need* the incoming list? I'd just as happily do away with it altogether, but I dunno -- what do others think? Getting rid of the top nav bar -- that's exactly what I did in my mockup. However, I disagree with just putting them into the top of the sidebar. I don't think they are prominent enough even there, and think it is very very important to put emphasis on the download/browse links. I also think the statistics are a bit silly to be putting on every page -- especially as they are not "live" statistics. Search -- yes, I did that too. I think we need to stick to just one search box. Giving people options is not always a good idea ; ) Submit form -- again, I did this and agree. In terms of submitting screenshots, I agree with Bryce that it should be linked just from the clipart submission page. I agree we need to simplify the footer. Validation buttons should be removed, anybody interested in validating pages will already know how to. Furthermore, we can hardly guarantee compliance when pretty much anybody is able to edit the site. I disagree with you putting the affiliates in the footer -- again this is clutter, and is also not a very prominent position. Please see bug 3599 where we discussed this. Also, can I request that we not think about visuals in this bug. My mockup would have been a wireframe if there was not already a site design. Basically, the important thing to discuss here is where the content needs to go in order to make the site as easy to use as possible. That's the number one concern at the moment. After that is dealt with then perhaps it would be nice to touch up the visuals too, but I think content is more important right now. Bryce's stuff ------------- I agree with your order. My mockup was designed such that people could come to the site, read what it's about, and right away know how to get to the clipart. I think this could be made even easier for people if we reviewed copy on the front page to make a short, concise paragraph saying what it's about. I'm thinking something really simple like: "The Open Clip Art Library aims to provide freely available, public domain clipart for whatever use you like. Feel free to browse the library, and if you found it useful consider submitting some of your own clip art." (links in appropriate places) People don't tend to like to read too much. It would also be good to highlight key terms like "freely available" -- again this will catch the eye of people half-assedly glancing at the site. Just those two sentences cover pretty much all of your four points. News -- I totally agree. One News item would be good. I can customise it to display "Releases" and "News" seperately, if they are put in different categories. I reckon that'd be a good idea. Submit Screenshot -- covered above. Discussion -- yep, one single page with a link like "Discussion & Feedback" would be good. We could cover all avenues of discussion/feedback on one single page. Roadmap -- agree Wiki -- agree Branding and Logo -- again, I agree. Without this, and with the project information on the home page, I don't think there's really any reason to have an about page. -- This would be my sidebar: Clipart: * Browse Clip Art * Download Package _____________ [Search] Contribute: * Submit Clip Art * Discussion & Feedback * Request Clipart Information: * News * FAQ (everyone knows what that means) * Wiki * Screenshots * Developer Weblogs > In my mind, the four most important things we want visitors to > gain from the site: > * Understand what the project is about and just how much clipart there is > * Search/browse for clip art > * Upload their own clip art > * Feel welcome to get more deeply involved I think I would reverse the order of those first two, but apart from that, I think this line of thinking is heading in the right direction. > Submit Screenshot - I'm tempted to suggest just hanging this off > of the submit clipart page instead of in the main nav bar. It's a > useful tool but the casual submissions we've gotten to date have been > less than useful. It needs less visibility IMHO. I agree with the rationale here, but I'm not convinced the submit clipart page is the right place to put the link. Perhaps a link from the View Screenshots page, instead? > * Roadmap probably isn't worth having as a top level link. > * Wiki should probably go under Information instead of under Developer. With those changes, the developer section would be left with one link. Seems like a wasted section heading for that. Perhaps it should be consolidated with another section. Where else could we put the tools? Do the tools even need a front-page link? Would the link from the downloads page be enough? > Do we actually *need* the incoming list? I'd just as happily do > away with it altogether, but I dunno -- what do others think? The incoming list is useful, but I don't think we need to fill up the sidebar on every page with fifteen links, when this information, and more, is already available on the incoming submissions page. I think just a link to that page might be enough. > Getting rid of the top nav bar -- that's exactly what I did in my > mockup. However, I disagree with just putting them into the top of > the sidebar. I don't think they are prominent enough even there, and > think it is very very important to put emphasis on the download/browse > links. That is why in my mockup I also put links to them in the main text area of the front page, but perhaps something more visual, as Bryce suggests, is in order in that regard. > I disagree with you putting the affiliates in the footer -- > again this is clutter, and is also not a very prominent position. I think I agree with you, but I left them there in my mockup mainly because I wasn't sure exactly what else to do. Perhaps a link somewhere (where?) to a separate page of affiliate projects, which could have a full description of each and so forth. > Also, can I request that we not think about visuals in this bug. My > mockup would have been a wireframe if there was not already a site design. If you mean colors and fonts and so forth, I agree. I made the mockup look plausible, rather than a wireframe, mainly so that people wouldn't go, "Eww, that's ugly" and overlook the way the information is layed out, which was the point. My mockup was not intended to provide accuracy on the pixel level, just a general idea of how things could be set out. If someone doesn't like some little thing, such as the way I bulleted each section of the sidebar, don't sweat that; whoever actually implements the revised site will probably change such minor things anyway; the big key point here is what information should be in the header, the footer, the sidebar, and the main page area, and how it should be arranged. Sub-div presentational details are neither here nor there at this point. I will revise my mockup. Created attachment 3273 [details]
gpg-armored.txt
Revised mockup, with some of the discussed changes.
(In reply to comment #7) > > Submit Screenshot > > Perhaps a link from the View Screenshots page, instead? > Good idea > Do the tools even need a front-page link? > Nope > The incoming list is useful, but I don't think we need to fill up > the sidebar on every page with fifteen links, when this information, > and more, is already available on the incoming submissions page. > I think just a link to that page might be enough. > That's cool with me > > Getting rid of the top nav bar -- that's exactly what I did in my > > mockup. However, I disagree with just putting them into the top of > > the sidebar. I don't think they are prominent enough even there, and > > think it is very very important to put emphasis on the download/browse > > links. > > That is why in my mockup I also put links to them in the main text > area of the front page, but perhaps something more visual, as Bryce > suggests, is in order in that regard. > Are iconic buttons (such as the ones I suggested in my own mockup) not "visual"? I think they definitely are. I don't think text links are enough really. You've not said anything against the idea of those buttons, but also not supported them either -- so do you like or dislike them and why? > > I disagree with you putting the affiliates in the footer -- > > again this is clutter, and is also not a very prominent position. > > I think I agree with you, but I left them there in my mockup mainly > because I wasn't sure exactly what else to do. Perhaps a link somewhere > (where?) to a separate page of affiliate projects, which could have a full > description of each and so forth. > This was discussed in bug 3599, as I said in my previous comment, and it was decided that we should display ONE affiliate per page randomly to give them all a chance for the limelight without crowding our site with links to others. So then the question I where. In bug 3599, I suggested the sidebar, but rejon said it was crowded and that the top bar might be a better idea. I put it in the top bar in my own mockup, and nobody has voiced an opinion about that positioning -- what do you think? > > Also, can I request that we not think about visuals in this bug. My > > mockup would have been a wireframe if there was not already a site design. > > If you mean colors and fonts and so forth, I agree. I made the mockup look > plausible, rather than a wireframe, mainly so that people wouldn't go, "Eww, > that's ugly" and overlook the way the information is layed out, which was > the point. > Well you could always have done it according to the current site design as I did... And to be honest, I don't think anyone would have said that. But anyway, the important part is the information. > > > Getting rid of the top nav bar -- that's exactly what I did in > > > my mockup. However, I disagree with just putting them into > > > the top of the sidebar. I don't think they are prominent > > > enough even there, and think it is very very important to put > > > emphasis on the download/browse links. > > > > That is why in my mockup I also put links to them in the main > > text area of the front page, but perhaps something more visual, > > as Bryce suggests, is in order in that regard. > > Are iconic buttons (such as the ones I suggested in my own mockup) > not "visual"? I think they definitely are. I don't think text > links are enough really. You've not said anything against the idea > of those buttons, but also not supported them either -- so do you > like or dislike them and why? Let me have another look at them... Umm, call me blind, but I don't see any visual iconic buttons for those on your mockup, just text links in a large font. If those were supposed to be placeholders for visual iconic buttons, then that seems like a reasonable approach to me; I just didn't realize that was what they were. Perhaps I will look into revising my mockup again to include something along those lines... [Affiliates] > This was discussed in bug 3599 Yeah, I'd read that, but it didn't really answer the question, although it did raise some relevant issues... > So then the question I where. Yes, exactly. > In bug 3599, I suggested the sidebar, but rejon said it was crowded I agree with that... > and that the top bar might be a better idea. I put it in the top > bar in my own mockup, and nobody has voiced an opinion about that > positioning -- what do you think? Aesthetically, I think that unballances the symetry of the banner, although perhaps it could be made to look good if done well. I'm wondering if maybe we could fit one affiliate in the main page area of just the front page... I will think some more about how that area can be arranged better. We don't want a complex layout in there, but perhaps something more than just text is in order. Created attachment 3306 [details] [review] minor update: x86-64 similar to x86 Playing around with ideas here. Is this a good place for the visual buttons? Created attachment 3307 [details] [review] keyboard layout diff Or what about putting them over here, like this? Which is better, or is there another place? Created attachment 3308 [details]
Test document
Concept for visual download button. Someone can probably do better than this,
but here is a working prototype to get things going.
Created attachment 3309 [details]
nvidia-bug-report
Again, someone can do better, but here's a browse button concept prototype.
(In reply to comment #10) > Let me have another look at them... Umm, call me blind, but I don't > see any visual iconic buttons for those on your mockup, just text links > in a large font. If those were supposed to be placeholders for visual > iconic buttons, then that seems like a reasonable approach to me; I > just didn't realize that was what they were. Perhaps I will look into > revising my mockup again to include something along those lines... > Yes, they are placeholders. I thought I made that reasonably clear when I said: "Hence I put in those massive buttons. This is also our chance to show off visually, it would be lovely to have some really bold, graphically interesting buttons. Anyone want to volunteer?" But ok. > [Affiliates] > > This was discussed in bug 3599 > Yeah, I'd read that, but it didn't really answer the question, although it did > raise some relevant issues... Well Jon suggested the top bar and I agreed. > > In bug 3599, I suggested the sidebar, but rejon said it was crowded > > I agree with that... > > > and that the top bar might be a better idea. I put it in the top > > bar in my own mockup, and nobody has voiced an opinion about that > > positioning -- what do you think? > > Aesthetically, I think that unballances the symetry of the banner, although > perhaps it could be made to look good if done well. I'm wondering if maybe we > could fit one affiliate in the main page area of just the front page... I will > think some more about how that area can be arranged better. We don't want a > complex layout in there, but perhaps something more than just text is in order. > I don't think the complexity of the layout really matters, so long as the placement gives affiliates *enough* focus without giving them *too much* of it. I think in your mockups it has too much focus. It seems to suggest that visiting an affiliate is equally important to browsing/downloading the collection, which of course, it's not. And yeah, probably the top bar is too much focus too. In light of that, I hate to say it, but I'm going to suggest the bottom of the sidebar again. I don't have any better ideas. I'm going to have a go at making some buttons too and we can see what we come up with. > I can do a similar style for a "Browse" button if it is desired. Obviously > if people hate my button then I won't ; ) At the moment, bugs.fdo seems not to be showing attachments (a few moments earlier it was refusing requests, so this actually is an improvement), so I can't look at it right now. > If I'm honest about your buttons, Jonadab, I don't particularly like them. I didn't intend for mine to be the final ones. I'm not an artist. I dabble a little bit, but it's not really my field, and I have neither the inclination nor the training. My main purpose in doing those buttons was to convince someone else they could and should do up some better ones. > Also, does anybody know what the OCAL font is?
I cannot seem ATM to find the SVG behind the main banner we are currently using.
Jonathan Leighton wrote:
>
> Here's a "Download" button I did.
It seems is something wrong with the attachment: it can't be accessed.
(In reply to comment #18) > Jonathan Leighton wrote: > > > > Here's a "Download" button I did. > > It seems is something wrong with the attachment: it can't be accessed. On IRC: Turnip daniels and other wranglers: bugzilla seems to be pretty confused at the moment -- do you know anything about this? daniels Turnip: yeah daniels Turnip: as the topic says [ed: topic says "parts of gabe's RAID array failed -- bugs.fd.o and lists.fd.o are known to be affected (missing attachments in BZ, corrupted mail archives)"] Turnip my apologies! Turnip any ETA on a fix? daniels no worries daniels not really. one of the disks in our raid array just sort of fell out, so we're looking at the backups pdx seem to be taking to see what we can recover. Turnip ok. Does the RAID not mean that you have a copy on another disk? Or do I misunderstand? daniels depends what level of RAID, but as I understand it from anholt, the recovery went rather sideways Turnip alright So we may or may not be able to get back the data. I'll re-attach my button tonight anyhow. (In reply to comment #17) > > Also, does anybody know what the OCAL font is? > > I cannot seem ATM to find the SVG behind the main banner we are currently using. It's at http://openclipart.org/about.php, but the text is just a path, not an actual text object. This is sensible though, for two reasons: 1) People don't have to have the font installed 2) A guy where I work told me that when you convert text to a path, it becomes a drawing and the copyright on the font does not apply Who did the logo? Maybe I can contact them to find out. (In reply to comment #16) > > If I'm honest about your buttons, Jonadab, I don't particularly like them. > > I didn't intend for mine to be the final ones. I'm not an artist. I > dabble a little bit, but it's not really my field, and I have neither the > inclination nor the training. My main purpose in doing those buttons was > to convince someone else they could and should do up some better ones. Yeah fair enough. No offence was intended even if it was recieved (in which case sorry). I'm no designer either, although I do try. At the end of the day we can all do out best and hope something good comes out of it : ) Created attachment 3348 [details] [review] Patch to increase rotated bitmap copy speed Here's a "Download" button I did. I'd be interested to hear what people think. Also, does anybody know what the OCAL font is? I'd really like to try it out using that font if anybody knows which it is... I can do a similar style for a "Browse" button if it is desired. Obviously if people hate my button then I won't ; ). If I'm honest about your buttons, Jonadab, I don't particularly like them. But then you may not like mine. Art is certainly a difficult thing to agree on. Anyway, it would be good to start implementing the interface discussed in this bug as soon as we agree on buttons (as they are fairly important). The only outstanding thing then would be the affiliate link, but perhaps that can be discussed some more in the other bug once this bug is closed. Created attachment 2869 [details]
Updated mockup.
Attaching a (quite minor) update of my mockup, mainly because of the former
attachments having been lost in the RAID shuffle. At this point, I think the
thing I most want feedback about is the positioning of the download, browse,
and affiliate link buttons, not in terms of "I think it should be five pixels
over" but more in terms of whether the general placement is good or if there is
a better place for them, on the other side of the text, or layed out
horizontally somewhere instead of vertically, whether the affiliate link should
be more separate from the others, that sort of thing. Other comments are still
welcome as well, but that's the main thing.
Oh, and somebody draw some better buttons; ideally we should have a whole set:
download, browse, and one for each of the affiliates. I think we're agreed now
that we want visual buttons for these things; we just haven't nailed down yet
where we're going to put them.
> > Also, does anybody know what the OCAL font is? [...] > Who did the logo? Maybe I can contact them to find out. The original logo, as submitted to the logo contest (by Andreas Nielson IIRC), had different text (using the word "project" instead of library) in a different font. This can still be found in logos/OpenClipArtLibrary/open_clip_art_library_logo_01.svg The graphical element from this winning entry was taken and put with the text for the name we use now, in another font, by someone else, possibly rejon. Also there were briefly different colors (notably, one of the clips was green at one point). This version can be seen in logotype_final_-_open_clip_art_library_01.svg But the colors were then changed back to the original ones (except for the background, which was selected to integrate with the site design's blue top banner). The font and text, however, were not changed back to their original version, since it was felt that we wanted to use "Open Clip Art Library" rather than "project". Yet, the font we use now also does not match the one in logotype_final_... Except for color, the text we use now, and the font it is in, bears a striking resemblance to the ones in Neil Stuber's entry, as seen in open_clip_art_librarylogo_01.svg, so it is possible that it was taken from there. I am guessing that this may have been done by Jon, Bryce, or Nicu, but I don't actually know. > Except for color, the text we use now, and the font it is in, bears a
> striking resemblance to the ones in Neil Stuber's entry, as seen in
> open_clip_art_librarylogo_01.svg
And other entries by the same author as well. The following uri is given
in the description metadatum in each of his entries:
www.neilstuber.com
Upon visiting that site, I found the following contact information:
Neil Stuber
n (at) neilstuber.com
347.463.2995 {Brooklyn, NY}
The second line there looks like a convenient email contact, if someone wants to
ask if he remembers which font he used.
Created attachment 2884 [details]
Download button
My download button (again!)
(In reply to comment #23) > Created an attachment (id=2869) [edit] > Updated mockup. > > Attaching a (quite minor) update of my mockup, mainly because of the former > attachments having been lost in the RAID shuffle. At this point, I think the > thing I most want feedback about is the positioning of the download, browse, > and affiliate link buttons, not in terms of "I think it should be five pixels > over" but more in terms of whether the general placement is good or if there is > a better place for them, on the other side of the text, or layed out > horizontally somewhere instead of vertically, whether the affiliate link should > be more separate from the others, that sort of thing. Other comments are still > welcome as well, but that's the main thing. All things considered, I can't think of a better position. So yeah, I reckon we should go with that. > Oh, and somebody draw some better buttons; I'd be interested to hear your feedback on my download button. >ideally we should have a whole set: > download, browse, and one for each of the affiliates. We don't need buttons for affiliates -- it's important to keep their own branding. At most they will need resizing or something. (In reply to comment #25) > > Except for color, the text we use now, and the font it is in, bears a > > striking resemblance to the ones in Neil Stuber's entry, as seen in > > open_clip_art_librarylogo_01.svg > > And other entries by the same author as well. The following uri is given > in the description metadatum in each of his entries: > www.neilstuber.com > > Upon visiting that site, I found the following contact information: > Neil Stuber > n (at) neilstuber.com > 347.463.2995 {Brooklyn, NY} > > The second line there looks like a convenient email contact, if someone wants to > ask if he remembers which font he used. Thanks, I'll email him. Man, this thread is long. Ok, first things first: 1.) Submit clipart with the simplest input box and submit should most definitely be on the front page very prominent. This is important!!! 2.) You should also think about where a login box would go... 3.) Where is all the developer information in the menu? That is so key! We need people to be able to contribute this way effectively. Overall, I like the cleanup and organization. The fonts in the body seem a bit too large. Also, maybe using some of the other colors from the logo might pretty up the site slightly. I'm not so into the bullets in the menu items. I think menu items automatically read as menu items because they are larger and people understand this language of the web pretty well these days ;) The two buttons should have the same text as the menu. So Download Clip Art should be the same on the button as in the menu (which currently reads Download Releases). Also, I think consolidating the font stylings into one or two different styles will help professionalize the site more. The font used for the logo I vectorized from somewhere, but I can't remember the name. I found the font I believe: font-size:54.000000;font-style:normal;font-variant:normal;font-weight:800;font-stretch:condensed;fill:#000000;fill-opacity:1.0000000;stroke:none;stroke-width:1.0000000pt;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1.0000000;font-family:Myriad Pro Black Cond;text-anchor:start;writing-mode:lr; So, Myriad Pro Black Cond I will look for this font at home. I might do some designing on the mockup later in the game. > > Oh, and somebody draw some better buttons; > I'd be interested to hear your feedback on my download button. I like it better than mine. More contrast, easier to read, and simpler, and I like what you've done with the gradients. It makes mine look cluttered. The only thing about it that I'm not entirely sure about is putting the red lettering together with the orange arrow. These are colors from our logo, though, so maybe it's alright, especially if you can get the yellow into the browse button somehow. We should get another couple of people to comment, preferably someone with good artistic ability. > Where is all the developer information in the menu? That is so key! > We need people to be able to contribute this way effectively. The developer stuff is present, but before it was absolutely choking the site, from an end user perspective. You can only load up the front page with so much developer info without actively chasing users away. Not that the developer stuff isn't important -- it's vital -- but the developers are quite a LOT more willing (and able) than end users to look around, navigate the site, and bookmark relevant subpages. Not that we should let the developer and contributor stuff get *hidden*, by any means, but it's not. In my mockup, if you look at the sidebar, the top three (3) items are end-user items: browse, download, and search. After that, there's submit, Discussion & Feedback (which presumably will link to a page that tells about the all-important mailing list, among other things), the request page (which is very useful for contributors, as well as for people who want to make requests), and most of the stuff in the Information section also is developer oriented. Okay, FAQs are end-user stuff, and arguably the screenshots, but the news, wiki, and blog items, as well as the incoming submissions queue, are all solidly in the realm of the developers and contributors. Perhaps these things need to be rearranged better, to make important ones more prominent, but is there anything *missing* that really needs to be there? Additionally, several of the developer-oriented links point to deeper structures. The wiki, for instance, is practically an entire site in itself. And it's all about developer stuff. This brings up an important difference between the way developers versus end users use the web: to an end user, the front page, basically, is the site; for a developer, the front page is a navigational tool that helps you find the relevant portion(s) of the site. It's a completely different paradigm. As a navigational feature, the banner across the top probably should point back to the main page. Some people expect that, and the ones who don't won't likely click on it, and even if they do, the main page is a nice central destination from which it is easy to get to any other major part of the site. > Submit clipart with the simplest input box and submit should most > definitely be on the front page very prominent. This is important! I think it was overall a negative for usability, for a couple of reasons. First, and most important, it was redundant and therefore confusing; we had at least one contributor complain about not understanding which form to use and what the difference was, and the answer I was able to give him ("if it confuses you, just use _this_ form and ignore those other ones") was not very satisfactory, IMO. Additionally, the extra form, despite *looking* simpler, does not in practice actually make things easier for most contributors, because after filling out that form, the user comes anyway to the other form that the link points to. There are (now that we've got extension sniffing for filetype determination) rare exceptions to this, when all the metadata are already included, but that is only likely to happen when the contributor is already familiar with our process, in which case he's probably bookmarked the submit form anyway, among other reasons because it provides the dropdown list of keywords. Really, I don't think we lose much by taking the extra submit form off the main page -- and we gain significantly in the simplicity department. The "Submit Clipart" link is the very first thing under the Contribute section of the sidebar; that's fairly prominent. And if the main clipart submission form is all that bad, so that contributors don't want to use it, perhaps *that* needs to be redesigned. > You should also think about where a login box would go... In the sidebar, I should think. If we have login, there will be several items related to it: if the user is not logged in, there's at minimum a box for the username, one for the password, and a button. When the user is logged in, there needs to be some indication of who is logged in, a link to the place where the user can review and/or change his preferences and whatever personal info (e.g., contact information), plus a logout link. I guess that means a sidebar section. If I had to pick a place in the sidebar for it, I'd put it beneath the Contribute section, but above Information. An argument could be made for putting it above Contribute, though. > The fonts in the body seem a bit too large. Also, maybe using some of > the other colors from the logo might pretty up the site slightly. I'm > not so into the bullets in the menu items. Also, I think consolidating > the font stylings into one or two different styles will help > professionalize the site more. These sorts of minor details need not detain us here. As discussed in comments 6 and 7, I assume whoever implements the HTML will tweak such things, but at this stage I'm more concerned with the overall design. As you point out, the thread is already getting long (though I have seen much longer ones on b.m.o). > The two buttons should have the same text as the menu. So Download > Clip Art should be the same on the button as in the menu (which currently > reads Download Releases). Agreed. In order to keep the button simple, let's make the sidebar read "Download Clip Art", unless someone can think of a reason to do otherwise. Created attachment 2889 [details]
buttons idea
Comment on attachment 2889 [details]
buttons idea
Here is my attempt at some buttons. I took inspiration from Jonathan and from
the ocal logo. I also used clipart from the library by AJ Ashton. Not sure
about the font colors though, any ideas?
(In reply to comment #30) > > Where is all the developer information in the menu? That is so key! > > We need people to be able to contribute this way effectively. > > The developer stuff is present [...] a completely different paradigm. I agree, 100%. We need to capture our audience first and foremost, and they will be more than happy to find out how to join us after that. > As a navigational feature, the banner across the top probably should point > back to the main page. Some people expect that, and the ones who don't > won't likely click on it, and even if they do, the main page is a nice > central destination from which it is easy to get to any other major part > of the site. Yep, agree with you here. > > Submit clipart with the simplest input box and submit should most > > definitely be on the front page very prominent. This is important! > > I think it was overall a [...] And if the main clipart > submission form is all that bad, so that contributors don't want to use > it, perhaps *that* needs to be redesigned. Again, I agree. Simplicity is really really key, and forms confuse the hell out of people (that's Normal People who don't use Linux and write C++). > > You should also think about where a login box would go... > In the sidebar, I should think. If we have login, there will be several items > related to it: if the user is not logged in, there's at minimum a box for the > username, one for the password, and a button. When the user is logged in, there > needs to be some indication of who is logged in, a link to the place where the > user can review and/or change his preferences and whatever personal info (e.g., > contact information), plus a logout link. I guess that means a sidebar section. Is this a login for the DMS, when it's ready? I'd say there should be a separate page for the actual login form, with just a "Login" or "Logout" link depending obviously on whether you are logged in or out. Not sure where it should go, but I'd say we should deal with that when we come to it -- who knows, the site may be different by then anyway. > > The fonts in the body seem a bit too large. Also, maybe using some of > > the other colors from the logo might pretty up the site slightly. I'm > > not so into the bullets in the menu items. Also, I think consolidating > > the font stylings into one or two different styles will help > > professionalize the site more. > > These sorts of minor details need not detain us here. As discussed in > comments 6 and 7, I assume whoever implements the HTML will tweak such > things, but at this stage I'm more concerned with the overall design. > As you point out, the thread is already getting long (though I have seen > much longer ones on b.m.o). My position is that the colours and design should stay the same (obviously minor things dont really need to be discussed) and if visual changes need to happen (I think it would be a good idea), we should have a new bug *AFTER* we get the layout/IA stuff dicussed in this bug sorted. > > The two buttons should have the same text as the menu. So Download > > Clip Art should be the same on the button as in the menu (which currently > > reads Download Releases). > > Agreed. In order to keep the button simple, let's make the sidebar read > "Download Clip Art", unless someone can think of a reason to do otherwise. Good, yeah. Created attachment 2894 [details] Download button 2 (In reply to comment #30) > The only thing about it that I'm not entirely sure about is putting the red > lettering together with the orange arrow. These are colors from our logo, > though, so maybe it's alright, especially if you can get the yellow into the > browse button somehow. We should get another couple of people to comment, > preferably someone with good artistic ability. Yeah, I wasn't sure either, but I did it because -- as you realised -- it was the colours in the logo. The problem with the logo colours is that they don't contrast all that much. Anyway, I got in contact with Neil Stuber, who told me the font he used was Arial Black 41.5pt. I have changed my button (attached), and I think it looks a lot better with the OCAL font. > Here is my attempt at some buttons. I took inspiration from Jonathan and > from the ocal logo. I also used clipart from the library by AJ Ashton. Not > sure about the font colors though, any ideas? I think the words need to have good contrast against the background, to be easy to read at a quick glance, and the ones colored with the yellow-orange gradient, against a background of yellow-orange gradient, are definitely lacking in that regard. I'm less sure about the white. I think it is okay against the orange but falls a little short against the yellow. I tried each of the two colors of blue from the site, with either white or black outlines, and I was not satisfied with that either. Then I tried black text outlined in white, and I think that may provide the best contrast against the yellow-orange gradient background. At the bottom, against the yellow, the black shows up really well, and at the top, against the orange, the white outline helps it to show up better than it might otherwise. What do you think? Oh, and if these buttons end up against a white background, they will want a black outline, rather than a white outline. That's an easy change, and no big deal, and the black looks fine around the yellow-orange. I'm not 100% sure whether I prefer Jonathan's blue-gradient button, or these yellow-orange ones. I tend to like blue better as a color, but that is a personal thing. The yellow-orange is probably more eye-catching. Then again, the blue probably integrate's better into the look of the site. OTOH, the yellow and orange are from the logo, and we'd talked about using those colors more on the site. (Perhaps to go along with those buttons we should be using more red for boundary lines and things, yellow for the sidebar background instead of baby blue, and so on? I guess we can leave most of those questions for the stylesheet to answer later.) On the gripping hnd, the orange arrow on the download button stands out really well against the blue gradient background and really brings out the idea of download; whereas, with the yellow-orange gradient background, the focus tends to be on the button background or the whole button, rather than the arrow element. Hmmm... I think I want another opinion or two. The other question I have is about the books; they don't communicate the concept of browse to me. Maybe I'm just thick? Granted, "Browse" can be an abstract and somewhat difficult concept to portray... Oh, another point from back the other day... > We don't need buttons for affiliates -- it's important to keep their > own branding. At most they will need resizing or something. It is certainly important to keep each affiliate's own branding, so the button design for those is both simpler and much more constrained because of that, but I think we do need buttons for the affiliates, for several reasons, most of which revolve around fitting them into our site. First off, the obvious: they don't just have to be the same size; they also really should be the same shape, in terms of aspect ratio. (They can have blank areas around the edges, so they don't have to be the same shape in terms of being a rectangle, but it would be fairly problematic if for instance of of them were taller than it is wide.) This is more than mere resizing, as it may require something like placing text next to the logo element, or under it, or whatever, to get it to fit. To be clear, we'd be using the affiliate's logo element to represent them, and their chosen text, preferably in their chosen branding font if possible, so we would be retaining, to the greatest extent possible, their branding. I will use Inkscape as an example. Their branding consists, as near as I can determine, of four elements: the inkscape logo (which you see on the site and also as a desktop icon), the word "Inkscape", and the colors black and white, and the motto "Draw Freely". (There is also the description, "Open Source Scalable Vector Graphics Editor", but that is probably too long to put in a button, though it could be used in the alternate text and possibly also in a tooltip.) We would need to combine two or more of those elements into a button the same overall shape (and size) as our browse and download buttons. > forms confuse people (that's Normal People who don't use Linux and write C++). Hey, I don't write C++, does that make me normal? ;-) > Anyway, I got in contact with Neil Stuber, who told me the font he used > was Arial Black 41.5pt. Aha! I hadn't recognized it before, I think because it had been resized to a different scale horizontally than vertically, making it look less fat, but apart from that this does appear to be the right font. Created attachment 2895 [details]
Mockup with Jonathan's download button, similar browse button, and sample Inkscape affiliate button
Besides the buttons, the question of submit form, and minor issues like fonts
or colors or bullets, is there anything else we still need to discuss here?
Created attachment 2896 [details]
Mockup with buttons based on Benji's.
Here it is with buttons based on Benji Park's. I did change the border color
from white to black, since the surrounding background is white, and the text to
black (white outline) for better contrast. Again, I used Inkscape as the
sample affiliate.
(In reply to comment #35) > > Here is my attempt at some buttons. I took inspiration from Jonathan and > > from the ocal logo. I also used clipart from the library by AJ Ashton. Not > > sure about the font colors though, any ideas? > > I think the words need to have good contrast against the background, to be > easy to read at a quick glance, and the ones colored with the yellow-orange > gradient, against a background of yellow-orange gradient, are definitely > lacking in that regard. > I agree here. I also feel that -- especially from looking at the buttons in Jonadab's mockup -- they are a little TOO bold and bright and don't really sit well with the rest of the page as a whole. Also, if the gradient was a little less strong it would probably make achieving contrast a lot easier. > I'm less sure about the white. I think it is okay against the orange but > falls a little short against the yellow. I tried each of the two colors > of blue from the site, with either white or black outlines, and I was not > satisfied with that either. Then I tried black text outlined in white, > and I think that may provide the best contrast against the yellow-orange > gradient background. At the bottom, against the yellow, the black shows > up really well, and at the top, against the orange, the white outline > helps it to show up better than it might otherwise. What do you think? > The issue would probably be solved if there was a less extreme background gradient used. > I tend to like blue better as a color, but > that is a personal thing. Well, perhaps. Blue is quite a "comfortable" colour and it appears to both sexes. In contrast yellow/orange conveys "warning" or "danger" generally. I'm not saying it's bad to use them, but in moderation definitely. I think the yellow/orange background is just a bit too overwhelming, and besides, blue is already used a lot on the site (as you said). > The other question I have is about the books; they don't communicate the > concept of browse to me. Maybe I'm just thick? Granted, "Browse" can be > an abstract and somewhat difficult concept to portray... I agree. If I were to do it I'd probably use a magnifying glass. But it's a hard one to portray... magnifying glass also communicates "search". There's certainly no hard in investigating different elements and seeing how they look. Actually, I quite liked the folder icon you put in next to my download button. I think that worked especially well as it is a similar colour to the "download" arrow, so the two sit well together. > Oh, another point from back the other day... > > > We don't need buttons for affiliates -- it's important to keep their > > own branding. At most they will need resizing or something. > > It is certainly [..] overall shape (and size) as our browse > and download buttons. Yeah yeah, you're right of course ;). Don't take me too literally ;). My point was really that they are not items where the design needs to be discussed -- the affiliate's logo just need to be integrated with our other buttons. > > forms confuse people (that's Normal People who don't use Linux and write C++). > > Hey, I don't write C++, does that make me normal? ;-) Naaah, you're just a wannabe ; ) I don't write C++ either. One day... > > Anyway, I got in contact with Neil Stuber, who told me the font he used > > was Arial Black 41.5pt. > > Aha! I hadn't recognized it before, I think because it had been resized > to a different scale horizontally than vertically, making it look less > fat, but apart from that this does appear to be the right font. Yeah, I had to compress it horizontally -- I tried to fit the l in "Download" to the l in "Clip" in order to get the right size. I guess the o in "Download" can then be matched to the o in "Browse" if the need arises. > I think the words need to have good contrast against the background, to be > easy to read at a quick glance, and the ones colored with the yellow-orange > gradient, against a background of yellow-orange gradient, are definitely > lacking in that regard. Yeah, I wasn't happy with the look. > I'm less sure about the white. I think it is okay against the orange but > falls a little short against the yellow. I tried each of the two colors > of blue from the site, with either white or black outlines, and I was not > satisfied with that either. Then I tried black text outlined in white, > and I think that may provide the best contrast against the yellow-orange > gradient background. At the bottom, against the yellow, the black shows > up really well, and at the top, against the orange, the white outline > helps it to show up better than it might otherwise. What do you think? > > Oh, and if these buttons end up against a white background, they will want > a black outline, rather than a white outline. That's an easy change, and > no big deal, and the black looks fine around the yellow-orange. Yes, easy change, I was just going to the logo look. > I'm not 100% sure whether I prefer Jonathan's blue-gradient button, or > these yellow-orange ones. I tend to like blue better as a color, but > that is a personal thing. The yellow-orange is probably more eye-catching. > Then again, the blue probably integrate's better into the look of the site. > OTOH, the yellow and orange are from the logo, and we'd talked about using > those colors more on the site. (Perhaps to go along with those buttons we > should be using more red for boundary lines and things, yellow for the > sidebar background instead of baby blue, and so on? I guess we can leave > most of those questions for the stylesheet to answer later.) On the > gripping hnd, the orange arrow on the download button stands out really > well against the blue gradient background and really brings out the idea > of download; whereas, with the yellow-orange gradient background, the focus > tends to be on the button background or the whole button, rather than the > arrow element. Hmmm... I think I want another opinion or two. It might work to tone down the gradient (which should be red to yellow btw, with a bit of orange in the middle) but what I really noticed when looking at the mocks is that the brightly colored buttons really jumped out where as jonathans really blended well with the rest of the site. My problem is that they blended almost to well. I know that yellow goes really well against a blue background. Maybe the button overall should be blue and the text colored. It is a graphic after all and I'm hoping to have it stand out more. > The other question I have is about the books; they don't communicate the > concept of browse to me. Maybe I'm just thick? Granted, "Browse" can be > an abstract and somewhat difficult concept to portray... My first thought was a magnifying glass but then that = search. Maybe it's just me but a folder has never comunicated browse to me, unless you are computer literate. If we are hoping to move away from the heavy technical look of the site then I think that we should try something a bit more accessable to those not so computer literate. So I agree that the books are not a perfect match, lets brainstom and see what does comunicate browsing. My first thought is eyes or eyeballs maybe looking at some objects. Not sure how that looks exactly but it might convey the concept better. > Let's brainstom and see what does comunicate browsing Right. It's a thorny problem. My first-draft button used the white pointing-finger graphic, which is intended to resemble how a web browser makes the mosue cursor look when hovering over a link. But it's awefully plain, and maybe it doesn't convey "browse" very well either. The book isn't doing it for me, and I agree that the folder doesn't really fit with the type of browsing that we're getting at here. A disembodied eyeball is liable to gross people out... Spectacles, maybe? "Browse" is a hard thing to communicate visually. What if we use for that button a graphic that communicates the idea of artwork, since that's what's being browsed? Would that work? Now, back to the button colors... > It might work to tone down the gradient (which should be red to yellow > btw, with a bit of orange in the middle) but what I really noticed when > looking at the mocks is that the brightly colored buttons really jumped > out where as jonathans really blended well with the rest of the site. > My problem is that they blended almost to well. I know that yellow goes > really well against a blue background. Maybe the button overall should > be blue and the text colored. It is a graphic after all and I'm hoping > to have it stand out more. I think this paragraph hits the nail on the head: the blue buttons don't stand out as well as we might like, and the orange ones are a bit much, calling too much attention to the background. Something in between may be called for. I'm wondering if maybe the background of the buttons, rather than being a simple gradient, should maybe have some texture, to make it pop out a bit more, without going all out for the blinding colors. Created attachment 2901 [details]
Revised mockup again; buttons now have blue background, red/orange/yellow gradient text
This still needs work.
I was aiming to combine the best of both button styles, but it clearly needs a
real artist's touch. For one thing, I managed somehow to create a backround
pattern that was almost, but not quite, entirely unlike what I intended. I was
aiming for a brushed-aluminum look on the blue, and as you can see I didn't
precisely get there. I'm also not at all sure I oriented the gradient on the
letters in the best possible way, and there may be other issues.
NOTE: I filed this in the wrong bug accidentally. The other thing is that the site really doesn't need IMO a complete overhaul. It would be quite simple to simplify things by moving the right sidebar, replacing the google search with the keyword search at the top of the screen, and then tweaking the fonts, etc to focus more on getting to the clip art. My primary interest in the site is two fold: 1.) Get Clip Art 2.) Submit Clip Art Those are the primary interests IMO to anyone who visits the site. Created attachment 2912 [details]
Another mockup
How about this? I really didn't like the gradient you put it on the text
Jonadab -- apart from anything else it made it quite unreadable. As you can see
though, pretty much all I did was make the text that OCAL yellow colour, to
make the button a "stick out" a bit more. I'm not particularly fond of the
texture either because I think it adds un-necessary complication and detracts
from the real focus of the button: the text and the icon.
What do you think?
The yellow text on the buttons is okay with me, and, as I said, the texture
didn't look like I wanted anyway. I do think we need someone else, besides the
three of us, to weigh in at this point on two things:
1. The buttons: their look, colors, and stuff, and how to make
them look *right*; we're a lot closer than when we started
out, but I think there's something still not quite right.
2. The presence or absence of the submit form on the front page
(and, if present, where to put it). We discussed this, but
I don't know that we really reached a consensus.
Bryce? Nicu?
After we settle those two things, I think we can look at HTML/CSS
implementation, tweaking fonts and sizes, and so forth.
Nathan Eady wrote: > >1. The buttons: their look, colors, and stuff, and how to make > them look *right*; we're a lot closer than when we started > out, but I think there's something still not quite right. >2. The presence or absence of the submit form on the front page > (and, if present, where to put it). We discussed this, but > I don't know that we really reached a consensus. > >Bryce? Nicu? 2. the simple submit form on the front page is the *only* one I use for uploading images, I don't like the other one (probably because I find it unintuitive, with the most important field, "Browse", at the bottom instead at the top) 1. I tried to stay out of this talk (about the look of buttons) because I know we have plenty of people each of them perfectly able to draw good buttons and each of them with his own vision (resulting a high flamewar potential) (In reply to comment #45) > Nathan Eady wrote: > > > >1. The buttons: their look, colors, and stuff, and how to make > > them look *right*; we're a lot closer than when we started > > out, but I think there's something still not quite right. > >2. The presence or absence of the submit form on the front page > > (and, if present, where to put it). We discussed this, but > > I don't know that we really reached a consensus. > > > >Bryce? Nicu? Nathan Eady == Jonadab, right??? Confuse me why don't you ; ) > 2. the simple submit form on the front page is the *only* one I use for > uploading images, I don't like the other one (probably because I find it > unintuitive, with the most important field, "Browse", at the bottom instead at > the top) Would you be content removing the submit form from the front page if the other one was reworked a bit? > 1. I tried to stay out of this talk (about the look of buttons) because I know > we have plenty of people each of them perfectly able to draw good buttons and > each of them with his own vision (resulting a high flamewar potential) It is true that there is high flamewar potential, but if we just ignore the issues that won't make them go away. We haven't had a flamewar yet, and my feeling is that if we all remain calm and be specific about things we like/dislike and accept each other's viewpoints then it's fine. At the moment I don't think we'll get anywhere without some feedback from some other people. Jonathan Leighton on 2005-08-18 06:34 [reply] ------- > > Nathan Eady == Jonadab, right??? Confuse me why don't you ; ) this is my chance to get the most offtopic bugzilla comment ever: http://www.bright.net/~jonadab/personal/j/#saga Yes, is the same person > Would you be content removing the submit form from the front page if the other > one was reworked a bit? Don't know, let see the reworked version first. IIRC, when we created the actual layout I asked what is the main target of the site: end-users or contributors and we considered both as targets, but the project was new and we needed contributors. Now, one year later it may be or may be not the time to change the focus. According to this it may be or may be not useful to have a submit form on the front page. > It is true that there is high flamewar potential, but if we just ignore the > issues that won't make them go away. I said I trust people working on buttons to be able to create good ones. This is art, we can end with two buttons both equally good but completely different. (In reply to comment #47) > > Would you be content removing the submit form from the front page if the other > > one was reworked a bit? > > Don't know, let see the reworked version first. I'll create a new bug. > > It is true that there is high flamewar potential, but if we just ignore the > > issues that won't make them go away. > > I said I trust people working on buttons to be able to create good ones. This is > art, we can end with two buttons both equally good but completely different. Okay, but somehow or other we need to come to a decision. Let me try to break it down: * We seem to have agreed on the font -- both variants use Arial Black * We seem to have agreed that an arrow is appropriate for the download button * We seem to have agreed that the buttons need a black outline List of things we haven't agreed on (accompanied by my opinions): * The actual arrow used. Personally I prefer mine -- the colour is another thing to be discussed but I prefer the shape of mine. * Background colour -- I think the focus should be the contents of the button, not its background. That's why I chose to use blue. * Text colour, although I think this is rather dependant on the background colour * Browse icon -- all things considered, I quite like the use of the OCAL icon for this. It seems most appropriate, especially given how difficult it is to convey with an icon! I think the most important ones in this list is the background colour and the browse icon. This is like a list within a list ;) How about when things look good, post to the list the mockup, plan, etc. It is hard to keep track of everything on here and at that point will bring more ppl. into the fold. What do you all think? > I tried to stay out of this talk (about the look of buttons) because I > know we have plenty of people each of them perfectly able to draw good > buttons and each of them with his own vision (resulting a high flamewar > potential) My instincts tell me that these buttons are not going to be a flamewar. A bikeshed, maybe, but not a flamewar. So far most of what we've said about them we've agreed on, and what we're looking at in the most recent mockups is a combination of more than one person's work. But we need another artist's eye. > the simple submit form on the front page is the *only* one I use for > uploading images, I don't like the other one (probably because I find > it unintuitive, with the most important field, "Browse", at the bottom > instead at the top) If the other form is unintuitive, then it needs to be fixed. I think I already knew that, vaguely, in the back of my head, but this confirms it. (That, *in itself*, is not an argument for getting rid of the one on the front page, but either way, an unintuitive form is one we should revise. We can spin that off to the other bug, though, for now.) > Nathan Eady == Jonadab, right??? Confuse me why don't you ; ) Sorry, yes, at work I use my real-world name; whereas, from home I use the username I picked up in college. (Long story short, there were too many people named Nathan (roughly, three per hall in the guys' dorms), so it was either go by my last name all the time or get a monicker; I got one, and it stuck.) > this is my chance to get the most offtopic bugzilla comment ever Around the time of the 1.0 release, b.m.o. had some *extremely* off-topic bugzilla comments, notably in certain "bugs" that were off-topic in the first place or just plain in-jokes, and then the comments went off-topic even for the bug's topic. All of which is neither here nor there... > > Would you be content removing the submit form from the front page if > > the other one was reworked a bit? > Don't know, let see the reworked version first. Hmmm... Actually, yeah, being just one page, that can probably be reworked before we are ready to move on this holistic redesign anyway. > IIRC, when we created the actual layout I asked what is the main target > of the site: end-users or contributors and we considered both as targets, > but the project was new and we needed contributors. Now, one year later > it may be or may be not the time to change the focus. I'm pretty sure we still want both users and contributors, but the question is more about finding a balance that works as well as possible for as many people as possible, balancing how it works for users against how it works for the contributors and developers. > How about when things look good, post to the list the mockup, plan, etc. > It is hard to keep track of everything on here and at that point will bring > more ppl. into the fold. What do you all think? We're approaching that point, I think. The list software doesn't like attachments (probably for good reasons), but I can always throw mockups up on the web someplace and put URIs in a list message. Yeah, I'll do that, when I think we've gotten as far as we can without it, which will probably be pretty soon now. We've made quite good progress already. There really are just a few points left to go over and clear up... Going back to Bryce's four things that the site needs to answer... > * Understand what the project is about and just how much clipart there is > * Search/browse for clip art > * Upload their own clip art > * Feel welcome to get more deeply involved Number one is the main blurb. Currently, it mostly covers what the project is about, and does not tell how much clipart there is. However, we could easily enough add wording to it to cover that point. On the other hand, the release announcment, just below, can be expected to cover this point. Is that enough, or should this information be more prominent? Number two appears in three places in the current mockup: at the top of the sidebar, in the main "what the project is about" blurb, and with the buttons (although there's not a search button, so search is only covered twice; still, I think that's enough). Numbers three and four both have links in the sidebar, and also in the main "what the project is about blurb". We're still determining if that's enough. Oh, and have we heard back from Benji what he thinks about the yellow text? Upon closer inspection, Arial Black is *not* the font in the logo. You can see the difference quite noticeably in an uppercase C. Most of the letterforms are quite similar, but it is very clearly not identical on the uppercase C. The font is: Myriad Pro Black Cond I said that in one of my posts I thought... Check the example: http://www.font.com/free/myriad-pro-black-cond.php I pulled the font out the original logo file. It is an adobe font from their new font pack of opentype fonts that is standard in all adobe apps like the newest illustrator, photoshop, etc. It is a font I received with a previous purchase of adobe illustrator, but you know, I'm not sure on the legality of the use of that font on our site...hence why we need open fonts!!! > The font is: Myriad Pro Black Cond > I said that in one of my posts I thought... Ah, yes, I'd missed that somehow; I see it now. > It is an adobe font from their new font pack of opentype fonts that > is standard in all adobe apps like the newest illustrator, > photoshop, etc. Ah. I don't have any Adobe products except for the Reader, so that explains why I don't have it on any of my systems. > but you know, I'm not sure on the legality of the use of that font > on our site... IANAL, but from what I have been given to understand: * Distributing the font per se is something we can't do unless Adobe chooses to allow it, due to copyright law. This probably includes embedding the font (although I'm not sure we use any formats that support embedded fonts anyway). * But distributing materials (e.g., graphics) that have been rendered using it is probably okay. People think nothing of distributing paper documents that have text rendered with a non-redistributable font, and AFAIK there's nothing magic, legally, about paper in this regard. However... > hence why we need open fonts!!! In some ways, it would be nice to use a freely-redistributable font for most of the text-rendered-as-graphics on the site, because that would allow anyone to create the graphics -- e.g., if we needed a new button or a new sidebar section header, anyone could create it, not just someone who has invested money in Adobe products. Of course, that only matters for the logo if we want its font to match other things on the site. Whether that's necessary is something we haven't spent much discussion on yet. We could leave the logo as it stands and use a different font (perhaps a seriffed font, for a nice obvious contrast) for the other things. I was just going to use the same font as the logo uses because Jonathan suggested it, and I didn't have any real objection -- not because I thought it was strictly necessary. So perhaps here's the question: is it better to keep the extant logo/banner with the font it has (which, incidentally, I quite like for that), or is it better to pick a freely-redistributable font so that it's easier to make other things (such as buttons and sidebar section headers) match it? I'll comment on the rest later cause I'm supposed to be working, but I have access to that font here at work, so I can use it if we need. As I said in a previous comment, one of my colleagues told me that once you convert a font to a path, it becomes a drawing and is no longer subject to the copyright of the font. So I think we're ok using it. (In reply to comment #54) > I'll comment on the rest later cause I'm supposed to be working, but I have > access to that font here at work, so I can use it if we need. As I said in a > previous comment, one of my colleagues told me that once you convert a font to a > path, it becomes a drawing and is no longer subject to the copyright of the > font. So I think we're ok using it. Meh, stoopid -- I just realised rejon said he has the font! Anyhow, two is better than one. I don't really have much else to say about any of thes really, I'm just gently nodding (*nod*). On Monday I will (hopefully) change my latest mockup to use the correct font and upload it again. Benji may/may not wish to change his too (??) but then I'd fully support making a post to the list asking for feedback. I have taken the mockup to the next level: http://www.openclipart.org/index-simple.php This is in CVS, so we can all fiddle with it until we're either happy with it or tired of fiddling ;-) Note that all changes are designed to not interfere with the existing site, until we are ready to switch over to the new one, which we aren't yet. This is especially important when editing the CSS. I also created a News page, which the new sidebar links to. However, some of the other links in the new sidebar currently don't go anywhere, e.g., the affiliates link. Oh, and I didn't know how to set up a rotating thing in PHP, so unless we want the front page to be written in Perl, somebody else needs to do that part. My PHP foo is definitely not up to that. So currently the mockup just points to Inkscape all the time. It's the only one we've done an affiliate button for anyway. That's another task that has to be done before we can go live with this. Oh, about the buttons, those are in CVS too, both the SVG source and also the PNG versions that the site actually uses. For some of the affiliates, the buttons might need to be done in PNG directly, due to the relevant branding elements' not being available in vector form. (In reply to comment #56) > I have taken the mockup to the next level: > http://www.openclipart.org/index-simple.php > > This is in CVS, so we can all fiddle with it until we're either happy with it or > tired of fiddling ;-) Good > Oh, and I didn't know how to set up a rotating thing in PHP, so unless we want > the front page to be written in Perl, somebody else needs to do that part. My > PHP foo is definitely not up to that. So currently the mockup just points to > Inkscape all the time. It's the only one we've done an affiliate button for > anyway. That's another task that has to be done before we can go live with this. I'll do it. Comments: * Can we make the buttons bigger? * I'm not a fan of the markup in certain places -- particularly the sidebar -- I'll make changes myself and let people know. Other than that, I think it's loooking quite good. > Can we make the buttons bigger? Yes. They are SVG. (Well, on the page they're PNG, but they were designed as SVG and exported to PNG, so we can export them again, easily.) I tried them at 128px wide, and they didn't look big enough, so I tried them at 150px wide, and that was better, but we can try larger sizes and see how they look. > I'm not a fan of the markup in certain places -- particularly the sidebar -- > I'll make changes myself and let people know. Sure thing. I will fiddle with the button sizes, you fiddle with the sidebar. How is the size of the buttons now? (In reply to comment #59) > How is the size of the buttons now? Much better :) Markup for the sidebar is now drastically improved. PHP affiliates rotation coming up... The affiliates link can now be randomly generated. However, currently only an Inkscape button exists so only an Inkscape button appears. For more buttons to appear, they will need to be added to the $affiliates array on line 262 of includes/functions.php. resolved by the introduction of cchost |
Use of freedesktop.org services, including Bugzilla, is subject to our Code of Conduct. How we collect and use information is described in our Privacy Policy.