Census Reporter API Exploration

We’re trying out a new site idea for the online digital sociology program. Once again, Matt came up with an idea that really got me excited and I started wandering around trying to figure out how to make it work. At some point I found CensusReporter.org. This is a pretty amazing site that is a Knight1 News Challenge-funded project.

What we want to do is figure out roughly where the viewer/visitor is geographically and give them a glimpse of that area through some data. Nothing too deep, just a taste of the interesting ways technology, data, and visualization can blend together to do interesting things. We don’t want the exact address for a few reasons. One, we don’t want to be too creepy. Two, getting a rough location through the IP address doesn’t trigger the browser approval request that more exact location data requires. My goal is not to subvert the approving/denying of location data but I worry too many people will miss that approval prompt and we’re not keeping this data.

Get Location

To get local data I have to figure out where the person is. To do that, I’m just grabbing the IP address and getting a location bounced back. There are a few ways to do this. I went with freegeoip.net and the following function would give a chunk of useful json location data.

The request (jquery style).

$.getJSON("//freegeoip.net/json/?callback=?", function(data) {
  var location = data;
  var lat = location.latitude;
  var long = location.longitude;
  var city = location.city;
  var state = location.region_code;
});

The data returned.

{
"ip": "128.172.35.18",
"country_code": "US",
"country_name": "United States",
"region_code": "VA",
"region_name": "Virginia",
"city": "Richmond",
"zip_code": "23284",
"time_zone": "America/New_York",
"latitude": 37.5538,
"longitude": -77.4603,
"metro_code": 556
}

Census Reporter

iframe Chart

In one of my semi-lucid searches I found this profile chart embed page. The iframe looked like this. I saw the geoID= and I was all excited. It looks like I can build these dynamically!2

<iframe id="cr-embed-16000US5367000-demographics-age-distribution_by_decade-total" class="census-reporter-embed" src="https://s3.amazonaws.com/embed.censusreporter.org/1.0/iframe.html?geoID=16000US5367000&chartDataID=demographics-age-distribution_by_decade-total&dataYear=2016&releaseID=ACS_2016_1-year&chartType=histogram&chartHeight=200&chartQualifier=&chartTitle=Population+by+age+range&initialSort=&statType=scaled-percentage" frameborder="0" width="100%" height="300" style="margin: 1em; max-width: 960px;"></iframe>

So I thought I’d be set to pull data using the city/state or the latitude/longitude but to use the census reporter I need the geoID. I went off on a few false trails but eventually found the API call to look up geoIDs via the census reporter itself.

Attempt One

https://api.censusreporter.org/1.0/geo/search?q=richmond
The trimmed down response to that query is below. The full_geoid is what I want but I’m hoping to ask without having to run a second loop through to match the full_name data.

{
"results": [
{
"full_geoid": "16000US5167000",
"full_name": "Richmond, VA",
"sumlevel": "160"
},
{
"full_geoid": "16000US0660620",
"full_name": "Richmond, CA",
"sumlevel": "160"
},
{
"full_geoid": "16000US1864260",
"full_name": "Richmond, IN",
"sumlevel": "160"
},
{
"full_geoid": "16000US1260230",
"full_name": "Richmond West, FL",
"sumlevel": "160"
},
{
"full_geoid": "05000US36085",
"full_name": "Richmond County, NY",
"sumlevel": "050"
},
{
"full_geoid": "05000US51760",
"full_name": "Richmond city, VA",
"sumlevel": "050"
},
{
"full_geoid": "05000US13245",
"full_name": "Richmond County, GA",
"sumlevel": "050"
}
]
}

Attempts #2a, #2b etc.

This fails with no results.
https://api.censusreporter.org/1.0/geo/search?q=richmond,va

My next try was to URL encode the query. I used this because I never remember how to encode commas.
https://api.censusreporter.org/1.0/geo/search?q=richmond%2C%20va

It gave me two responses but strangely neither one matches the geoID I want. I have no idea why.

{
"results": [
{
"full_geoid": "31000US40060",
"full_name": "Richmond, VA Metro Area",
"sumlevel": "310"
},
{
"full_geoid": "40000US74746",
"full_name": "Richmond, VA Urbanized Area",
"sumlevel": "400"
}
]
}

Attempt #3

You can also look up via lat/long. I know that because the API told me when I asked for something it wouldn’t respond to. It didn’t tell me exactly how to ask it though. There are several times were I tried longitude, long, and lng instead of lon but I’ll save you seeing that. This is what worked.
https://api.censusreporter.org/1.0/geo/search?lat=37.6211&lon=-77.6515
Sadly, this gives me a number of items back but not the Richmond one I expected.

Paying Attention

I continued to play some games and started getting some blank charts. I went back to the documentation page and with considerable less excitement I read.

Can I automate these embeds?
Unfortunately, no. The data for embedded charts is stored in tiny, static files to keep bandwidth low and performance high. This also lets us lock the data for a chart according to the ACS release in use when you embedded it, so your numbers don’t change just because we add new data to Census Reporter.

The data files for a chart are created the first time someone clicks “Embed” next to that chart on Census Reporter, and then stored for any future use. If you copy some embed code and change, say, the geoID variable to reflect another geography, odds are that new data file won’t have been created yet, and you’ll get a broken chart.

Ah well, it was a useful exploration and I’ll be using the site to do other stuff.

Timeline Sketch #2

I am still kicking around ideas for a timeline of my work history. You can see some of the other stuff in this post.

This version is a Bootstrap version that I think can end up working pretty well even in a mobile view with a bit more work. You can see it full size here.

Full size view of the timeline .

It’s set up so that there are two col-sm-6 containers that hold ten columns each making for a total of 20 covered years. I didn’t realize Bootstrap would let you just do col-1 and make it more than 12 columns.

So I have two rows of 10 columns within the 6 column ‘halves’ of the page. That lets them break nicely on mobile views into two rows that stack.

Mobile view of the timeline.

I set up some JSON to represent the jobs. I only did three so far but there are enough to see it’s functional. If you click on one of the first three job titles, you’ll see the data below the timeline changes. I haven’t really worked through the colors. I’m letting it marinate to see if I want to take it to fruition.

See the Pen bootstrap timeline test by Tom (@twwoodward) on CodePen.

Weekly Web Harvest for 2018-01-21

  • Tobias Schneider on Twitter: “Somebody forgot to turn off their Fitbit. Markers trace known military outposts, supply and patrol routes.… “

    Somebody forgot to turn off their Fitbit. Markers trace known military outposts, supply and patrol routes.

  • Donald Rumsfeld’s Snowflake Poetry Is Exactly What America Needs Right Now – POLITICO Magazine

    CALENDAR, PART 2

    I have a feeling that
    the things I want to do
    that we have to drop
    off the calendar
    don’t get put back on.
    For example,
    I still need a dentist appointment.
    Nov. 28, 2001,1:21 p.m.

    h/t my lovely wife

  • Walgreens Vampire | Orlando – Yelp

    He’s normally referred to as the Altamonte Vampire, although I’ve never seen him in any other businesses than Walgreens, as he pretty much lingers there late at night. I’ve also heard to him referred to as Dracula, but I think the Walgreens Vampire is more fitting than anything.

  • Prior Art – Futility Closet

    Krøyer patented his technique in the United Kingdom and Germany, but (the story is told) the Dutch application was rejected because a Dutch examiner found the 1949 Donald Duck comic The Sunken Yacht, by Carl Barks, in which Donald and his nephews raise a yacht by filling it with ping-pong balls.

  • Senate Quietly Admits It Doesn’t Protect Staffers’ Personal Email Or Devices From Hacking

    The government agency responsible for policing the Senate’s cybersecurity doesn’t actually protect staffers’ personal devices or accounts, creating what one former congressional staffer called “a major threat vector” for foreign hackers.

    “If I were a foreign intelligence service, I would be looking at every single congressional staffer, then I’d look at their personal email accounts because they’re all using Gchat,” said Daniel Schuman, a former House of Representatives staffer and the current chair of the Congressional Data Coalition, a nonprofit group that urges Congress to become more transparent and tech-savvy. “The Senate is not doing anything, nor is the House, to protect that,” Schuman told BuzzFeed News.

  • My Grandfather’s Travel Logs and Other Repetitive Tasks · An A List Apart Article

    But what do you do when you’re faced with a problem that can’t be solved with a plugin, like my grandfather’s travel data? If you’re a designer, what’s the best way to structure unconventional data so you can just focus on designing?

  • Comic contracts and other ways to make the law understandable

    Considering how swamped we all are with agreements and terms, from the workplace to just downloading apps, we need to change the way the information regulating our legal relationships is presented, as well as the level of other detail it contains.

    Pointlessly complex contracts have to stop. This is why some lawyers are rethinking contract design, using mind maps, illustrations and even contracts in comic strip form, which is the focus of my research.

It’s Fun, It’s Here! Highlights Theme for WordPress

The only place I ever saw Highlights for Children magazine was at my dentist office, a short distraction while waiting for the drilling and fat fingers of weird old Dr Cooper.

The tagline of the magazine was “Fun With a Purpose”.

But no connection here, except the name, it’s a brand new WordPress theme I just hoisted onto GitHub.

This is another theme I have built upon the solid foundation of a Creative Commons licensed template from HTML5 Up called Highlights “A Fun Little {Responsive} Single Pager.”

The content on this one is rather narrow, yet spoke to me as a nice simple calling card, top of the domain type design. The nifty hook is, when you look at the demo, as you scroll down, the background image subtly changes to match the content.

This joins my previous conversions of these well built HTML static themes to WordPress, WP-Dimension and WP-Big Picture.

You can find a working demo at http://lab.cogdogblog.com/highlights/

This one is close to WP-Big Picture which I used as a starting point. I use Posts to represent the front page sections, and the featured image becomes the one in the background as the front page is scrolled.

That stumped me a while until I picked through the code, there is an image inserted into the HTML, and the scroll action triggers a jQuery function to bring the image in. So in the original HTML, it does not look like anything special:

<div class="container">
	<span class="image fit primary"><img src="images/pic02.jpg" alt="" /></span>
	<div class="content">
		<header class="major">
			<h2>Stuff I do</h2>
		</header>
		<p>Consequat sed ultricies rutrum. Sed adipiscing eu amet interdum lorem blandit vis ac commodo aliquet vulputate.</p>

In narrow mobile screens, the image moves to be inserted inline, so there is some media elements in CSS controlling how the image is used. I actually could not exactly figure out the Javascript, so I just experimented with the template to insert the featured image in the same place:

<div class="container">
	<span class="image fit primary"><?php the_post_thumbnail();?></span>
	<div class="content">
		<header class="major">
			<h2><?php the_title(); ?></h2>
		</header>
		
		<p><?php the_content( 'more...' );?></p>

And it worked.

What my WordPress version does is a a bit more than you get in the HTML one; that one has three sections wired into the front page, you can add more, and re-arrange, by some not too terribly complex HTML copy/paste/editing.

But in the WordPress version, you just create posts for the front (I have allowed up to 10 sections, an arbitrary limit easily changed), and the order is controlled by using the Post Order metabox in the editor (added in my theme).

And it’s even easier to do via the dashboard Quick Edit, and the listing of Posts includes the order:

Using the Quick Edit to modify the post order

I also have it designed to use the WordPress Read More code, if you have longer content where you want just the opening on the front. Simply inserting the Read More thing into a post, you define where that split occurs, it then automatically adds the button on the front, and when clicked from there, it jumps to the content that follows.

And I also have a Page template, because there might be other stand alone content you do not want on the front page, but perhaps to link to.

I have some Customizer controls to edit the top title and the sub title (different from the blog title and tagline, I use that in the footer), and, with the Font Awesome 4 Menus plugin, you can add a menu of social icon links to the footer.

The Customizer Header Image control creates the background image used at the top of the site (the demo site uses a set that are randomly loaded all set up in the Customizer), and the top of all single post and page views, where the image switches, like on the front, when you scroll down to the content.

Finally, I added to these theme, and the others, a 404 Not Found template, which offers links to posts, pages, etc.

Enough describing, check out the demo including

This is a first release, and it’s likely I missed something or there might be funky CSS issues. Try it out and if you have suggestions, bugs, swiss bank account numbers, let me know in the GitHub Issues.

It’s pretty easy to leverage off of the ones I have built, and let me know if there is another one at HTML5 Up worth WordPress-ifying.

This was certainly “Fun With a Purpose” to make. I may have spent more time than worth mocking up the fake cover:

The full cover of an old magazine I appropriated just for this blog post


Featured Image: A photoshopped version of a magazine cover of a September 1986 issue of Highlights magazine, found in Reddit, not really licensed. Sometimes, well, oh heck, I really needed an image to remix. Send in the lawyers.

Portfolio Timeline

One of the things I ended up being dissatisfied with on my own portfolio was the timeline of my work history.1 At the time making an interactive multimedia timeline seemed like a good idea. Just the phrase “interactive multimedia timeline” sounds fancy, right? I made it using the KnightLab Timeline JS tool (which is a great tool) but it just doesn’t do what I want.

Define the Purpose

I hadn’t really thought deeply enough about my audience. If it’s people trying to hire me, and I can’t imagine anyone else caring, then I have to think what I want them to understand at a glance. Paging through the timeline can tell a decent story (if it happens) but the timeline does not allow the viewer to see the big picture at a glance. I also tried to show that while I’ve had a large number of jobs there’s a pattern of, and consistency between, organizations and between higher ed and k12. I tried to make that connection in the Timeline JS version by using the same logo and color pattern in the segments but it requires people to notice that and hold it in their heads. It’s not doing what a good visualization should do which is to offload that cognitive load to the eyes of the viewer.

Hand Sketch

So I opted to sketch out some timeline thoughts. You can see it below. I did it on the same page as I used for my drawing game challenge from the other night.2 You can see two timeline sketches. One is the work history and one depicts where I’ve lived. I often do these sketches to help think. Writing it down just helps force some constraints prior to further thinking it through digitally. On the right edge of the paper you can barely see the start of the data pieces I’ll need to make the display distinctions I’m looking for. For the work timeline it’s pretty simple. I need a start and end date, a job title, an organization, and a level. So five columns if I was making a spreadsheet with as many rows as I have had jobs.

Untitled

Survey the Field

I’ve seen lots of timelines. I’ve made lots of timelines. I still thought it would be worth looking around for a bit to see what others might have come up with. In addition to some general google searches for timelines,3 I also look like site:bl.ocks.org timeline to restrict the search to just some D3 examples. The nice thing about that site is the code is visible and you gives you a big jump if you opt to use a particular example. The bl.ocks.org site doesn’t have a good built in search so I use that bit of Google advanced search to allow me to search just that site.

I added a number of slightly different or interesting timeline examples to my pinboard bookmarks. That doesn’t mean I like them or dislike them. Often I just like to see how different people approach problems. Navigating large amounts of data is something I run into frequently and I find benefit in seeing examples I like but also in examples I actively dislike.

Digital Sketches

At this point, I start doing digital sketches. Some of those might just be messing with the look using a graphics editor of my choice. Sketch, Keynote, Photoshop, Illustrator, Omnigraffle are all stuff I use depending on my mood and the particular type of illustration I’m trying to make.

Below are some simple partial sketches using Keynote. I’m just guessing at sizes/percentages but I’m already running into problems with titles being too long. I don’t like the slant option. I could do a vertical alignment but I think people tend to expect horizontal displays for time and I’m losing ‘above the fold’ space that might cost me being able to see the whole timeline in one glance. Although this is a desktop-centric view, I’m guessing most people who want to see this will be on laptops. I will consider phone view constraints but they’re a secondary audience for this particular piece. You can see that despite knowing some of the basic ideas about stripping color when possible, I’m fighting that a bit (and possibly based on research or at least finding some research to back my own beliefs). Inevitably there is the pure science/art of data visualization and there is the practice of it with normal humans. Adding blue doesn’t help understanding but it does make it look better to average viewers.

Screen Shot 2018-01-27 at 2.19.35 PM

Screen Shot 2018-01-27 at 2.28.24 PM

I also do little programming sketches (bottom of the page) just to get a feel for what writing the code will feel like. I often use CodePen or Web Maker to do that. A CodePen example is included below.

I’m still thinking through exactly how I want this to feel and look…but that’s what the advance work looks like as I start to think it through.

See the Pen google script timeline by Tom (@twwoodward) on CodePen.


1 I’m trying to be more aware of what my links sound like when navigating via a screen reader. It feels a bit awkward at times to make longer, more descriptive links but it is worth thinking about.

2 ‘Draw dancing fruit’ was the prompt that one of the kids came up with.

3 These are pretty rough.

Portfolio // Data Visualization

This is meant to be a general survey of a fairly large swathe of concepts and examples with lots of links for additional specificity. I encourage you to follow links.1 I’ve tried to also mix it with quotes from a variety of designers.2 Those people are also worth exploring and most links will lead you to something that will lead you down an associative trail3 of links/searches..

Portfolio design considerations are grounded in many of the same design decisions that are foundational to good data visualizations. Many portfolios also include, maybe should include, elements that meet the typical definition of data visualizations although usually of small data sets.4 Both portfolios and data visualizations can be thought of as heuristics. You’re helping people think. You’re helping them understand you, a concept, a relationship, etc.

  1. Rich content brings meaning to a graphic.
  2. Inviting visualization interprets the content and highlights the essence of the information for the reader.
  3. Sophisticated execution brings the content and the graphics to life.

Dona Wong

Have an Audience in Mind5

The audience sets the initial frame for your consideration. Who are you trying to talk to? What are their likely experiences with websites and what do they care about? It’s also worth thinking about what might keep you from being attractive to people that you wouldn’t like. Assuming you have that luxury, it’s awfully nice to proactively remove yourself from situations where you’d suffer. In any case, there are common patterns that you’ll want to take advantage of.

Patterns may be more concrete than principles or heuristics, but they do define abstractions—the
best patterns aren’t specific to a single platform or idiom. Some even work in both print and interactive systems. Ideally, each pattern captures some minor truth about how people work best with a created artifact, and it remains true even while the underlying technologies and media change.

Jenifer Tidwell

In almost every case of anything, you are dealing with people who are busy6 and disinclined to stay on pages that don’t interest them in some way and fairly quickly. You need to consider what shows when that page first loads. What’s above the fold? You can even use data visualizations of eye scan patterns to think about how people read websites and what it might mean.

That’s not much different from how you might think about data visualizations. What is the audience experience with the data and visualizations more broadly? How does that shape what I build? How might I prioritize certain information and how do I think through an experience that invites deeper analysis?

Make an Argument // Deliver a Message

In a portfolio you are making an argument that you can do certain things. You’re trying to condense lots of time, energy, and effort into something that can be understood relatively quickly and yet represents the depth, complexity, and time you’ve spent honing these skills. That doesn’t mean it can’t also lead to greater depth and sophistication but you’ve got to get people interested first.

In data visualizations, even those that are exploration based7, you are making an argument. You believe some understanding will come from seeing or interacting with the data. Both scenarios are about communication and understanding. You’re taking on a larger portion of the burden of time and cognitive load rather than putting it solely on the viewer.

Least Effective Dose // Minimalism

Less is more is the refrain. You want to design rather than decorate. “We need to get more comfortable with whitespace.” but that doesn’t mean empty space.

Simplify – Just like an artist can capture the essence of an emotion with just a few lines, good data visualization captures the essence of data – without oversimplifying.

Stephen Few

There are some great examples out there of people taking really graphically heavy data visualizations and breaking them down in simple formats. I particularly like this revision of a banana chart. Dark Horse Analytics also has a series of gifs that take a busy chart and break it down to the most basic components. You can see one example below and other examples for simple tables, simple pie charts, simple maps.

An animation showing the progressive removal of clutter from a bar chart.

Graphical excellence is that which gives to the viewer the greatest number of ideas in the shortest time with the least ink in the smallest space.

Edward Tufte

Digital // Analog

It’s also important to realize that while some of these items are only possible with fairly sophisticated software, there is also real power in simple hand-drawn images. XKCD is an online comic that routinely blurs the boundaries between the two while at the same time blurring the lines of education and humor. This particular comic also takes advantage of the web to do things that would be impossible with standard physical options. Hovering over any of the comics presents a second layer of the joke and a number of the comics play with the flexibility the web has regarding scale and the ability to scroll and zoom to release/see additional detail (The Earth’s Average Temperature, and Money for instance). It plays into the idea of revelation in this gestalt theory/data visualization document.That whole series is really nice. There are four of them and I get to them by changing the number in the URL.

Bret Victor’s presentation ‘Stop Drawing Dead Fish‘ is about art but can easily be applied to data visualization. He makes a number of strong arguments about when something becomes truly digital as opposed to simply digitized. It’s also worth checking out his explorable explanations work. He pushes the boundaries there but the conceptual considerations are what I’d encourage you to focus on rather than getting intimidated or over awed.8

This is the far end of the spectrum and really requires bending your brain to do really well. It’s not going to happen every time but being aware of truly transformative destinations helps set a bar that is aspirational. If your goals were simply to duplicate paper then a huge swath of affordances end up being ignored. That doesn’t mean there’s no scenario where you simply duplicate really good work on paper but being aware of the far horizon9 always helps.

A Portfolio

I’m going to apply some of these concepts to Dr. Tressie McMillan Cottom’s site. I didn’t break down the site with her so I’m making educated guesses in terms of the thought that went on.

An annotated screenshot of tressiemc.com indicating 4 areas of note.

Above the Fold

The following areas are visible when the page first loads and prior to the user scrolling. That is generally where the most important and most engaging content is placed.

Section #1 Menu choices are pretty close to a mini-outline describing your site. This represents (and links to) what is most important in your site. This is a place to simplify and condense. Tons of menu items results in awkward navigation. In most sites this menu travels across all pages so it’s the primary driver to allow people to access the main parts of the site. What are the constituent pieces that make the whole? What are the four or five most important pieces you’d want people to see?

In this case the menu items are CV, Research, Projects, followed by a grab bag item entitled EssaysTalks, Media, and More. That’s pretty typical for an academic portfolio. You could look at many academic portfolios and find that most have a very similar structure.

Section #2 is the next major design/visual area. This represents probably 90% of the above the fold area so it’s fairly important releastate. In web design terms this is a slider or carousel. Sliders are often meant to help you cheat a bit and include more visual content in a particular area by rotating content through. They’re meant to be visual and engaging and they remain a pretty popular trend despite some research indicating sliders may not be as engaging as popularly thought.10 The content here cycles through every X seconds or the user can navigate via the small rectangles at the bottom center of the slider.

Below the Fold

Section #3 This is the condensed biography paragraph. I put it through wordcounter.io to take a closer look at it. You can see it’s about 80 words and digital appears 3 times. Cottom, professor, and inequality appear twice. It’s not data visualization but repeating words shows importance.
Data view of intro paragraph that indicates 82 words, 590 characters.

Section #4 This section contains book reviews. Based on the arrangement it seems like Lower Ed takes priority over Digital Sociology. In terms of reviews it looks like the NYT takes priority over Harvard. They’re both pretty impressive for sure. The fact that they’re links changes their color and gives them a bit more emphasis on a scan of the text. That also creates association between the elements through the gestalt principal of similarity/invariance. The reviews are written in similar patterns which helps build consistency. It also make small inconsistencies stand out. You might notice the double dash rather than single in front of the Harvard Educational Review or the lack of leading double quotes for the BookForum quote. That’s not meant as a criticism just a reminder to create patterns that will be easy to follow or build workflows that force adherence. Humans wander when possible and have trouble seeing those variances in their own work. It’s usually much easier to see it in the work of other people.11

tressie.002
Section #5 There’s a sub-menu here. It’s an interesting shift from the menu at the top of the site. We have a repetition of CV as a link but there’s an addition of new elements – Public Lectures, The Daily Show, and Fresh Air. That’s a bit of a shift and the focus here seems to be a bit more on popular, rather than traditionally academic, topics of interest. These items are more specific and would likely fall under the Talks, Media, and More category of the main menu.

Section #6 Here we move into most recent posts. They’re a bit harder to follow. It’d be helpful to enclose them to show the unity of the elements that constitute a single post. It may be a case where things get a bit too minimal.

A list of years and months of blog posts on the right and a tag cloud of elements on the right.
Section #7 This section has two data visualization patterns. On the left we have a navigational element that breaks down years and months. In this case all months are listed regardless of whether that month has a post or not. You can see that through the color variation. It’s easy to take in at a glance that there are posts from 2012 to the present and there has been at least one post on every month in 2012, 2013, and 2014. On the right is a tag cloud. The use of tags in posts generates this automatically and increases in size indicates and increase in the number of posts that use that tag. #lowered has lots of posts while #r ends up with just one. That means it’s so small you might not even see it unless you look closely.


1 May own pattern is to command click to open interesting looking links in new tabs as I read. I also end up with many, many open tabs.

2 I’m not doing as well with diverse representation as I’d like so if you have cool people who aren’t white men please throw them my way.

3 h/t Gardner and Thought Vectors for getting me to read some of the old stuff.

4 You do want to be careful about over simplifying or arbitrarily simplifying your skills into something like “The Arbitrary ‘Skills’ Chart.”

5 That audience could be just you. Maybe you just want to do this to reflect on your own work or make something beautiful or strange.

6 . . . or at least convinced they are which is ends up being the same thing.

7 Think explorable explanations which tend to live in the intersection of simulation and data visualization.

8 Maybe that’s just me.

9 It’s best not to look at the date when Victor made these presentations.

10 Many sites I worked on have sliders.

11 I will see at least 12.3 errors in this post once I hit publish.

Fake Hues

I heard Trump saying ‘fake news’ on the way in this morning and it led me to ‘fake hues.’ It’s been stuck in my head ever since. I thought this would have been done already but a cursory google search didn’t turn it up so . . .

I took the image of Trump from this article and used Color Thief1 to pull out the three main skin-ish colors.

Three rows of orange-ish colors with the text 'fake hues' over the top of them in white.

It took all of five minutes to slap together and write this post so I’ve now got it out of my head and can move on to more productive things. But I’ll probably come back to it this evening to match the font and the box ratios on the upper portion so the white spaces matches the letter cross-strokes like the lower portion.


1 It’s science rather than my biased selection of especially orange colors.

Where Can I Get a Stunning Web Site?

I awoke today wondering, that if in today’s mankind digital age, a stellar website is needed for all kinds of businesses?

Is there a place I can post my own information on the internet? How can I get a stunning design but also a great under-the-hood engineering that leads to reliable seamless functionality all the time?

Is there such a thing?

And then, like karma, the key to enlightenment arrives in my inbox:

Oh Nitin you are my savior.

You, the emissary of the cockroach world that poops all over the internet, what a noble profession you must have, sitting down each day to make these grandiose offers to complete strangers?

Thanks for also including your selfie pic

I’m saving my quarters so I can make that long distance call. Enjoy the treatment.


Featured Image: Roach – 02 flickr photo by siamesepuppy shared under a Creative Commons (BY) license

I like how the caption informs me “Despite popular opinion, roaches are very clean.”

100 Copies Loop

We’re doing year two of the Social Work Portfolio in Google Docs. I am opting to do the creation/duplication of the main files on the computer end rather than the Google Drive/Scripts side of things because of all the hassle from last year. You can read more about the full failure here.

This AppleScript will give me 100 iteratively-named (x_1, x_2, etc.) copies of the source folder and all its sub-directories and their content. It is just adding a variable from the AppleScript to the loop that calls the terminal command ditto.

tell application "Terminal"
	repeat with theIncrementValue from 100 to 1 by -1
		set folderNum to {theIncrementValue as string}
		set currentTab to do script ("ditto /Users/yournamehere/Desktop/BSW_Graduation_Portfolio_2018 /Users/yournamehere/Desktop/sw18/BSW_Graduation_Portfolio_2018_" & folderNum)
	end repeat
end tell

I’m sure a shell script could do this or I could do it fully in Automator. There are many paths but I knew enough about both of these to get what I needed one in ~5 minutes.

Next up will be automating the sharing via Google Script. It won’t be much different than last year but I’m going to add a piece that will write that the folder and the contents were successfully shared to the spreadsheet that holds the student emails. That way when/if the script fails it can auto-resume without having to go back and start over.