Animate an Image you own this product

'); $(document.body).append('
loading reading lists ...
'); function adjustReadingListIcon(isInReadingList){ $readingListToggle.toggleClass("fa-plus", !isInReadingList); $readingListToggle.toggleClass("fa-check", isInReadingList); var tooltipMessage = isInReadingList ? "edit in reading lists" : "add to reading list"; $readingListToggle.attr("title", tooltipMessage); $readingListToggle.attr("data-original-title", tooltipMessage); } $.ajax({ url: "/readingList/isInReadingList", data: { productId: 1897 } }).done(function (data) { adjustReadingListIcon(data && data.hasProductInReadingList); }).catch(function(e){ console.log(e); adjustReadingListIcon(false); }); $readingListToggle.on("click", function(){ if(codePromise == null){ showToast() } loadCode().then(function(store){ store.requestReadingListSpecificationForProduct({ id: window.readingListsServerVars.externalId, manningId: window.readingListsServerVars.productId, title: window.readingListsServerVars.title }); ReadingLists.ReactDOM.render( ReadingLists.React.createElement(ReadingLists.ManningOnlineReadingListModal, { store: store, }), document.getElementById("reading-lists-modal") ); }).catch(function(e){ console.log("Error loading code reading list code"); }); }); var codePromise var readingListStore function loadCode(){ if(codePromise) { return codePromise } return codePromise = new Promise(function (resolve, reject){ $.getScript(window.readingListsServerVars.libraryLocation).done(function(){ hideToast() readingListStore = new ReadingLists.ReadingListStore( new ReadingLists.ReadingListProvider( new ReadingLists.ReadingListWebProvider( ReadingLists.SourceApp.marketplace, getDeploymentType() ) ) ); readingListStore.onReadingListChange(handleChange); readingListStore.onReadingListModalChange(handleChange); resolve(readingListStore); }).catch(function(){ hideToast(); console.log("Error downloading reading lists source"); $readingListToggle.css("display", "none"); reject(); }); }); } function handleChange(){ if(readingListStore != null) { adjustReadingListIcon(readingListStore.isInAtLeastOneReadingList({ id: window.readingListsServerVars.externalId, manningId: window.readingListsServerVars.productId })); } } var $readingListToast = $("#reading-list-toast"); function showToast(){ $readingListToast.css("display", "flex"); setTimeout(function(){ $readingListToast.addClass("shown"); }, 16); } function hideToast(){ $readingListToast.removeClass("shown"); setTimeout(function(){ $readingListToast.css("display", "none"); }, 150); } function getDeploymentType(){ switch(window.readingListsServerVars.deploymentType){ case "development": case "test": return ReadingLists.DeploymentType.dev; case "qa": return ReadingLists.DeploymentType.qa; case "production": return ReadingLists.DeploymentType.prod; case "docker": return ReadingLists.DeploymentType.docker; default: console.error("Unknown deployment environment, defaulting to production"); return ReadingLists.DeploymentType.prod; } } }); } });
prerequisites
basic Java • basics of Processing • basic debugging
skills learned
Processing canvas and coordinate system basics • Processing drawing primitives and transformations • Processing file and image handling
Yu Zhang and Mathias Funk
1 week &middot 6-9 hours per week &middot BEGINNER

pro $24.99 per month

  • access to all Manning books, MEAPs, liveVideos, liveProjects, and audiobooks!
  • choose one free eBook per month to keep
  • exclusive 50% discount on all purchases

lite $19.99 per month

  • access to all Manning books, including MEAPs!

team

5, 10 or 20 seats+ for your team - learn more


Look inside
In this liveProject, you’ll use the Processing creative coding environment to animate still photos or artwork. You’ll start by animating simple object images with interaction techniques, then animate landscape photos using layers and transparency. Finally, you’ll extend these techniques to creative drawing on images.
This project is designed for learning purposes and is not a complete, production-ready application or solution.

project authors

Mathias Funk
Dr. Mathias Funk is an Associate Professor in the Future Everyday group in the Department of Industrial Design at the Eindhoven University of Technology. He has a background in Computer Science and a Ph.D. in Electrical Engineering from Eindhoven University of Technology. Since 2011, he has taught creative programming, computational prototyping, and designing with data and connectivity, and built tools for design researchers.
Yu Zhang
Dr. Yu Zhang has a background in fine arts and design. Her PhD research investigates the theory and artistic practice of interactive technologies for public, large-scale installations. As a researcher and artist, she approaches visual art with mixed reality installations and projections, sensor-based interactives, and computational arts. She has been teaching design and art in international workshops and higher education for over ten years.

prerequisites

For Java programmers interested in developing or rediscovering their creativity with easy visual computing techniques.

TOOLS
  • Basic Java
  • Basics of Processing
TECHNIQUES
  • Basic debugging using the Processing console
  • Basic math such as linear algebra (vectors and vector addition) and geometry

features

Self-paced
You choose the schedule and decide how much time to invest as you build your project.
Project roadmap
Each project is divided into several achievable steps.
Get Help
While within the liveProject platform, get help from other participants and our expert mentors.
Compare with others
For each step, compare your deliverable to the solutions by the author and other participants.
book resources
Get full access to select books for 90 days. Permanent access to excerpts from Manning products are also included, as well as references to other resources.

choose your plan

team

monthly
annual
$49.99
$399.99
only $33.33 per month
  • five seats for your team
  • access to all Manning books, MEAPs, liveVideos, liveProjects, and audiobooks!
  • choose another free product every time you renew
  • choose twelve free products per year
  • exclusive 50% discount on all purchases
  • Animate an Image project for free
RECENTLY VIEWED