<?xml version="1.0" encoding="UTF-8"?><rss version="2.0" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:media="http://search.yahoo.com/mrss/"><channel><title>Deep Learning – IMG.LY Blog</title><description>Posts tagged Deep Learning on the IMG.LY blog.</description><link>https://img.ly/blog/tag/deep-learning/</link><language>en-us</language><image><url>https://img.ly/apple-touch-icon.png</url><title>Deep Learning – IMG.LY Blog</title><link>https://img.ly/blog/tag/deep-learning/</link></image><atom:link href="https://img.ly/blog/tag/deep-learning/rss.xml" rel="self" type="application/rss+xml"/><generator>Astro</generator><lastBuildDate>Fri, 12 Jun 2026 10:11:08 GMT</lastBuildDate><ttl>60</ttl><item><title>Inpainting: Removing Distracting Objects in High-Resolution Images</title><link>https://img.ly/blog/image-inpainting/</link><guid isPermaLink="true">https://img.ly/blog/image-inpainting/</guid><description>We teamed up with the Bochumer Institute of Technology to present improved results with deep learning approaches. Here are our experiences from a mission to make editing easier.</description><pubDate>Tue, 08 Dec 2020 15:03:28 GMT</pubDate><content:encoded>&lt;h3 id=&quot;introduction&quot;&gt;Introduction&lt;/h3&gt;
&lt;p&gt;You may know this situation: You are out on a trip when suddenly a unique opportunity for a photograph appears, like a wild animal showing up or sun rays breaking through the rain clouds for a few seconds. Without hesitation, you grab your camera and capture the sight. Later you discover that a distracting object, like a road sign, is ruining your shot. Time for some cumbersome retouching.&lt;/p&gt;
&lt;p&gt;Now, imagine you could erase the distracting object just by highlighting it. Wonderful! From the field of deep learning, a technique for image manipulation called &lt;strong&gt;Image Inpainting&lt;/strong&gt; makes it possible. Image Inpainting aims to cut out undesired parts of an image and &lt;strong&gt;fills up missing information&lt;/strong&gt; with plausible content of patterns, colors, and textures that match the surrounding.&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;Figure 1: Inpainting example. A) shows the original image; B) the masked (input) image; C) the results of the inpainting.&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 1496px) 1496px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;1496&quot; height=&quot;579&quot; src=&quot;https://img.ly/_astro/1_1Tl2Oq.webp&quot; srcset=&quot;/_astro/1_8J1G8.webp 640w, /_astro/1_Zch4i2.webp 750w, /_astro/1_ZygjVb.webp 828w, /_astro/1_2eNKv8.webp 1080w, /_astro/1_1GfTHz.webp 1280w, /_astro/1_1Tl2Oq.webp 1496w&quot;&gt;&lt;/p&gt;
&lt;p&gt;Today we would like to share experiences that we have gained during the application of deep learning inpainting approaches. Furthermore, we’ll present some quality optimization steps that we have implemented to improve results addressing the transformation to high-resolution outputs. But let us start with a quick introduction: who are we and why are we concerned with these kinds of topics?&lt;/p&gt;
&lt;p&gt;We are a small consortium consisting of the &lt;strong&gt;&lt;a href=&quot;https://bo-i-t.de/&quot;&gt;Bochumer Institute of Technology&lt;/a&gt;&lt;/strong&gt;, a research institute aiming to transfer knowledge from academia into industry, and the company &lt;strong&gt;&lt;a href=&quot;https://img.ly&quot;&gt;IMG.LY&lt;/a&gt;,&lt;/strong&gt; a team of software engineers and designers developing creative tools like the &lt;a href=&quot;https://img.ly/products/photo-sdk/&quot;&gt;PhotoEditor SDK&lt;/a&gt; and the &lt;a href=&quot;https://img.ly/blog/building-the-creative-engine-of-the-world/&quot;&gt;UBQ&lt;/a&gt; engine. Together we are working in the EFRE.NRW funded research project &lt;a href=&quot;https://kidesign.img.ly/&quot;&gt;KI Design&lt;/a&gt; that targets artificial intelligence (AI) and deep learning-based algorithms for image content analysis and modification, as well as a leveraging tool kit for aesthetic improvements.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Image Inpainting&lt;/strong&gt; has been a viable technique in image processing for quite some time, even before “Artificial Intelligence” was on everyone’s lips. Common for most inpainting algorithms is that an area of an image is highlighted to be corrected. Many conventional algorithms then analyze the statistical distribution to fill the resulting gap by finding and using nearest neighbor patches. The most famous and state of the art approach of this method is the &lt;strong&gt;&lt;a href=&quot;https://gfx.cs.princeton.edu/pubs/Barnes_2009_PAR/patchmatch.pdf&quot;&gt;PatchMatch&lt;/a&gt; algorithm&lt;/strong&gt;. It uses a fast, structured randomized search to identify the approximate nearest neighbor patches that will fill in the respective part of the image.&lt;/p&gt;
&lt;p&gt;However, there are two &lt;strong&gt;drawbacks&lt;/strong&gt;: first, regardless of the approximation, performance still might be an issue, and second, the results suffer from a lack of semantic understanding of the scene. Thus, research dived into new ideas and directions and tried the application and implementation of AI- and neural network-based approaches to solving these issues.‌‌‌‌ For us, the removal of annoying background content is a useful feature, as it improves the overall image aesthetic. Having this available on mobile devices would be particularly interesting. Due to performance limitations and ever-improving integrated cameras, a mobile solution requires a fast and lightweight model architecture as well as the ability to process high-resolution images.&lt;/p&gt;
&lt;p&gt;Summarized, our expectation for an AI-based inpainting algorithm are:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;removal of (manually highlighted) background objects/persons&lt;/li&gt;
&lt;li&gt;feasibility to process high-resolution images&lt;/li&gt;
&lt;li&gt;fast and lightweight network (applicable for smartphones)&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;The number of publications addressing this or similar requirements has increased enormously in recent years. After digging into the literature, we identified two promising approaches and tested them.&lt;/p&gt;
&lt;h3 id=&quot;testing-and-comparing-model-architectures&quot;&gt;Testing and Comparing Model Architectures&lt;/h3&gt;
&lt;p&gt;These selected networks were based on the latest scientific findings and appeared to provide high-quality output. Both approaches have well-documented repositories – a special thank you to the authors for their great work (of repositories and papers as well)! The selected networks are:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;Partial Convolutional Neural Networks (PCONV); [&lt;a href=&quot;https://arxiv.org/abs/1804.07723&quot;&gt;paper&lt;/a&gt;, &lt;a href=&quot;https://github.com/MathiasGruber/PConv-Keras&quot;&gt;github-repository&lt;/a&gt;]&lt;/li&gt;
&lt;li&gt;Generative Multi-column Convolutional Neural Networks (GMCNN); [&lt;a href=&quot;http://papers.nips.cc/paper/7316-image-inpainting-via-generative-multi-column-convolutional-neural-networks.pdf&quot;&gt;paper&lt;/a&gt;, &lt;a href=&quot;https://github.com/shepnerd/inpainting_gmcnn&quot;&gt;github-repository&lt;/a&gt;]&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;You may be wondering why exactly we chose these models for comparison purposes, as the latest scientific findings sound a bit vague. Indeed, it is considerably difficult to identify the best fitting model architecture. As far as we know, there is no standardized validation method or data set. Most papers demonstrate their results on &lt;em&gt;self-selected&lt;/em&gt; test images and further compare them with again &lt;em&gt;self-selected&lt;/em&gt; approaches. The only option we had was to evaluate models that seemed reasonable to us. A validation method or standardized test set could be a valuable scientific contribution here. Let’s turn back to the selected models.‌‌‌‌ The PCONV network uses multiple convolutional layers and adds a &lt;em&gt;partial convolutional layer&lt;/em&gt;. The key feature is that the convolution does not consider invalid pixels, indicated by an updating mask. This prevents the algorithm from picking up the color of the mask (typically the average color tone of the image) and transmit it into the reconstruction process.&lt;/p&gt;
&lt;p&gt;The &lt;strong&gt;GMCNN&lt;/strong&gt; – a GAN-based model – is built in a special architecture consisting of 3 networks: a generator, split up into three branches addressing different feature levels, a local and global discriminator, a VGG19 net calculating the implicit diversified Markov random field (ID-MRF), introduced in the paper. This ID-MRF serves as a loss term comparing generated content with nearest-neighbor patches of the ground truth image. While the interaction of all three networks is required in the training phase, only the generative network serves for testing and production. More details and figures regarding the model architecture are available in the official &lt;a href=&quot;http://papers.nips.cc/paper/7316-image-inpainting-via-generative-multi-column-convolutional-neural-networks.pdf&quot;&gt;paper&lt;/a&gt;.&lt;/p&gt;
&lt;p&gt;Due to the lack of standardized sets, we created our own test sets addressing different levels of complexity. This also included image data requiring an understanding of semantic structures. In our comparison, we paid special attention to ensuring the filled content was harmonious, and a possible artifact interspersion was reduced to a minimum. In particular, image artifacts could raise issues in terms of translation with respect to high-resolution information. Here is an example output of our tests:&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;Figure 2: Comparison of GMCNN and PCONV model. A) shows the original image; B) the masked (input) image; C) the results of the PCONV network and D) the results of the GMCNN model.&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 2000px) 2000px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;2000&quot; height=&quot;1095&quot; src=&quot;https://img.ly/_astro/2_r92Ec.webp&quot; srcset=&quot;/_astro/2_1AEMMW.webp 640w, /_astro/2_ZtiLji.webp 750w, /_astro/2_H1eho.webp 828w, /_astro/2_18mnqN.webp 1080w, /_astro/2_Z1c3kHp.webp 1280w, /_astro/2_1Hu0Sr.webp 1668w, /_astro/2_r92Ec.webp 2000w&quot;&gt;&lt;/p&gt;
&lt;p&gt;In comparison, the inpainting result based on PCONV suffered from some blurred artifacts and erratically deviating shades, cf. Figure 1C, whereas the GMCNN-based result appeared to be more precise and plausible concerning the semantic context, cf. Figure 1D. You can see this clearly when you look at the grille door that was covered by a person. The GMCNN approach, cf Figure 1D, had recognized and respected the grid structure, while the PCONV overlayed this with a uniform (black) color tone. In consideration of all test data results, we decided to follow up with the GMCNN.&lt;/p&gt;
&lt;p&gt;However, we would like to emphasize that this does not mean that one model architecture is better suited for Image Inpainting than the other. The used weights build-up of the PCONV architecture may achieve similar results with further training or different test sets.&lt;/p&gt;
&lt;h3 id=&quot;what-about-high-resolution-inpainting&quot;&gt;What About High-Resolution Inpainting?&lt;/h3&gt;
&lt;p&gt;At the current state of the model, the processing of high-resolution images remains uncovered. Out of all the papers and repositories we found, even papers promising high-resolution often just targeted image sizes of 1024x1024 pixel at maximum. Our expectations were a resolution of substantially more than 2000x2000 pixels. A reason for this issue seemed to be the hardware demanding and time-consuming training phase when processing high-resolution images. ‌‌&lt;br&gt;
Furthermore, the application of a high-resolution inpainting model could entail performance issues. These are not neglectable to us, as we are facing a prospective implementation on smartphones that can’t keep up with the power of a modern graphics card. Thus, an additional challenge is a high-quality transformation of low-resolution outputs to a high-resolution.&lt;/p&gt;
&lt;h3 id=&quot;apply-low-resolution-inpainting-output-to-high-resolution-images&quot;&gt;Apply Low-Resolution Inpainting Output to High-Resolution Images&lt;/h3&gt;
&lt;p&gt;‌‌The GMCNN model was trained with the &lt;a href=&quot;http://places2.csail.mit.edu/index.html&quot;&gt;Places&lt;/a&gt; dataset, formatted in a 512x680 resolution. Feeding in high-resolution images would exceed the training input size by far and further require information of feature dimensions that the model has never seen before. That could result in almost completely distorted reconstructions.&lt;/p&gt;
&lt;p&gt;A straightforward solution is to downscale the high-resolution image before feeding it to the model and then resize the result up to the original image size conclusively. Due to the upscaling (e.g., via bicubic interpolation), the image details suffer from a loss of quality. Therefore a better approach is to take only the masked areas of the upscaled inpainting prediction and stitch it back into the original image. That prevents the loss of initially known details from the unmasked regions. For the maintained inpainting regions, the lack of image details, as well as the artifacts and distortions, pose a complex challenge that we aimed to overcome with the following approaches.‌‌‌‌&lt;/p&gt;
&lt;h3 id=&quot;shrinking-mask-approach&quot;&gt;Shrinking-Mask-Approach&lt;/h3&gt;
&lt;p&gt;While the inpainted area mostly yields realistic-looking content for the more marginal regions, the performance decreases strongly towards the center, cf. Figure 3D. We especially noticed this behavior for larger masks. Conclusively a recursive inpainting procedure with an iteratively shrinking mask, cf. Figure 3E, seems to be a reasonable approach.  With this concept, we try to improve the inpainting results in a progressive manner starting from the boundary to the center of the masked regions while utilizing the generated information of the preceding recursion, cf. Figure 3F.‌‌&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;Figure 3: Shrinking-mask-approach. A) shows the original image; B) the final inpainting result after applying the shrinking-mask-approach for 4 iterations; C) shows the original image masked by the original mask (model input for iteration 1); D) the inpainting result of iteration 1; E) the inpainting result of the previous iteration 1 masked by a shrunken mask (model input for iteration 2) and F) the inpainting results of iteration 2.&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 1062px) 1062px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;1062&quot; height=&quot;1479&quot; src=&quot;https://img.ly/_astro/3_Z24j7qw.webp&quot; srcset=&quot;/_astro/3_Z1giTCo.webp 640w, /_astro/3_ZPwLax.webp 750w, /_astro/3_ZAqkG6.webp 828w, /_astro/3_Z24j7qw.webp 1062w&quot;&gt;&lt;/p&gt;
&lt;p&gt;To us, it was essential to have a dynamic method that allows the handling of all mask forms and sizes. Therefore, we decided to apply an erosion kernel to the original mask in a recursive fashion until it is fully eroded. The amount of shrunk masks determines the number of inpainting performed by the network.‌‌‌‌&lt;/p&gt;
&lt;h3 id=&quot;two-step-approach&quot;&gt;Two-Step-Approach&lt;/h3&gt;
&lt;p&gt;While investigating and testing various quality optimization steps, we also fed high-resolution images into our model and discovered that the results for smaller masks were convincing. That led us to the hypothesis that not the resolution but rather the number of pixels to reconstruct seems to be the limiting factor. This finding served as the basis for our two-step-approach.‌‌‌‌&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;Figure 4: Two-step-approach. A) shows the original image; B) the final inpainting result after applying the two-step-approach&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 2000px) 2000px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;2000&quot; height=&quot;710&quot; src=&quot;https://img.ly/_astro/4_OlLcn.webp&quot; srcset=&quot;/_astro/4_ZcIuQI.webp 640w, /_astro/4_ZPa8Y2.webp 750w, /_astro/4_1peh2d.webp 828w, /_astro/4_ZdIXGY.webp 1080w, /_astro/4_xfsjk.webp 1280w, /_astro/4_uCJLy.webp 1668w, /_astro/4_OlLcn.webp 2000w&quot;&gt;&lt;/p&gt;
&lt;p&gt;Briefly, the approach works as follows. In the first step, we perform inpainting on a downscaled high-resolution image while applying the original mask. In a second step, we transfer the model output of step one into a higher resolution and perform inpainting again. This time we apply a modified mask containing only small coherent mask regions, for which we exploit the provided higher resolution context information. ‌‌&lt;br&gt;
In more detail, the first step is characterized as the baseline approach, cf. Figure 5: We scale the masked image down to the training resolution of 512x680 pixels and fill up the missing information.&lt;/p&gt;
&lt;p&gt;Optionally, the shrinking-mask-approach can be applied in the first step.&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;Figure 5: Step 1 of the two-step-approach. A) shows the original image masked by the original mask; B) the intermediate low-resolution inpainting result emerging from step 1&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 2000px) 2000px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;2000&quot; height=&quot;709&quot; src=&quot;https://img.ly/_astro/5_PAuNW.webp&quot; srcset=&quot;/_astro/5_ZhyHA5.webp 640w, /_astro/5_ZU0lHo.webp 750w, /_astro/5_1ko4iQ.webp 828w, /_astro/5_2oqGyL.webp 1080w, /_astro/5_Z1TL0dQ.webp 1280w, /_astro/5_htj7.webp 1668w, /_astro/5_PAuNW.webp 2000w&quot;&gt;&lt;/p&gt;
&lt;p&gt;In the second step, we quadruplicate the output of step 1 to a resolution of 1024x1360 pixels. To prevent the resolution loss for unmasked regions caused by this upscaling, we stitch the generated content into the same sized (downscaled) input image. The resulting image serves as the model input for step 2. ‌‌&lt;/p&gt;
&lt;p&gt;To avoid/reduce image artifacts in the subsequent inpainting process, we modify the original mask to contain only the small mask regions and the boundaries of the large mask regions. In detail, we temporarily shrink the mask with an erosion kernel to ablate small mask segments and the marginal areas of larger mask sections, cf. Figure 6B. Finally, we calculate the difference between the original mask and the altered mask, resulting in our desired modified mask, cf. Figure 6C.&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;Figure 6: Mask modification required for step 2 of the two-step-approach. A) shows the original mask; B) the original mask temporarily shrunken by an erosion kernel; and C) the modified mask containing small mask regions and boundary areas only.&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 1946px) 1946px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;1946&quot; height=&quot;536&quot; src=&quot;https://img.ly/_astro/6_Zeoyj0.webp&quot; srcset=&quot;/_astro/6_P3BN5.webp 640w, /_astro/6_Zr5uSS.webp 750w, /_astro/6_ChAk2.webp 828w, /_astro/6_1dIWH7.webp 1080w, /_astro/6_1qfv3T.webp 1280w, /_astro/6_81fGE.webp 1668w, /_astro/6_Zeoyj0.webp 1946w&quot;&gt;&lt;/p&gt;
&lt;p&gt;By re-inpainting, we double the resolution of the generated content for the small contiguous mask regions, cf. Figure 7A bottom right, as well as for the masked boundary areas, cf. Figure 7A upper left. Moreover, through the latter, we achieve smoothing of the intense decay in resolution between the unmasked regions and the generated content arising from step 1. Finally, we scale our image back to the original input resolution and stitch the generated content to the original image to maintain the original resolution for unmasked areas.&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;Figure 7: Step 2 of the two-step-approach. A) shows the inpainting result of step 1 masked by the modified mask containing only small mask areas and boundary regions; B) final inpainting result arising from step 2&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 2000px) 2000px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;2000&quot; height=&quot;717&quot; src=&quot;https://img.ly/_astro/7_3lyip.webp&quot; srcset=&quot;/_astro/7_Z2x2NCb.webp 640w, /_astro/7_QNPLK.webp 750w, /_astro/7_Z1WXR0V.webp 828w, /_astro/7_ZbTJbF.webp 1080w, /_astro/7_Z1nAuf6.webp 1280w, /_astro/7_1GiIWk.webp 1668w, /_astro/7_3lyip.webp 2000w&quot;&gt;&lt;/p&gt;
&lt;h3 id=&quot;conclusion&quot;&gt;Conclusion&lt;/h3&gt;
&lt;p&gt;For us, it was impressive to see how AI-based inpainting can successfully and deceptively realistic fill in missing information. Not only the consideration of structural (semantic) content is an advantage compared to conventional approaches, but especially the decreased demand on required hardware. In our view, this opens up the opportunity to reach a much larger group of users of inpainting algorithms: in place of using powerful hardware and professional software, mobile devices could achieve small but decisive changes.&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;Easy removal of distracting objects with inpainting: Example photo of a red squirrel taking a nap in the trees, distracting twig marked, and inpainted result.&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 2000px) 2000px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;2000&quot; height=&quot;667&quot; src=&quot;https://img.ly/_astro/8_l_Z1kJHjL.webp&quot; srcset=&quot;/_astro/8_l_1JTG5u.webp 640w, /_astro/8_l_26Omlu.webp 750w, /_astro/8_l_1GpI0f.webp 828w, /_astro/8_l_ZgiRCz.webp 1080w, /_astro/8_l_Z1Fvu52.webp 1280w, /_astro/8_l_ZAIwwN.webp 1668w, /_astro/8_l_Z1kJHjL.webp 2000w&quot;&gt;&lt;/p&gt;
&lt;p&gt;In summary, we have dealt with the application of high-resolution images, which is undoubtedly gaining in importance due to the ever-improving smartphone cameras. Processing high-resolution images entail an increasing number of pixels to “inpaint” and could further lead to quality as well as performance issues. Thus, we decided to improve the output of low-resolution networks and to provide them with more information to support a subsequent upscaling procedure.&lt;br&gt;
We have implemented two different approaches, shrinking-mask and two-step-approach that can be applied independently or in a combined manner. It turned out that both methods subjectively increased the image quality. However, this comes along with higher computational demands, as models are applied multiple times.&lt;br&gt;
Overall, we think that the combination of these two approaches will represent a good toolkit for AI-based high-resolution image inpainting. But we’ll keep an eye on the upcoming scientific developments.&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;This project was funded by the European Regional Development Fund (ERDF).&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 449px) 449px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;449&quot; height=&quot;112&quot; src=&quot;https://img.ly/_astro/9_Zv71r7.webp&quot; srcset=&quot;/_astro/9_Zv71r7.webp 449w&quot;&gt;&lt;/p&gt;</content:encoded><dc:creator>Vivien</dc:creator><dc:creator>Philip</dc:creator><dc:creator>Pascal</dc:creator><media:content url="https://blog.img.ly/2020/12/image_inpainting_deeplearning.gif" medium="image"/><category>Deep Learning</category><category>Artificial Intelligence</category><category>Image Editing</category><category>Tutorial</category></item><item><title>Smart Cropping - Automatically crop images to optimal regions with deep neural networks</title><link>https://img.ly/blog/smart-cropping/</link><guid isPermaLink="true">https://img.ly/blog/smart-cropping/</guid><description>Many websites ask you to upload images in specific aspect ratios. Smart cropping allows you to automatically find such images for any aspect ratio. It&apos;s powered by Convolutional Neural Networks, predicting the salient areas of a picture. We describe how smart cropping works and why it&apos;s important.</description><pubDate>Fri, 24 Jul 2020 11:48:34 GMT</pubDate><content:encoded>&lt;p&gt;Pictures are omnipresent on the social web. It is common to instantly post photos of all kinds of events to share with friends and followers. Also, businesses want to show presence on social networks and employ designated social media managers to represent the company and to communicate to customers.&lt;/p&gt;
&lt;p&gt;Let’s assume you work as a social media manager in a company. Your job is to communicate with customers and represent your company on various social media platforms. One part of your job is to share pictures of your company’s work. Since you’re serving multiple social media platforms, you always have to consider their specific aspect ratio requirements for images. One platform wants you to provide square photos, whereas another one asks for pictures in a wide landscape format.&lt;/p&gt;
&lt;p&gt;You are a busy person, you don’t want to waste time on cropping hundreds of images into the proper format, but you also don’t want to crop your pictures weirdly.&lt;/p&gt;
&lt;p&gt;Suppose you want a portrait-oriented version of the following image. Simply choosing the center would lead to an odd picture containing only one half of the bird. What you want is the image to include the region of interest; here, probably the whole bird in the center of the image.&lt;/p&gt;
&lt;p&gt;But how can we automatically find such image regions?&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;A bad image cutout (left) and a good one (right)&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 2000px) 2000px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;2000&quot; height=&quot;927&quot; src=&quot;https://img.ly/_astro/robin_Z27I8c6.webp&quot; srcset=&quot;/_astro/robin_r6J45.webp 640w, /_astro/robin_2wSwjf.webp 750w, /_astro/robin_3nxbk.webp 828w, /_astro/robin_VFwr5.webp 1080w, /_astro/robin_Zz1bpt.webp 1280w, /_astro/robin_Z2uCr6I.webp 1668w, /_astro/robin_Z27I8c6.webp 2000w&quot;&gt;&lt;/p&gt;
&lt;p&gt;When humans look at images, they intuitively focus on significant elements of the photos first. If you look at the following pictures, …&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 2048px) 2048px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;2048&quot; height=&quot;1365&quot; src=&quot;https://img.ly/_astro/image-4_1WFNUQ.webp&quot; srcset=&quot;/_astro/image-4_Z29KSCi.webp 640w, /_astro/image-4_Z2bs8LD.webp 750w, /_astro/image-4_27k41M.webp 828w, /_astro/image-4_Zbc8vk.webp 1080w, /_astro/image-4_Z2hFSu1.webp 1280w, /_astro/image-4_J693X.webp 1668w, /_astro/image-4_1WFNUQ.webp 2048w&quot;&gt;&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 2000px) 2000px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;2000&quot; height=&quot;1333&quot; src=&quot;https://img.ly/_astro/image-2_5wphL.webp&quot; srcset=&quot;/_astro/image-2_Z205taz.webp 640w, /_astro/image-2_Z21LIjU.webp 750w, /_astro/image-2_2h0ttv.webp 828w, /_astro/image-2_ZllleT.webp 1080w, /_astro/image-2_Z2rP6dA.webp 1280w, /_astro/image-2_yVVko.webp 1668w, /_astro/image-2_5wphL.webp 2000w&quot;&gt;&lt;/p&gt;
&lt;p&gt;… you will probably notice that your first focus on the salient parts of the image (maybe the geyser or the sundown for the first image, and the reindeers on the road for the second image).&lt;/p&gt;
&lt;p&gt;As it turns out, it is possible to train neural networks to predict such &lt;em&gt;salient regions&lt;/em&gt;. A prediction of such a network is called a &lt;em&gt;saliency map&lt;/em&gt;. It basically is a grayscale image of the same size as the picture. Each pixel intensity encodes the degree of saliency. These saliency maps allow us to find the best image region for a given aspect ratio.&lt;/p&gt;
&lt;p&gt;But how can networks be trained to predict salient regions in a picture? And how do we, given the salience information, crop an image to an optimal region?&lt;/p&gt;
&lt;p&gt;Fortunately, there was already a considerable amount of research regarding saliency prediction. Basically, there are two main approaches: attention-based saliency prediction and segmentation based saliency prediction. The first group focuses on predicting the center points of human attention regardless of object segmentation and boundaries, whereas the latter considers the most salient objects as a whole.&lt;/p&gt;
&lt;p&gt;For our application, it seemed more suitable to choose an attention-based approach. We decided to go with an &lt;a href=&quot;https://arxiv.org/pdf/1611.09571.pdf&quot;&gt;LSTM based model&lt;/a&gt;.&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;Model architecture, adapted from https://arxiv.org/pdf/1611.09571.pdf&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 1738px) 1738px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;1738&quot; height=&quot;1010&quot; src=&quot;https://img.ly/_astro/image_1taTmC.webp&quot; srcset=&quot;/_astro/image_Z15hRr1.webp 640w, /_astro/image_ZNGbNo.webp 750w, /_astro/image_Z1BzDLm.webp 828w, /_astro/image_24kOwp.webp 1080w, /_astro/image_Z28kxgt.webp 1280w, /_astro/image_217aWP.webp 1668w, /_astro/image_1taTmC.webp 1738w&quot;&gt;&lt;/p&gt;
&lt;p&gt;Briefly summarized, the approach works as follows: A deep convolutional neural network (CNN), pre-trained on image classification, acts as a feature extractor. The value of some intermediate layer (or &lt;em&gt;hidden layer&lt;/em&gt;) is forwarded to the recurrent LSTM that further improves the prediction. The saliency map then is the output of the LSTM, combined with the Gaussian priors.&lt;/p&gt;
&lt;p&gt;In particular, a dilated convolutional network, in our case, a modified RESNET50 already pre-trained on the &lt;a href=&quot;http://salicon.net/challenge-2017/&quot;&gt;SALICON&lt;/a&gt; dataset, is deployed for feature extraction. The original &lt;a href=&quot;https://arxiv.org/pdf/1611.09571.pdf&quot;&gt;paper&lt;/a&gt; for this method used a network for image classification. Many CNNs can act as feature detectors, but they don’t perform equally well. For example, compared to the standard convolutional feature extraction networks, the dilated networks prevent the harmful effects of image rescaling on the saliency prediction. The extracted feature maps are then fed into an attentive convolutional LSTM (recurrent neural network). This iteratively improves the saliency prediction on the obtained feature maps. Finally, multiple trainable (isotropic) Gaussian priors are added to take the bias of human attention into account, since humans tend to focus on the image center.&lt;/p&gt;
&lt;p&gt;We trained the network on the &lt;a href=&quot;http://salicon.net/challenge-2017/&quot;&gt;SALICON&lt;/a&gt; dataset, which includes 20,000 images from Microsoft COCO and 15,000 corresponding saliency maps. The saliency maps were generated by empirical studies modeling human eye fixation by mouse movements. We optimized our network with a composed loss function considering the Pearson Correlation Coefficient and the Kullback-Leibler divergence, representing standard saliency prediction loss measures.&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;Model input, RESNET50 predicted saliency map, and 1:1 image version&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 2000px) 2000px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;2000&quot; height=&quot;491&quot; src=&quot;https://img.ly/_astro/geyser_WW79i.webp&quot; srcset=&quot;/_astro/geyser_ZsdNHS.webp 640w, /_astro/geyser_Zz15Pp.webp 750w, /_astro/geyser_ZmXXUp.webp 828w, /_astro/geyser_SBKzc.webp 1080w, /_astro/geyser_L9wAT.webp 1280w, /_astro/geyser_Z18xSoY.webp 1668w, /_astro/geyser_WW79i.webp 2000w&quot;&gt;&lt;/p&gt;
&lt;p&gt;With this approach, we could already predict pleasing saliency maps suitable for smart image cropping. Unfortunately, our first successful model took up way too much memory, thus being useless for practical applications. Therefore we had to compress the model to a suitable size while maintaining the smart cropping performance as high as possible. After a while of unsatisfactory trials, we found that instead of the RESNET50, we could just deploy the way smaller Keras-intern MobileNet as our feature extraction model.&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;MobileNet predicted saliency map and 1:1 image version&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 2000px) 2000px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;2000&quot; height=&quot;789&quot; src=&quot;https://img.ly/_astro/geyser_mobilenet_ZsyIuK.webp&quot; srcset=&quot;/_astro/geyser_mobilenet_Z1I51LR.webp 640w, /_astro/geyser_mobilenet_2pPX08.webp 750w, /_astro/geyser_mobilenet_1wIvCO.webp 828w, /_astro/geyser_mobilenet_Z21Sz0p.webp 1080w, /_astro/geyser_mobilenet_ZUkA0F.webp 1280w, /_astro/geyser_mobilenet_Z1TpF7L.webp 1668w, /_astro/geyser_mobilenet_ZsyIuK.webp 2000w&quot;&gt;&lt;/p&gt;
&lt;p&gt;This model option indeed provides less precise results for the saliency map prediction. However, it is still suitable for the smart image cropping, since we only need to know the position of the focus points roughly. Not only could we save much memory capacity employing this model variation, but also we could increase the runtime of our model significantly, which was our goal. This way, we created a model suitable for practical applications that are supposed to take over the inconvenient manual cropping process.&lt;/p&gt;
&lt;p&gt;Once we have the saliency map, the smart crop can be determined quite easily. First, we compute the edge length of a window covering the given image as much as possible while fulfilling the required aspect ratio. Afterward, we slide this window over the predicted saliency map and determine the position that maximizes the covered saliency density. Now we only need to crop the image based on the optimal window position. Thus we obtain our smart cropped image suiting the required aspect ratio. The method is inspired by &lt;a href=&quot;https://ieeexplore.ieee.org/document/7780430&quot;&gt;this&lt;/a&gt; paper.&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;Original image, saliency map, square, 16:9, and 9:16 versions&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 2000px) 2000px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;2000&quot; height=&quot;296&quot; src=&quot;https://img.ly/_astro/image-13_Z1t1mdm.webp&quot; srcset=&quot;/_astro/image-13_1pxPx2.webp 640w, /_astro/image-13_36nzF.webp 750w, /_astro/image-13_1XIeq7.webp 828w, /_astro/image-13_ZP5jrF.webp 1080w, /_astro/image-13_1RzOQz.webp 1280w, /_astro/image-13_Z1Mm1vK.webp 1668w, /_astro/image-13_Z1t1mdm.webp 2000w&quot;&gt;&lt;/p&gt;
&lt;p&gt;To sum up, using saliency prediction and maximization, smart cropping enables us to find the best image regions for any aspect ratio. This technique, which we’re currently building into our &lt;a href=&quot;https://img.ly/blog/building-the-creative-engine-of-the-world/&quot;&gt;UBQ engine&lt;/a&gt;, reduces the user’s burden to manually crop images into the required aspect ratio.&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;&lt;img alt=&quot;&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 2000px) 2000px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;2000&quot; height=&quot;502&quot; src=&quot;https://img.ly/_astro/EFRE_Foerderhinweis_englisch_farbig_Z1Uf1uq.webp&quot; srcset=&quot;/_astro/EFRE_Foerderhinweis_englisch_farbig_Zdua0T.webp 640w, /_astro/EFRE_Foerderhinweis_englisch_farbig_Z1Ir0o7.webp 750w, /_astro/EFRE_Foerderhinweis_englisch_farbig_Z27Rae0.webp 828w, /_astro/EFRE_Foerderhinweis_englisch_farbig_10Uf38.webp 1080w, /_astro/EFRE_Foerderhinweis_englisch_farbig_13LHJ0.webp 1280w, /_astro/EFRE_Foerderhinweis_englisch_farbig_1KOi8c.webp 1668w, /_astro/EFRE_Foerderhinweis_englisch_farbig_Z1Uf1uq.webp 2000w&quot;&gt;&lt;/p&gt;
&lt;p&gt;This project was funded by the European Regional Development Fund (ERDF).&lt;/p&gt;</content:encoded><dc:creator>Vivien</dc:creator><dc:creator>Leonard</dc:creator><media:content url="https://blog.img.ly/2020/07/0_Geysir.jpg" medium="image"/><category>Deep Learning</category><category>Machine Learning</category><category>Artificial Intelligence</category><category>AI</category><category>Insights</category></item><item><title>From 2D to 3D Photo Editing</title><link>https://img.ly/blog/from-2d-to-3d-photo-editing-948690b7b45e/</link><guid isPermaLink="true">https://img.ly/blog/from-2d-to-3d-photo-editing-948690b7b45e/</guid><pubDate>Tue, 26 Jun 2018 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;Last November, we released Portrait, an iOS app that helps create amazing, stylized selfies and portraits instantly.&lt;/p&gt;
&lt;p&gt;With over a million downloads and many more portrait images created, we feel that the idea and vision of Portrait was more than confirmed. The central component of Portrait is an AI that is trained to clip portraits from the background, a technique we are eager to further improve and refine. In fact, Portrait helped us to explore a novel technique for image editing, as we were able to leverage a new powerful data set in photography: depth data.&lt;/p&gt;
&lt;p&gt;We began feeding our AI models with the depth data from the iPhone Xs TrueDepth camera and had one goal in mind: to infer depth information for portrait imagery, or bringing three-dimensionality into a two-dimensional photo. Along the way, we created a new architecture concept, that allows performance and memory improvements through modularizing and reusing neural networks.&lt;/p&gt;
&lt;p&gt;In the following article, we’d like to present some of our results along with the insights we made.&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;An image and it’s corresponding depth map. (Source)&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 600px) 600px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;600&quot; height=&quot;801&quot; src=&quot;https://img.ly/_astro/1-r23YFAfXu_OHchBqd4plKw_Z1KsEdA.webp&quot; srcset=&quot;/_astro/1-r23YFAfXu_OHchBqd4plKw_Z1KsEdA.webp 600w&quot;&gt;&lt;/p&gt;
&lt;h2 id=&quot;the-new-cool-depthdata&quot;&gt;The New Cool: Depth Data&lt;/h2&gt;
&lt;p&gt;The usage of depth data in image editing initially became available with the iPhone 7 Plus when Apple introduced ‘Portrait Mode’. By combining a depth map and face detection, the devices are able to blur our distant objects and backgrounds, mimicking a ‘bokeh’ or depth of field effect, which is well known from DSLRs cameras.&lt;/p&gt;
&lt;p&gt;While the actual implementation varies, all major manufacturers nowadays offer a similar mode by incorporating depth data into their image editing pipeline. This is either achieved through the conventional dual or even triple camera on the back of a phone, dual-pixel offset calculations combined with machine learning or dedicated sensors like Apples TrueDepth module. In fact, for a modern flagship phone, some sort of depth based portrait mode is almost a commodity.&lt;/p&gt;
&lt;p&gt;From a developers perspective, things look a little different: Depth data became a first-class citizen throughout the iOS APIs in iOS 11 and such data is now easily accessible on supported devices. Android users obviously have access to depth data as well, either by utilizing multiple cameras or by Googles dual-pixel based machine learning approach, seen in the newer Pixel 2 phones. But contrary to iOS, Android doesn’t yet offer a common developer interface to access such data. In fact, developers aren’t able to access any of the depth information Google or other manufacturers collected within their camera apps. This means developers would either need to implement the algorithm to infer depth from two images themselves or try to rebuild Googles sophisticated machine learning powered system. Neither of these options is practical and probably not even possible given the usual limitations to camera APIs.&lt;/p&gt;
&lt;p&gt;So although being quite common, depth data isn’t as easily accessible for developers as one might think. Right now you’re out of luck on Android, dependent on hardware on iOS and even then limited to the 1.000$ flagship if you’re interested in depth for images taken with the front camera. And last but not least, across all devices and platforms, there is no way for you to generate a depth map for an existing image.&lt;/p&gt;
&lt;h2 id=&quot;deep-possibilities&quot;&gt;Deep Possibilities&lt;/h2&gt;
&lt;p&gt;Despite the restrictions, we decided to first explore the power of depth for image editing, as depth data provides many new exciting creative possibilities:&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;A depth map visualized in 3D space. (Source)&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 1000px) 1000px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;1000&quot; height=&quot;433&quot; src=&quot;https://img.ly/_astro/1-UyLhWSDUQdKU-0wfKcYPgg_2cc62N.webp&quot; srcset=&quot;/_astro/1-UyLhWSDUQdKU-0wfKcYPgg_1RzFAE.webp 640w, /_astro/1-UyLhWSDUQdKU-0wfKcYPgg_1jHR91.webp 750w, /_astro/1-UyLhWSDUQdKU-0wfKcYPgg_1y3t3X.webp 828w, /_astro/1-UyLhWSDUQdKU-0wfKcYPgg_2cc62N.webp 1000w&quot;&gt;&lt;/p&gt;
&lt;p&gt;If we have a depth map for a given image, our editing possibilities are increased dramatically. Instead of a 2D image, a flat plane of color values, we suddenly have a depth value for each individual pixel, which translates into a 3D landscape highlighting distinct objects in the foreground and a clear indication of background.&lt;/p&gt;
&lt;h3 id=&quot;depth-aware-editing&quot;&gt;Depth-aware Editing&lt;/h3&gt;
&lt;p&gt;Instead of relying on color and texture differences to determine fore- and background, one could literally edit these regions individually. This allows adjustments like darkening the background while lightening the foreground, which makes portraits ‘pop’. If we’d be able to generate a high-resolution depth map, we could easily replace the AI currently used in Portrait and would allow even more sophisticated creatives. Thanks to the new APIs, there are already some awesome iOS apps available that specialize in depth based editing. One famous example is Darkroom with their “depth-aware filters”:&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;Darkrooms ‘depth-aware’ filters. (Source)&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 1000px) 1000px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;1000&quot; height=&quot;450&quot; src=&quot;https://img.ly/_astro/1-RP-bR21xfOyDciBNgiQovQ_e4d4z.webp&quot; srcset=&quot;/_astro/1-RP-bR21xfOyDciBNgiQovQ_1k66MV.webp 640w, /_astro/1-RP-bR21xfOyDciBNgiQovQ_H7L4v.webp 750w, /_astro/1-RP-bR21xfOyDciBNgiQovQ_chxWN.webp 828w, /_astro/1-RP-bR21xfOyDciBNgiQovQ_e4d4z.webp 1000w&quot;&gt;&lt;/p&gt;
&lt;h3 id=&quot;depth-of-fieldeffects&quot;&gt;Depth of Field Effects&lt;/h3&gt;
&lt;p&gt;As a depth of field or bokeh effect was the initial motivation for Apple to incorporate depth sensing technology, it is one of the most obvious applications. Depth is crucial for such an effect, as the amount of bluriness of any given region directly depends on its distance to the camera lens.&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 450px) 450px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;450&quot; height=&quot;600&quot; src=&quot;https://img.ly/_astro/1-t-iuevsvhcRZK1krCv4GVw_wkaR3.webp&quot; srcset=&quot;/_astro/1-t-iuevsvhcRZK1krCv4GVw_wkaR3.webp 450w&quot;&gt;&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;Artificial Depth of Field (Source) and 3D asset placement examples.&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 800px) 800px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;800&quot; height=&quot;599&quot; src=&quot;https://img.ly/_astro/1-Uj0A37iDdBj7qljbO8tKEA_1bOpp5.webp&quot; srcset=&quot;/_astro/1-Uj0A37iDdBj7qljbO8tKEA_Blyk2.webp 640w, /_astro/1-Uj0A37iDdBj7qljbO8tKEA_Z1oLE5s.webp 750w, /_astro/1-Uj0A37iDdBj7qljbO8tKEA_1bOpp5.webp 800w&quot;&gt;&lt;/p&gt;
&lt;h3 id=&quot;3d-asset-placement&quot;&gt;3D Asset Placement&lt;/h3&gt;
&lt;p&gt;As mentioned above, a depth map gives us a 3D understanding of the image. We’re able to tell if subject A is positioned in front of or behind subject B. This allows placement of digital assets like stickers or text in a ‘depth-aware’ fashion, but could also be used to apply ‘intelligent’ depth of field, e.g. a bokeh effect that ensures all faces are in focus.&lt;/p&gt;
&lt;h2 id=&quot;enter-deeplearning&quot;&gt;Enter Deep Learning&lt;/h2&gt;
&lt;p&gt;Motivated by the possibilities enabled by depth maps, we were wondering if we could bring this magic to any type of portrait image. We consulted existing literature on depth inference and found various papers¹ and articles on the topic, some of which even presented results that seemed sufficient for our use cases. In our case, we didn’t need accurate, as in ‘this pixel is 30cm in front of the camera’, results, but we were only interested in getting the general distance relations correct. For us, knowing that region A was slightly behind but definitely way in front of region B was enough to generate a visually pleasing effect and by constraining our domain to portrait imagery, we were able to further reduce the tasks complexity.&lt;/p&gt;
&lt;p&gt;Given our experience with deep learning and our current focus on introducing machine learning powered features to the &lt;a href=&quot;https://img.ly/products/photo-sdk/&quot;&gt;PhotoEditor SDK&lt;/a&gt;, we immediately decided to tackle the new challenge with deep learning or more specifically convolutional neural networks. Having a huge dataset of image and depth map pairs available, made this choice even easier. We stuck to a system similar to our previous segmentation model but decided to put more emphasis on allowing the reuse of individual parts, as this would come in handy when adding additional features in the future. To achieve this, we created a new modularized neural network approach named Hydra, which will be presented in an upcoming blog post.&lt;/p&gt;
&lt;p&gt;During development, we followed our tried and tested workflow of starting with a complex custom model, which is then tweaked and refined to match our performance requirements while maintaining the prediction quality we need. Once that was done, we had a fast and small model, trained on thousands of iPhone front camera selfies and capable of inferring high fidelity depth maps from a plain RGB image in under a second.&lt;/p&gt;
&lt;h2 id=&quot;the-prototype&quot;&gt;The Prototype&lt;/h2&gt;
&lt;p&gt;After creating a small model capable of inferring depth maps for any given portrait image, we immediately wanted to evaluate its performance in a ‘real-world’ environment. We decided to build a prototype that applies a depth of field effect to a portrait image, by using the model and its outputs. With our long-term goal of deploying the model to iOS, Android and the web in mind, we built the prototype using TensorFlowJS to explore this newly released library. Our browser demo consists of a minimal ‘Hydra’ implementation with individual modules, one for extracting features and one for the actual depth inference, which can both be executed individually.&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;Our demo web app in action.&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 1200px) 1200px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;1200&quot; height=&quot;442&quot; src=&quot;https://img.ly/_astro/1-rVZLH5Tsq0bBKjFNSlKYlA_Z23OWO9.webp&quot; srcset=&quot;/_astro/1-rVZLH5Tsq0bBKjFNSlKYlA_Z1dWDjs.webp 640w, /_astro/1-rVZLH5Tsq0bBKjFNSlKYlA_KKQvH.webp 750w, /_astro/1-rVZLH5Tsq0bBKjFNSlKYlA_ZoEQaL.webp 828w, /_astro/1-rVZLH5Tsq0bBKjFNSlKYlA_25hiok.webp 1080w, /_astro/1-rVZLH5Tsq0bBKjFNSlKYlA_Z23OWO9.webp 1200w&quot;&gt;&lt;/p&gt;
&lt;p&gt;While being optimized for performance and memory footprint, the trained weights of the model still add up to ~18MB, which we will improve by further fine-tuning or even applying pruning or quantization. Once the models are loaded, all further processing happens on the device though, so you may try out all the samples without worrying about your data plan.&lt;/p&gt;
&lt;h2 id=&quot;results&quot;&gt;Results&lt;/h2&gt;
&lt;p&gt;Seeing our vision come to life was quite a stunning experience. Suddenly our browser was able to perform a complex depth of field effect without the need for special hardware, manual annotations or anything else apart from our image. And the best part was manually moving the focal plane through the image, either by sliding or tapping on different regions. Although being trained on ‘just’ selfies the model handles turned heads, silhouettes and multiple people pretty well and isn’t as restricted to its domain as we initially expected.&lt;/p&gt;
&lt;p&gt;And while our initial prototype is still weighing in at ~18MB, we’re certain to slim that down further in order to use the model in production. Performance wise we were very impressed with the TensorFlowJS inference speed. Even though everything is happening on the client side and is therefore dependent on the clients hardware, we saw inference speed below one second right of the bat and those greatly improved after the initial run, as the resources were already allocated. While not being immediately helpful for the depth inference part, this allowed us to further confirm our theory behind Hydra: Re-running inference once the necessary resources on the machine have been allocated greatly increases performance and might even allow real-time performance after an initial setup-time.&lt;/p&gt;
&lt;p&gt;To summarise, we’re definitely eager to further explore the use of depth data in image editing and think we have found a way to overcome the access restrictions on different platforms and hardware with our custom model. Combined with our new Hydra approach we can see lots of potential features that will delight both our users and customers and we will keep you updated right here.&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;&lt;strong&gt;(1)&lt;/strong&gt; &lt;br&gt;
The papers we extracted most knowledge for our use case from were:&lt;br&gt;
“Depth Map Prediction from a Single Image using a Multi-Scale Deep Network” (&lt;a href=&quot;https://arxiv.org/abs/1406.2283&quot;&gt;arXiv&lt;/a&gt;)&lt;br&gt;
“Deeper Depth Prediction with Fully Convolutional Residual Networks” (&lt;a href=&quot;https://arxiv.org/abs/1606.00373&quot;&gt;arXiv&lt;/a&gt;)&lt;/p&gt;
&lt;p&gt;*&lt;strong&gt;*Thanks for reading! To stay in the loop, subscribe to our&lt;/strong&gt; &lt;a href=&quot;https://photoeditorsdk.us13.list-manage.com/subscribe?u=dc9f652839dbb620d14d6d28d&amp;#x26;id=04a306e4b2&quot;&gt;&lt;strong&gt;Newsletter&lt;/strong&gt;&lt;/a&gt;&lt;strong&gt;.**&lt;/strong&gt;&lt;/p&gt;</content:encoded><dc:creator>Malte</dc:creator><dc:creator>Eray</dc:creator><media:content url="https://blog.img.ly/2020/03/1-Rd4wX6T9PmoXZA56yVLgCQ-1.png" medium="image"/><category>Machine Learning</category><category>Photography</category><category>Deep Learning</category><category>Photos</category><category>Technology</category><category>AI</category></item><item><title>When Creativity meets A.I.</title><link>https://img.ly/blog/when-creativity-meets-a-i-f48ee9a3612d/</link><guid isPermaLink="true">https://img.ly/blog/when-creativity-meets-a-i-f48ee9a3612d/</guid><description>How we built the Portrait App.</description><pubDate>Thu, 16 Nov 2017 23:00:00 GMT</pubDate><content:encoded>&lt;p&gt;A new generation of A.I. algorithms, propelled by rising computational power, new hardware, and a shift in paradigms made its first notable impact in the creative world: The works of &lt;a href=&quot;https://arxiv.org/abs/1508.06576&quot;&gt;Gatys et al.&lt;/a&gt; and &lt;a href=&quot;https://papers.nips.cc/paper/2012/hash/c399862d3b9d6b76c8436e924a68c45b-Abstract.html&quot;&gt;Krizhevsky et al.&lt;/a&gt; have not only gathered considerable public attention but have helped apps like Prisma to be adapted and used by millions. I strongly believe that this is merely the beginning. *&lt;strong&gt;*With the help of machine learning, we will fine-tune, simplify, and automate creative processes and ultimately empower new techniques for design and content creation.**&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;We’ve been following this topic for quite some time now and have spent considerable effort in researching the opportunities of deep learning for our &lt;a href=&quot;https://img.ly/products/photo-sdk/&quot;&gt;PhotoEditorSDK&lt;/a&gt;. After more than a year of research and development, today, we’re finally bringing one of our apps to beta. *&lt;strong&gt;*Portrait**&lt;/strong&gt; combines supervised deep learning with the visual power of our SDK. In a nutshell, Portrait makes creating beautifully designed portrait images as easy as taking a selfie. You turn your selfies into movie poster-like portraits, with styles ranging from double-exposure photography to stencil art. One may consider it as the next iteration of what Apple and Google recently brought to market with their new camera features.&lt;/p&gt;
&lt;p&gt;We’ve now come a long way and gained invaluable insights on our journey so far. Not only did we get our hands dirty with countless training sessions and refinements to the neural net, but our first hand experience also helped to set expectation management right and to dismantle hype from substance. Most notably, it changed our product shaping process, making it more important than ever to foster strong ties between the product stakeholders and to share a common vision and goal everybody can get behind.&lt;/p&gt;
&lt;p&gt;In the following I’d like to share the story of how we built the app and closed the gaps between roles of the stakeholders within this process.&lt;/p&gt;
&lt;hr&gt;
&lt;h2 id=&quot;preface-before-neural-networks-were-the-hot-new-thing&quot;&gt;Preface: Before Neural Networks were the Hot New Thing&lt;/h2&gt;
&lt;p&gt;&lt;a href=&quot;https://www.instagram.com/backslashtwentyone/&quot;&gt;My journey&lt;/a&gt; begins over ten years ago, while I was graduating in neuroscience. Back then, the idea of A.I. was just a vague promise. Artificial Neural Networks were too small, computers lacked the necessary power, and the results were certainly nice, but still too weak to compete with other traditional algorithms. Research felt stuck in tiny little specializations without really following a broader vision. Dazzled by its impracticability, my interest in Neural Networks slowly began to fade.&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;Me&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 837px) 837px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;837&quot; height=&quot;1005&quot; src=&quot;https://img.ly/_astro/image-19_Z1qfSoO.webp&quot; srcset=&quot;/_astro/image-19_Z17E27E.webp 640w, /_astro/image-19_Z181CKI.webp 750w, /_astro/image-19_Z1zXPnP.webp 828w, /_astro/image-19_Z1qfSoO.webp 837w&quot;&gt;&lt;/p&gt;
&lt;p&gt;It took research on Neural Networks another six years to get back on my radar. At that time, I was leading several product developments at 9elements. When I learned about the work of DeepMind (now Google) I had a genuine feeling that this time, A.I. was ready for the limelight.&lt;/p&gt;
&lt;p&gt;As we were in the course of building a library for image editing and computer vision — the PhotoEditorSDK, we realized how much neural nets could also affect the creative space, given its ability to abstract and formalize rules. What if there was a machine that could reproduce the common and dull tasks you have to do as an art director within a second? What if designers could get rid of repetitive and tedious activities that interrupt their creative flow?&lt;/p&gt;
&lt;p&gt;But this topic isn’t something you’d learn in a week, obviously. Still, innovations cannot happen if you’re not willing to take a risk, so we decided to invest considerable time and resources into this technology.&lt;/p&gt;
&lt;p&gt;From a product management’s perspective, this process is actually an anti-pattern: Usually, you wouldn’t want to start by finding the right purpose for a technology, instead you’d find the right technology for a purpose. I still believe that this is essentially the right approach, but sometimes you have to abandon your best practices and take a swim in uncharted waters. Consequently, we asked Malte, one of our iOS engineers, to spearhead our research and take a deep dive into this topic. We decided to start off with image segmentation as the first process that we wanted to optimize through machine learning. Masking and clipping sometimes can be a tedious tasks, and ultimately we wanted to reduce this process that can take several minutes to a single click.&lt;/p&gt;
&lt;hr&gt;
&lt;h2 id=&quot;chapter-1-the-machine-engineer&quot;&gt;Chapter 1: The Machine Engineer&lt;/h2&gt;
&lt;p&gt;Malte, who is a diligent engineer and — how convenient — a &lt;a href=&quot;https://www.instagram.com/buhmi/&quot;&gt;passionate photographer&lt;/a&gt;, started investigating some approaches that focused on image segmentation. You can read more about his journey in his &lt;a href=&quot;https://img.ly/blog/deep-learning-for-photo-editing-943bdf9765e1/&quot;&gt;article&lt;/a&gt;. Although he experimented with various neural networks and post-processing techniques, the resulting masks sometimes lacked the desired accuracy and wouldn’t have matched a user’s expectations. This was a first expected insight. As we want to deliver ready-to-use products to our customers, that don’t need any complex tweaking, this was something we had to fix. Our problems originated mostly from our rather ambitious goal to segment any type of object within an image. It would have required to train with vast data and to scale up the number of filters in our network. However, due to our on-device constraint, this would have killed our carefully crafted performance.&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;Malte&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 960px) 960px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;960&quot; height=&quot;1280&quot; src=&quot;https://img.ly/_astro/image-20_1FNoyt.webp&quot; srcset=&quot;/_astro/image-20_ZMaLGV.webp 640w, /_astro/image-20_ZKUDmW.webp 750w, /_astro/image-20_vAmUF.webp 828w, /_astro/image-20_1FNoyt.webp 960w&quot;&gt;&lt;/p&gt;
&lt;p&gt;Therefore, we shifted this generalist approach to a specialized network for images of a certain domain that the model can be applied to. In hindsight, this seems quite obvious, as our rather small model would have never been able to cope with the amount of variations existing in ‘the real world’ anyway. So, we went back to the drawing board and started discussing which domain to focus on. That’s where we got suck; we struggled to find an obvious trend in our customers’ use cases or known photography platforms.&lt;/p&gt;
&lt;p&gt;It was actually during his summer holiday, when Malte had the flash of genius. At a stop-over in Singapore, he noticed how the city was flooded with selfie-stick wielding tourists. The sheer amount of selfies taken at any public place in Singapore left him astonished and he realised that he just found the right domain. Selfies, and portraits in general, felt like an infinite datasource and prime use case for our image segmentation algorithm. Back home, we decided to focus on selfies and portrait-like photography.&lt;/p&gt;
&lt;p&gt;Malte started searching for portrait datasets and found a collection of roughly 2000 portrait images collected from Flickr. Those were a great starting point and after a few training runs, he already reached satisfactory results, as the model was now capable to capture all available variations. At that point, we had a system at our hands that was able to segment portrait or selfie images in real-time on the device you’re capturing them with. This seemed like a great opportunity, but we didn’t want to stop just there. Releasing a prototype that can free a selfie from its background is nice, but doesn’t feel like something that would truly showcase how AI can make a difference in our creative process.&lt;/p&gt;
&lt;hr&gt;
&lt;h2 id=&quot;chapter-2-the-art-director&quot;&gt;Chapter 2: The Art Director&lt;/h2&gt;
&lt;p&gt;This is where our Art Director Tommi, a renowned graphic artist and former sprayer, stepped in to explore what can be done with *&lt;strong&gt;*a selfie, an accurate alpha mask and the image editing features from our PhotoEditor SDK**&lt;/strong&gt;. When Tommi took the lead, I asked him to draft a vision, a creative direction for our app that combines all the tools and possibilities at our disposal.&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;Tommi&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 820px) 820px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;820&quot; height=&quot;1048&quot; src=&quot;https://img.ly/_astro/image-21_Z16iIDq.webp&quot; srcset=&quot;/_astro/image-21_Zm3RuC.webp 640w, /_astro/image-21_1dqpLk.webp 750w, /_astro/image-21_Z16iIDq.webp 820w&quot;&gt;&lt;/p&gt;
&lt;p&gt;Together, we started exploring portrait trends and unique imagery that would help us find a direction for our showcase. Soon, the walls of our meeting rooms and offices were plastered with inspirational works on portrait photography of all different kinds and styles. This visual catalogue kept inspiring us, although we weren’t sure on which style to settle in the end. It was when we could hardly find any more free spots on our walls and after looking at them for countless times that the idea struck:&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;&lt;strong&gt;What if we could enable users to turn their portrait to what we saw on these walls?&lt;/strong&gt; And this, without actually having the design expertise they would normally be required to do so.&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;Instead of brooding over a completely new form of portraits, we could take all these styles and instantly realize them with the technology we had. From that point on, we flipped our process upside down. Instead of thinking about what the technology is capable of, or identifying a problem worth solving, we aimed for the creative output that we wanted our app to produce. While we started our venture with a technology, we now had visual results that we could work towards. The main question shifted from “What is our technology capable of?” to “How can we achieve this visual output with our technology?”&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;Walls full of inspiration.&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 1400px) 1400px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;1400&quot; height=&quot;857&quot; src=&quot;https://img.ly/_astro/image-22_29aGwu.webp&quot; srcset=&quot;/_astro/image-22_Z5ex44.webp 640w, /_astro/image-22_19M8HX.webp 750w, /_astro/image-22_Z13ggyC.webp 828w, /_astro/image-22_Z2i4DqD.webp 1080w, /_astro/image-22_Z2tRtVa.webp 1280w, /_astro/image-22_29aGwu.webp 1400w&quot;&gt;&lt;/p&gt;
&lt;p&gt;Tommi designed five lead graphics, so our team of engineers and designers could grasp what we ultimately wanted to achieve, using only a selfie and the features of our SDK.&lt;/p&gt;
&lt;hr&gt;
&lt;h2 id=&quot;act-3-closing-ranks&quot;&gt;Act 3: Closing ranks&lt;/h2&gt;
&lt;p&gt;With such a clear vision for our app, we started separating the wheat from the chaff, categorizing the portraits and understanding which operations of our SDK we had to combine, assemble and enhance to create these visuals.&lt;/p&gt;
&lt;p&gt;What followed was a remarkable interplay across multiple stakeholders of our team. While we were always very vocal proponents of building strong relationship between product stakeholders, *&lt;strong&gt;*the introduction of the AI layer actually glued our team further together**&lt;/strong&gt;.&lt;/p&gt;
&lt;p&gt;Our designers started to embrace the engineering perspective, playfully identifying both opportunities and constraints through the tech layer. At the same time, our engineers embraced the design vision and formalized it into code. Let me give you some examples:&lt;/p&gt;
&lt;p&gt;While thinking of the UI, we understood that the transformation of a selfie into a graphical artwork required an immediate feedback for the user, so they can find a pose that works best with the respective artwork. Consequently, we optimized our networks for real-time processing, a true challenge that needed strong expertise in both iOS engineering and neural net architecture.&lt;/p&gt;
&lt;p&gt;Our designs and recipes in turn had to be tweaked to gracefully allow for errors of our AI, because an error rate of 3% can still produce undesired artefacts and mask inaccuracies. We did that by using techniques that beautifully fringed edges of the portrait.&lt;/p&gt;
&lt;p&gt;Altogether, the close cooperation, as well as countless meetings, feedback loops, and the continuous fine tuning of the code and underlying recipes is what brings us here.&lt;/p&gt;
&lt;p&gt;All of this wouldn’t have happened if we hadn’t took the risk to invest in a rising technology in the first place. And all of this wouldn’t have been possible if it wasn’t for the exemplary cooperation between all the stakeholders. Portrait is a showcase of how technology can inspire and tie a team together. This, in the end, is absolutely necessary if we want to achieve the leaps we expect with AI. If you want to impact the creative space by introducing an AI layer to it, your engineers have to think like designers, or at least deeply understand their work.&lt;/p&gt;
&lt;hr&gt;
&lt;h2 id=&quot;the-road-ahead&quot;&gt;The Road Ahead&lt;/h2&gt;
&lt;p&gt;Portrait is a first showcase and one step of many in our venture to wire several AI aspects deep into our SDK. On our journey, we’ve identified many more opportunities where we can help broader audiences to make creative work and design more accessible. Of course, we will also improve our models and networks with better and more data, always keeping in mind the aesthetic and visual output we’d like to achieve. We’ll keep you posted on our updates and next ventures into this exciting new era.&lt;/p&gt;
&lt;p&gt;If you liked what you read, I’d encourage you to check out Portrait and our &lt;a href=&quot;https://img.ly/products/photo-sdk/&quot;&gt;PhotoEditor SDK&lt;/a&gt;!&lt;/p&gt;
&lt;p&gt;Thanks to my co-authors Malte &amp;#x26; Felix!&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Thanks for reading! To stay in the loop, subscribe to our &lt;a href=&quot;https://photoeditorsdk.us13.list-manage.com/subscribe?u=dc9f652839dbb620d14d6d28d&amp;#x26;id=04a306e4b2&quot;&gt;Newsletter&lt;/a&gt;.&lt;/strong&gt;&lt;/p&gt;</content:encoded><dc:creator>Eray</dc:creator><media:content url="https://blog.img.ly/2020/04/image-3.jpeg" medium="image"/><category>Artificial Intelligence</category><category>Creativity</category><category>iOS</category><category>Deep Learning</category><category>Machine Learning</category><category>AI</category></item><item><title>Deep Learning for Photo Editing</title><link>https://img.ly/blog/deep-learning-for-photo-editing-943bdf9765e1/</link><guid isPermaLink="true">https://img.ly/blog/deep-learning-for-photo-editing-943bdf9765e1/</guid><pubDate>Thu, 20 Apr 2017 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;Deep learning, a subfield of machine learning, has become one of the most known areas in the ongoing AI hype. Having led to many important publications and impressive results, it is applied to dozens of different scenarios and has already yielded interesting results like human-like speech generation, high accuracy object detection, &lt;a href=&quot;https://ai.googleblog.com/2016/09/a-neural-network-for-machine.html&quot;&gt;advanced machine translation&lt;/a&gt;, &lt;a href=&quot;https://ai.googleblog.com/2016/11/enhance-raisr-sharp-images-with-machine.html&quot;&gt;super resolution&lt;/a&gt; and many more.&lt;/p&gt;
&lt;p&gt;There is a steady flow of papers and publications that describe the latest advances in network design, compare existing architectures or describe unseen approaches leading to even better results than the current state-of-the-art. At the same time more and more companies and developers jump on the deep learning bandwagon and deploy the ideas and architectures to real world production systems.&lt;/p&gt;
&lt;p&gt;This article describes our approach to applying deep learning to our image editing product, the struggle we had with finding the right architecture and the experiences we made while developing a system that can be deployed to mobile devices.&lt;/p&gt;
&lt;h2 id=&quot;our-vision&quot;&gt;Our vision&lt;/h2&gt;
&lt;p&gt;At &lt;a href=&quot;https://9elements.com&quot;&gt;9elements&lt;/a&gt;, we’ve had various AI topics on our radar for quite some time now. With deep learning, we finally found a tremendous opportunity for our product, the &lt;a href=&quot;https://img.ly/products/photo-sdk&quot;&gt;Photoeditor SDK&lt;/a&gt;: &lt;strong&gt;We believe AI-based algorithms could be the ideal approach to boost our users creative output and simplify complex design tasks&lt;/strong&gt;.&lt;/p&gt;
&lt;p&gt;Given the hype and results, we decided to dip our toes into deep learning, which quickly lead to some research regarding the most common challenges in interactive image editing. We quickly surfaced image segmentation as a major challenge that could be solved using deep learning and started investigating further.&lt;/p&gt;
&lt;p&gt;If you have ever tried to select a distinctive region in a picture, say your best friend on the beach or your cute pet, you know the struggle of carefully moving your cursor along the object’s outer bounds until you eventually miss a part or accidentally select something that doesn’t belong to the object. Professional image editing tools can be quite helpful in accomplishing such tasks, but on the one hand, they aren’t available on your mobile device, where you take and publish the images, and on the other hand, can be quite expensive and usually require some hands-on time, before you can produce anything usable.&lt;/p&gt;
&lt;p&gt;Our goal was to finally remove the hassle from image clipping. We wanted to &lt;strong&gt;reduce the required user interaction to a minimum&lt;/strong&gt; while offering an intuitive solution that doesn’t require any manuals or online courses. On top of that, as we provide native SDKs for &lt;a href=&quot;https://img.ly/docs/pesdk/web/introduction/getting_started/&quot;&gt;web&lt;/a&gt;, &lt;a href=&quot;https://img.ly/docs/pesdk/ios/getting-started/integration/swift-package-manager/&quot;&gt;iOS&lt;/a&gt;, and &lt;a href=&quot;https://img.ly/docs/pesdk/android/getting-started/integration/&quot;&gt;Android&lt;/a&gt;, the solution had to be deployable to all of these systems without relying on a powerful backend or being limited to certain features.&lt;/p&gt;
&lt;p&gt;Having formulated our rather ambitious goals, we started our journey by looking into the most common research papers and classic techniques for image segmentation. We then focused on the deep learning part and quickly had an idea on how to design our approach.&lt;/p&gt;
&lt;h2 id=&quot;our-journey&quot;&gt;Our journey&lt;/h2&gt;
&lt;p&gt;Image segmentation, the process of classifying each pixel in a picture to be rather fore- or background, is a popular research field and still perceived as quite challenging due to the complicated nature of the task. We, humans, are extremely well trained at perceiving scenes, identifying objects and making logical assumptions based on the visual input we receive.&lt;/p&gt;
&lt;p&gt;For a long time, all approaches were based on colors, edges, and contrast and relied heavily on fine-tuned parameters, which had to be adjusted to every new scenario. That changed in 2012 when Krizhevsky et al. presented &lt;a href=&quot;https://papers.nips.cc/paper/2012/hash/c399862d3b9d6b76c8436e924a68c45b-Abstract.html&quot;&gt;astonishing object classification results&lt;/a&gt; on the ImageNet benchmark using a neural network. Suddenly a system was able to classify objects with unprecedented accuracy and no need for any human fine-tuning. The neural network was ‘just’ trained on the dataset by seeing images combined with their corresponding labels and adjusting its internal representation until it couldn’t learn any further.&lt;/p&gt;
&lt;p&gt;As we had already decided on using deep learning for our task, using a neural net clearly was our way to go. We started by examining the existing solutions and approaches, created our first prototype based on our findings and refined our approach and implementation until everything met our expectations.&lt;/p&gt;
&lt;h3 id=&quot;scene-labeling&quot;&gt;Scene Labeling&lt;/h3&gt;
&lt;p&gt;The first approaches we examined focused on segmenting the whole image. This is a common task called scene labeling or semantic labeling, because it allows robots and other systems to understand a scene. The goal is to classify each pixel in an image to a particular object category. An example could be a self-driving car that searches for the road and tries to determine whether any pedestrians are crossing the street. Such a car would try to classify each pixel as road, pedestrian, tree, traffic sign, etc.:&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;Human labeled scene from the Cityscapes Dataset&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 1200px) 1200px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;1200&quot; height=&quot;597&quot; src=&quot;https://img.ly/_astro/1-c5yvBgnNeMYxQlwr5yN5yQ_1QBHVb.webp&quot; srcset=&quot;/_astro/1-c5yvBgnNeMYxQlwr5yN5yQ_1m3G3a.webp 640w, /_astro/1-c5yvBgnNeMYxQlwr5yN5yQ_hH8pz.webp 750w, /_astro/1-c5yvBgnNeMYxQlwr5yN5yQ_14yPz1.webp 828w, /_astro/1-c5yvBgnNeMYxQlwr5yN5yQ_10qoxR.webp 1080w, /_astro/1-c5yvBgnNeMYxQlwr5yN5yQ_1QBHVb.webp 1200w&quot;&gt;&lt;/p&gt;
&lt;p&gt;While offering lots of possibilities, the existing solutions were lacking the desired accuracy we needed to provide visually pleasing image segmentations. For a self-driving car, it doesn’t matter if the ‘person’ region for some pedestrian accurately covers the person’s outlines. However, for us it does.&lt;/p&gt;
&lt;p&gt;To overcome these issues we experimented with post processing techniques that used the segmentations we found as a base for further optimisations. This lead to our first approach where we would initially segment the entire image using a convolutional neural network, offer the found regions as selectable regions to a user and then try to refine the user’s selection using conventional image segmentations to find the best possible mask.&lt;/p&gt;
&lt;p&gt;While already yielding some useful results the system did not quite match our requirements. If the initial segmentation was too coarse or off in critical regions, the user could never select an area that would lead to his desired segmentation.&lt;/p&gt;
&lt;h3 id=&quot;image-segmentation-based-on-userinputs&quot;&gt;Image segmentation based on user inputs&lt;/h3&gt;
&lt;p&gt;We went back to the drawing board and searched for other approaches that would fit our use case. It didn’t take long, and we stumbled upon &lt;a href=&quot;https://arxiv.org/abs/1603.04042&quot;&gt;Deep Interactive Object Selection&lt;/a&gt;, a paper that presents an interactive system which creates image segmentations based on user clicks. It looked like a good fit for our requirements, and we updated our existing system to generate fake user inputs and train on combinations of these inputs and images.&lt;/p&gt;
&lt;p&gt;To train the net, we used the publicly available COCO dataset, which contains around 300.000 images with more than 2 million annotated object instances. To handle the amount of data, we limited our training data to a subset of the full dataset. This subset was made up of images that contain objects from certain categories and cover a minimum area within the image. As we generated the inputs artificially by adding clicks on the object mask, we could generate as many training data from the COCO subset as we wanted. After some experiments, we settled for three different strategies to create user inputs and trained the net with roughly 300.000 training records.&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 400px) 400px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;400&quot; height=&quot;400&quot; src=&quot;https://img.ly/_astro/1-ha6lNjDWPH5FDOhASLSYOg_Zzijvu.webp&quot; srcset=&quot;/_astro/1-ha6lNjDWPH5FDOhASLSYOg_Zzijvu.webp 400w&quot;&gt;&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 400px) 400px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;400&quot; height=&quot;400&quot; src=&quot;https://img.ly/_astro/1--yMNXhbET6JfRAr7UKLz-w_2l2CfT.webp&quot; srcset=&quot;/_astro/1--yMNXhbET6JfRAr7UKLz-w_2l2CfT.webp 400w&quot;&gt;&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;An input image, a distance map generated from user clicks and the corresponding groundtruth label for an MSCoco sample.&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 400px) 400px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;400&quot; height=&quot;400&quot; src=&quot;https://img.ly/_astro/1-nYVbp1evh1hvHaXdj-vDlg_Z1Mhbbk.webp&quot; srcset=&quot;/_astro/1-nYVbp1evh1hvHaXdj-vDlg_Z1Mhbbk.webp 400w&quot;&gt;&lt;/p&gt;
&lt;p&gt;The masks generated by the updated system were quite impressive already. The neural net could infer which object the user wanted to mask in the image, just by looking at raw pixel data and the user’s clicks on the object. Happy with the first results, we tried to tackle the next hurdle. Before diving deeper into optimizing the neural net, which is a rather error prone process and consumes lots of time, we wanted to deploy the net to a mobile device. We wanted to make sure that such a tool is usable on any device and the performance would match our expectations.&lt;/p&gt;
&lt;h3 id=&quot;neural-nets-on-mobiledevices&quot;&gt;Neural nets on mobile devices&lt;/h3&gt;
&lt;p&gt;Neural nets are sets of operations, executed in a specific order and based on millions of parameters. Therefore one “run” of such a net requires a lot of computation power, as millions of calculations have to be carried out. At the same time, the millions of parameters need to be deployed, as they represent the model or the representation the neural net has learned during training. So, to deploy our neural net, we had to solve these two requirements on an iPhone.&lt;/p&gt;
&lt;p&gt;The first requirement, computing power, was thankfully solved by Apple. With the latest iOS version a specialised framework, called &lt;em&gt;Metal Performance Shaders&lt;/em&gt;, was introduced. It offers the all required operations and is tailored to run these on the phones GPU, which is fast and efficient. To execute our net using the framework we had to translate our TensorFlow network code to Swift and rebuild the net’s architecture using Metal Performance Shader operations. Sadly Apple only supports a subset of todays common neural network operations, so we were forced to write some shader code to reconstruct the full network.&lt;/p&gt;
&lt;p&gt;The second requirement, extracting the trained parameters and deploying them to the device was much easier. We just had to restore our previously trained model from a TensorFlow checkpoint, write all trained variables into a file and deploy this file with our iOS app. When needed, the iOS app would load the file into memory, and our network implementation would use the given parameters to run an inference pass.&lt;/p&gt;
&lt;p&gt;Having met the two requirements, our network worked fine on an iPhone. We added the postprocessing operations and were able to segment images by a single tap without the need for a backend or any network communication. But there were some caveats.&lt;/p&gt;
&lt;p&gt;While our neural net was a very common and widely used network, it was huge regarding the trainable variables. A trained model contains ~134 million parameters, which translates to about half a gigabyte of data that needs to be deployed with the app. This was obviously a showstopper for a mobile image editing app, as we couldn’t justify a 500MB download just to be able to segment images with your finger.&lt;/p&gt;
&lt;p&gt;Furthermore, the results were still very coarse. If your colleague waved his arms in an image, the net usually could easily detect his torso, head and maybe his legs, but almost never the arms or hands. Fixing this using our postprocessing algorithms wasn’t that much of an option as it would have required lots of computing power and why bother using a neural net with millions of parameters if we fall back to conventional image processing techniques anyway?&lt;/p&gt;
&lt;p&gt;So all in all, we had already learned a lot: Our approach of processing user inputs combined with raw image data as neural net input led to usable outputs, although quite coarse. Deploying such a net to mobile devices was possible, and the performance was good enough for using it in an interactive tool. The next step was to optimize the system to fix the parameter size and get finer results.&lt;/p&gt;
&lt;h3 id=&quot;combining-squeezenet-and-sharpmask&quot;&gt;Combining SqueezeNet and SharpMask&lt;/h3&gt;
&lt;p&gt;We decided to tackle the network size first, as laying a proper foundation for optimizing the coarseness seemed like a sane thing to do. When looking for small nets with few parameters and fast inference its hard not to stumble across the &lt;a href=&quot;https://arxiv.org/abs/1602.07360&quot;&gt;SqueezeNet architecture&lt;/a&gt; by Iandola et al. which was published in November 2016. It met our use case, didn’t use any exotic operations that would be hard to implement on mobile and the results looked promising, so we removed the original network from our system and replaced it with an altered SqueezeNet implementation. And to our surprise, it worked almost right away. We had to tweak our training pipeline, and the results differed slightly, but all in all the small network with only ~5 million parameters matched the performance of our previous behemoth with ~134 million parameters. We quickly updated our conversion script and found out that our deployable model file just &lt;strong&gt;shrunk from ~500mb to 2.9mb&lt;/strong&gt;. What a happy day!&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;The SqueezeNet architecture.&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 1200px) 1200px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;1200&quot; height=&quot;183&quot; src=&quot;https://img.ly/_astro/1-zPnkborOECNOZR86UCvMKQ_FzrRz.webp&quot; srcset=&quot;/_astro/1-zPnkborOECNOZR86UCvMKQ_Z1cnUlc.webp 640w, /_astro/1-zPnkborOECNOZR86UCvMKQ_Z1Qo2mJ.webp 750w, /_astro/1-zPnkborOECNOZR86UCvMKQ_Z6B1z.webp 828w, /_astro/1-zPnkborOECNOZR86UCvMKQ_1McUss.webp 1080w, /_astro/1-zPnkborOECNOZR86UCvMKQ_FzrRz.webp 1200w&quot;&gt;&lt;/p&gt;
&lt;p&gt;Having solved the network size issue, we went ahead and thought about increasing the precision of our predictions. A loss of resolution is unavoidable in convolutional neural networks, as later layers acquire a larger “view” of the inputs by reducing their input size with so-called “pooling” layers. These layers take for example four values from the previous layer and merge them into a single one. Therefore our new SqueezeNet-based system created a 32 by 32-pixel image mask from a 512 by 512-pixel input image. Up to now we just scaled these up by using a transposed convolution. This allowed the net to learn how the upscaling worked best, but the fine details from the initial input image were already lost at this point.&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;A SharpMask refinement module.&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 300px) 300px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;300&quot; height=&quot;390&quot; src=&quot;https://img.ly/_astro/1-Pu3jkltytfzkRs9ENoZsCQ_lDw3p.webp&quot; srcset=&quot;/_astro/1-Pu3jkltytfzkRs9ENoZsCQ_lDw3p.webp 300w&quot;&gt;&lt;/p&gt;
&lt;p&gt;We remembered &lt;a href=&quot;https://arxiv.org/abs/1603.08695&quot;&gt;Facebooks SharpMask&lt;/a&gt; system introduced in summer 2016 and revisited the accompanying paper. Their refinement modules seemed like a good fit, as they were able to gradually incorporate features from lower levels, but with higher resolution, into the coarse outputs. We adopted the idea and altered the refinement modules to take the final SqueezeNet output. The modules then combined the coarse SqueezeNet output with the pooling layers intermediate results and were able to refine the result. This increased our model size and the computation costs by a fair amount, but lead to much finer and more detailed results.&lt;/p&gt;
&lt;p&gt;Once we settled on our architecture, we started an extensive training run, in which we tested more than one hundred different variations of hyperparameters, architectural details, and resizing techniques. Evaluating the results, we selected a variation, which made the best compromise between accuracy and inference speed/model size.&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;A chart showing the accuracies that each variation achieved after a given number of steps during the training process.&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 1200px) 1200px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;1200&quot; height=&quot;273&quot; src=&quot;https://img.ly/_astro/1-Vz_5BpREzqAGa_ZNFp1bHA_Z8rNCE.webp&quot; srcset=&quot;/_astro/1-Vz_5BpREzqAGa_ZNFp1bHA_XpgkK.webp 640w, /_astro/1-Vz_5BpREzqAGa_ZNFp1bHA_143Xbw.webp 750w, /_astro/1-Vz_5BpREzqAGa_ZNFp1bHA_Z2kkwwm.webp 828w, /_astro/1-Vz_5BpREzqAGa_ZNFp1bHA_2qNT7X.webp 1080w, /_astro/1-Vz_5BpREzqAGa_ZNFp1bHA_Z8rNCE.webp 1200w&quot;&gt;&lt;/p&gt;
&lt;h2 id=&quot;our-results-and-prototype&quot;&gt;Our results and prototype&lt;/h2&gt;
&lt;p&gt;Having managed to fix all the issues, we were eager to see how the whole system performed on a mobile device with limited computing power and inputs. We updated our mobile app to use the new network architecture and the freshly trained model to compare the refined system to our previous approach. The results were amazing. When selecting objects that matched the categories of our training data and were fully visible in the image, we were able to generate fine-grained selection masks with &lt;strong&gt;just a single tap&lt;/strong&gt;. More complex or larger objects required a few more taps, but we could always find a selection mask for our object, that was at least a solid starting point for further optimizations.&lt;/p&gt;
&lt;p&gt;We decided to build a more polished prototype based on our existing img.ly iOS app. This app uses our &lt;a href=&quot;https://img.ly/products/photo-sdk&quot;&gt;PhotoEditor SDK&lt;/a&gt; to offer advanced image editing including focus and filter operations. As we were now able to create masks based on objects in the image we quickly settled on enhancing our filter and focus tools with selective masking.&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 331px) 331px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;331&quot; height=&quot;580&quot; src=&quot;https://img.ly/_astro/1-rf1v_R_PHbQDo8MpMPFg8w_ZIWoo9.webp&quot; srcset=&quot;/_astro/1-rf1v_R_PHbQDo8MpMPFg8w_ZIWoo9.webp 331w&quot;&gt;&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 331px) 331px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;331&quot; height=&quot;580&quot; src=&quot;https://img.ly/_astro/1-naxBkJ1MXe09LXkIHmdkFA_1QJtfk.webp&quot; srcset=&quot;/_astro/1-naxBkJ1MXe09LXkIHmdkFA_1QJtfk.webp 331w&quot;&gt;&lt;/p&gt;
&lt;p&gt;&lt;img alt=&quot;Our first prototype in action.&quot; loading=&quot;lazy&quot; decoding=&quot;async&quot; sizes=&quot;(min-width: 331px) 331px, 100vw&quot; data-astro-image=&quot;constrained&quot; data-astro-image-pos=&quot;center&quot; width=&quot;331&quot; height=&quot;580&quot; src=&quot;https://img.ly/_astro/1-Oa6rKX7fZMDEQ-QPDsGznA_19ef6u.webp&quot; srcset=&quot;/_astro/1-Oa6rKX7fZMDEQ-QPDsGznA_19ef6u.webp 331w&quot;&gt;&lt;/p&gt;
&lt;h2 id=&quot;retrospective&quot;&gt;Retrospective&lt;/h2&gt;
&lt;p&gt;Looking back at our journey into deep learning, it was one of the more frustrating yet fascinating ones. The sheer amount of possible applications is exciting, and once you get the hang of training something on your data, you immediately want to start experimenting with new things. On the other hand, you’re usually building huge black boxes with millions of float values, which makes debugging a pain. Especially when trying to replicate an already implemented architecture on other platforms, this can quickly become rather frustrating. If your outputs don’t match the expected results, your only option is to repeatedly go over your code, check all parameters and hope you stumble upon the wrong number somewhere. But once you manage to set everything up and start seeing some good results, you instantly want to tweak and optimise the bits and pieces of your system.&lt;/p&gt;
&lt;p&gt;Overall, deep learning is a pain to debug, but yields great results, opens up a new field of photo editing applications and we’ll definitely keep exploring the new possibilities of applying the techniques in our product. Stay tuned for upcoming features!&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Thanks for reading! To stay in the loop, subscribe to our &lt;a href=&quot;https://photoeditorsdk.us13.list-manage.com/subscribe?u=dc9f652839dbb620d14d6d28d&amp;#x26;id=04a306e4b2&quot;&gt;Newsletter&lt;/a&gt;.&lt;/strong&gt;&lt;/p&gt;</content:encoded><dc:creator>Malte</dc:creator><media:content url="https://blog.img.ly/2020/03/1-rZLmjkiT9VNRU5eJNK77Jg.jpeg" medium="image"/><category>Machine Learning</category><category>AI</category><category>Deep Learning</category><category>Photography</category><category>Artificial Intelligence</category></item></channel></rss>