Add 3x3x3 Speed-Blind icon

[dmint789]

Preview:

[dmint789]

@jfly thoughts?

[lgarron]

I think this is a pretty good approach, but the white outline on the blindfold needs to be transparent.

Also:

• Do you think we'll see other speed blindfolded events? I could imagine people holding it for 2x2x2.
• This differs from the existing stopwatch design (penalty-A4d1). If it's a unique design (and not taken from a potentially copyrighted iconset), that's fine by me (although I might make the lines a bit thicker for small resolutions).

[dmint789]

I think this is a pretty good approach, but the white outline on the blindfold needs to be transparent.

Also:

• Do you think we'll see other speed blindfolded events? I could imagine people holding it for 2x2x2.
• This differs from the existing stopwatch design (penalty-A4d1). If it's a unique design (and not taken from a potentially copyrighted iconset), that's fine by me (although I might make the links a bit thicker for small resolutions).

I doubt we'll ever see 2x2 speedblind, especially since it would be hardly any different from regular 2x2. I thought about making it a more generic icon, but then there'd be way too much detail.

I actually really dislike the way the stopwatch looks in penalty-A4d1, and would rather not use it for this icon. This is a unique design I made, based on inspiration from some examples I found online, which is a normal practice. I can edit it though, that's no problem.

I'll try to fix the outline too, once we fully agree on the other points.

[jfly]

LGTM, modulo the white outline.

I'm also supportive of updating cubing-icon penalty-A4d1 with whatever stopwatch design you land on here.

[dmint789]

So am I good to just fix the outline and make the lines like 30% thicker?

[jfly]

That works for me

[dmint789]

I've made the lines thicker, but I can't figure out how to make the outline transparent. Please advise.

[dmint789]

@jfly ping

[jfly]

@dmint789 sorry for the delay. I've made the border transparent. I'm not sure if it's the cleanest way of accomplishing this or not, I am far from an Inkscape expert.

[dmint789]

@jfly can you please tell me how you did it? I'd like to know for the future. Is it the same as the borders on multi blind old style? I dunno how those were done either though.

[jfly]

I duplicated the blindfold, and used inkscape's clipping functionality. This was a bit tricky for me because I needed to get rid of the stroke to make this work (which I think I did by converting the object to a path).

[dmint789]

Oh, the stroke is actually quite easy to disable. You mind if I try again? Maybe I'll come up with something more elegant. I'll use that clipping function you mentioned.

[jfly]

You mind if I try again?

Please, go for it!

[dmint789]

@jfly I've fixed it now. Do you want me to update the stopwatch in that other icon within the scope of this PR too?
@lgarron please review the changes

[jfly]

Do you want me to update the stopwatch in that other icon within the scope of this PR too?

Sure, go for it!

[dmint789]

@jfly done. Please review and make a new version of the npm package with this icon and the new Guildford icons.

[lgarron]

I definitely like the design, but there are a few changes I'd make:

• Convert the round part of the stopwatch to a path outline rather than a path stroke, to ensure that the SVG coloring works consistently with other icons for any non-iconfont use cases.
• Remove unused stroke data.
• Minify using svgo/SVGOMG.

I was a bit concerned about the use of a clip path, but it looks like like this has wide support in browsers and SVG tools.

[dmint789]

@lgarron I think I can do the first two, but I don't get the third point. How do I minify it, and what's the purpose of doing that?

[lgarron]

How do I minify it, and what's the purpose of doing that?

The simplest is probably to use https://jakearchibald.github.io/svgomg/

Smaller file sizes can help a page load more quickly over the internet. We encourage people to use the icon font, but if anyone used the SVGs that could definitely help load times with pages that are essentially just text and icons (e.g. https://unofficial.cubing.net/).

[jfly]

We have never asked people to minify SVGs in the past. If we care about this, I'd rather we add it as a build step.

[dmint789]

Yeah, I agree (and not just because that's less work for me, haha)

[dmint789]

@lgarron I have removed all of the stroke data (at least I think I did), and transformed the circle into a path.

[dmint789]

@lgarron ping :)

[dmint789]

@jfly since @lgarron isn't responding, could you cancel his blocking review?

[dmint789]

@jfly is this good to merge now? I've reverted the changes to the penalty icon.

I'm happy with dmint789's work

[dmint789]

@jfly thank you. Can you please release a new NPM package with both this and the other new icons?

[jfly]

@dmint789 version 1.1.2 is released!