Add breeze icons for ROOT cern files
ClosedPublic

Authored by alexde on Aug 26 2019, 2:17 PM.

Details

Summary

The original logos can be founded here: https://root.cern.ch/img/logos/ROOT_Logo/ROOT_Logo.pdf
I have used the blue color, which is also used for ROOT's website banner and logo.

Test Plan

Diff Detail

Repository
R266 Breeze Icons
Lint
Automatic diff as part of commit; lint not applicable.
Unit
Automatic diff as part of commit; unit tests not applicable.
alexde created this revision.Aug 26 2019, 2:17 PM
Restricted Application added a project: Frameworks. · View Herald TranscriptAug 26 2019, 2:17 PM
Restricted Application added a subscriber: kde-frameworks-devel. · View Herald Transcript
alexde requested review of this revision.Aug 26 2019, 2:17 PM
alexde edited the test plan for this revision. (Show Details)Aug 26 2019, 2:34 PM
alexde edited the summary of this revision. (Show Details)Aug 26 2019, 2:36 PM
ndavis requested changes to this revision.Aug 29 2019, 6:49 AM
ndavis added a subscriber: ndavis.

I think we should use #1ed4e5 for the color instead since that's what the official logo uses. Normally, I'd say to use a similar Breeze-like color, but mimetype icons are a mess anyway and I don't think it's worth worrying too much about unless Breeze's official color palette is expanded.

The 16 and 22 px versions aren't supposed to have backgrounds and the root symbols are pretty faint. I've remade these for you:

The 32px version isn't lined up with the grid and the emblem in the middle is faint. Generally, one should avoid placing objects on half pixels.

This revision now requires changes to proceed.Aug 29 2019, 6:49 AM
alexde updated this revision to Diff 64935.Aug 29 2019, 12:41 PM

Improve the root logo layout and change the root's color to the offical color 1ED4E5

alexde edited the test plan for this revision. (Show Details)Aug 29 2019, 12:43 PM

I think we should use #1ed4e5 for the color instead since that's what the official logo uses. Normally, I'd say to use a similar Breeze-like color, but mimetype icons are a mess anyway and I don't think it's worth worrying too much about unless Breeze's official color palette is expanded.

I have changed the color for the 64px version. I think we can keep the blue background color as this is indeed the offical background color.

The 16 and 22 px versions aren't supposed to have backgrounds and the root symbols are pretty faint.

Uh, I will make them somehow less faint, though I am not sure how to keep their original character in this case.

I've remade these for you:

Thanks, but the root you created does not resemble the original one any longer. However, I will rework them as well.

The 32px version isn't lined up with the grid and the emblem in the middle is faint. Generally, one should avoid placing objects on half pixels.

I will see what I can do about it.

alexde updated this revision to Diff 64944.Aug 29 2019, 1:30 PM

Also add the new 64px breeze icon.
Add new 22 px icons. Transparent background, less faint, original color.

alexde edited the test plan for this revision. (Show Details)Aug 29 2019, 1:34 PM
alexde edited the test plan for this revision. (Show Details)
alexde updated this revision to Diff 64946.Aug 29 2019, 2:01 PM

Add new 32px icons.

The root is now less faint and uses the original color.

alexde edited the test plan for this revision. (Show Details)Aug 29 2019, 2:08 PM

The 16 and 22 px versions aren't supposed to have backgrounds and the root symbols are pretty faint.

Rethinking it, I think it's wrong. The white background belongs to the logo and should not be removed as the white circle and the root symbol belong together, even
if it is against the Breeze guide line. ;)

My thoughts on your submission:

For the 16px and 22px designs, I would with the designs @ndavis proposed here:

Yes, the symbol there has the same thickness throughout the root sign, which differs from the original branding, but this makes the icon much more discernable and it's not like you could make out that difference at that size anyway.
As @noahdvs mentioned above, the white background should be removed and the entire symbol should be made up of one filled path with no outline (!). This is important to keep the icon looking as intended with the Qt SVG renderer.

As for the 32px and 64px designs, I would much prefer using only two colors by placing white variants of the smaller icons on top of a blue document background.
Example for the 32px icon:

I think this fits much better with other Breeze mimetype icons.

alexde added a comment.EditedAug 30 2019, 1:52 PM

As @noahdvs mentioned above, the white background should be removed and the entire symbol should be made up of one filled path with no outline (!). This is important to keep the icon looking as intended with the Qt SVG renderer

He mentioned that the white background should be removed. He did not mention, that it should be made up of one filled path with no outline. ;-)

As for the 32px and 64px designs, I would much prefer using only two colors by placing white variants of the smaller icons on top of a blue document background.
I think this fits much better with other Breeze mimetype icons.

ndavis saw this differently:

I think we should use #1ed4e5 for the color instead since that's what the official logo uses. Normally, I'd say to use a similar Breeze-like color, but mimetype icons are a mess anyway and I don't think it's worth worrying too much about unless Breeze's official color palette is expanded.

If we go with your suggestion, I think the outer ring should be dropped completely as it distracts more from the root / original branding than it benefits IMHO, like that:

It looks "Breezie" to me. :)

ndavis added a comment.EditedAug 30 2019, 7:35 PM

As @noahdvs mentioned above, the white background should be removed and the entire symbol should be made up of one filled path with no outline (!). This is important to keep the icon looking as intended with the Qt SVG renderer

He mentioned that the white background should be removed. He did not mention, that it should be made up of one filled path with no outline. ;-)

As for the 32px and 64px designs, I would much prefer using only two colors by placing white variants of the smaller icons on top of a blue document background.
I think this fits much better with other Breeze mimetype icons.

ndavis saw this differently:

I think we should use #1ed4e5 for the color instead since that's what the official logo uses. Normally, I'd say to use a similar Breeze-like color, but mimetype icons are a mess anyway and I don't think it's worth worrying too much about unless Breeze's official color palette is expanded.

If we go with your suggestion, I think the outer ring should be dropped completely as it distracts more from the root / original branding than it benefits IMHO, like that:

It looks "Breezie" to me. :)

Alright, try it without the ring. I thought the ring was necessary for it to match the original logo. Removing the ring allows the "root" symbol in the middle to be larger, which makes it less faint.

If the 16px and 22px versions include the ring, then it needs to be in the larger versions as well.

alexde updated this revision to Diff 65264.Sep 2 2019, 6:15 PM
alexde edited the test plan for this revision. (Show Details)

Remove all circles and only use root symbol.
This makes the root symbol less faint and the icons fit better to Breeze overall.

alexde edited the test plan for this revision. (Show Details)Sep 2 2019, 6:19 PM
ndavis requested changes to this revision.EditedSep 2 2019, 7:22 PM

You're getting there.

  • 16px: needs 2px margins on the top and bottom
  • 22px: needs 3px margins on the top and bottom
  • 32px: needs to be lined up with the pixel grid and needs 2px margins on the top and bottom. You'd really be better off basing the background shape on another 32px icon and then applying the colors you want to use rather than trying to use a shrunken version of the the 64px background.
This revision now requires changes to proceed.Sep 2 2019, 7:22 PM
alexde updated this revision to Diff 65307.Sep 3 2019, 12:07 PM

16px: add 2px margins to top and bottom
22px: add 3px margins to top and bottom
32px: use existing and approved 32px icon as template instead of shrinking the 64px version

ndavis accepted this revision.Sep 3 2019, 12:19 PM
This revision is now accepted and ready to land.Sep 3 2019, 12:19 PM

Looks like you've got everything

alexde edited the test plan for this revision. (Show Details)Sep 3 2019, 12:23 PM

Looks like you've got everything

Thank you all for mentoring me! :)

ngraham accepted this revision.Sep 3 2019, 12:44 PM
Closed by commit R266:018b67eff94c: Add breeze icons for ROOT cern files (authored by Marc Henning <marc.henning1@rwth-aachen.de>, committed by ndavis). · Explain WhySep 3 2019, 12:45 PM
This revision was automatically updated to reflect the committed changes.