Showing posts with label javascript. Show all posts
Showing posts with label javascript. Show all posts

Dec 12, 2012

This Exquisite Forest: Join this massive online, creative, interactive, participatory, collaborative narrative animation project, by Chris Milk and Aaron Koblin

"Right here, in your web browser, you may contribute to anyone's creation and steer it in any direction you choose, or start a story of your own, by creating a seed animation for a new tree. Our hope is through the collective creativity of the web, an ever-expanding forest of narrative paths will grow." -Chris Milk/Aaron Koblin

This Exquisite Forest is a collaborative art project by Chris Milk and Aaron Koblin, creators of the online Johnny Cash collaborative project. The Johnny Cash Project was a crowd-sourced music video for Johnny Cash's final album (see below).

What I like about this project is that it provides viewers with the opportunity to create animations that link with those of other people, online.  All of the tools to create animations and music are on the website, along with  clear instructions and FAQs.  You can even curate your own tree.

For those who take a less participatory approach to art, the project's website offers something called "The Endless Theater", where viewers can watch the most popular branches of This Exquisite Forest.



The project makes use of Google's App Engine. Google's Cloud Storage handles the accounts and data storage.   To access the project, you need Google's Chrome browser, as the project takes advantage of JavaScript and HTML5.

RELATED 
This Exquisite Forest Project

The Making of This Exquisite Forest








Jul 5, 2012

Checking out Recline js, an open-source, browser based HTML and JavaScript library for data: "Relax with your data"

"Recline.js - relax with your data"
"A simple but powerful library for building data applications in pure Javascript and HTML"

The diagram below was taken from the Recline.js website and provides a basic overview of how it works:

    Mar 1, 2012

    Creating Responsive HTML5 Touch Interfaces (Stephen Woods -Video and Slides)

    Here is an interesting video I came across during my HTML5 explorations - Stephen Woods, from Flickr, shares his words of wisdom about HTML5 and touch interfaces:


    Stephen Woods (Flickr): Creating Responsive HTML5 Touch Interfaces




    Here are a few links from the presentation:


    Slides:  Creating Responsive HTML5 Touch Interfaces
    http://www.slideshare.net/ysaw/creating-responsive-html5-touch-interfaces

    Responsive Web Design 
    http://www.alistapart.com/articles/responsive-web-design/





    Link to article about HTML5, web "apps", and the future, from a "Yahoo" perspective

    I thought I'd share a link to an article about HTML5 and the future from a "Yahoo" perspective:


    Why ambitious developers need more than just HTML5
    Bruno Fernandez-Ruiz, CNET News, 3/1/12


    Think "Cocktail".




    Aug 2, 2011

    Taking a look at CreativeJS: "The very best of creative JavaScript and HTML5" -

    I came across the CreativeJS website while searching for HTML5/JavaScript resources suitable for creative multimedia projects.  The team at CreativeJS includes Seb Lee-Delisle, Val Head, Paul Neave, Rob Hawkes, Hakim El Hattab, and Lisa Larson-Kelley.


    What a talented team!


    RELATED
    Recent blog post from CreativeJS:  Spherical Harmonics Mesh Builder
    Seb Lee-Delisle
    Neave Interactive
    Rob Hawke's book:  Foundation HTML5 Canvas
    Hakim El Hattab's Experiments
    Lisa Larson-Kelley's Website:  Learn from Lisa (Web video publishing)

    SOMEWHAT RELATED
    Interactive Digital Fireworks

    Digital Fireworks in Brighton from Seb Lee-Delisle on Vimeo.






    Jan 28, 2011

    State of Information Visualization, 2011 InfoVis in HTML5 "how-to", and more (Thanks to Robert Kosara)

    Take a look at Robert' Kosara's recent post on his eagereyes blog:
     
    The State of Information Visualization, 2011

    In this post, Robert reviews of some of the important trends in information visualization in 2010, discusses the potential of HTML5 for creating information visualization experiences on the web, and makes a few predictions about the near future.  Robert is pretty sure that the world is ready for "truly interactive, browser-based visualization".  He notes that the Protovis Primers he shares on his website are quite popular.

    Most of the following resources and links were taken from the eagereyes website:

    Information Visualization, HTML5, and JavaScript Resources (more to come)
    HTML5 and Visualization on the Web
    Robert Kosara, eagereyes, 12/21/10
    Canvas Tutorial (HTML element used to draw graphics using scripting)
    HTML5 Canvas Cheat Sheet
    Dive Into HTML5 Tutorial (canvas element)
    node.js: (How to run JavaScript on a server.)
    JavaScript: The Key to In-Browser Visualization
    Robert Kosara, eagereyes, 2/11/10
    PROTOVIS
    A Protovis Primer, Part 1
    A Protovis Primer, Part 2
    A Protovis Primer, Part 3
    "Protovis is a very powerful visualization toolkit. Part of what makes it special is that it is written in JavaScript and runs in the browser without the need for any plugins. Its clever use of JavaScript's language features makes it very elegant, but it can also be confusing to people who are not familiar with functional programming concepts and the finer points of JavaScript." -Robert Kosara

    Robert Kosara, eagereyes, 3/10/10
    VisWeek 2010
    Caroline Ziemkiewicz and Robert Kosara




    Thanks, Robert, for sharing these very useful resources!

    Oct 28, 2010

    Interactive Timelines using Timemap.js (via O'Reilly Radar)

    I've been gathering information about interactive timelines and I'm happy to share a link to TimeMap, a Javascript library to help use Google Maps with a SIMILE timeline. Basically, TimeMap helps to display time series datasets on maps.


    Timemap.js Examples


    Here is the description of Timemap from the Google Code website:
    "Timemap.js is a Javascript library to help use Google Maps with a SIMILE timeline. The library allows you to load one or more datasets in JSON, KML, or GeoRSS onto both a map and a timeline simultaneously. By default, only items in the visible range of the timeline are displayed on the map."



    "This version includes several new features, including the ability to load arbitrary data elements using KML, GeoRSS, and Google Spreadsheets; a progressive loader to load data based on the timeline location; templating support for the map info window; improved code documentation; and more. See the changelog for more details.
    If you like the code documentation style, you can also get the jsdoc template for use in your own projects."





    Thanks to Nat Torkington, of O'Reilly Radar, for sharing this link.  Nat also shared a link to Google's website, Exploring Computational Thinking- "educational materials to help teachers get students thinking about recognizing patterns, decomposing problems, and so on."

    Jan 30, 2010

    Know HTML & JavaScript? Open source PhoneGap lets you easily create apps for the iPhone and other platforms. (Update: Including the iPad.)

    I found what I plan to use to develop my first iPhone app, and since I know HTML and JavaScript, it won't be a chore to get up and running. I'm not sure if it plays well with Apple's iPad.

    Update:  PhoneGap CAN be used to develop for the iPad, if the information in the following article from O'Reilly Radar is true!  
    Web developers can rule the iPad

    PhoneGap. Overview:


     Information from the PhoneGap website:

    "PhoneGap is an open source development tool for building fast, easy mobile apps with JavaScript. If you’re a web developer who wants to build mobile applications in HTML and JavaScript while still taking advantage of the core features in the iPhone, Android, Palm, Symbian and Blackberry SDKs, PhoneGap is for you."

    "As simple as HTML, CSS and JavaScript. Software development is hard work. Device integration should be simple so you can focus on the application you are building instead of authoring complex compatibility layers. PhoneGap aims to solve device integration by web enabling devices native functionality with open standards."

    Comment: Why does the video give me the impression that development is still a boy's club?  It looks like no women were involved in the PhoneGap code camp.  This is 2010, not 1985, and I'd expect to see more young women involved in this sort of development.