<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0 plus SVG 1.1//EN" "http://www.w3.org/2002/04/xhtml-math-svg/xhtml-math-svg.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8"/>
    <title>Project-Team:MINT</title>
    <link rel="stylesheet" href="../static/css/raweb.css" type="text/css"/>
    <meta name="description" content="New Results - Sketching dynamic and interactive illustrations"/>
    <meta name="dc.title" content="New Results - Sketching dynamic and interactive illustrations"/>
    <meta name="dc.subject" content=""/>
    <meta name="dc.publisher" content="INRIA"/>
    <meta name="dc.date" content="(SCHEME=ISO8601) 2014-01"/>
    <meta name="dc.type" content="Report"/>
    <meta name="dc.language" content="(SCHEME=ISO639-1) en"/>
    <meta name="projet" content="MINT"/>
    <!-- Piwik -->
    <script type="text/javascript" src="/rapportsactivite/piwik.js"></script>
    <noscript><p><img src="//piwik.inria.fr/piwik.php?idsite=49" style="border:0;" alt="" /></p></noscript>
    <!-- End Piwik Code -->
  </head>
  <body>
    <div class="tdmdiv">
      <div class="logo">
        <a href="http://www.inria.fr">
          <img style="align:bottom; border:none" src="../static/img/icons/logo_INRIA-coul.jpg" alt="Inria"/>
        </a>
      </div>
      <div class="TdmEntry">
        <div class="tdmentete">
          <a href="uid0.html">Project-Team Mint</a>
        </div>
        <span>
          <a href="uid1.html">Members</a>
        </span>
      </div>
      <div class="TdmEntry">
        <a href="./uid3.html">Overall Objectives</a>
      </div>
      <div class="TdmEntry">Research Program<ul><li><a href="uid12.html&#10;&#9;&#9;  ">Human-Computer Interaction</a></li><li><a href="uid13.html&#10;&#9;&#9;  ">Numerical and algorithmic real-time gesture analysis</a></li><li><a href="uid17.html&#10;&#9;&#9;  ">Design and control of haptic devices</a></li></ul></div>
      <div class="TdmEntry">Application Domains<ul><li><a href="uid22.html&#10;&#9;&#9;  ">Next-generation desktop systems</a></li><li><a href="uid23.html&#10;&#9;&#9;  ">Ambient Intelligence</a></li><li><a href="uid24.html&#10;&#9;&#9;  ">Serious Games</a></li></ul></div>
      <div class="TdmEntry">New Software and Platforms<ul><li><a href="uid26.html&#10;&#9;&#9;  ">LibGINA</a></li><li><a href="uid27.html&#10;&#9;&#9;  ">3D interaction using mobile phone</a></li><li><a href="uid28.html&#10;&#9;&#9;  ">tIO (tactile input &amp; output)</a></li><li><a href="uid29.html&#10;&#9;&#9;  ">libpointing</a></li><li><a href="uid30.html&#10;&#9;&#9;  ">PIRVI platform</a></li></ul></div>
      <div class="TdmEntry">New Results<ul><li><a href="uid32.html&#10;&#9;&#9;  ">Highlights of the Year</a></li><li><a href="uid35.html&#10;&#9;&#9;  ">Impact of form factors and input conditions on absolute indirect-touch pointing tasks</a></li><li><a href="uid36.html&#10;&#9;&#9;  ">Direct and indirect multi-touch interaction on a wall display</a></li><li class="tdmActPage"><a href="uid38.html&#10;&#9;&#9;  ">Sketching dynamic and interactive illustrations</a></li><li><a href="uid40.html&#10;&#9;&#9;  ">The not-so-staggering effect of staggered animations</a></li><li><a href="uid41.html&#10;&#9;&#9;  ">Flexible contextual retrieval of chosen documents and windows</a></li><li><a href="uid42.html&#10;&#9;&#9;  ">Multi-touch command selection using finger identification</a></li><li><a href="uid44.html&#10;&#9;&#9;  ">Impact of the localization and activation of mode switchers</a></li><li><a href="uid45.html&#10;&#9;&#9;  ">A serial Architecture for a collaborative robot</a></li><li><a href="uid47.html&#10;&#9;&#9;  ">Mimetic Interaction Spaces: Controlling Distant Displays in Pervasive Environments</a></li><li><a href="uid48.html&#10;&#9;&#9;  ">Match-Up &amp; Conquer: A Two-Step Technique for Recognizing Unconstrained Bimanual and Multi-Finger Touch Input</a></li><li><a href="uid49.html&#10;&#9;&#9;  ">Understanding Users's perceived Difficulty of Multi-Touch Gesture Articulation</a></li><li><a href="uid50.html&#10;&#9;&#9;  ">Dynamic Modelling of Electrovibration</a></li><li><a href="uid53.html&#10;&#9;&#9;  ">Coupling between Electrovibration and squeeze filmfor tactile stimulation</a></li></ul></div>
      <div class="TdmEntry">Bilateral Contracts and Grants with Industry<ul><li><a href="uid56.html&#10;&#9;&#9;  ">Bilateral Contracts with Industry</a></li></ul></div>
      <div class="TdmEntry">Partnerships and Cooperations<ul><li><a href="uid59.html&#10;&#9;&#9;  ">National Initiatives</a></li><li><a href="uid63.html&#10;&#9;&#9;  ">European Initiatives</a></li><li><a href="uid66.html&#10;&#9;&#9;  ">International Initiatives</a></li><li><a href="uid69.html&#10;&#9;&#9;  ">International Research Visitors</a></li></ul></div>
      <div class="TdmEntry">Dissemination<ul><li><a href="uid74.html&#10;&#9;&#9;  ">Promoting Scientific Activities</a></li><li><a href="uid121.html&#10;&#9;&#9;  ">Teaching - Supervision - Juries</a></li><li><a href="uid160.html&#10;&#9;&#9;  ">Popularization</a></li></ul></div>
      <div class="TdmEntry">
        <div>Bibliography</div>
      </div>
      <div class="TdmEntry">
        <ul>
          <li>
            <a id="tdmbibentmajor" href="bibliography.html">Major publications</a>
          </li>
          <li>
            <a id="tdmbibentyear" href="bibliography.html#year">Publications of the year</a>
          </li>
          <li>
            <a id="tdmbibentfoot" href="bibliography.html#References">References in notes</a>
          </li>
        </ul>
      </div>
    </div>
    <div id="main">
      <div class="mainentete">
        <div id="head_agauche">
          <small><a href="http://www.inria.fr">
	    
	    Inria
	  </a> | <a href="../index.html">
	    
	    Raweb 
	    2014</a> | <a href="http://www.inria.fr/en/teams/mint">Presentation of the Project-Team MINT</a> | <a href="http://www.lifl.fr/mint">MINT Web Site
	  </a></small>
        </div>
        <div id="head_adroite">
          <table class="qrcode">
            <tr>
              <td>
                <a href="mint.xml">
                  <img style="align:bottom; border:none" alt="XML" src="../static/img/icons/xml_motif.png"/>
                </a>
              </td>
              <td>
                <a href="mint.pdf">
                  <img style="align:bottom; border:none" alt="PDF" src="IMG/qrcode-mint-pdf.png"/>
                </a>
              </td>
              <td>
                <a href="../mint/mint.epub">
                  <img style="align:bottom; border:none" alt="e-pub" src="IMG/qrcode-mint-epub.png"/>
                </a>
              </td>
            </tr>
            <tr>
              <td/>
              <td>PDF
</td>
              <td>e-Pub
</td>
            </tr>
          </table>
        </div>
      </div>
      <!--FIN du corps du module-->
      <br/>
      <div class="bottomNavigation">
        <div class="tail_aucentre">
          <a href="./uid36.html" accesskey="P"><img style="align:bottom; border:none" alt="previous" src="../static/img/icons/previous_motif.jpg"/> Previous | </a>
          <a href="./uid0.html" accesskey="U"><img style="align:bottom; border:none" alt="up" src="../static/img/icons/up_motif.jpg"/>  Home</a>
          <a href="./uid40.html" accesskey="N"> | Next <img style="align:bottom; border:none" alt="next" src="../static/img/icons/next_motif.jpg"/></a>
        </div>
        <br/>
      </div>
      <div id="textepage">
        <!--DEBUT2 du corps du module-->
        <h2>Section: 
      New Results</h2>
        <h3 class="titre3">Sketching dynamic and interactive illustrations</h3>
        <p>We collaborated with Autodesk Research in Toronto (as a scientific consultant) on a project whose focus was to design and develop tools that enable artists to bring life to illustrations with subtle, continuous animation effects and infusing interactive behavior to the drawings. We believe designers, artists and creators should be able to communicate with computers the way they think about art and animation. This motivated Autodesk to develop interfaces that facilitate powerful ways of thinking and content creation with freeform sketching and direct manipulation, thus offering an alternative to complex professional animation tools. Our design combines the complementary affordances of humans and computers by utilizing by-example phenomena, thus preserving expressiveness and personal style, yet reducing tedium.</p>
        <p>The outcome of the collaboration is Kitty <a href="./bibliography.html#mint-2014-bid17">[23]</a> , a sketch-based tool for authoring dynamic and interactive illustrations (Figure <a title="Sketching dynamic and interactive illustrations" href="./uid38.html#uid39">2</a> ). Artists can sketch animated drawings and textures to convey the living phenomena, and specify the functional relationship between its entities to characterize the dynamic behavior of systems and environments. An underlying graph model, customizable through sketching, captures the functional relationships between the visual, spatial, temporal or quantitative parameters of its entities. As the viewer interacts with the resulting dynamic interactive illustration, the parameters of the drawing change accordingly, depicting the dynamics and chain of causal effects within a scene. The generality of this framework makes our tool applicable for a variety of purposes, including technical illustrations, scientific explanation, infographics, medical illustrations, children's e-books, cartoon strips and beyond. A user study demonstrates the ease of usage, variety of applications, artistic expressiveness and creative possibilities of our tool.</p>
        <div align="center" style="margin-top:10px">
          <a name="uid39">
            <!--...-->
          </a>
          <table title="" class="objectContainer">
            <caption align="bottom"><strong>Figure
	2. </strong>Example of a dynamic interactive illustration authored with Kitty. (a) Objects in the scene are interactive: the egg held by the cook can be dragged down, as if falling into the pot, triggering subsequent animations, such as soup splashes (b) and closing of the cat's eyelids (c). Turning the knob increases the fire and steam (d). The resulting dynamic illustration captures the living nature of the scene, where the gas stove flames burn and steam emits from the pot.</caption>
            <tr align="center">
              <td>
                <table>
                  <tr>
                    <td xmlns="" style="height:3px;" align="center">
                      <img xmlns="http://www.w3.org/1999/xhtml" style="width:427.0pt" alt="IMG/kitty.png" src="IMG/kitty.png"/>
                    </td>
                  </tr>
                </table>
              </td>
            </tr>
          </table>
        </div>
        <p>Kitty is a follow up of a previous project, Draco   <a href="./bibliography.html#mint-2014-bid18">[50]</a> , a prototype sketch-based interface that allows artists and casual users alike to add a rich set of animation effects to their drawing, seemingly bringing illustrations to life such as a school of fish swimming, tree leaves blowing in the wind, or water rippling in a pond. Draco was realized before Fanny Chevalier joined Inria. Kitty is the result of a collaboration between Autodesk Research (inventor) and Inria (scientific consultant). A patent has been filed by Autodesk Research for Kitty, and the company is currently developping a commercial application based on the research protoype.</p>
      </div>
      <!--FIN du corps du module-->
      <br/>
      <div class="bottomNavigation">
        <div class="tail_aucentre">
          <a href="./uid36.html" accesskey="P"><img style="align:bottom; border:none" alt="previous" src="../static/img/icons/previous_motif.jpg"/> Previous | </a>
          <a href="./uid0.html" accesskey="U"><img style="align:bottom; border:none" alt="up" src="../static/img/icons/up_motif.jpg"/>  Home</a>
          <a href="./uid40.html" accesskey="N"> | Next <img style="align:bottom; border:none" alt="next" src="../static/img/icons/next_motif.jpg"/></a>
        </div>
        <br/>
      </div>
    </div>
  </body>
</html>
