woensdag 26 juni 2013

Microsoft Outlook Feedback Icon

A common mistake (in my opinion) is that, when using round corners and outlines, the diameter of the corner is not enlarged along. Let me illustrate this with the Outlook Feedback icon. Two speech bubbles, with a white space around the one in front, to suggest some kind of layering.

Microsoft Outlook Feedback Icon

Please take a close look at the white line in between the two blue shapes. This seems to be an offset of the frontmost shape. This results in a white 'blob' at the corner, since the white space is bigger at the rounding than at the straight parts. Personally I prefer this white space to be an outline of the frontmost shape, so the white line has an equal thickness all the way. Compare the improved version below with the one above:

Improved Microsoft Outlook Feedback Icon


Below is the underlying solution. The dotted line is an outline of the frontmost shape. This is used to cut the backmost shape (or simply layerd in between and made white.

Solution


Geen opmerkingen:

Een reactie posten