Archive for the ‘Canvas’ Category

Irregular Shapes – Part 4

Friday, July 25th, 2014

Previously in this series we’ve looked at how to display images with irregular outlines, beginning with simply rounding the corners, but also displaying them in a speech bubble. In this final article of the series we’ll look at displaying an image with a love heart outline.

Irregular Shapes – Part 3

Friday, July 18th, 2014

In the previous articles in this series, we’ve looked at two different approaches for creating an image with rounded corners. In this article, we’ll look at creating a speech bubble effect, similar to those used in some messaging apps such as WhatsApp.

Irregular Shapes – Part 2

Friday, July 11th, 2014

In the previous article we looked at how we can use an alpha mask to create a round cornered image, although there were a couple of reasons why it wasn’t entirely suitable for our requirements. In this article we’ll look at an alternative mechanism for achieving the same result but without using a second image.

Irregular Shapes – Part 1

Friday, July 4th, 2014

A little while ago I was asked about how to create images with irregularly shaped outlines such as those in WhatsApp which are shaped like a speech bubble. In this series we’ll look at some techniques for doing precisely that.

Blurring Images – Part 7

Friday, March 28th, 2014

In the previous article we performed some simple optimisations which enormously improved the frame rate of our animations. However, we mentioned that increasing the size of the area that we wish to blur will slow the frame rate because the complexity of the blur operation will increase exponentially. In this article we’ll look at an alternative approach which should permit us to animate larger areas.

Blurring Images – Part 6

Friday, March 21st, 2014

In the previous article we looked at frame rates, and explored how we can measure them by adding some simple benchmarking logging. In this article we’ll look at implementing our dynamic blurring so that we can animate things, and optimising things to improve our framerate.

Gradient Text

Friday, March 29th, 2013

Recently there was a comment on the article on Text Shadows asking how to fill text with a gradient. In this article we’ll look at a simple technique for doing precisely that.