Splash of Colors

BUSINESS REQUIREMENT

This application is based on the concept of ‘selective coloring’ where image modification is done using different brushes. This includes basic image processing techniques like image size alteration, cropping, selective coloring, and recoloring of images by conversion of image to grayscale or colored. Users can import images from the camera or gallery and process them as they wish. They can add vivid colors to their desired image with brush strokes.

This application also needed to include filtering features. These filters can be applied only in the brushed region of the image. The processed image can be shared on Facebook, Instagram, and Twitter or can be sent via email.

CHALLENGES

• Applying filter on the brushed path was the major challenge.
• Change colored portion of the image to a grayscale image using the black and white brush, and plot the color pixels correctly.
• In-app purchases to get more filters/brushes and an Ad-free experience.

SOLUTIONS

• Include 4 types of brushes: sharp / blur / semi-translucent sharp / semi-translucent blurry. The first one is the basic brush which will turn images into colored images or gray images in each stroke with full depth. The second one is the same as the first one with a blurred edge.
• When a user drags the third or fourth brush over color images, the color gets decreased by 50% less saturated than before. The saturation decreases gradually as the brush stroke increases. If the user already applied a gray overlay on an image, the color saturation will increase by 50% of the opposite color as the brush strokes. The fourth brush edge gives a blurry effect rather than the sharp edge of the third brush.
• Keep the brushed pixels and their location in a multi-dimensioned array and apply the filter to those pixels.
• Implemented GPU image library for better and fast application of filters to the pixels.
• Implemented pattern brushing technique to overcome the problem of turning the colored brushed part to a grayscale image.
• Optimized image ratio and its pixels for getting a better editing experience.

IMPACT

• The image editor performs well as expected by the client since it is built on the GPU image which gives a faster rendering of graphics and a better output.
• This app allows recoloring of images and applies desired photo effects to them.
• The edited image could be shared via email or posted on Facebook, Twitter, or Instagram.

KEY TECHNOLOGIES

• Swift 2.2
• GPU Image
• Applovin SDK
• Core graphics