<p><div><div><div><div data-show-faces="false" data-height="21" data-width="100" data-layout="button_count" data-send="true" data-href="https://www.r-bloggers.com/the-i-love-ikea-web-app-built-at-the-ikea-hackaton-with-r-and-shiny/"></div></div><div></div></div><div></div></div>
<div>
(This article was first published on <strong><a href="https://longhowlam.wordpress.com/2017/12/10/the-i-love-ikea-web-app-build-at-the-ikea-hackaton-with-r-and-shiny/"> R – Longhow Lam's Blog</a></strong>, and kindly contributed to <a rel="nofollow" href="https://www.r-bloggers.com/">R-bloggers)</a> </div>
<p><img data-orig-file="https://longhowlam.files.wordpress.com/2017/12/wordpress01.png?w=347&amp;h=265&amp;fit=347%2C265&amp;resize=347%2C265" data-orig-size="258,197" data-medium-file="https://longhowlam.files.wordpress.com/2017/12/wordpress01.png?w=347&amp;h=265&amp;fit=347%2C265&amp;resize=347%2C265?w=258" data-attachment-id="2564" data-image-meta="{" data-image-description="" src="https://longhowlam.files.wordpress.com/2017/12/wordpress01.png?w=347&h=265&fit=347%2C265&resize=347%2C265" data-permalink="https://longhowlam.wordpress.com/2017/12/10/the-i-love-ikea-web-app-build-at-the-ikea-hackaton-with-r-and-shiny/wordpress01/" data-large-file="https://longhowlam.files.wordpress.com/2017/12/wordpress01.png?w=347&amp;h=265&amp;fit=347%2C265&amp;resize=347%2C265?w=258" alt="wordpress01" data-image-title="wordpress01" sizes="(max-width: 347px) 100vw, 347px" data-comments-opened="1" class="wp-image-2564" data-recalc-dims="1"></p>
<h2>Introduction</h2>
<p>On the 8th, 9th and 10th of December I participated at <a rel="nofollow" href="http://hackathon.ikea.com/" target="_blank">the IKEA hackaton</a>. In one word it was just <strong>FANTASTIC!</strong> Well organized, good food, and participants from literally all over the world, even the heavy snow fall on Sunday did not stop us from getting there!</p>
<div><img src="https://i2.wp.com/media.licdn.com/mpr/mpr/AAIABADGAAgAAQAAAAAAAAnqAAAAJDQ1MmQ4MDkzLWM5OTUtNGY3Ni1iMDNlLWRhY2RhZTk4YTc4Ng.png?w=450&ssl=1" data-recalc-dims="1"></div>
<p> </p>
<p>I formed a team with Jos van Dongen and his son Thomas van Dongen and we created the “I-Love-IKEA” app to help customers find IKEA products. And of course using R.</p>
<div><img src="https://i2.wp.com/media.licdn.com/mpr/mpr/AAIABADGAAgAAQAAAAAAAAwyAAAAJGM4MDIxZDMzLWNiOGYtNDYyOC04YWI3LTkzMDRlZDBiMjg1Mg.jpg?resize=447%2C335&ssl=1" data-recalc-dims="1"></div>
<h2>The “I-Love-IKEA” Shiny R app</h2>
<p>The idea is simple. Suppose you are in the unfortunate situation that you are not in an IKEA store, and you see a chair, or nice piece of furniture, or something completely else…. Now does IKEA have something similar? Just take a picture, upload it using the <strong>I-Love-IKEA R Shiny</strong> <strong>app</strong> and get the best matching IKEA products back.</p>
<h2>Implementation in R</h2>
<p>How was this app created? The following steps outline steps that we took during the creation of the web app for the hackaton.</p>
<p>First, we have scraped <strong>9000 IKEA product images</strong> using Rvest, then each image is ‘scored’ using a pre-trained VGG16 network, where the top layers are removed.</p>
<div><img src="https://i1.wp.com/media.licdn.com/mpr/mpr/AAIABADGAAgAAQAAAAAAAAq0AAAAJDdiNTIwYzMzLTZiODUtNGM0Mi05ZWI1LTg1NThkOWFmNTRjMw.png?w=450&ssl=1" data-recalc-dims="1"></div>
<p> </p>
<p>That means that for each IKEA image we have a <strong>7*7*512</strong> tensor, we flattened this tensor to a 25088 dimensional vector. Putting all these vectors in a matrix we have a 9000 by 25088 matrix.</p>
<p>If you have a new image, we use the same pre-trained VGG16 network to generate a 25088 dimensional vector for the new image. Now we can calculate all the 9000 distances (for example cosine similarity) between this new image and the 9000 IKEA images. We select, say, the top 7 matches.</p>
<h3>A few examples</h3>
<div><img src="https://i1.wp.com/media.licdn.com/mpr/mpr/AAIAAQDGAAgAAQAAAAAAAA5qAAAAJDhjYjhmMWI0LTcwZDMtNGEyMy05ZDZmLTY0NjZkMTI5ZGM0Nw.png?w=450&ssl=1" data-recalc-dims="1"></div>
<div><img src="https://i2.wp.com/media.licdn.com/mpr/mpr/AAIAAQDGAAgAAQAAAAAAAAr7AAAAJGYxYmUxMmE3LTZkY2MtNGViNC05OWEyLTJhYmRmYjc1MDg0OQ.png?w=450&ssl=1" data-recalc-dims="1"></div>
<h3>A Shiny web app</h3>
<p>To make this useful for an average consumer, we have put it all in an R Shiny app using the library ‘<a rel="nofollow" href="https://github.com/rstudio/miniUI" target="_blank">minUI</a>‘ so that the web site is mobile friendly. A few screen shots:</p>
<div><img src="https://i2.wp.com/media.licdn.com/mpr/mpr/AAIAAQDGAAgAAQAAAAAAAAvMAAAAJDVlNTc4ODkxLTI4YWYtNDBhYi05YjVhLTlhM2Y3MWE2MjU5Yg.png?w=450&ssl=1" data-recalc-dims="1"></div>
<p> </p>
<p>The web app starts with an ‘IKEA-style’ instruction, then it allows you to take a picture with your phone, or use one that you already have on your phone. It uploads the image and searches for the best matching IKEA products.</p>
<div><img src="https://i0.wp.com/media.licdn.com/mpr/mpr/AAIAAQDGAAgAAQAAAAAAAA4PAAAAJDQ1MWJiYWEwLTAxMWYtNDI0YS05OTlhLTE4MWViZWIzNGQ0Mw.png?w=450&ssl=1" data-recalc-dims="1"></div>
<p> </p>
<p>The R code is available from my <a rel="nofollow" href="https://github.com/longhowlam/I_LOVE_IKEA_SHINY_APP" target="_blank">GitHub</a>, and a live running Shiny app can be found <a rel="nofollow" href="http://145.131.21.163:3838/sample-apps/I_LOVE_IKEA_SHINY_APP/" target="_blank">here</a>.</p>
<h2>Conclusions</h2>
<p>Obviously, there are still many adjustments you can make to the app to improve the matching. For example pre process the images before they are sent through the VGG network. But there was no more time.</p>
<p>Unfortunately, we did not win a price during the hackaton, the jury did however find our idea very interesting. More importantly, we had a lot of fun. In Dutch “Het waren 3 fantastische dagen!”.</p>
<p>Cheers, Longhow.</p>
<p> <a rel="nofollow" href="https://feeds.wordpress.com/1.0/gocomments/longhowlam.wordpress.com/2563/" target="_blank"><img border="0" alt="" src="https://feeds.wordpress.com/1.0/comments/longhowlam.wordpress.com/2563/"></a> <img border="0" alt="" src="https://i1.wp.com/pixel.wp.com/b.gif?resize=1%2C1&ssl=1" data-recalc-dims="1"></p>
	<p>
<div>
<div>To <strong>leave a comment</strong> for the author, please follow the link and comment on their blog: <strong><a href="https://longhowlam.wordpress.com/2017/12/10/the-i-love-ikea-web-app-build-at-the-ikea-hackaton-with-r-and-shiny/"> R – Longhow Lam's Blog</a></strong>.</div>
<hr>
<a rel="nofollow" href="https://www.r-bloggers.com/">R-bloggers.com</a> offers <strong><a rel="nofollow" href="https://feedburner.google.com/fb/a/mailverify?uri=RBloggers">daily e-mail updates</a></strong> about <a rel="nofollow" href="https://www.r-project.org/" title="The R Project for Statistical Computing">R</a> news and <a rel="nofollow" href="https://www.r-bloggers.com/search/tutorial" title="R tutorials">tutorials</a> on topics such as: <a rel="nofollow" href="https://www.r-bloggers.com/search/data%20science" title="Data science">Data science</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/Big%20Data" title="Big Data">Big Data, <a rel="nofollow" href="https://www.r-users.com/" title="R jobs">R jobs</a>, visualization (<a rel="nofollow" href="https://www.r-bloggers.com/search/ggplot2" title="ggplot and ggplot2 tutorials">ggplot2</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/boxplot" title="Boxplots using lattice and ggplot2 tutorials">Boxplots</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/map" title="Maps and gis">maps</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/animation" title="Animation in R">animation</a>), programming (<a rel="nofollow" href="https://www.r-bloggers.com/search/RStudio" title="RStudio IDE for R">RStudio</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/sweave" title="Sweave and literate programming">Sweave</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/LaTeX" title="LaTeX in R">LaTeX</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/SQL" title="SQL and databases">SQL</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/eclipse" title="Eclipse IDE for R">Eclipse</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/git" title="git and github, Version Control System">git</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/hadoop" title="Large data in R using Hadoop">hadoop</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/Web+Scraping" title="Web Scraping of google, facebook, yahoo, twitter and more using R">Web Scraping</a>) statistics (<a rel="nofollow" href="https://www.r-bloggers.com/search/regression" title="Regressions and ANOVA analysis tutorials">regression</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/PCA" title="principal component analysis tutorial">PCA</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/time+series" title="Time series">time series</a>, <a rel="nofollow" href="https://www.r-bloggers.com/search/trading" title="finance trading">trading</a>) and more...
<img alt="" width="1" src="http://feeds.feedburner.com/~r/RBloggers/~4/bweMSB9pADs" height="1"></a></div>