CINXE.COM

<!doctype html>   <html xmlns="http://www.w3.org/1999/html"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title>Il-Ho Jung — design, interactive & motion</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <meta name="keywords" content="Il-Ho, Jung, Il-Ho Jung, Design, Interactive, Motion, Graphic, Art Direction, Design Direction, Creative, Creative Studio, Branding, Experience Design, Corporate Design, Interactive Design, UX Design, Editorial, Animation, Typography, Berlin, Festival Design, World Caps, Awards, The FWA, Awwwards, Art Director's Club, European Design Award, German Design Award"> <meta name="description" content="Il-Ho Jung — Design, Interactive & Motion is a Berlin based Multidisciplinary Design Director.">  <meta name="viewport" content="width=1440" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-mobile-web-app-status-bar-style" content="black" /> <link rel="stylesheet" href="style/font/font.css"> <link rel="stylesheet" href="style/GGS.css"> <link rel="stylesheet" href="css_gen.css"> <link rel="stylesheet" href="style/layout.css"> <link rel="shortcut icon" type="image/ico" href="favicon.ico">   </head> <body class='IE'> <div class="startRemove"><img src="t.png" /><img src='style/preload.gif' /></div> <div class="body"> <div class="background mask"> <div class="maskedContainer"> <div class="content"> <div class="mask"> <div class="maskedContainer"> <div class="content mover"> <div class="content backgroundImage"> <div class="mask"> <div class="maskedContainer"> <div class="content"> <div class="mask bgItem" id="bgItem1"> <div class="maskedContainer"> <div class="position"><div class="content"></div></div> </div> </div> <div class="mask bgItem" id="bgItem2"> <div class="maskedContainer"> <div class="position"><div class="content"></div></div> </div> </div> <div class="mask bgItem" id="bgItem3"> <div class="maskedContainer"> <div class="position"><div class="content"></div></div> </div> </div> <div class="mask bgItem" id="bgItem4"> <div class="maskedContainer"> <div class="position"><div class="content"></div></div> </div> </div> <div class="mask bgItem" id="bgItem5"> <div class="maskedContainer"> <div class="position"><div class="content"></div></div> </div> </div> <div class="mask bgItem" id="bgItem6"> <div class="maskedContainer"> <div class="position"><div class="content"></div></div> </div> </div> <div class="mask bgItem" id="bgItem7"> <div class="maskedContainer"> <div class="position"><div class="content"></div></div> </div> </div> <div class="mask bgItem" id="bgItem8"> <div class="maskedContainer"> <div class="position"><div class="content"></div></div> </div> </div> </div> </div> </div> </div> <div class="content mouseOver"> <div class="mask"> <div class="maskedContainer"> <div class="content"></div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> <div class="site" id="home"> <div id="newsContent"> <div class="newsNavigation"> <table><tr> <td class="navThird"><div id="prev"><a href="#/news/1">PREV</a></div></td> <td>  </td> <td valign="top"><div class="bullet" id="news0"><a href="#/news/0"><div class="boebbel out">¤</div><div class="boebbel in">•</div></a></div></td><td><div class="bullet" id="news1"><a href="#/news/1"><div class="boebbel out">¤</div><div class="boebbel in">•</div></a></div></td><td><div class="bullet" id="news2"><a href="#/news/2"><div class="boebbel out">¤</div><div class="boebbel in">•</div></a></div></td><td><div class="bullet" id="news3"><a href="#/news/3"><div class="boebbel out">¤</div><div class="boebbel in">•</div></a></div></td><td><div class="bullet" id="news4"><a href="#/news/4"><div class="boebbel out">¤</div><div class="boebbel in">•</div></a></div></td><td><div class="bullet" id="news5"><a href="#/news/5"><div class="boebbel out">¤</div><div class="boebbel in">•</div></a></div></td><td><div class="bullet" id="news6"><a href="#/news/6"><div class="boebbel out">¤</div><div class="boebbel in">•</div></a></div></td><td><div class="bullet" id="news7"><a href="#/news/7"><div class="boebbel out">¤</div><div class="boebbel in">•</div></a></div></td><td><div class="bullet" id="news8"><a href="#/news/8"><div class="boebbel out">¤</div><div class="boebbel in">•</div></a></div></td><td><div class="bullet" id="news9"><a href="#/news/9"><div class="boebbel out">¤</div><div class="boebbel in">•</div></a></div></td><td><div class="bullet" id="news10"><a href="#/news/10"><div class="boebbel out">¤</div><div class="boebbel in">•</div></a></div></td><td><div class="bullet" id="news11"><a href="#/news/11"><div class="boebbel out">¤</div><div class="boebbel in">•</div></a></div></td><td><div class="bullet" id="news12"><a href="#/news/12"><div class="boebbel out">¤</div><div class="boebbel in">•</div></a></div></td><td><div class="bullet" id="news13"><a href="#/news/13"><div class="boebbel out">¤</div><div class="boebbel in">•</div></a></div></td><td><div class="bullet" id="news14"><a href="#/news/14"><div class="boebbel out">¤</div><div class="boebbel in">•</div></a></div></td> <td>  </td> <td><td class="navThird"><div id="next"><a href="#/news/1">NEXT</a></div></td> </tr></table> </div> <div class="photoToggle" id="news"><a href="#"><div class="borderContainer"><div>NEWS</div></div></a></div> </div> <div class="logo"><a class="btnHome" title="IL-HO" href="#/news/0">º</a></div> <div class="navi"> <nav class="main second"> <ul> <li><a class="btnHome" href="#/news/0">WORK</a></li> <li> </li> <li><a id="navreel" href="#/reel">REEL</a></li> </ul> </nav> <nav class="main first"> <ul> <li><a id="navdesign" href="#/design">DESIGN</a></li> <li><a id="navinteractive" href="#/interactive">INTERACTIVE</a></li> <li><a id="navmotion" href="#/motion">MOTION</a></li> </ul> </nav> <nav class="main sub"> <ul class='design'><li><a href="#/design/PROJECTK2016" data-id="PROJECTK2016" preview="content/work/design/18_projectk2016/mouseover/00.jpg">PROJECT K 2016</a></li><li><a href="#/design/NIPPONCONNECTION2016" data-id="NIPPONCONNECTION2016" preview="content/work/design/17_nippon2016/mouseover/00.jpg">NIPPON CONNECTION 2016</a></li><li><a href="#/design/PROJECTK2015" data-id="PROJECTK2015" preview="content/work/design/16_projectk2015/mouseover/00.jpg">PROJECT K 2015</a></li><li><a href="#/design/NIPPONCONNECTION2015" data-id="NIPPONCONNECTION2015" preview="content/work/design/15_nippon2015/mouseover/00.jpg">NIPPON CONNECTION 2015</a></li><li><a href="#/design/PROJECTK2014" data-id="PROJECTK2014" preview="content/work/design/01_projectk2014/mouseover/00.jpg">PROJECT K 2014</a></li><li><a href="#/design/RESTAURANTGUIDE" data-id="RESTAURANTGUIDE" preview="content/work/design/02_restaurantguide/mouseover/00.jpg">KOREAN RESTAURANT GUIDE</a></li><li><a href="#/design/TASTE" data-id="TASTE" preview="content/work/design/03_taste/mouseover/00.jpg">TASTE</a></li><li><a href="#/design/WORLDCAPS" data-id="WORLDCAPS" preview="content/work/design/04_worldcaps/mouseover/00.jpg">WORLD CAPS</a></li><li><a href="#/design/PROJECTK" data-id="PROJECTK" preview="content/work/design/05_projectk/mouseover/00.jpg">PROJECT K 2013</a></li><li><a href="#/design/TEILANSICHTEN" data-id="TEILANSICHTEN" preview="content/work/design/06_teilansichten/mouseover/00.jpg">TEILANSICHTEN</a></li><li><a href="#/design/KANGNAM" data-id="KANGNAM" preview="content/work/design/08_kangnam/mouseover/00.jpg">KANGNAM DAY & NIGHT</a></li><li><a href="#/design/PDELUBANOISE" data-id="PDELUBANOISE" preview="content/work/design/12_pdelubanoise/mouseover/00.jpg">PDE LUBANOISE</a></li></ul><ul class='interactive'><li><a href="#/interactive/THISISTASTE.DE" data-id="THISISTASTE.DE" preview="content/work/interactive/14_taste/mouseover/00.jpg">TASTE</a></li><li><a href="#/interactive/PROJECTKWEBSITE2013" data-id="PROJECTKWEBSITE2013" preview="content/work/interactive/01_projectkwebsite2013/mouseover/00.jpg">PROJECT K</a></li><li><a href="#/interactive/PALMENGARTEN" data-id="PALMENGARTEN" preview="content/work/interactive/02_palmengarten/mouseover/00.jpg">PALMENGARTEN</a></li><li><a href="#/interactive/VOLLMILCH" data-id="VOLLMILCH" preview="content/work/interactive/03_vollmilch/mouseover/00.jpg">VOLLMILCH</a></li><li><a href="#/interactive/ZDFWORTWAHL" data-id="ZDFWORTWAHL" preview="content/work/interactive/04_zdfwortwahl/mouseover/00.jpg">ZDF WORTWAHL</a></li><li><a href="#/interactive/GSENPOD" data-id="GSENPOD" preview="content/work/interactive/05_gsenpod/mouseover/00.jpg">GSENPOD</a></li><li><a href="#/interactive/MARTINANDERLE" data-id="MARTINANDERLE" preview="content/work/interactive/06_martinanderle/mouseover/00.jpg">MARTIN ANDERLE</a></li><li><a href="#/interactive/SONYERICSSONMUSICTRIP" data-id="SONYERICSSONMUSICTRIP" preview="content/work/interactive/07_sonyericssonmusictrip/mouseover/00.jpg">SONY ERICSSON MUSICTRIP</a></li><li><a href="#/interactive/VOLVOSAFETY" data-id="VOLVOSAFETY" preview="content/work/interactive/09_volvosafety/mouseover/00.jpg">VOLVO SAFETY</a></li><li><a href="#/interactive/ALEXANDERVALENTIN" data-id="ALEXANDERVALENTIN" preview="content/work/interactive/10_alexandervalentin/mouseover/00.jpg">ALEXANDER VALENTIN</a></li><li><a href="#/interactive/STARROOM" data-id="STARROOM" preview="content/work/interactive/11_starroom/mouseover/00.jpg">STAR ROOM</a></li><li><a href="#/interactive/SONYERICSSONW890i" data-id="SONYERICSSONW890i" preview="content/work/interactive/12_sonyericssonw890i/mouseover/00.jpg">SONY ERICSSON W890i</a></li></ul><ul class='motion'><li><a href="#/motion/PROJECTKTRAILER2016" data-id="PROJECTKTRAILER2016" preview="content/work/motion/16_projectktrailer2016/mouseover/00.jpg">PROJECT K TRAILER 2016</a></li><li><a href="#/motion/PROJECTKTRAILER2015" data-id="PROJECTKTRAILER2015" preview="content/work/motion/15_projectktrailer2015/mouseover/00.jpg">PROJECT K TRAILER 2015</a></li><li><a href="#/motion/PROJECTKTRAILER2014" data-id="PROJECTKTRAILER2014" preview="content/work/motion/14_projectktrailer2014/mouseover/00.jpg">PROJECT K TRAILER 2014</a></li><li><a href="#/motion/PROJECTKTRAILER2013" data-id="PROJECTKTRAILER2013" preview="content/work/motion/13_projectktrailer2013/mouseover/00.jpg">PROJECT K TRAILER 2013</a></li><li><a href="#/motion/TRANSLATIONS03TRAILER" data-id="TRANSLATIONS03TRAILER" preview="content/work/motion/01_translations03/mouseover/00.jpg">TRANSLATIONS 03</a></li><li><a href="#/motion/THEFAIRYANDTHEWOODCUTTER" data-id="THEFAIRYANDTHEWOODCUTTER" preview="content/work/motion/02_thefairyandthewoodcutter/mouseover/00.jpg">THE FAIRY & THE WOODCUTTER</a></li><li><a href="#/motion/SAMSUNGXCOVER" data-id="SAMSUNGXCOVER" preview="content/work/motion/03_samsungxcover/mouseover/00.jpg">SAMSUNG XCOVER</a></li><li><a href="#/motion/THEGUIDE" data-id="THEGUIDE" preview="content/work/motion/04_theguide/mouseover/00.jpg">THE GUIDE</a></li><li><a href="#/motion/NZINSIDER" data-id="NZINSIDER" preview="content/work/motion/05_nzinsider/mouseover/00.jpg">NZ INSIDER</a></li><li><a href="#/motion/SAATCHI" data-id="SAATCHI" preview="content/work/motion/06_saatchi/mouseover/00.jpg">SAATCHI & SAATCHI</a></li><li><a href="#/motion/FITFORSUMMER" data-id="FITFORSUMMER" preview="content/work/motion/07_fitforsummer/mouseover/00.jpg">FIT FOR SUMMER</a></li><li><a href="#/motion/SCHIRNKUNSTHALLE" data-id="SCHIRNKUNSTHALLE" preview="content/work/motion/10_schirn/mouseover/00.jpg">SCHIRN KUNSTHALLE</a></li></ul> </nav> <footer> <span class="first"><a href="#/about">ABOUT</a></span> <span class="second"><a href="#/index">INDEX</a></span> </footer> </div> </div> <div class="site" id="work"> <div class="holder"></div> <div class="imageList"></div> </div> <div class="site" id="about" image="content/about/about.jpg"> <div class="headline design">DESIGN,</div><div class="headline interactive">INTERACTIVE</div><div class="headline and">&</div><div class="headline motion">MOTION</div>      <div class="copyHolder"> <div class="head">ABOUT</div>  <div class="copy">Il-Ho Jung is a multidisciplinary Designer and<br /> Art Director based in Berlin. <br /> With a passion for design, he has developed a broad<br /> knowledge of many different disciplines and is<br /> always eager to learn more with each new project. <br /> He considers every work individually and creates<br /> strong concepts with the right design. <br /> He is convinced that design should be experimental <br /> without losing its focus and that the joy for<br /> design shouldn’t be missed out.</div> <div class="awards"> <p style="position: absolute;">RECOGNITION<br /><br /></p> <table> <thead><tr><td class="first">AWARD</td><td class="space"></td><td class="second">WORK</td><td class="space"></td><td class="third">CATEGORY</td></thead> <tbody> <tr><td>German Design Award Winner 2016</td><td></td><td>Project K 2013</td><td></td><td>Design</td></tr> <tr><td>European Design Awards Silver</td><td></td><td>Taste</td><td></td><td>Design</td></tr> <tr><td>Art Director's Club</td><td></td><td>World Caps</td><td></td><td>Design</td></tr> <tr><td>Art Director's Club</td><td></td><td>Taste</td><td></td><td>Design</td></tr> <tr><td>Art Director's Club</td><td></td><td>Project K 2013</td><td></td><td>Design</td></tr> <tr><td>Art Director's Club</td><td></td><td>il-ho.com</td><td></td><td>Interactive</td></tr> <tr><td>The FWA</td><td></td><td>il-ho.com</td><td></td><td>Interactive</td></tr> <tr><td>Awwwards</td><td></td><td>il-ho.com</td><td></td><td>Interactive</td></tr> <tr><td>Designpreis Rheinland-Pfalz</td><td></td><td>Teilansichten</td><td></td><td>Design</td></tr> <tr><td>Hochschulpreis der FH Mainz</td><td></td><td>Teilansichten</td><td></td><td>Design</td></tr> <tr><td>ADC Junior Bronze</td><td></td><td>Translations 03</td><td></td><td>Design</td></tr> <tr><td>Designcharts No. 1</td><td></td><td>Sony Ericsson Musictrip</td><td></td><td>Interactive</td></tr> <tr><td>Annual Multimedia</td><td></td><td>Galaxy XCover</td><td></td><td>Motion</td></tr> <tr><td>Webby Award</td><td></td><td>Construction & Fall of the Berlin Wall</td><td></td><td>Motion</td></tr> </tbody></table> </div> </div> <div class="contact"> <span class="head">CONTACT</span> <div class="copy"> <span class="tele">+49. 177. 3753868</span><br /> <span class="tele"><a href="mailto:hello@il-ho.com?subject=hello il-ho">hello@il-ho.com</a></span> </div> </div> <div class="logo"><a class="btnHome" title="IL-HO" href="#/news/0">º</a></div> <div class="navi"> <nav class="main second"> <ul><li></li></ul> </nav> <footer> <span class="first"><a href="#/news/0">WORK</a></span> <span class="second"><a href="#/index">INDEX</a></span> </footer> </div> </div> <div class="site" id="index"> <div class="imageList"></div> </div> <div class="site" id="reel" image="content/reel/movie.jpg"> <div class="navi"> <nav class="main second"> <ul><li>REEL</li></ul> </nav> <footer> <span class="first">2013</span> <span class="second"><a href="#/news/0">CLOSE</a></span> </footer> </div> <div class="video" img="content/reel/movie.jpg" h264="content/reel/movie.mp4" webm="content/reel/movie.webm" w="1280" h="720"></div> </div> <div class="modal newsBg"> </div> <div class="modal news"> <div class="newsCopy"> <div class="content"></div> <div class="photoToggle" id="modal"><a href="#"><div class="borderContainer"><div>HOME</div></div></a></div> </div> </div> <div class="modal index"> <div class="logo"><a class="btnHome" title="IL-HO" href="#/news/0">º</a></div> <div class="navi"> <nav class="main second"> <ul><li><a href="#/index">INDEX</a></li></ul> </nav> <nav class="main first"> <ul> <li><a id="navmakingof" href="#/index/1">MAKING OF</a></li> <li><a id="navmorework" href="#/index/2">MORE WORK</a></li> <li><a id="navinspiration" href="#/index/3">INSPIRATION</a></li> </ul> </nav> <footer> <span class="first"><a href="#/news/0">WORK</a></span> <span class="second"><a href="#/about">ABOUT</a></span> </footer> </div> </div> <div class="modal work"> <div class="canvas"><canvas id="canvas" width="1" height="1"></canvas></div> <div class="container"> <div class="arrow left"> <a href="#"> <div class="image"></div> <div class="icon">¦</div> <div class="dark">ﬃ</div> <div class="bg">•</div> <div class="over">PREV</div> </a> </div> <div class="arrow right"> <a href="#"> <div class="image"></div> <div class="icon">ﬁ</div> <div class="dark">ﬃ</div> <div class="bg">•</div> <div class="over">NEXT</div> </a> </div> <span class="first"><a href="#/description">DESCRIPTION</a></span> <span class="second" id="close"><a href="#/news/0" onclick="workCloseContent(this); return false;">CLOSE</a></span> <div class="info"></div> <nav class="main second"> <ul><li></li></ul> </nav> </div> <div class="copy text"></div> </div> <div class="preload"> <div class="preloadLogo"></div> </div> <div class="contentLoader"> <div class="logo"><img src="style/content_preloader.gif"></div>  </div> <div class="modal orientationBg"> </div> <div class="modal orientation"> <div class="orientationLogo"> <img src="content/rotate.png" /> </div> </div> <div class="border" id="top"></div> <div class="border" id="left"></div> <div class="border" id="right"></div> <div class="border" id="bottom"></div> <div id="lockScreen"></div> <script type="text/javascript" src="js/libs/plugins/ScrollToPlugin.min.js"></script> <script type="text/javascript" src="js/libs/plugins/CSSPlugin.min.js"></script> <script type="text/javascript" src="js/libs/plugins/RoundPropsPlugin.min.js"></script> <script type="text/javascript" src="js/libs/easing/EasePack.min.js"></script> <script type="text/javascript" src="js/libs/TweenLite.min.js"></script> <script type="text/javascript" src="js/libs/preloadjs-NEXT.min.js"></script> <script type="text/javascript" src="js/libs/jquery-1.8.0.min.js"></script> <script type="text/javascript" src="js/libs/jquery.lazyload.min.js"></script> <script type="text/javascript" src="js/libs/jquery.address.js"></script> <script type="text/javascript" src="js/Background.js"></script> <script type="text/javascript" src="js/Class.js"></script> <script type="text/javascript" src="js/plugins.js"></script> <script type="text/javascript" src="js/Main.js"></script> <script type="text/javascript" src="js/Index.js"></script> <script type="text/javascript" src="js/Home.js"></script> <script type="text/javascript" src="js/Work.js"></script> <script type="text/javascript" src="js/About.js"></script> <script type="text/javascript" src="js/Framework.js"></script> </body> </html>