New Media Initiatives

Photo by k0a1a.net.

Minneapolis-based Northern Lights.mn has announced the second year of Ar(ists) on the Verge:

Northern Lights announces a second round of Art(ists) on the Verge commissions (AOV2). AOV2 is an intensive, mentor-based fellowship program for 5 Minnesota-based, emerging artists or artist groups working experimentally at the intersection of art,  technology, and digital culture with a focus on network-based practices that are interactive and/or participatory. AOV2 is generously supported by the Jerome Foundation.

Northern Lights was founded by former Walker New Media Curator Steve Dietz. The grants this year will be juried by Dietz, along with Kathleen Forde, Curator for Time-Based Arts at the Experimental Media and Performing Arts Center (EMPAC) in Troy, NY, and the Walker’s chief curator, Darsie Alexander.

The resulting show  show at the Weisman Art Museum from last years grantees was worth checking out. It is good to see work being done to create our own new media art structures here in Minnesota, rather than watching cool things like Eyebeam happen from afar.

And by the way, Northern Lights’ blog, Public Address, has become one of my favorite reads for neat artwork being made around the world. I confess I find a lot of art blogs rather dry and esoteric, but not Public Address. And, this may seem somewhat mundane and obvious, but near every post has an interesting image, which is nice for an art blog.

If you’re visiting town and are out and about, getting info on the Walker and other cultural institutions in the city via the web just got easier. Minneapolis’ city-wide wireless network now lets users access walkerart.org without being a subscriber. Here’s how it works:

On your computer, select the “City of Minneapolis Public WiFi” network.

Open your browser and point yourself to walkerart.org. That should do it. You may be directed to a user agreement log in screen and then the “walled garden” of Minneapolis city information and lists of other accessible community sites. The Walker is listed under Area Arts & Culture > Arts & Museums > Art Museums.

Wireless Log In Screen

Minneapolis Dowtown Area Walled Garden Portal

A brief history of Minneapolis Municipal WiFi

Several years ago, the City of Minneapolis joined with USI Wireless to build out a city-wide network. The goal was to provide access for city government and citizens. The city would be a core tenant, paying USI, and USI would sell access to citizens. The city required USI to build a community portal and USI must provide grants out of it’s profits to non-profits working to bridge the digital divide.

Over the last several years, the network has slowly been built out. Right now there are some problem areas, which include Loring Park and the Minneapolis Sculpture Garden. My understanding is that these areas should see service sometime soon, though I’m not sure of any exact plans on the Sculpture Garden.

There are a couple things I have really liked about the network:

• We’re doing it. A lot of cities have talked about building municipal wifi, and then discover large problems and things don’t work well. There have been some issues with in Minneapolis, it is taking longer to build the network than originally thought, but my impression is that it has worked fairly well.
• It’s network neutral. The agreement between the city and USI specifically requires USI to not hinder any type of traffic over another.
• Parts of it are free. This is how you can get to our site for free.
• It’s low cost. The cost for being a subscriber is pretty low, compared to other wire-based providers.
• It’s local. USI is a local company.

For more information on the network and the history, Peter Fleck has been blogging about Minneapolis WiFi for some time.

• Eric at Adapted Studio put together this sweet little demo of HTML5 and Canvas in action, in the form of the Game of life. Source code is included, too, if you want to learn a few nifty things.
• Color me surprised, but Microsoft is actually purporting to work together on at least some of the HTML5 spec. This could be good. Using <video> would be much easier if everyone would do it. But there still is the nasty issue of codecs, which is even more thorny than W3C specs.
• This is from about a year ago, but John Resig (of jQuery fame) posted a very nice tutorial for Learning Advanced Javascript. It clears up a lot of confusion about seemingly advanced techniques.
• Also worth perusing is Mark Pilgrim’s Gentle introduction to video formatting. If you’re a video geek, you might know some of this, but there’s detail that might fill in some gaps. The slides are also slightly amusing. I had no idea the .mkv format came from a bunch of guys in Russia that decided to opensource it.

HTML 5 image form here.

Now that Don’t Sleep on It is over and everyone has caught up on some sleep, I thought I’d share a bit more on the technical setup and a lesson learned. Witt told me he thought that it was one of the best, if not THE best, event that WACTAC has ever done. I tend to agree.

As I explored in a previous post, we used a digital still camera to take our single frame images, then stitch them together in quicktime as a longer move. For the event itself, we used two cameras. The primary camera, a Canon 10D, was equipped with a 16mm wide-angle lens that gave us a really good shot of the entire space. The second camera, a Canon G9, wasn’t quite as wide-angle, but would be a good backup camera in case something happened to the 10D. A sample of the space:

We taped off sight lines, just out of frame, so the artists would know what was in frame and what was not.

Our events & media production team set up a very nice mount for the cameras, as you can sort of see in this blurry, hastily snapped iPhone shot:

Unfortunately, every good plan has it’s own particular achilies heel. In this case, that heel was electronics’ desire for an uninterrupted flow of electricity. Midway through the evening on Friday night, the circuit breaker that powered the computer and cameras was tripped. Power was quickly restored, and the computers were turned back on. However, the startup procedure to get the time-lapse running was not something that could be scripted or automated, so the capture did not start again until 9 AM the next morning when I cam to check on things.

The lesson here: Time lapse is awesome, but next time, use an uninterpretable power supply. Preferably one that has a loud audible warning. I probably should have thought of this, but it really didn’t occur to me how chaotic and crazy the event would actually be (I mean that in the most endearing way possible).

The fact that we lost 12 hours of the time-lapse does stink, but it also means we still captured 12 hours of the event. I’ve assembled the video, and it has been posted to YouTube, but the quailty is not as good as a quicktime file. Here is a higher-quality quicktime MP4:

Click to play, or download the original file.

To fill some of the 12-hour gap, we hastily collected photos from whoever was available and had taken photos. They’ve been put together as a short slideshow filling a portion of the 12-hour missing period.

WACTAC has an event next week called Don’t Sleep on It, taking place during Art-a-Whirl. The gist of the event: over the course of 24 hours different groups of artists will transform a gallery space, destroying and re-building the art many times over the period. At the end of the event, they want to show a time-lapse video of the transformation.

Making a time-lapse movie is not hard. While it can be done using a video camera, it’s easier to use a digital still camera. You take a series of images at predefined intervals and stitch them together using software like After Effects, or, even simpler, Quicktime Pro. We’re using a Canon G10 and the Canon Remote Capture software to take photos every 10 seconds. I set up a test in our office just to make sure it would run correctly and without incident. Here’s the result:

Taking one photo every 10 seconds over 24 hours generates 8640 frames, creating a video just under 10 minutes long. We may end up dropping every other frame to create a shorter movie. The nice thing about using a digital still camera for this is that it produces a video well beyond even 1080P HD resolution.

In the above video, you can enjoy watching me look up documentation on Django, read a book about symfony, and my be mesmerized by a screensaver.

For the past month or two, we have been working on changes to mnartists.org. We deployed some of these changes several weeks ago, and just deployed even more now. I thought I would take some time to highlight the enhancements and new goodies.

Homepage

The first change you’ll notice when visiting the site is that the home page got an overhaul. The rotators for New Artwork and Featured Collections were changed to display images to the full-size of their boxes and they animate smoother. This means sometimes cropping work, but we think it’s a trade-off worth making.

Articles are also displayed with a three-tier hierarchy, allowing the site to call recent writing out more prominently, even though we feature six instead of 10. The sidebar on the homepage has also been reorganized, bringing the mnartists.org blog to the top and adding links to the Facebook and Twitter profiles for mnartists.org.

The revised homepage.

Revised article page

Articles

Articles got some attention in several ways. First, we changed the way images are displayed by adding a larger expanding gallery at the top of each article, rather than having small images thumbnails listed down the left side. On the back end for editors, we also added an enhanced editor (tiny mce) to allow for richer control over formatting and even embedding other media.

Social media Sharing
Across many areas of the site, you’ll now see a link to Share this article/artwork/collection/event. Using much of the same code we developed for the Walker Calendar, sharing is now easier on mnartists.org. We connect with Facebook, Twitter, Myspace, Delicious, Google Bookmarks, and Yahoo Bookmarks, as well as rolling in email links in a few places.

The new sharing links.

Search

The one change that will probably make everyone cry tears of joy is the search results refinement. We’ve heard lots of complaints about the search, not wholly unfounded. The search actually works pretty good, but the simple search weights everything more or less equally. If you search for someone’s name, hoping to just get their artist page, it will be in the results, but there might be other things that rank higher.

The revised search result page lets you change your simple search into an advanced search, using tabs above the results to select the type of resource you want to search for. This is very similar to what google does with their search results refinements (web, images, video, maps, etc.).

Old style search results

New search results with refinements.

Artist Pages

Artist pages also got an overhaul with two big changes. First, images for each artwork will display at a new, larger size, about 519px tall and/or 520px wide. For artworks with more than one image associated, a gallery rotating gallery will cycle through the images. Previously, if an artwork had more than one image associated, only the first would show up, and the rest would be listed in the “Related Media” list.

Old artist homepage.

Revised artist page.

Secondly, we changed the way Related Media works. Now, it is simply “Media List” lists every type of media associated with an artwork. More importantly, for non-image media, such as video and audio, we embed the media in the actual page. So if you upload a quicktime file, the quicktime embed code will be generated and put right into the page. MP3 audio files will be played with the jwplayer flash player, making audio on the site a lot more nifty. We’re using the excellent jquery.media plugin to do this.

This approach to handling media isn’t without some issues, but given the variety of media already on the site and our resources to work on it, this is the best solution. We are looking at making more substantial changes to this in the future, but this is a good incremental improvement.

Artwork with video before changes.

Artwork with video after changes. (Two video files attached)

The image size and media enhancements have also been applied to the collections area of the site.

Editing text

Another change we made a month ago was adding a visual editor to various form fields on the site. Prior to the change, users could only enter a very limited selection of markup to entries, [b] for bold, [i] for italic, and [a] for a link. We’ve eliminated that and replaced it with the new editor (tiny_mce), which allows for bold, italic, underline, unordered lists, and links. While seemingly simple, it was actually quite a challenge to deal with both the legacy code and the new formatting. The text actually goes through several transformations between the editor, the database, and being displayed again. Keeping everything consistent is a non-trivial pile of regular expressions.

The new visual editor.

One thing that we will have to keep an eye on is users pasting in text from Microsoft Word. Word tends to shove a bunch of garbage pseudo-html into the clipboard, and when pasting, it can be difficult to filter out. The editor has a button to Paste from word (with the blue W) that helps.

Any issues?

If you notice any problems with the site, please let our community manager or myself know. Bugs may crop up, and we do fix things.

We just made a small addition to the Walker website: a social media page. In case you didn’t know, the Walker is on Flickr, Twitter, FaceBook, and YouTube. The Walker has actually been in those spaces for some time, but there hasn’t been a good connection from the Walker site.

There are four different Walker-related groups for user contributed content on flickr: Walker Art Center, Minneapolis Sculpture Garden, Walker After Hours, and WACTAC. The social media page highlights the most recent Walker and Garden photos. We also post a good number of photos of our own, from After Hours to exhibition installation views. To make things clearer, we also added a official photography policy.

Since around September of 2008, I have been posting on twitter as the @walkerartcenter. Twitterfeed fills in some gaps with our blog posts, but I try to announce other notable things and answer visitor questions there. When the #snowmageddon happened, our twitter followers knew about it first. The social media page lists our latest 5 tweets to give visitors a good indication of what we tweet about.

We’re on the Facebook, too, and keep the page up-to-date with selected events and current exhibitions. Facebook doesn’t let Pages do a whole lot, but we’ve got 6500 fans.

And the Walker’s YouTube page has been around for over a year, first starting with the Tell us a story about your suburb project for Worlds Away. We’ve posted a few things from the archives there, and we’re slowly porting content from the Walker Channel to YouTube as well.

Setting the social media page up was made easier by using the Tweet! and jQuery.Flickr plugins.

If you’ve tuned into the live streaming events the Walker Channel has carried in the past, you have been forced to use Real Player to watch. Real was great back in the day when the Walker Channel was launched, but in 2009 it is a little dated. Flash streaming is much more convenient, and the VP6 codec flash offers is quite good. 

For tonight’s The Art of the Book panel discussion, we will be using ustream.tv to stream the event, rather than Real Player. No fancy plugins or separate applications required. It is also free, and doesn’t require us to run our own Real Media server. It will also help us decrease the turn-around on getting a recorded event into the Walker Channel, iTunes U and YouTube. None of this is rocket surgery, of course. Other places, like The UpTake, have been using free straming services very effectively, we’re just a little late getting on the bandwagon. 

We’re doing tonight’s lecture is a test of ustream, and we will be working out any kinks. We’ve done some testing already, but haven’t used it in a live setting where anyone other than a handful of people have been watching. 

If you’re watching and run into any problems, let us know. Shoot me an e-mail (click on my name to get the address), hit us on twitter, post here, or join the chatroom on ustream.

Last week we made a small change to our online calendar, adding social media sharing features. This means it is easier for readers of our online calendar to tell their friends and contacts about events. In our calendar, if you click the “share this” button, it slides out this drawer:

There are a number of pre-made DHTML widgets out there that are easy to use, but don’t provide quite the user experience we would like to have. Furthermore, they don’t share the content as cleanly and aren’t event specific. So we made our own functionality. It isn’t rocket surgery, but some notes on what we did may prove useful for others.

Sharing to calendars
Because this is an online calendar, sharing events to other calendars are very important. We already have an iCal feed for our calendar, and it is already set up to share specific events rather than all events, we just hadn’t been using that feature. The new sharing widget does so, simply by passing the proper event ID to our iCal page. A user can download this .ics file and it should work in Outlook, Sunbird, or iCal.

We also added sharing to google calendar. Google has an event publisher guide that documents how to share events to gCal. Compared to most other sharing solutions, gCal is more complicated. The main thing we had trouble with was formatting the date properly. Google prefers the date in what it calls “UTC format”, but I cannot find documentation anywhere showing what google uses is actually UTC format. What UTC format actually appears to be is the ISO 8601 time formatted without any punctuation. This is very similar to what the iCal format uses internally. Thankfully, since we were already calculating this for the iCal format, Nate was able to easily pass me this info for each event. With that, it is simply a matter of putting together the various components of the URL:

gcalURL = 'http://www.google.com/calendar/event?action=TEMPLATE&text='+encodeURIComponent(share_eventTitle);
gcalURL += '&dates='+startDate+"/"+endDate;
gcalURL += "&sprop=website:"+encodeURIComponent(location.href)+"&sprop=name:Walker%20Art%20Center";
gcalURL += "&details="+encodeURIComponent(share_eventDesc);
gcalURL += "&trp=true"
if (theLocation){
	gcalURL += "&location="+encodeURIComponent(theLocation);
}
window.open(gcalURL);
return false;

Sharing to social media sites
MySpace and Facebook both have specifications for how to share events to each of them, documented here and here, respectively. For Facebook, it is important to modify your page to include the meta tags it requests. When you share to Facebook, it doesn’t pass a description or image via the URL. Rather, Facebook scrapes the referred page to ascertain the description and images. Using the Meta tags gives much better results than whatever Facebook’s scraper comes up with. Most of the time, if you rely on their scraper, it will come up with some chrome images from your site rather than actual content images.

MySpace doesn’t scrape the page like facebook, so it’s important to construct a friendly description, with an image, if you can. We put a linked image along with the first few sentences of text for the description we pass to MySpace. Here is the format MySpace uses:

http://www.myspace.com/index.cfm?fuseaction=postto&u=YOURURL&t=YOURTITLE&c=YOURDESCRIPTION&l=3


We also “share” to twitter. There isn’t really sharing per se, on twitter, but you can pre-assemble a tweet for someone. Simply pass someone to http://twitter.com/home/?status=YOURTWEET. We assmble the event title, a reply to our twitter account, and a twitter-friendly shortened URL. Like this: “2008 British Television Advertising Awards @walkerartcenter – http://bit.ly/3c60xK”.

To get the friendly URL, we’re using bit.ly, one of the many URL shortening services available. However, bit.ly has a handy, well documented, API that does JSONP, allowing us to get around cross-site scripting issues.

Sharing to bookmarking sites
Sharing to Bookmarking sites like delicious (formerly del.icio.us, we miss the old URL) is quite simple. These are the formats for Delicious, Google Bookmarks and Yahoo Bookmarks, respectively:

http://delicious.com/save?jump=yes&url=YOURURL&title=YOURTITLE
http://www.google.com/bookmarks/mark?op=edit&bkmk=YOURURL&title=YOURTITLE
http://bookmarks.yahoo.com/toolbar/savebm?u=YOURURL&t=YOURTITLE&opener=bm&ei=UTF-8

Yahoo Bookmarks like to be opened in a pop-up window, but it isn’t strictly necessary. Always remember to urlencode text that is being passed into the URL, since there are many reserved characters in the URL. Javascript provides the encodeURIComponent function to do this.

When we switched from standalone WordPress to WordPress MU for the Walker Blogs, we also switched from Spam Karma 2 to Defensio. Spam Karma 2 had its funky interface issues on the admin, but it worked really well keeping our comment spam at bay. 

We’ve been using Defensio for not quite two months, which should be plenty of time to train the filters, but our statistics aren’t that great:

Recent accuracy: 97.10%:

• 3708 spam
• 147 legitimate comments
• 135 false negatives (undetected spam)
• 12 false positives (legitimate comments identified as spam)

I’ve never had great confidence in Akismet, but perhaps my misgivings are unfounded. Are there any other spam comment plug-ins people like? What have been your experiences?

What I’d really love to see is a comment plugin that used an Akismit-like baysein filter for catching the big stuff, than Amazon Mechanical Turk to test the stuff it’s not sure about. I’d pay $0.10 a comment for that.