Closed Bug 649450 Opened 14 years ago Closed 14 years ago

Request for an icon for the Mozmill Crowd extension

Categories

(Marketing :: Design, task)

Product:
Marketing
Component:
Design
Type:
task
Priority:
Not set
Severity:
normal

Tracking

(Not tracked)

Status:
RESOLVED FIXED

People

(Reporter: whimboo, Assigned: victoria.pater)

References

(
URL
)

Details

Attachments

(6 files)

mozmill crowd icon v1
29.85 KB, image/png
Details
movement.
13.46 KB, image/png
Details
mozmill crowd icon v2
35.18 KB, image/png
Details
mozmill crowd icon v3
37.93 KB, image/png
Details
mozmill crowd - assets
184.44 KB, application/x-zip-compressed
Details
Smiley Crowd
343.48 KB, application/octet-stream
Details
In QA Test Automation we have an on-going project for crowd sourced testing of Firefox with Mozmill. For this extension and the various web sites involved we need an icon to visualize what's the extension is for. To help you understanding the extension, we already have collected some notes and proposals what could be shown in the icon. Who is the target audience of the extension * Testers from the community * Collaboration between different teams * Everyone is located on a geographical spot around the world Purpose * Faster and richer testing cycles by automated testing of Firefox UI with ease Gain from using the extension * Collecting test results and information of the users system for analysis End Goal * To better the product (Firefox) Potential representative symbols in the icon * Super basic window (indicate Firefox without logo) * An indication of software (no app logo) is the testing product (could be Firefox or Thunderbird, or any other application in the future) * Sense of speed or haste (blur? or whatnot) * Cogwheel or machinery (Steam) (automation) * Globe/world (community) or people, crowdsourced focus on people * Cables to connect everyone to a central place or nexus * Indication/symbol of testing, or exposing issues (magnifying glass, bug) Tara, if you have questions I will be around this week, so we can have a talk in person if wanted/needed. Thanks!
Lets talk more tomorrow AM and we can see what the best way to move forward is.
Per our conversation: Looking for icons that would go in a few different spaces, and therefore work well in roughly 3 different sizes: * 64x64 add-ons manager. * 16x16 favicon and toolbar icon * 128x128 website view ------------------- Some general thoughts around what this should represent: * Indication of community and automation. * Communities / people connected around the world. * Everyone around the world is helping us... * The collective, groups of people coming together for greater good. Name of Add-on: Mozmill Crowd. ------------------- Timing: Roughly mid-may, May 13th ------------------- Next steps: * Henrik and team to share some icon samples that they like as inspiration. * Creative to share some initial concept ideas, and icon samples
Two links to browse through for some potential icon inspiration. Would be nice to look at the best icons already in the add-ons gallery as well. * http://bit.ly/hVjGLF * http://istockpho.to/geMrgm
Hey guys, let me know if you had any additional thoughts here. Otherwise, I'll work with Lee to brainstorm a few initial directions and we can go from there. I think going with something circular to reinforce the "global" aspect is a good starting point. But if you have any additional thoughts, now's the time to share them :) Thanks.
Not so much an icon but an illustration I stumbled upon at that second link I kind of like for inspiration is http://www.istockphoto.com/stock-illustration-14178947-teamwork-solutions.php?st=8391b57, with the focus on people, teamwork, and the cogwheels I suppose referencing the automation. There's some really interesting ones on that authors page http://www.istockphoto.com/search/lightbox/6924125/#e717731
Tara, I had to travel back in the last days and had a day off. We will collect ideas and will report back by latest tomorrow.
We did some searches on the given websites and also discussed own ideas and how to put them together. Actually it's kinda hard and we would need your expertise. But so far here our findings: * Community: http://bit.ly/dPLZ0l It's great to see the different colors of the skin, which visualizes that people around the world are playing a big role. * Automation: http://bit.ly/fpY9wI Given the different sizes of the icon we probably need an object in the icon which will stay the same and could be identified in the 16x16 case. * Examples One idea we came up with, is a fox with a spinning globe at the fingers and which gets pushed up and stabilized by the community. In this case the automation part isn't really to identify and probably hard to downsize. You can see a quick and dirty drawing here: http://people.mozilla.com/~hskupin/downloads/example.jpg On the other hand the above mentioned gear could be the central piece with the community arms in it. Those could hold some kind of rotating machinery. Tara, I hope that helps a bit so you get an idea about the basic ideas we have. If you need more information please ask and we will try to get back to you ASAP. Thanks.
Attached image mozmill crowd icon v1 —
Hi all, Thanks for all of the design fodder and inspiration. In the interest of scalability, I tried going fairly simple w/ this icon - combining the cog metaphor with different colors and sizes, representing a diverse group of community pulling together to achieve a task. I sort of 'borrowed' the design style of some of the sample links you commented with, but if you like the general design - I can redo the treatment into a more unique style. Let me know your thoughts!
Thanks Lee. I think you did a great job of distilling the direction into a simple, abstract, yet meaningful icon. I think we can likely tweak and polish this... but overall I really like the direction. Will let Henrik comment though since it's his project :) Henrik if you can let Lee know your feedback asap that'd be great. I want to make sure you guys get this asap and that Lee can (ideally) wrap it up by end of this week at the latest. Thanks.
Assignee: tshahian → ltom
This looks cute! As Tara has already mentioned it's simple and tells a good story. Also it fits well into a 16x16 sized icon. Aaron and I have further talked about it and came up with some ideas for tweaks: * Right now there is a grey background. We feel that it would better present the global community when we could show a globe in the background. This can even be a zoomed in view with mostly the ocean and parts of a continent in a corner. Something like the following illustration but without the wireframes: http://www.shutterstock.com/cat.mhtml?searchterm=globe&x=0&y=0&search_group=&lang=en&search_source=search_form#id=55840078 * There is empty space at the bottom of the icon which is not covered by the gears. Can we make it so all gears are positioned a bit outside of the available area, also at the bottom? Enlarging them should be probably the easiest solution. * When I have seen the colors I got an idea. We have different sizes of gears. Can we make it so we have red, yellow, and green from small to large? That would match our expectation with "As more automation is done as better (greener) Firefox will be". In the same steps the faces could turn from frowning to smiling. * It would be nice to see some kind of radial blurring for the gears to show off the activity. Again, we think it's a great first iteration and we are curious to see how we can proceed. If any of the above mentioned ideas is not possible please let us know. We know that some of those effects will not be clearly visible in smaller sizes but that would be fine. Thanks Lee!
Status: NEW → ASSIGNED
THanks for the feedback, Henrik. I like the idea of putting a globe behind the cogs - and tried it - but the level of detail is really detracting from the cogs and their story. What could be a solution is to make the background an earthy-blue, and forgo the continents. Also, I really like the idea about transitioning from red to green and going from small to large/ sad to happy. I'm also going to try to implement this. Not sure how the blurring will render, so I'm going to work around that too... stay tuned. going to try to send you a new mockup to review soon. THanks!
Lee and I had a mid-air collision :) here's my feedback (which supports his thoughts I think) Thanks Henrik. Appreciate the quick feedback. I think we can definitely polish up a few things here, but I'm not sure if I entirely agree with some of your suggested feedback. Mainly because the canvas we have is very tiny, which means that simple/abstract works best than adding too much detail. With that in mind, here are my thoughts in response to your feedback: * I think we can try different background colors if you like, but adding a globe with earth/water elements might be adding too much detail here and taking away from the gears concept (which still captures the diverse communities working together to move things forward concept). I vote against the globe, personally.. but understand where you're coming from with that. * We can scale up/move the gears a bit to have them bleed off. They all bleed off a bit, we can do more if you wish. But I personally like the balance right now. Perhaps we can fill that empty space up a bit more by re-positioning the graphic slightly. * I don't see a problem with changing the gear colors. Sounds good :) * Blur effects, etc may not look as nice as you think - especially given the size. I think leaving it crisp works best. Maybe there's a subtle thing Lee can try... not sure. ---------- That's my 2 cents :) Will let Lee comment as well. Overall though I think this is going to look great in the end with some tweaks. Thanks Henrik!
(In reply to comment #12) > * I think we can try different background colors if you like, but adding a > globe with earth/water elements might be adding too much detail here and taking > away from the gears concept (which still captures the diverse communities > working together to move things forward concept). I vote against the globe, > personally.. but understand where you're coming from with that. Probably I was not clear enough. I understand your concerns and I fully share them. That's why I have said a zoomed view, which means that we do not want to see the whole globe. As Lee already has mentioned a bit of water would even be enough, so we can get rid of the a bit boring gray background. If any schema of a continent will not work even not a small indication or a soft one, we are fine with it. > * We can scale up/move the gears a bit to have them bleed off. They all bleed > off a bit, we can do more if you wish. But I personally like the balance right > now. Perhaps we can fill that empty space up a bit more by re-positioning the > graphic slightly. Sounds like a good alternative. Can we try both ways to see the differences? > * Blur effects, etc may not look as nice as you think - especially given the > size. I think leaving it crisp works best. Maybe there's a subtle thing Lee > can try... not sure. Ok. So what about strokes to indicate the speed like what has been done on one of those icons (running man): http://bit.ly/eWjasu > That's my 2 cents :) Will let Lee comment as well. Overall though I think > this is going to look great in the end with some tweaks. Thanks Henrik! Thanks you too. It's great to get that feedback, especially because we are noobs in that area. :)
Attached image movement. —
Something subtle like this might work, or using lighter shades of the gear colors to show movement. But this will likely only be visible in the larger size. So, something to keep in mind. Will Lee figure out the best way to respond to that though :)
(In reply to comment #14) > colors to show movement. But this will likely only be visible in the larger > size. So, something to keep in mind. Will Lee figure out the best way to > respond to that though :) Sure, that's what we were thinking of.
Attached image mozmill crowd icon v2 —
Hi all, Thanks again for the feedback and constructive discussion. Again, I tried implementing the globe background, but it was much too much detail to render well, even at the biggest icon size. In this version you will see: - cogs go from: 1. small, red, frown 2. medium, yellow, blank face 3. large, green, happy! - cog motion lines are very subtle - you may only notice them in the largest version - blue (earth) background w/ gradient bursts behind cogs to retain their definition.
First, it's a great update and soo cute! The cogs look great, also the motion lines are awesome and are going into the right direction. :) We had a further discussion and I want to bring up our points: * What do you mean with "details to render" for the globe? As I have mentioned in my last comment we don't think it's necessary to show the complete globe, but only a zoomed in area. We discussed that and still think that an indication would be kinda valuable. With the reordering of the cogwheels there is space at the lower right corner, which could fit a bit of a land mass. Blurring should make it less distracting. Also a bit more darker blue would then be nice to visualize it is water, something in-between what we have now and the border. * The cogs are blending through the borders. When you zoom in you can clearly see it for the green one. * We are missing the app style shining (http://bit.ly/hhASw3) you had in your first version of the icon. We both think it would make the icon even more brilliant. This shining should probably replace the gradient you have used for the background now. We hope that we can agree on those points and get it realized. If you want to have direct feedback just ping me on IRC.
Hi Henrik Thank you for the feedback. I'd like to wrap these up as Lee has a number of other items on his plate that need his attention -- I think that we're really close. Here are my responses: * "Details to render" refer to the fact that this is a very small canvas (as you know) and adding any more elements behind the cogs other than a basic color or subtle elements (like the motion) would clutter up the piece and work against you. There's definitely not enough space to show anything that would properly echo a globe (even if it's not showing the full globe). So, I respectfully disagree with you here and suggest that we keep this simple and apply a blue background to represent the globe - which Lee has already done. Anything else would drown out the cogs. * There is a line of pixels bleeding off the top. Lee can clean that up before posting finals. * Shine: Lee, if it's quick to do. Could you please apply a slight shine to these as you did in the first round? --------- So, I'm going to ask Lee to do the last two bits and close this out. I think it they look great. Sound good? Thanks Henrik.
(In reply to comment #18) > properly echo a globe (even if it's not showing the full globe). So, I > respectfully disagree with you here and suggest that we keep this simple and > apply a blue background to represent the globe - which Lee has already done. > Anything else would drown out the cogs. I trust your experience. It would have been nice if we could see such an attempt, just to see it ourselves. But only if such a version is still laying around. So could we at least make the blue a bit darker? > * Shine: Lee, if it's quick to do. Could you please apply a slight shine to > these as you did in the first round? When that step is possible we also should remove the gradient from the background. Two of them stacked on top of each probably doesn't look that good. > So, I'm going to ask Lee to do the last two bits and close this out. I think > it they look great. Sound good? Thanks Henrik. Sure, sounds fine. A question beside, would it be easy enough for later to extract the cogwheels? I'm thinking about using those to visualize the test results in the UI of the extension. Means: red for test failures, yellow for disabled tests, and green for a successful test run. All of the cogwheels should have the same size. Shall I file a new bug for it once it is needed?
Attached image mozmill crowd icon v3 —
Hi Henrik, Here's another mockup of the icons. I think you will be pleased to see I was able to work in a globe graphic in the background while retaining the cog-faces definition. Added the 'shine' back on the icon, and cleaned up all the edges. I can also extract all three cogs for you to use at a later time. If you are happy with these 3 icons, I can send you final PNGs today.
Looks great, thanks Lee. I'd like to wrap this one up soon.
Attached file mozmill crowd - assets —
Hey all, I'm attaching a .zip file of: - 3 icon PNGs (128, 64, 16 px versions) - 3 cog PNGs (128x128 size, so you could scale down if needed)
Thanks Lee for the 3rd version of the icon. It looks great and fixes any of our concerns from above. We think we are good to go with this version. We probably need some other sizes of the icon which I have forgotten about, i.e. for the toolbar (large/small setting). Could we get access to the vector image or would we have to ask for an icon size each time we need a new one?
Glad you like the icons, Henrik. Here's a link to an AI file containing the icons, and the 3 cogs: http://intothefuzz.com/leetom/MISC/mozmillcrowd_icon.ai
Thanks! Closing. Henrik, enjoy your new icon. Lee, great work.
Status: ASSIGNED → RESOLVED
Closed: 14 years ago
Resolution: --- → FIXED
Hey Henrik, got your email. I'm going to ask Rhonda to update the graphic. I suggest turning all the cogs into happy faces / smiles, vs. worrying about the details of their expression. The idea is to convey that the net result of working together is "positive" --> hence the happy faces. I think that works best and it's a quick change we can make. I'm reopening this bug for simplicity, but am just going to ask for one change vs. more/tweaks. Sound good?
Assignee: ltom → rspencer
Status: RESOLVED → REOPENED
Resolution: FIXED → ---
Sounds perfect. Please let get us back to you by latest tomorrow with all the icon sizes we really need additional to the ones we were already talking about.
Status: REOPENED → ASSIGNED
Necessary sizes of the icon: 16x16, 24x24, 32x32, 48x48, 64x64, and 128x128. If you can also export a size of 256x256 would be nice. The separate cogwheels we do not need at the moment. We would come back later once we have the needs for those. Thanks.
Assignee: rspencer → victoria.pater
Attached file Smiley Crowd —
all sizes should be attached.
Looks good to me. Henrik, please confirm so we can close. Thanks Victoria!
Yes, all we need is in there. Thanks for the quick turnaround.
Status: ASSIGNED → RESOLVED
Closed: 14 years ago → 14 years ago
Resolution: --- → FIXED
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: