Closed Bug 1281811 Opened 3 years ago Closed 3 years ago

Create new, consistent component bar screenshots for SeaMonkey Help


(SeaMonkey :: Help Documentation, enhancement)

SeaMonkey 2.42 Branch
Not set


(Not tracked)



(Reporter: isaacschemm, Assigned: isaacschemm)




(2 files, 3 obsolete files)

User Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:45.0) Gecko/20100101 Firefox/45.0 SeaMonkey/2.42
Build ID: 20160503211837

Steps to reproduce:

The following pages in Help have small screenshots of the component bar:
* Customizing SeaMonkey > Toolbars > Component Bar - taskbar.png
* Using Mail & Newsgroups (highlights Mail icon) - task_mail.png
* Using Mail & Newsgroups > Reading Messages (highlights Mail icon with new mail notification) - task_newmail.png
* Using Mail & Newsgroups > Using Address Books (highlights Address Book icon) - taskbar-ab.png
* Creating Web Pages (circles Composer icon) - composer_icon.png

Actual results:

taskbar, task_mail and task_newmail all use the old Netscape classic / Mozilla Suite theme's icons.
taskbar-ab and composer_icon use the Modern theme and Netscape icons.

Expected results:

The screenshots should be updated to be consistent with each other, and use either the current Default or Modern theme. This will also remove Netscape branding.

Additionally, the highlighting of certain icons in these screenshots should be consistent. Currently, task_mail and task_newmail dim other icons, while taskbar-ab and composer_icon circle the relevant icon.
Blocks: 1278566
Attached file (obsolete) —
Here's a set of 5 component bar images that use the Default icon theme.
To highlight specific icons, I made all the other icons grayscale and put them at 25% opacity (see the included .xcf file in gimp.)
Attachment #8764683 - Flags: feedback?(stefanh)
(In reply to Isaac Schemm from comment #1)
The new png are 32bit bit depth(?), old ones only have 8nit. I doubt that that can have any negative results, but someone with knowledge should decide.
I think the new png, which have the same names as the original ones in folder "...\chrome\en-US\locale\en-US\communicator\help\images", would be ideal as replacements of the old images.

Assignee due to facts
Assignee: nobody → isaacschemm
Severity: normal → enhancement
Ever confirmed: true
Comment on attachment 8764683 [details]

We actually already have a mixture 4-, 8-, 24- and 32-bit images. I'm a little bit in-between here... I'm slightly inclined to think they're a bit too washed out, but maybe that's my eyes. How does it look if you just reduced the opacity?
Attachment #8764683 - Flags: feedback?(stefanh)
Do the "disabled" (not highlighted in the picture) icons look too washed out, or the regular icons?

Reducing the opacity would make them less visible, and increasing it would make them more so. I could also make them not grayscale. My main goal is to make sure that the Mail icon is still distinct from the rest when they're all "grayed out".

I could also just circle the icons with a red circle like Address Book and Composer currently do.
Sorry, I ment the "disabled" icons. I do prefer the washed out style compared to a red circle, I'm just a bit concerned that it's hard to see what the washed out icons mean. Can you try and see how it looks like if you don't use any grayscale?

Also, bevare of the fact that you made them all the same size (which is good), but in at least the composer page the image dimensions are hardcoded which you need to adjust or remove (I'm unsure why we set the dimensions there so you can try and see if it works without them). Right now the image will be stretched to the hardcoded dimensions.
OK, good to know.
Here's a version where the icons aren't grayscale.
Attachment #8764683 - Attachment is obsolete: true
Attachment #8766001 - Flags: feedback?(stefanh)
Comment on attachment 8766001 [details]

Yeah, I think these are better.
Attachment #8766001 - Flags: feedback?(stefanh) → feedback+
Attached patch component-bar-image-update.patch (obsolete) — Splinter Review
A patch to apply new component bar screenshots to SeaMonkey Help in the comm-central tree and update the dimensions for composer_icon.png in composer_help.xhtml
Attachment #8766304 - Flags: review?(stefanh)
Comment on attachment 8766304 [details] [diff] [review]

>-<div><img src="images/composer_icon.png" width="128" height="23"
>-  alt="" /></div>
>+<div><img src="images/composer_icon.png" alt="" /></div>
> <div style="-moz-margin-start: 80px;"><strong>Composer icon</strong></div>

It would be nice if the text was more in line with the composer icon. 80px makes the text start too far at the right, 50px makes more sense. Also, we should use margin-inline-start instead of -moz-margin-start. Mind fixing these 2 things as well and put up a new patch (you have r+ automatically)?
Attachment #8766304 - Flags: review?(stefanh) → review+
Attached patch component-bar-image-update.patch (obsolete) — Splinter Review
Changed left margin to 55px
Attachment #8766304 - Attachment is obsolete: true
Why 55?
It seemed to line up a bit better (the first "C" in "Composer" with the Composer icon.) 50px was almost there but didn't look quite right.
It could also be aligned with the center of the image if you think that would be better.
Aha, I see. The reason for 50px is that I think that it looks better when the "C" starts slightly before the Composer icon - a bit like the lineup you can see when looking at the mail taskbar icons. Centering is always tricky, since the text might not be of the same length if it's localized.
OK, that makes sense. I'll go with 50px.
Attachment #8766537 - Attachment is obsolete: true
Comment on attachment 8766796 [details] [diff] [review]

Great, thanks.
Attachment #8766796 - Flags: review+
Closed: 3 years ago
Resolution: --- → FIXED
Target Milestone: --- → seamonkey2.47
You need to log in before you can comment on or make changes to this bug.