Instructions

by golan @ 4:55 pm 10 January 2010

Instructions for submitting assignments and using the course web site.

  • Looking Outwards Exercises.
    You are strongly encouraged to embed videos from YouTube and Vimeo into your blog post. Don’t forget to label your Post with an appropriate Category for the assignment, e.g. Project-0, etc.

  • Uploading PDF Files.
    This blog uses the Google Doc Embedder Plugin. You can find more information about this plugin here, and you can see a demonstration post using it here.

  • Uploading Flash programs.
    This blog uses the Kimili Flash Embed Plugin. You can find more information about this plugin here, and you can see a demonstration post using it here.

    • Don’t forget to label your Post with an appropriate Category for the assignment, e.g. Project-0, etc.

  • Uploading Processing applets.
    Due to poor support in WordPress, Java applets require a little fussing to upload.
    A demonstration of the process can be seen on the course blog here.
    To upload a processing applet to the course blog,

    • Prepare your files:
      Before exporting your project as an applet, make sure that the title of your Processing project contains no capital letters or spaces. If it does, re-save it with a new name. (Otherwise, there can be problems because WordPress  automaticaly lowercases filenames.) Also, make sure your project’s title includes your name, or else it may conflict with someone else’s (don’t just name it “project-1” silly!).
    • Archive your project, using Processing’s utility, in the Tools->Archive Sketch menu.  This will create a .zip file which contains all of your source code, etc. Save this, you’ll upload it later.
    • In Processing, export your applet (from File->Export). This will create a folder called “applet” inside your sketch folder, and Processing will automatically open up that folder. (If you need to locate this folder again, you can find it from the Sketch->Show Sketch Folder menu item.)
    • In this applet folder, you will find a file called “index.html”.
      Open this up in a text editor, and change the margin numbers in the line which reads
      margin: 60px 0px 0px 55px; to  margin: 0px 0px 0px 0px;
      Then save and close this file.
    • Important: Rename this index file to include your name and the project number, e.g. golan-project-3.html, not index.html! THIS AIN’T SO HARD, PEOPLE.
    • Upload the materials to the blog:
      Log in to the course blog and create a new Post (not a Page).
    • In the “Add New Post” editor, select the HTML tab (for HTML editing mode). This is important.
    • At the top of the editor, you will see the “Upload/Insert” buttons. The rightmost of these (the 8-pointed star) is used for uploading media objects (the “Add Media” button). Click on this, navigate to your sketch’s applet folder, and select the HTML file for uploading. This will upload the file into the blog’s assets. Important: While you’re here, copy the URL of the uploaded HTML file into your computer’s clipboard. This URL will look something like this: http://golancourses.net/2010spring/wp-content/uploads/2010/01/index.html
    • In the HTML of the blog Post, paste in the following IFRAME code, replacing the URL below with the URL of your uploaded HTML file, and replacing the width and height indicated with the preferred dimensions of your applet:
      <iframe frameborder=”0″ scrolling=”NO” width=”600″ height=”350″ src=”http://golancourses.net/2010spring/wp-content/uploads/2010/01/index.html” ></iframe>
    • Important: now, upload the following additional media assets:
      • The .jar file in your applet folder (it will look something like golan-project-3.jar)
      • The .zip archive containing your complete project.
      • The “loading.gif” image which is generated by Processing.
    • Note that the maximum width for an applet to appear correctly in this blog is just 600 pixels. If you would like to show something larger, then don’t bother with the whole IFrame thing, and just link directly to your index page instead.
    • Important: Once you insert the IFRAME code, don’t edit your blog post in “Visual” mode, or else WordPress will accidentally delete it.
    • Don’t forget to label your Post with an appropriate Category for the assignment, e.g. Project-0, etc.

This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License.
(c) 2016 Special Topics in Interactive Art & Computational Design | powered by WordPress with Barecity