Tag Archives: interactive

Data Visualizations from the New York Times

Screen Shot 2014-04-02 at 12.43.17 PM (2)

Everyone loves a good data visualization.  And everyone loves a good data visualization even more if the visualization is interactive.  Unfortunately, I can’t embed an interactive visualization above, but click on it to link to the interactive version.  The circles represent the volume of traffic at airports around the U.S.  Clicking on a circle reveals all of the connecting flights to that airport.  I’m sure you could get this information out of some kind of heinous Excel spreadsheet, but this format is way more engaging.

This is why I was attracted to this year’s Wherry Lecture, which is hosted by the Departments of Statistics and Psychology at Ohio State.  The speaker was Amanda Cox from the New York Times‘ graphics department who spoke about the Times‘ use of data visualizations.  Amanda shared many examples that illustrated the importance of context, how a good visualization sometimes limits the amount of data in order to highlight patterns, and the importance of how the text and the visuals work together.  These are a few of my favorites.

The Jobless Rate for People Like YouNot all groups have felt the recession equally.  This visualization allows you to view trends in different demographics.  The differences can be startling.

One Report, Diverging Perspectives – Employment numbers with “Democrat” and “Republican” buttons that allow you to view the same data through different lenses.

Over the Decades, How States Have Shifted – A look at how each state has voted – Democratic or Republican – with connections to every election since 1952.

Counties Blue and Red, Moving Right and Left – Imagine a map of the wind blowing across the U.S.  Now instead of that wind representing, well, wind, imagine it representing the changes vote margin between Democratic and Republican presidential candidates.

Mapping America: Every City, Every Block – Based on U.S. Census data from 2005 to 2009, you can choose to represent ethnicity, income, housing, education, and other information on a map and then zoom out to view the entire nation or zoom in to view your neighborhood.

All of these examples provide different paths to understanding the data that is represented.  To see some of the other examples in this lecture, check out my Twitter stream (@eslchill) or follow the New York Times Graphics Department (@NYTgraphics).

Leave a comment

Filed under Inspiration

Interactive Fiction

The text-based game Zork being played via teletype machine

If you’re like me, one of your first computer game experiences was with an interactive fiction text-based game.  Zork was probably the most popular, but I discovered the Hitchhiker’s Guide to the Galaxy game first (before I knew it was a book.)  In fact, I had never played Zork until quite recently when I encountered a version of it on Frotz, which I discovered as an iPhone application.  Within Frotz, one can play a wide variety of text-based adventure games.

If you’ve never played one of these games, there really isn’t much to learn.  Players are typically presented with a description of their character’s surroundings followed by a prompt.  Players can type simple directions at the prompt, such as “go north” or “pickup phone.” This process repeats with the game presenting the results of the previous command or a description of the new scene if the player has moved.  From there, the player enters further directions, and the game continues.

Obviously, the focus of the game is the writing as there are typically no graphics involved.  These games also have a rich tradition of Easter Eggs and snarky responses, particularly when commands are malformed or not recognized.  As the player proceeds through the game, objects can be collected (such as a key) that can later be used to solve a problem or make progress through the game (such as unlocking a door.)

These games are now rediscoverable thanks to new technologies.  Not only that, but it has also become very easy to create a game with virtually zero programming involved.  Two examples of tools that can be used to create interactive fiction are Twine and Inform7.

Twine is the simpler of the two.  Resulting stories are interactive in the way that Choose Your Own Adventure stories are interactive, but they use linked texts to allow the reader to progress in a non-linear way.  Examples of stories written using Twine can be played on gimcrackd.com.

Inform7 is much more complex, but the results are actual interactive text-based adventure games.  Elements can be dragged and dropped to create the relationships that form the basis of the story.  Examples of some of the best interactive text adventures can be found in this article on makeuseof.com.

I haven’t used either of these tools yet, but I’m curious about what ESL students might make of them (and make with them).  The process of writing can be a challenge in itself and, if they are not familiar with interactive fiction, explaining it would be an additional difficulty.  But by collaborating in small groups, there might be some interesting possibilities for collaborating and giving peer feedback.  At the very least, interactive text adventure games can provide ESL students with a rich source of input.  And because the syntax for interacting with the game is so simplified, even intermediate level learners can play them.

I plan to give Inform7 a try to see how easy it is to use.  If you’ve used it, or know of other similar tools, leave a comment.

Leave a comment

Filed under Projects

Interacting With Video

hand in monitor

#edtech #esl YouTube annotations provide a discussion space layered onto each video.

In my previous post, Interactive Videos, I shared some examples of YouTube videos that incorporate some new interactive features of the site that overlay buttons and links that can take you to a different segment of the video or to a different video or website entirely.

These kinds of pop-up messages have been crowding onto YouTube videos since this feature became available.  If used gratuitously, they are annoying, but when used to add supplemental information, they can be quite useful.  As one example, take a look at the video tutorial for making the above image.  It’s a straightforward and informative two-minute video.  At about the 1:30 mark, some red text appears that seems to be essential information that was omitted in the original shooting of the video.  Adding a quick note is a simple solution that does not require reshooting the video.

But there must be more we can do with these tools.  I’d been thinking about some different ways to incorporate these techniques when I came across a presentation made by Craig Howard at the Indiana University Foreign / Second Language Share Fair.  The page includes a recording of the presentation, a handout that summarizes how to annotate YouTube videos, and a link to an example video, which I’ve included below.

The nice thing about this approach is that a video, in this case a video for teachers-in-training to discuss, can include the online conversation layered right over top of the video.  Comments by different speakers can be made in different colors and the length of time they are displayed can easily be adjusted as appropriate.  Of course, everyone involved needs to have free Google or Gmail accounts to sign in, and the video must be configured to allow annotations by people other than the person who uploaded it.

The ability to integrate video materials and online discussion so seamlessly opens up some interesting potential for interacting with videos in new and interesting ways.  I’ve recently looked at some options for online bulletin boards / sticky notes, including Google Docs, but incorporating this style of discussion directly onto the video is fantastic.

I’m still kicking around different options for making YouTube videos more interactive.  If you have other examples or ideas, please share them in the comments below.

Leave a comment

Filed under Resources

Interactive Videos

mocap character

When I hear the phrase interactive videos, I think of people covered in florescent mocap pingpong balls or choppy, Choose Your Own Adventure-style stories like Dragon’s Lair.  And there are those.  But, it seems that some creative tinkerers have pushed the envelope with some of YouTube’s interactive features and come up with some interesting results.

How can they be used with ESL and EFL students?  Well, in addition to viewing and interacting with the videos and then discussing or reporting on the experience, students could be challenged to determine how the videos were made.  For the more ambitious, students could make their own videos using the same techniques.  Some of them, like the Oscars find the difference photo challenge would be relatively easy to remake.

For more interactive videos that will get your students talking, watch 15 Awesome YouTube Tricks.

1 Comment

Filed under Uncategorized

Kinect-Based IWB

infrared points of light projected from a Kinect

Ever since a $3000 bounty was placed on cracking open Microsoft’s fab new gaming hardware, the motion-sensing Kinect for Xbox, hackers and tinkerers have been putting the open-source drivers to lots of interesting uses on platforms that Microsoft never envisioned.  I’ve written about interesting Kinect hacks before (and before that,) and I’ve written about my experience with the Wii-based $50 Interactive Whiteboard (IWB,) but I haven’t seen a fully-developed Kinect-based Interactive Whiteboard.

Perhaps an Interactive Whiteboard is too narrow a description.  Many of the pieces are in place (see below) to interface with a computer using Kinect.  So, as with the Wii-based IWB, any application you can use on your computer can be controlled by this hardware.  If you connect your computer to a projector, you essentially have an Interactive Whiteboard.

Is the Kinect-based experience different from a Wii-based IWB or a Smartboard?  Almost certainly.  There would be no need to touch the screen at all, but rather to gesture in front of the Kinect to interact with the projection on the screen.  Would this be an improvement?  I’m not sure.  A touch-based IWB is more analogous to traditional whiteboard that uses markers and an eraser.  So, the touchless experience would be quite different.  I need to try it myself to really wrap my head around the opportunities that this motion-sensing interface offers.

I’m not sure if anyone here at Ohio State is working with Kinect as an interface for non-Xbox applications.  But I do know that the Digital Union has a Kinect which could probably be used to see if and how things work.  If anyone else is interested in trying to pull this together, drop me a line or leave a comment.

Multitouch with Kinect

Kinect on a Mac

Multitouch Kinect

Kinect Fingertip Detection

Kinect + PC + Mario = Fun

3 Comments

Filed under Projects

Kinect Development

microsoft kinect hardware

Microsoft recently announced plans to release a software development kit (SDK) for the Kinect.  This should allow academics and enthusiasts to find new ways to connect the motion-sensing Xbox hardware to other platforms, such as desktop and laptop computers, much more easily.  In short, there should be many more Kinect hacks to come.

I’m still not sure how this would directly apply to classroom teaching, although it stands to reason that these applications could someday replace physical interactive whiteboards in the same way that Kinect was originally designed to replace physical videogame controllers for the Xbox.

For more, see my previous post on Kinect Hacks and below for some new examples of how Kinect is being used in new and exciting ways.

Control Windows 7

The touchless multitouch is really nice.  Mice are so 2008.

3D Tetris with Face Tracking

As the user moves his head, the perspective on the screen changes to match so that the 3D perspective is constantly updated.

Kinect Lightsaber

A wooden stick becomes a lightsaber in real time.  This would save hours of  frame-by-frame editing.

Balloon Body

After Kinect scans your body, use your scroll wheel to expand or contract the surface.

Christmas Lights

Use Kinect attached to a bunch of dimmers to control Christmas lights for a very nice effect.

Flying Robot

The 3D capability of connect makes it perfect for a robot that navigates three-dimensional space.

1 Comment

Filed under Inspiration

Open and Kinect

open kinect

A few days ago, I wrote about how the new Microsoft Kinect has been hacked so that you don’t need an Xbox to use it.  There are now lots of tinkerers and hackers working with this hardware to see what else might be possible.  Although it’s not as easy to see the immediate applications for Kinect in the language classroom as it was for the Wii-based interactive whiteboard, there are obvious parallels.  And this new gaming hardware is more advanced than the Wiimote, which may offer more possibilities.  I’ve posted some examples of some interesting Kinect-based projects below.

How does it work?

Infrared beams, and lots of them.  Here’s how it looks with an infrared / nightvision camera.

Multitouch IWB

Because Kinect can “see” surfaces in 3D, it can be used to create a multitouch interactive whiteboard on multiple surfaces.

Control your browser

Forget your mouse.  Kinect can see the gestures you make in three-dimensional space.  Use gestures to control your browser and more.

Teach it

Teach it to recognize objects.  Obviously, there is a lot more software in use here, but Kinect provides the interface.

Digital puppets

Who wouldn’t want one of these?

Visual camouflage

In 1987, the movie Predator cost $18M.  A significant portion of what was left over after paying Arnold Schwarzenegger was likely spent on the cool alien light-bending camouflage effects.  Just over 20 years later, you can make the same effects on your computer using the $250 Kinect hardware.

3D video

At first glance, this looks like really poor quality video, but stick with it.  Notice the Kinect camera does not move, but with the flick of a mouse, the point of view can be changed as Kinect extrapolates where everything is in the space based on what it can see from where it is.  The black shadows are where Kinect can’t see.

Using 2 Kinects, most of the shadows are filled in.  The effect is like a translation of the real world into a low resolution Second Life-like environment.

3 Comments

Filed under Inspiration