My workflow for Neat Hobby! or, webcomics are hard, not including the drawing part

I came back to Neat Hobby! after a months-long break — which looks like is going to be a regular occurrence during the dead-of-winter months — and had to get back into the groove of posting the latest comic to the kabillion places where people have chosen to gather online. I have finally accepted that I have no control over how folks choose to “consume” “content” — ergo, let the cutting-and-pasting of links begin!

I’m 100% a tourist in the webcomics game and it’s more about self-care and creative satisfaction so I don’t really lose sleep if I forget something. But that said, I wrote down my workflow for getting Neat Hobby! up each week so I wouldn’t forget it all when I came back. Useful/fun to share? I dunno, you’re the one reading this.

Prep stage

I draw each Neat Hobby! strip in Clip Studio Paint at 600dpi, using a first-generation Surface Pro tablet. Most strips start with a template file that has eight panels, a folder each panel, and a folder for dialogue balloons. Most Neat Hobby! strips are four-panel jobs, so I just delete the panel folders I don’t use.

From here, I export a number of finished images:

  • the full strip at 900 pixels wide.
  • a 600 x 300 pixel wide “card” image to be used by Twitter and Facebook previews. To make these, I hide the dialogue folder, make an interesting selection with the CSP Selection Tool and export just that selection.
  • a 200 pixel square thumbnail image, using the same technique. I used to create these using the media editing tools in WordPress, but to be honest, they’re super-confusing to use. Now I just create them in CSP.

Once created I upload them to a cloud-based storage folder where I can work with them from a laptop or phone.

The Neat Hobby! website

I used to just upload the 900px version to the Neat Hobby! website, but I redesigned the site to use a Flexbox layout to make the comics more mobile-friendly. On a wide screen, the panels display as a two-column square, but on a small screen, they rearrange into a single column. Wizardry!

This means I gotta chop up the 900px version into separate panels. I use Pixelmator, which has a nice Slice Tool for this (CSP does not, booo.).

Once I have an image for each panel, I upload them to the website along with the card and thumbnail images and insert them into a new post.

(How does Twitter and Facebook find the card image? I have some custom website templating that does everything. Maybe I’ll post some snippets later.)

Once the site is updated, I move on to EVERYTHING ELSE.

Instagram

Instagram is great for panel-based comics because readers can swipe through the strip. But I’ve found that uploading the not-square sliced panels to Instagram kind of sucks. They get distorted and aren’t optimally sized.

So I use a Mac OS X Automator script to make copies of the slices and resize them for Insta. They automatically go into a cloud-based folder so I can put a post together using Instagram on my phone.

Instagram tagging is a real pain in the ass, but I’ve found it’s it’s the only way I’ve gotten new readers who aren’t already friends and family. I keep a text file of standard boilerplate hashtags to paste in and modify.

Twitter and Facebook

Here I just post a link to the website. The card images make sure there’s a nice-looking preview image. Because I took the Twitter and Facebook apps off my phone to cut down on my social-media-induced rage, I use an IFTTT applet to keep both the Neat Hobby! Facebook and Twitter pages in sync with the official website. If you take this route, be sure to uncheck the link shortening option in your IFTTT account settings, or else your card images won’t “unfurl” correctly.

UPDATE: I used to use IFTTT to also post updates to my personal Twitter and Facebook pages too, but stopped because too many identical posts across different accounts gets flagged as spam. I’ve found it’s better to just share or retweet those updates via my personal accounts.

Tumblr

Yes, there is a Neat Hobby! Tumblr!

Tumblr does things with images that I don’t understand or trust, so I upload the full 900px image. Tagging is a nuisance, so I use the Tumblr Post Tags extension for Chrome to pre-populate the tags. Then I add a few relevant extra tags.

I also use keep a folder of “syndication snippets” that are just text files that have some boilerplate text I put in every Tumblr and Medium post. “Read more here!” and “Follow on Twitter here!” and that kind of stuff. More manual labor!

I am thinking of ditching Tumblr. It’s currently used as a mirror of the official site, and I don’t really invest enough time there cultivating it.

Medium

Because a lot of Neat Hobby! strips deal with tech culture stuff, I started posting specific strips to Medium. I post the original 900px image to ensure the layout doesn’t break. Mercifully, Medium only allows five tags.

Growth has been slow but generally positive on Medium. As with Tumblr I don’t have time to really cultivate an audience there, but it’s still doing better than Tumblr with minimal effort.

Email

For the brave and true mailing list members, I use TinyLetter and post a link to the most recent strip. I’ve experimented with embedding the card images in email, but I think it’s more trouble than it’s worth. Once, for my day job, I used Litmus to test out some HTML email layouts. Trust me, you don’t want to know just how badly things can break.

That’s basically everything. I know some career comics folks out there use automation services like Hootsuite and some just pay someone else to do all of this stuff for them, which sounds fantastic, but there’s a limit to my investment in all this.

June 13, 2018

New music release! “NPE,” a 20-minute concept EP about anxiety, computers, and irreversible life choices

I’m pleased to announce a new music project I’ve been working on for the past year (and teasing on Twitter for the past week)!

NPE is a 20-minute mostly-instrumental concept EP I’m releasing under the name OneKilotonSun. I began writing these tracks in early 2017 as way of working through feelings of midlife anxiety, day-job stress, post-election depression, and generic winter blues.

“NPE” is an acronym for null pointer exception, which is a type of programming error where the computer expects to find a value but finds nothing — null — instead. I thought it was a fitting title to describe what I was experiencing at the time: sudden, frustrating setbacks caused by literally nothing. Anyway, you don’t have to know anything about computers to enjoy this EP, trust me.

It’s hard to describe this music. Loop-and-guitar art rock? In a lot of ways NPE is a nod to my early influences — Pink Floyd, Porcupine Tree, Alan Parsons Project — stuff I listened to when I was learning guitar in the first place. Which is to say, there are quite a few guitar solos.

Now at Bandcamp for your listening/purchasing pleasure (and iTunes to come later). If you’re not ready to commit to the full 20-minute odyssey, you can jump right to the single version of “Throwable” to get a taste. My fave track however is without a doubt “Exception” which is built on a riff I originally wrote when I was 22, and tracked last year with ace drummer Don Gunn, who also mastered the EP.

All net proceeds from NPE will go to the Girls Rock Camp Foundation — which is also true for all my other music too.

So very glad to push this out into the world. Enjoy.

June 4, 2018

The cycle of madness

  1. Wake up, grab phone before I even get out of bed.
  2. Within ten minutes, become super-angry about something I have zero control over.
  3. Think obsessively about super-angry thing as I shower.
  4. Fabricate arguments with imaginary opponents concerning super-angry thing while I drive to work.
  5. Realize if I don’t drop super-angry thing I won’t get anything done.
  6. Come home, grab phone, become super-angry about some new thing right before bedtime.

It’s gotten to the point where I’ve had to block the word thread on Twitter. I’ve had to block the fire emoji. This is no way to live.

June 1, 2018

I can’t stop listening to “All The Stars”

Missed out on this when it was released in January ahead of Black Panther. On repeat for days.

May 11, 2018

The Rock gets $1 million to tweet about his movies because he’s a business genius

Movie marketing dollars that would have gone to traditional advertising is now going to actors that have great direct engagement with their fans.

“predictive prefetching” with Guess.js

Interesting stuff coming out of Google I/O. Guess.js is intended to help create “predictive data-analytics driven approaches to improving user-experiences on the web.”

May 9, 2018

HTML5 Constraint Validation

Cool overview of all the built-in form validation goodness available in HTML5.

May 6, 2018

Pop Quiz, Hotshot

A new comic over at Neat Hobby!

Front End Interview Handbook

An interesting collection of questions and answers. I’d argue that some of these questions border on trivia — you shouldn’t be required to memorize the entire CSS spec to get a job — but since people are gonna ask them anyway, worth a read.

March 21, 2018

Digg Reader shutting down

Digg Reader is going the way of Google Reader, meaning those of us who value access to an internet not dictated by Facebook-like algorithms just lost another safe haven. I’ve moved my subscriptions over to The Old Reader, which has a quaint Slashdot-era feel to it, and there are many other options available.

March 20, 2018
« Older EntriesNewer Entries »