Posts Tagged ‘interactive media’

ZIM is “Better than Nothing” ??

April 10, 2015

ZIM js - free JavaScript Library of Interactive Media Modules

Had a fun time presenting ZIM (http://zimjs.com) last night at the Software Hamilton Demo Camp to an audience of 100 developers, designers, entrepreneurs, etc. in the Art Gallery of Hamilton’s Tanenbaum Pavilion.

It was one of the sweetest (in the old-fashioned sense) welcomes I’ve had where a few shouts of Dan Zen led to a growing round of applause as I was taking the stage.  It is nice to have a history of talks, the last being Droner http://droner.mobi where the audience controlled me with the multiuser app from their phones.  I still had people coming up to me thinking that my essence of being is Kitty Tartan – http://kittytartan.com – I would much prefer they take note of Tilty http://tilty.mobi and Touchy http://touchy.mobi both of which I presented at different times with the audience playing with business cards and coins with their neighbors. So from the first Demo Camp where I presented Optartic Tunnel http://opartica.com – the app that I made my spinning pleasure card with to the Keynote on Creativity and New Forms of Mobile Games http://wp.me/p9ja-8Z, Demo Camp has been a very rewarding experience.

So on taking the stage, I explained that I did not wear my turquoise fun-fur cape (or was it a bib) as I wanted the audience to take me seriously.  I was presenting ZIM which lets us build more easily on the Canvas side of HTML where we are free to dynamically draw for artistic purposes, drag, drop and hit test to make puzzles, e-learning apps and games – the traditional realm of Interactive Media.  I presented the live examples and finished with the fact that since ZIM Frame has launched… ZIM is now officially a framework.

Questions and comments were fast a fun as always!  One asked about avoiding the pitfalls of Flash interface – I claimed that I did not believe in one interface fits all of the ultra efficient consistency principle and we need room to explore as variety is the spice of life.  Other answers had me saying if security ever became an issue, we could blame HTML and another answer had me poking fun at the HTML components which are in dire need of some design love and extension.

HTML components could use an updating

My favourite part was the last question where an eccentric character in the back shouted, “How is ZIM better than WHAT?”  I asked what was what?  The audience and I puzzled and then realized we were looking for a comparison with the competition.  I hesitated a little – then said that the reason I made ZIM is that I needed what it provided and there were no other solutions that I knew of – so… I guess… ZIM is better than… nothing.  I did not realize what I was saying… just came to that conclusion from my logic. So – ZIM is better than nothing!

http://zimjs.com/ try it out and then see the HELP section for community help and discussion.

Advertisements

The Canvas is your World – HTML 5 Canvas

March 7, 2015

I have been making interactive media for twenty years and now I hope to convince you to try.  If you already code then I hope to convince you to try a new system.  ZIM.

ZIM Interactive Media JavaScript Modules

In 1995, I worked in Director to make CD Roms.  In 2000, I moved to Flash to make Web games and apps.  In 2015, I moved fully to HTML 5 and in particular the canvas and JavaScript to make anything.  http://danzen.com/museum/tour.html

The HTML canvas tag allows you to dynamically manipulate pixels to draw and animate shapes.  It was the early 2000s that we got this ability in Flash and it was very exciting.  It is now very exciting in HTML where we can use free tools and publish just about everywhere.  We can also bring our experience to a very large creative community.

HTML HISTORICALLY

HTML was initially conceived as a tagging language for showing people information in a Browser.  You could also provide information through forms with text fields, etc.  DHTML (dynamic HTML) came along in the 2000s and used iFrames and layers to show new information without reloading the page (as could JavaScript through AJAX).  Simple animation of page elements with JavaScript were introduced and continue on with libraries like jQuery.  CSS (cascading style sheets) came along to allow us to style the page more efficiently and completely.

INTERACTIVE MEDIA

While making Web pages for browsing does fall under the realm of interactive media, it can be more specifically called Web design.  Interactive media is much more – see the Interactivity Scale.  Interactive media allows us to create, communicate and play – not just consume.  To make interactive media takes more than just tagging or animating – you have to code (program).  This means capturing events and using logic to determine and create what comes next.  It means providing a variety of interfaces so people can create things (applications).  It means dragging, dropping, rotating and hit tests so people can re-enact the world but in a virtual space.  These are things that were not done in traditional Web design and development (aside from maybe dragging items into a shopping cart).

Dan Zen - Interactivity Scale

ZIM

Short for Zen Interactive Modules, ZIM is a free JavaScript framework specifically for making Interactive Media. http://zimjs.com

Much of the ground work is found in a library called CreateJS written by Grant Skinner and crew.  Grant has transported years of interactive media knowledge with Flash to the HTML canvas / JavaScript world.

Remember, the Flash community (and the Director community before hand) has spent over twenty years honing the commands needed to accomplish interactive media.  There are dozens and dozens of commands that go beyond traditional HTML and JavaScript.  These have been shifted and tweaked to perfection.  Without any one of these commands, we could not easily make what we make.  I know, I have created hundreds of applications with millions of lines of award winning code – trust me.  We all owe a HUGE debt to Grant and his team for the phenomenal job they have done preserving our heritage. – Dan Zen

In a sense, CreateJS lets us code in JavaScript as we did in Flash and has even added or simplified nicely in places.  The backbone of CreateJS is EaselJS which provides us with proper object oriented display hierarchy – we can nest objects within objects (containers, shapes, bitmaps, text) and manipulate properties such as position, rotation, alpha, scale and these properties are transferred to their children.  So CreateJS takes us roughly to ground zero of Flash.

Enter ZIM.  When I was coding in Flash, I made over one hundred helper classes (a class is a bunch of code that does something and we can use it over and over).  These were created over ten years and put into packages but otherwise were a touch hodgepodge.  This time, I got to start fresh and planned from the start to let others use and understand these classes.  Half of them are now in ZIM version 1.  The other half, which are for advanced interfaces like gesture and multiuser will be launched as ZIM version 2.  Certainly, there is a lot that can be done with ZIM version 1.

zim1.2

USING ZIM

You can code with any text editor but it is best if you have syntax coloring so you can see the different parts of the code.  Sublime, TextPad, NotePad++, DreamWeaver, etc.

Start with a ZIM Template – perhaps the basic template.  Copy the source code into a file and name it sample.html.  Now drop the file onto a Web browser – Firefox, Chrome, IE, Safari.  You should see a big button and if you click it, it will go to ZIMjs.  Look at the code and see if you can make sense of it.

On ZIMjs, there is information about the functions and classes that are available.  There is example code and you can try out the examples.  There is also a Docs section that tells you what is available, what parameters you can provide, and what properties, methods and events are available.

ZIMjs Documentation

You can start cutting and pasting bits of the examples at a time into your sample.html and see if you can make things work.

You will also need to know how CreateJS works so you can draw circles, rectangles, lines, and use bitmaps (images), sound and animation.  You can use tutorials, etc.

You will also need to know JavaScript for the programming logic parts such as variables, functions, conditionals, loops, arrays and objects.  Also basic number and string manipulations.  Eventually, you will want to make your own classes as well.

Read about coding here: Dan Zen Museum Coding Tour.

tour

Please try out ZIM and if you need a hand, there is the CreateJS Facebook Group where we answer questions about CreateJS and ZIM.

I can tell you now, you are as close as you have ever come to making being able to make interactive media.  You need no huge application, no instals, etc.  And you can package your code up into a mobile app in less than an hour once you know what you are doing – all free (aside from the $100 dev cost on Apple, the $25 dev cost on Android and $20 for Windows – free for BB).  Just copy that template file and start poking around.

If you want formal training, I teach at Sheridan College in the one-year post grad diploma program http://imm.sheridanc.on.ca – we have a great learning environment.  Here are some open house photos.

— 15 —

Interactive Media – Digido

October 31, 2014

I have been making digital interactive media works for almost twenty years now.  I have a museum of approximately one hundred works at http://danzen.com.  There is a problem.  I do not know what to call them and I do not know what to call me, the maker.  This matters as it hampers our advancement in culture.

Unlike other creations like Songs, Videos, Sculptures, Paintings, Photographs, etc. we have no name.  We are stuck with generic names for what we make – projects, features, works.  These describe many types of creations.

Unlike other creators like Musicians, Videogrophers, Sculptors, Painters, Photographers, etc. we have no title.  We are perhaps Developers, Designers, Producers, Makers, Creators – but these are titles used in many fields.

I have struggled with this issue all my career and have attempted to come up with an answer a number of times.  You can see a poll that I put on Tapoll – a poll application where you predict the results as you vote:  http://www.tapoll.com/poll/id/413790478.  My recommendations at the time can be seen there – please take the poll.

WHAT DO WE MAKE?

We make digital interactive environments.  Firstly, we cannot just say interactive environments as our world is an interactive environment.  Digital, these days, means in the computer, so that is fine.  Things like songs and films have transcended analog and moved into the digital space – but are not interactive.  Some of the things we make have transcended as well such as games.  Games are an excellent example of digital interactive environments and certainly would be a subset of what we make.

Applications are also an excellent example of what we make.  An applications is software that lets people do things.  Traditionally we have had word processors, spreadsheets, paint programs, etc.  Applications are certainly digital interactive environments.  Social media, where people communicate through posting, sharing, rating, filtering is also a digital interactive environment and can also be thought of as a subset of applications.  Gadgets are small applications and we make those – Wavy – wave your mobile device and make sounds, etc.  Along the same lines, we make simulations where we recreate experiences in life often for educational or training purposes.

We also make art – which is neither games nor applications but for the most part, interactive experiences.  We have to be careful, because many experiences, are not interactive. Videos and Music would not be considered interactive works. You can experience art but it most art is not considered interactive however, there certainly is interactive art experiences and it is an exciting and thriving medium – installation art, etc. and we make that.

I do not consider an information site an interactive environment.  Navigation, in my mind, is the weakest form of interactivity and is already found in older media.  For instance, you navigate to what channel you want to watch or what book on the shelf and which page to read.  Please see my Interactivity Scale.

OPTIONS

Digital Interactive Experience is just too long.  What options do we have…

In our industry – the Interactive Media industry, it is common to have Interactive departments.  This is an indication that interactive is a good word to use.  We have even started to use the term as a noun – “have you seen the interactive?” but I would call this fairly rare – an indication that it is not quite the right word as it has had all the opportunity to catch on and has not.

The “inter” prefix of interactive is not terribly important.  Most people (even most people in our industry) see the inter part of interaction as being between the user and the computer. They completely forget the true or more powerful meaning behind inter.  They forget, that this can mean to interact with people – through the computer.

Act is the key word – whether alone or with others.  Activity would be an ideal name.  We make activities.  Unfortunately, that word has been taken by kindergarten teachers ;-).   Also… we would have to add that we make digital activities.  But you see how activity fits games, puzzles, applications and for the most part any art form where the user takes part and does something.  In the end… “digital activities” is probably not marketable.

In the sense that an activity is a noun (something to do) we could use interactivity as a noun in a similar way.  Therefore, we would make an interactivity.  You would play an interactivity or partake in an interactivity, etc.  I like that.  We can then be Interactivists.  It is a little tongue and cheek, though, with a play on an activist.  Maybe Interactivators ;-).  A problem is that interactivity is used most commonly as a qualifier of our product – it has interactivity.  It is also not a stand-alone, unique word for our work.  Think song, photograph, etc.

We do have the term media but this has been taken by… the media.  Media (plural) or a medium (singular) is a great word – it basically means the same as an environment.  It is something that sits between.  Hot, cold and medium – spiritual medium, etc.  In our case, a medium sits between the creator and the creation – like in art – clay, and paint, etc.  We are have a very special talent and task.  We make mediums.  For instance – the Flute is a medium – we would have made the flute.  We empower people to make content in our environments.  In my philosophy of Nodism I would say we make context in which others can make content.  Anyway – slightly digressing – back to it…

Along the lines of video and audio we could construct another such as actio, doeo, interactio etc.  I like doeo but it sounds quite silly – probably because of Dewey and our association with Huey, Dewey and Louie – or whatever.  Silly is not necessarily a bad thing – and I was using doeo for a while – but I just did not believe in it.

Neal Stephenson called them Ractives in Diamond Age with a plot of an interactive storybook.  Racitve is a really cool name and I would support that – it is the last part of interactives.  It sounds cool perhaps because of Raptors – it is unique – so… maybe.  It has potential.  We could then be Ractivators.

Experientials was a thought as for the last 5 years have been using the term “experiences” as what we build.  Again, many experiences are not interactive but rather authoritative – not user generated.  So, really, this is too broad a term – and it might need the term digital as well.  However, since it is a made up word, it might not need the digital qualifier.

Maybe someone who knows more Greek or Latin might come up with some good arrangements.

PROPOSAL

To really make this stick, I think we need a made up name or a “combo” name with roots or short classifiers.

DIGIDO is my current recommendation.  Digido is initially laughable – and undoubtedly you are at least smiling.  Smiling is not a bad thing.  If we really think about the words audio, movie and video we see that they too are quite cute.  People probably chuckled at the start as they did with iPod and iPad and now we are just fine.

I really like the word DO and so does Nike with its Just do it campaign.  Do means to act – to take part – to create – to build and make.  We make environments in which other people create, communicate and play.  They do things.  They do not just watch or consume – they do.  It is also nice and short.

DIGI – from digital or digits – like our fingers – I believe just means a distinction – like 01 – a jump rather than a blend and hence represents the way computers operate and we are making our environments with computers for computers – whether they be stationary or mobile – big or small – connected or not.  The Canadian New Media Awards, of which I have won two, have been renamed to the Digi Awards.  So that is a positive point in the digi direction ;-).

Digido sounds slightly like didgeridoo – an auspicious connection as a didgeridoo is one of the most basic of instruments.

One thing to consider is what this would be like as a field or industry.  What would it be like on job titles, etc.

Hologram – Holography – Holographer
Photograph – Photography – PhotographerSong – Music – Musician
Show – Television – Producer?  Team…
Movie – Film – Film Maker / Videographer
Digido – Interactive Media – Digidoist

CONCLUSION

Without a name, we are misunderstood.  It is slightly more difficult with our industry because we encompass different media – hence our traditional name, multimedia.  Unfortunately, with media being plural, multi was considered redundant.  The multimedia term is seen as old fashioned – sort of from the CD Rom days.  This has left us without a name and at best “interactive media”  which is like using “musical notes” every time we mean a song.  See what I mean?

Thoughts?

Dan

 

 

 

 

 

 

 

 


%d bloggers like this: