#624 closed defect (fixed)
Several icons does not look nice in the ring
Reported by: | erikos | Owned by: | eben |
---|---|---|---|
Priority: | Unspecified by Maintainer | Milestone: | |
Component: | design | Version: | Unspecified |
Severity: | Critical | Keywords: | |
Cc: | wadeb | Distribution/OS: | Unspecified |
Bug Status: | New |
Description
Eben - can you have a look at them? What are the guidelines they need to follow?
screenshot: http://dev.laptop.org/~erikos/maze.png
At least to me this looks wrong.
Attachments (9)
Change History (25)
comment:1 Changed 15 years ago by erikos
- Severity changed from Unspecified to Critical
comment:2 Changed 15 years ago by tomeu
comment:3 Changed 15 years ago by eben
Here is a better reference for icon creation, with some creation and verification scripts as well: http://wiki.laptop.org/go/Making_Sugar_Icons
I'll look into moving this page to the SugarLabs wiki...
comment:4 Changed 15 years ago by garycmartin
Happy to rework the offending icon, if no one else has started yet, just reassign to me.
erikos: other than Maze (just too big, right?); which others were vinegar in your eye, the mamamedia ones?
comment:5 Changed 15 years ago by garycmartin
- Cc wadeb added
Well, here's a very quick tweak to the Maze icon. This simple scale trick can be used on any oversized or non-centred icons now that the rounded rect highlight effect makes any deviations from the spec standout. Basically just wrap the svg drawing with the below, or something similar (I might be + .5 of a translate unit over the top if you want to tweak):
<g transform="translate(4,4)"> <g transform="scale(0.84)"> ... ... </g> </g>
comment:6 Changed 15 years ago by garycmartin
might be + .5 of a translate unit over the top
Actually, looking at a misc selection of icons, I think it might be the rounded rect that's 1 width unit too narrow and 1 height unit too short (with the left edge and top edge staying where they are). Either that or there's a fair few naughty slightly off centre icons.
erikos: until you mentioned it, I hadn't really noticed, now I can't stop seeing it :-)
comment:7 Changed 15 years ago by erikos
Gary, thanks for the icon, does work nicely here. As you pointed out - there is more then one issue it looks like. The icons need to follow the guidelines. Does not look nice if some are bigger than others. Some icons seem to fully use the 55px - some seem to leave some space. Have not looked at the details - but I think you know what I mean ;p
As well it looks like the drawing algorithm has some issues as well - see #636.
The other icons are the flipstick puzzles, comic builder and maybe a few more. I guess the ones that we include in soas-2 should be ideally the same size.
Sorry to have you made aware of this aesthetic drama :)
comment:8 Changed 15 years ago by erikos
- Bug Status changed from Unconfirmed to New
make it new as Gary confirmed it.
comment:9 Changed 15 years ago by garycmartin
OK will re-scale Flipsticks, Jigsaw Puzzle, Slider Puzzle, Comic Builder and will look out for others (Speak, Infoslicer, Joke Machine, Write, Chat are all badly centred or over scale). What's much more worrying to me is that this new hover design is so much less visually tolerant – seems like many Activity authors already have too much difficulty making their svg icons – trying to frame every activity icon with a border, in this aspect, is making other aspects of the UI look worse not better (i.e no one reported issues with these icons until now, as most were 'good enough' to get by).
The only though I have on this just now is that slightly increasing the size of the rounded rect will make it more visually tolerant to padding/centring issues – the down side being that it eats some space in the home layout. Is this a reasonable suggestion?
comment:10 Changed 15 years ago by wadeb
SVGs are inherently scalable. Can't we just have Sugar detect the dimensions of the icon and automatically scale it to the appropriate size?
comment:11 follow-up: ↓ 12 Changed 15 years ago by garycmartin
FWIW, I've attached corrected (re-scaled and/or re-centred) Flipsticks, Jigsaw Puzzle, Slider Puzzle, Cartoon Builder, Speak, InfoSlicer and Write.
comment:12 in reply to: ↑ 11 Changed 15 years ago by alsroot
Replying to garycmartin:
FWIW, I've attached corrected (re-scaled and/or re-centred) Flipsticks, Jigsaw Puzzle, Slider Puzzle, Cartoon Builder, Speak, InfoSlicer and Write.
thanks, i'll update Flipsticks, Jigsaw, Slider, Cartoon, Speak and InfoSlicer
comment:13 Changed 14 years ago by erikos
- Milestone changed from 0.84 to 0.86
comment:14 Changed 11 years ago by walter
Can this ticket be closed?
comment:15 Changed 10 years ago by walter
- Resolution set to fixed
- Status changed from new to closed
I think these are all resolved. Please reopen if there are more icons that need corrections.
Some guidelines for icons here:
http://wiki.sugarlabs.org/go/DesignTeam/Human_Interface_Guidelines/The_Sugar_Interface/Layout_Guidelines