16

Why I’m Teaching Data Viz for Sociology

I’m teaching a course for VCU’s digital sociology Master’s degree program this semester. One of the things I’ve asked the participants to do is explain why they’re taking this course. I’m hoping that will help me customize what we’re going to do in the course. Since I asked the participants to document why they were taking this course, I figured the least I could do is create a similar post explaining why I agreed to shepherd this course and why I made some of these initial choices. I’m approaching the concept of data visualization pretty broadly. The course is broken into two main components. The first portion is looking at their own portfolio and how they might think it through in terms of data visualization1 and then moving on to broader/deeper applications of data visualization (connected to their personal research). Part of the reason I want to start with the portfolio is that the data is personal and it’s easier to get a feel for how real/accurate any visualizations you make are. We’ll also be able to establish a decent foundation of web literacy, design, accessibility, etc. prior to applying them to more sophisticated visualizations. Essentially, it’s about starting out on more familiar ground before venturing out into increasing complexity. The second section will focus on figuring out a set […]

Bret Victor on the right with a black and white cartoon fish on the left. Under the fish is the statement - This is not a fish.

Data Viz and Dead Fish

3:40 – “I believe that behavior and responsiveness is the essence of the computer as an art medium and what that means is that any time we create art that doesn’t have behavior we’re not living up to the potential of the medium. It’s not native art.” 4:34 – “… what sort of art is possible when both the art and the artist are alive? When the art and the artist are responding to each other and working together to create something beautiful.” 15:00 – “So what you’re seeing here is kind of the interplay between two living and behaving beings. There’s the fish behaving through simulation. There’s me behaving through performance and there’s this wonderful kind of symbiosis with the two of us working together to put on a show. The simulation and the performance are really complementary. So when I was making that little scene with the fish there was always this back and forth between the simulation and the performance. So if there was something I wanted the fish to do but I couldn’t perform it with my hand because it was too complicated, I had to move my hand too fast, there’s too many other things going on with the scene, I take that and put it in the simulation.” 16:02 – “There’s this back and […]

Audio Annotation POC Using WaveSurfer.JS

See the Pen wave surfer – waveform by Tom (@twwoodward) on CodePen. I needed to make a quick proof of concept for the annotation of audio on the web. In this case, it’s meant to provide a visual and auditory way to play through interview segments that represent different categories of responses. I found WaveSurfer.js this morning and just a bit later I had a functional example. I find the ability to highlight track elements visually and access specific segments to be a pretty powerful combination. If we stacked several tracks vertically the visuals would quickly point out content variation in terms of timing and total composition. You could get more and more complex from there. Playing with it gave me all sorts of ideas (including possibly using it as part of of the upcoming Reclaim Your Dance Party // API + Audio = (beats, visuals, internet, participate) session at Domains 17 with Grant and Brian). It’s also looking like I’ll be able to work more with our music department to think through online course on music so possibilities like this will be very useful. This kind of thing would be pretty easy to turn into a plugin . . .

Simple Text Analysis POC

See the Pen text analysis color viz – step 1 by Tom (@twwoodward) on CodePen. Assuming you have sentences, phrases, or words you’d like to categorize . . . you could do something like this to create a visualization. This one is using CSS but it could be done in any basic word processing software. Setting levels of opacity would allow for multiple-overlapping categorizations. See the Pen text analysis color viz – step 2 by Tom (@twwoodward) on CodePen. Playing with font size and the rotation of the paragraph also opens up some doors . . . as does doing different rotations at the sentence level depending on the categorization of the sentence. You could get even more granular with stuff like that using data attributes and CSS. See the Pen text analysis color viz – step 4 by Tom (@twwoodward) on CodePen. A Bit Odder See the Pen text analysis color viz – step 5 by Tom (@twwoodward) on CodePen.

Using Chart JS in FileMaker Pro 15’s Web Viewer

I’m doing a project in FileMaker. FileMaker 15. I think the last time I used FMP seriously was 2010-ish- version 11 had just come out. It’s still the same program but there have been some interesting changes. It’s also weird now because I have an entirely different set of experiences with technology that I didn’t have back then. FMP’s charting/graphing still leaves much to be desired. I was trying to create a particular chart and thought I’d be slick. I tried many things. Many, many things. I even tried creating stacked bar charts with the initial bar color begin set to transparent (that would have worked) but FMP does not let you set custom color schemes for charts (which is insane). In any case, I started wandering the Internet and found a video on integrating Google Charts with FMP 14 and the web viewer. The easiest path seems to be — get your HTML working without FMP variables – make sure all your css/js etc. are full URL paths Once it’s working, escape all your double quotes by doing a find/replace all with \” Paste this into a web view component (make sure you wrap the whole thing in double quotes) you’ll then have something like this in your editing view switch to browse to make sure it works If […]

Thinking About Digital Literacy

I was asked to speak at the VCU School of Education’s Teaching Literacy in a Digital World Conference this past Saturday. I’ve haven’t spent much time thinking about “digital literacy” in the past few years. It’s been somewhat mashed together with other terms that overlap like- digital fluency, computational thinking, etc. – and like those terms there’s not much agreement on what it is. I glanced at a few definitions prior to making this but didn’t really stick with one. When Dr. Leila Christenbury started the conference she referenced the “find, evaluate, utilize, share, and create content using information technologies and the Internet” definition of digital literacy so I added that while I waited and it makes as good a framework as anything else. A chunk of the presentation is on GitHub hereĀ or you can fork it here. I opted to do the presentation with reveal.js and on GitHub mainly because I need to be expanding my own competencies (digital and otherwise). I struck the “differently” portion because I wanted to orient things more towards the idea of doing things and didn’t want people getting caught up in the nuances of whether it was really “different.” This was an attempt to connect with the audience. I believed they were mainly k12 teachers or faculty in the School of Ed (who […]

Insta Snoop

A while back I was messing with getting Instagram data without bothering with their API because I think their most recent API changes are really annoying. I’m also a bit fascinated with the scale of numbers in social media right now. I opted to look at Snoop Dogg’s Instagram followers and plot their change very 10 minutes. Click here or on the image to see the live chart. Get the Instagram Data w/o the API & Put it in the Database It turns out that each Instagram page has an embedded JSON file with the data I wanted. You can see it if you view the source of any page. This Stackoverflow post was kind enough to point it out and you see regex rearing it’s head again. I started out with my standard process of using Google Sheets as the database but decided I’d try MySQL because I wanted to try getting the JSON ought more cleanly. The chunk below grabs the data and puts it in the database. So that gets us the stuff we want in a nice little box on the Internet. I did try to do some fancy mysql stuff to avoid entering the change in followers as an additional field but I failed in enough ways that I just opted to proceed with the […]

Geo Tagging WordPress

First, go try it out if you want. Submit something. It’ll help it make more sense. I thought this would be a lot easier than I made it. I tried lots of paths and considered spending various amounts of money to make this easier. Please benefit (probably) from my wandering. I try to link in where I learned different things and, more importantly, I tried to emphasize vocabulary that might be useful to you. My goal1 was to- have a Google2 Map interface that auto-located the device allow the user to drag the marker to adjust the location plot the resulting WordPress posts on a map To make this work you do need a Google Maps API3 key and on the WordPress side you’ll need the Gravity Forms (Costs money but worth it) and Geo Mashup (free) plugins. Gravity Forms will let you create posts via a form and provision form elements via URL parameters. Geo Mashup is the friendliest way I found to display posts on a Google Map based on lat/long parameters associated with the post. Auto Locate I went to a few different places for this but ended up finding/using the handy example posted in the Google Maps API documentation. It took me a while to get there- “geolocation” is the key term. Add it to your […]

05

Inequality Mapping

A while ago (maybe a week) I had a conversation with David about inequality and mapping the data to help make it more understandable. He shared the video above with with me on Sept. 29. That got me moving. Initially, I played with the data in Google Earth. It’s pretty easy to generate circles1 with various radii2 I used this website to make the circles in only a few minutes. I played with it in Google Earth but ended up being unsatisfied with the options available in the new Google My Maps online interface. So that led me down the path of messing more directly with the Google Maps API.3 As I wandered around looking for examples I found a javascript library on Github (JQuery Location Picker) that seemed to do most of what I wanted. It let you pick a location and drop a marker with a specific circle size. My next goal was to figure out how to make a drop down list set the variable for the circle radius. Now that’s not difficult for anyone with a clue regarding javascript programming or probably anyone with a general clue about programming. I usually have a pretty good idea how this ought to work conceptually but not much of a clue what to actually write. It took me a […]

3D Passenger Pigeon Bones

I’ve been working with Bernard Means who runs VCU’s Virtual Curation Laboratory1. We spoke briefly a while back about building a site to allow for interactive views and downloads of 3D STL files his team has made of passenger pigeon bones. One of the goals was to allow mobile devices to interact with the site in an “app-like” fashion. This is more than a desire for the PR boost that seems to come with creating an “app”2 What we’re working toward is the ability to cache this stuff and enable archaeologists in the field to interact with the virtual shapes on mobile devices or download the shapefiles, print them out, and carry the replicas into the field (next up is a consideration of points). We wanted to get the passenger pigeon bones out in time for the anniversary of the extinction of the species which was 100 years ago today. Due to the excitement and drama that is the new school year, I didn’t end up getting the bones or focusing on this until Thursday. This was the first website I’ve made by hand (non-cms) in a while. I figured it’d be good for me and I thought it’d help remove complications. I don’t know if that ended up being true but it was a decent idea. It was a […]