Thumbsaver - duh

Thumbsaver

I came across the Thumbsaver today and thought, “Duh!” Just like the ergonomic peeler, I can’t believe this wasn’t invented sooner. I’d never admit it around (other?) manly men, but the few times I have hammered a nail, my hit rate wasn’t always 100%. Now, if one were to be seen using a Thumbsaver, manliness might still be in question regardless of accuracy, but it’s still a neat gadget in my book.

via Inspire Me Now

Color Sitemap

Color Sitemap

Lately, I’ve been playing with alternate ways of navigating the website. After accomplishing simple grid and list views, I decided to stray from conventions and have a little fun. Since the site focuses heavily on color with each page assigned its own scheme, why not navigate by color? Instead of a typical list-based sitemap, I spent today working on a color-based sitemap. It displays every page on the site and auto-updates when I create new pages. Rolling over a swatch displays the corresponding page’s title as well as the swatch’s hex value. This small concept makes me think more about the idea of experimenting on the site itself. What else could I play with?

UD Cycling Classic

Charlie Whitney, an internet-friend-turned-real-life-friend, recently finished the Urbandaddy Cycling Classic installation for the E2NY Music and Arts festival. It takes two racers on modded bikes and projects virtual environments mapped to their speeds. The concept is awesome, the execution is perfect, and it just looks so fun. If I still had birthday parties, I’d want to rent it for my upcoming 25th.

Cycling Classic Cycling Classic

Gimme Bar - save the web

These past few months, I’ve been beta testing Gimme Bar, a new web service by FictiveKin (the same dudes who developed TeuxDeux). This time they’re targeting internet content. At first, Gimme Bar might seem like just another bookmarking service, but instead of linking to the content, it actually saves it. You can save text, images, videos, and even capture an entire webpage.

What I love most about Gimme Bar is that there’s no specific way to use it. At first, I thought I’d make a wishlist for gadgets, but over time, it naturally became a collection of my favorite animated GIFs. There are countless ways you can use Gimme Bar and that’s what excites me about its future.

Gimme Bar is still in beta, but you can sign up without an invite for today only. Jump onboard while you can and try it out for yourself.

Gimme Bar

LayerVault - simple version control for designers

In my experience, version control is one issue that has always existed in the design world. Since devs are used to obscure commands and “mentally-challenged” user interfaces, typing git add . & git commit -a isn’t a big deal. Designers are different. Save as... is the typical version control method for many, and any attempt to force designers to use p4v might lead to mass suicide.

LayerVault tries to solve this problem by plugging directly into Photoshop. A simple Command + S automatically saves a revision. Then, you can view the file’s history in a timeline interface that shows a clear diff of the changes.

Unfortunately, LayerVault is currently in a closed beta, so I don’t have any invites to hand out, or even one for myself! For now, you can watch the video below, apply for access, and cross your fingers.

LayerVault

Wacom introduces Inkling

Today, Wacom introduced a new device called Inkling. It clips onto your sketchpad, records what you draw, and instantly provides a digital copy of the drawing. It sounds like black magic, but if it actually works, I know first-hand this will be on the wishlist of every illustrator out there. Check out the video below for a closer look.

Wacom Inkling Wacom Inkling

Compressed 02 by Kim Pimmel

I work with a very talented designer, Kim Pimmel, who consistently knocks out killer work both on the job and in his free time—we share the same hunger for side projects. Earlier this year, he started a short film series titled, “Compressed.” Kim released his second of the series and it does not disappoint. Even after telling me exactly how he did it, I’m still dumbfounded. Below are a few stills along with the film.

compressed compressed

Simon says build succeeds

Simon says

Last month, Adobe’s XD department held a ‘hack day’ for developers. Since we only had one day to produce something, I planned ahead and aimed to turn a vintage Simon Says into a build server status indicator. Since patience isn’t my greatest quality, I finished the project weeks before the hack day. I’m glad I did since I had to order many additional parts I didn’t think I needed.

The indicator works by cycling through the colors if the server is building. When the build succeeds, the indicator flashes green. When the build fails, the indicator flashes red. I used an Arduino Uno with a battery and bluetooth modem to make it completely wireless, so it could just hang on the wall, waiting for a build to start. Unfortunately, bluetooth eats through batteries like I eat through burritos, so that foiled my plans. As a tethered device, it’s not exactly practical, so it will lie in a box until the next time I show it off.

If you’d like to take a closer look at the process, visit the lab page.

Crowdbooster - a blogger's right-hand man

Crowdbooster

Since launching the new site and getting back into the blogging game, timing has been very important to me. Most importantly, what is the best time to tweet about a post in order to get the most exposure? This is where Crowdbooster comes in handy.

Crowdbooster is a web service that analyzes your tweets and your followers’ tweets, then generates a bubble chart, indicating the time of the day in which your followers are most active. From there, you can schedule a tweet and avoiding waiting for the right time. It also provides a slew of other data, like follower count over time and retweet impressions, but scheduling has been most useful for me.

At the moment, Crowdbooster is invite-only, but I have five invites to hand out to those interested in trying it out. Since the invites require me to type in email addresses rather than simply link you, I’m going to make it interesting. In the comments, link to your favorite animated GIF and I’ll pick my five favorite. And, by animated GIF, I don’t mean those under construction ones from ‘95. This gem is what I want to see.

Tidy your HTML

Like many developers, I’m OCD about code quality—not only for performance, but appearance as well. When working with generated HTML, it’s difficult to make sure every mixin, include, or partial is correctly indented. Enter Tidy, an HTML-cleaning executable that oddly enough comes bundled OS X. Here’s an example of the syntax:

$ tidy -im index.html

In the above code, the -i flag tells Tidy to properly indent index.html and -m indicates that Tidy should directly modify the file.

This is all well and good for an individual file, but what if you’re working on a large website? Luckily, Bash makes it easy by using a glob, or wildcard. This snippet executes Tidy recursively over every HTML file in the working directory:

$ tidy -im ./**/*.html

Now, if you’re working in a language like Ruby, you probably don’t want to use the command line if you can help it. There are several Ruby Gems that can run Tidy on a string or file, but I’ve had the best luck with Tidy FFI.

For this site, I run Tidy FFI at the tail-end of my Rake script, automatically cleaning up the innards and giving my OCD side some peace of mind:

require 'tidy_ffi'

desc "Tidies HTML files"
task :tidy do
  Dir.glob('site/**/*.html') do |path|
    content = File.open(path).read

    File.open(path, 'w') {|file|
      file.write TidyFFI::Tidy.new(content, 
        :numeric_entities => 1, 
        :output_html => 1, 
        :merge_divs => 0, 
        :merge_spans => 0, 
        :join_styles => 0, 
        :clean => 1, 
        :indent => 1, 
        :wrap => 0, 
        :drop_empty_paras => 0, 
        :literal_attributes => 1).clean
    }
  end
end

My script sets a handful of parameters that actually prevent Tidy FFI from cleaning too much. If you’re not careful, it will merge elements, and royally screw your CSS if you use nested selectors. View the site’s source code and see first-hand how well Tidy cleans!

  1. 1
  2. 2
  3. 3
  4. 4
  5. 5
  6. 6