Archive for June 2004

Treoing your Tivo

Jason Shellen, of Google, wrote briefly today about his experience programming a Tivo from a Treo 600 cell phone. Jason was using Tivo’s new “Online Scheduling” feature and sounded very impressed with the whole experience.

I’ve been scheduling recordings on my Series 1 DirecTivo with my Treo 600 phone for several months now, but I’ve been using the open source TivoWeb software instead. Installing the tiny TivoWeb package on your box turns it into a full-fledged web server with access to the outside world. The end result is that from any browser in the world (including the nice one on the Treo), you can access every aspect of your Tivo’s interface. You can even search for programs or physically change what channel your TV is tuned to… all via IP. And since TivoWeb is HTML and CSS driven, it’s a snap to create stylesheets which look great on desktop browsers and handheld devices as well.

So I’m wondering… has anyone tried both the official Tivo Online Scheduling feature and the TivoWeb Project’s open-source implementation? Are there any compelling reasons to use one over the other? I’m sure the lack of command-line setup and other Unix scariness is a big plus on the side of Tivo’s official service, but is it as powerful as what the TivoWeb Project gives you? In other words, can I freak housesitters out by changing channels from halfway across the world?

I think if more people were aware of features like remote scheduling, we wouldn’t see the levels of DVR/VCR ambivalence we still see in the market today. Why is Doogie Howser telling me how to pause football games when a less annoying celebrity could be telling me about remote scheduling?

Making Visited Links Radical

Everyone does visited links differently. Jakob Neilson flunkies use the old school blue-and-purple combo to help show visitors where they’ve been. People with actual design taste use more palatable colors, or perhaps a font-weight variation instead. When Mike Industries launched, visited links differentiated themselves with a subtle grey background.

Although I liked the grey background implementation, it started to look more like a highlighter pen than anything else.

I decided to rethink the situation.

Since doing normal stuff is no fun, I decided to experiment with the :after pseudo class. What character could one insert after a link to indicate that the link had already been checked? Hmmm. How about a checkmark? The standard ISO character set gives us the mathematical “radical” sign (√) which looks remarkably like a hand sketched checkmark at small sizes. So this should be easy, right? You’d think something like this would do the trick:

a:visited:after {
	content: " √";
	font-size: 75%;
}

Nope. It turns out that prints the actual encoded character series for radical after each link. But by using the unicode entity instead ( \221A ), the checkmark renders perfectly after each visited link:

a:visited:after {
	content: " \221A";
	content: "\00A0\221A";
	font-size: 75%;
}

* Thanks to Jens Meiert for improving this technique as illustrated above by using a non-breaking space before the radical, instead of a regular space.

I am not so naive to think this has never been done before, but I certainly do like the effect. Sure, the :after pseudo class isn’t supported in PC IE, but at least it degrades silently in feature-challenged browsers.

Mike Industries Zeitgeist: Week One

Well it’s been a good first week here at Mike Industries. Over 50,000 page views, plenty of scathing editorial and healthy discussion in the comment threads, and not a single piece of hate mail! Not that readers might be interested in such things, but I thought I’d share some of the nuggets gleaned from ShortStat during the first week:

  • Total Page Views: 50,304
  • Top Platforms: Windows – 69%, Mac – 25%, Linux – 2%
  • Top Browsers: Firefox – 41% (wow), IE – 23%, Safari – 17%
  • Top Three Referrers: Mezzoblue, Zeldman, Kottke
  • Most interesting referrer: The “Eater” (what the hell is this?)
  • Coolest blog discovered via referrer: Thought Anomalies
  • Number of deaths reported from the Invalidator Badge: 0*

Anyway, more ramblings are on the way this weekend. Thanks to everyone who has put up with them so far. Expect updates to this site once or twice a week as excess mental energy allows.

* In case there was any doubt, yes, the Invalidator Badge is clearly hyperbole.

You Know You're a Design Dork When...

You know you’re a design dork when this is just about the funniest comic you’ve ever seen:
(Original comic available at bancomicsans.com)

Converting CGI Movable Type Templates to PHP

I love Movable Type. I really do. But there are two things about it which really chap my hide. The first is that it doesn’t offer dynamic page serving, so I must recompile my entire site after making a change. I can live with this problem as recompiling is just a question of hitting a button and waiting awhile.

The second problem, however, is that Six Apart left a few important pages as raw CGI queries. I’m talking mainly about the Search Results page, the Comment Listing page, and the Trackback page. I understand why the company initially set things up this way since when Movable Type first came out, not nearly as many people were using PHP as they are now. But now that PHP is so widespread, it would sure be nice if the company offered its customers an easy way to convert these templates to PHP.

Short of this, I’d like to share the ways I de-CGI’d these templates on Mike Industries. If you build portions of your pages dynamically with PHP, this entry is for you.
→ Read the rest of this entry

Giving Full Typographic Control to the User

So I have this friend named Lavina who occasionally sends me e-mails and instant messages set in Comic Sans. I have told her repeatedly that this font has been officially banned, but she “just likes it” and continues to use it in various pieces of correspondence… even if it is just to piss me off.

So that got me thinking, should a website allow you to explicitly set the typeface of what you’re reading? Most sites set the typeface for you. My site gives you several choices derived from what I find to be very readable faces: Lucida Grande, Verdana, Helvetica, etc. But what about the edge case that just really loves Comic Sans? Should I throw Comic Sans in my dropdown menu on the right side of this site? Clearly not, unless I want to be publicly ridiculed at work.

What I decided to try instead was adding a custom font field to the Readability section on the right side of this site. Click the “Or, specify your own…” link and type in any font you have installed on your system. Then, hit the “Set” button and voila! Mike Industries will reluctantly render in whatever twisted typeface you happen to think of that day. Even Comic Sans. Or worse yet, Giddyup (see picture above). The only downside is that you need to type the font name in exactly as your system labels it. So for instance, on the Mac, “ComicSansMS” works but “Comic Sans” does not. If you have a particular font you’d like to specify, just try a few variations of its name, with and without spaces, and you’ll get it after a few tries. If you don’t get it, the site will just render in whatever your default font is.

One thing I’d really like to be able to do with this is have a dropdown menu with all the fonts a user has installed instead of making people type a font name in. Does anybody have any idea if this is possible? My suspicion is that if it is, it may require writing something OS-specific… bad.

So for now, please enjoy the Custom Font Selector, and let me know if you have any ideas to improve it. I feel like this functionality is best suited for OS X users right now because we get to view true anti-aliased Postscript fonts in our browsers, but as mentioned with regard to Comic Sans, Windows users can “benefit” too.

Newsmap as a Model for Smart Aggregation

Information overload. It’s the next big issue in publishing, and technology in general. The day you have 400 e-mails in your inbox, 900 new items in your RSS aggregator, and 8 Instant Messenger windows on your screen will come. For some people, it’s already here.

With the internet still growing and changing at such a rapid rate, the raw amount of information your brain processes will see a huge increase in this decade. There’s probably even a Moore’s Law-esque equation for it. So if we are finding that the flow of information into our lives is only going up and our free time is only going down, how do we deal with this increasing imbalance?

The answer is agentry. A smart agent of sorts that sits on your desktop and acts as mediator between you and the world. If you want something from the world, your agent goes out and finds it for you. If the world wants something from you, it needs to talk to your agent first. We may have various agents in our lives already but none accomplishes what the smart agent of the future will accomplish.
→ Read the rest of this entry

March to Your Own Standard

So what’s up with the little grey button at the bottom of this site? It is my official Invalidation Badge. It’s mere presence on every page of this site renders my entire domain XHTML 1.0 Non-Compliant. Invalid. Erroneous. Whatever you want to call it. Here are the various crimes this one line of code commits:

  • An ampersand is not properly encoded
  • An alt tag is missing
  • An attribute called “myfavoritetag” is made up
  • An attribute is missing quotes
  • A script tag is missing its type and language attributes
  • A non-closing tag is missing its trailing slash
  • A tag is upper case… gasp!

By invalidating my entire site with this one line of code, I ensure that I am made aware the instant it matters. The instant this stuff starts to break anything in the real world, I will know. If I only had a few small errors on a few random pages around my site, I could easily miss the day when “the big switchover” happens and wind up with broken pages I don’t know about. And since this code is in the form of a server-side include, I can freely remove it with a few clicks.

It’s kind of like carrying a canary down a mine shaft with you. As long as the canary is alive and chirping, you know you’re okay for air. Actually, I guess it’s not really like that.
→ Read the rest of this entry

Site Experiment: Puget Sound Cam

When it comes to designing public sites, I am a big fan of giving control to the user. The old school of web design told you to specify a page’s visual parameters in such exact terms that users couldn’t really do anything to adjust it. This was mostly the by-product of inconsistent browsers and heavy-handed design techniques. Although we haven’t gotten completely away from browser issues yet, we now have stylesheets with which to create entire design motifs.

By using a dynamic style switcher like the one on the upper right side of this page, we can offer users the choice of several different looks. Since there really is no accounting for taste in any form of media consumption, you only increase the likelihood that users will enjoy your site by offering them a few choices.
→ Read the rest of this entry

Putting the Face Back in Typeface

So the other day, Zeldman opined that he’s not seeing the sort of creative explosion he once expected from the web. I can’t say I disagree too much with that, but if you look in the right places, new jewels pop up every week.

Take Ni9e.com’s latest typographic illustration project. After watching it 20 or so times, I think it might really be the coolest thing I’ve ever seen in Flash. It’s creative, artistic, simple, and brilliant. The Bob Dylan (Garamond) one is my favorite, although all others are fantastic as well. Sometimes when I see stuff this good, it makes me want to get out of design altogether. I mean, when the bar is set this high, what’s the point of even jumping!

I can only guess how this was done:

  1. Use a pressure-sensitive tablet to draw a musician.
  2. Record every stylus movement using a custom-built Flash routine.
  3. Compile a text file containing the lyrics of a song from that musician.
  4. Write some Actionscript which recreates the original movement of the stylus, but using letters from the lyrics instead of a plain black line.
  5. Use the pressure-sensitivity to create bigger letters for when the stylus was pressed down hard, and smaller letters for when the stroke was light.
  6. Import the song and play it while the figure is being drawn.

It is great work like this which keeps me inspired about the web industry. Kudos Ni9e.com.

Shared

Hundreds of headlines wash over us every day. And part of why many of us engage in this flow is because we have faith that over time, this torrent of episodic knowledge is going to cohere into something more significant: a framework for genuinely understanding an issue. And we live with it ’cause it sort of works. Eventually you hear enough buzzwords like “single-payer” and “public option” and you start to feel like you can play along.

But mounting evidence indicates that this approach to information is actually totally debilitating. Faced with a flood of headlines on an ever-increasing variety of topics, we shut off. We turn to news that doesn’t require much understanding – crime, traffic, weather – or we turn off the news altogether.

- Matt Thompson on why the way we report and consume news is precisely wrong. Matt is, of course, precisely right. If you’re at SXSW next week, I don’t know how you could justify missing this talk.

Cameron’s Colosseo letterpress poster is now available: The only question is, black or white? The black is oh so tempting!

Jon Stewart Skewers Media’s Obsession with Chat Roulette: Funniest Wii Craps reference ever, as well. It’s really interesting to me that Chat Roulette is getting this much “attention” when TinyChat has been around so much longer, essentially does the same thing and more, and is much more useful to the average person. Just goes to show how viral public sex acts can be.

"Add features and customers forever and rake in the dough.":

The 2005 email that spawned Picnik, Google’s latest buy. If you’re thinking about launching a startup, you should study this e-mail carefully. It’s a perfect example of exactly how a crazy little thought becomes a big idea, and even on its own, it’s better than most “official company business plans” people present to VCs.  I gave a talk at Webstock in New Zealand a couple of weeks ago about creating a startup and I wish I had this to dissect at the time. Really good stuff.

Tumblr Finally Rolls Out Comments. Sort Of. Trolls Not Welcome. :

I actually really like how clubby it is.  Unfortunately it means I won’t be commenting on any Tumblrs since I don’t officially “follow” anyone besides via RSS, but that’s probably ok. Maybe the answer to the world’s wide-open commenting problem is something like this.

Episode 2 of Dan Benjamin's "The Conversation" is Live:

I was a guest on Dan Benjamin’s new weekly radio show last week, along with Merlin Mann, Christina Warren, Adam Keys, and Dave Nanian. Subjects discussed include Newsvine, keeping your own identity after becoming part of a big company, and the RADICAL concept of only publishing stuff to your readers and followers that is actually true.

LESS - Leaner CSS:

Given that pre-compiling CSS is an official “best practice” these days, why not use that compile step to extend CSS in powerful ways? LESS lets you use variables, nested rules, and other niceties at author-time to clean up your rules and keep everything tidy. I believe The Wolf made something like this a few years ago, but I haven’t heard about it since.

How 3D works, and why it's back:

Great article on the ins and outs of three dimensional imagery. Still doesn’t change my opinion that well-shot conventional cinematography is more impressive than the novelty that is Avatar.

The Importance of Removing Features:

This is one of the most useful articles I’ve read in a long time. As we work on focusing, strengthening, and simplifying Newsvine, the concepts discussed by Lukas ring true. “Saying no” has never been a strong suit of mine. It’s very helpful to remember how important of a quality it is. (via fullstopinteractive)

Newly released video of the space shuttle Challenger disaster: It was 24 years ago, I was in 5th grade, but I remember it like it was yesterday. School was stopped immediately and they wheeled out televisions in every classroom for us to watch the news footage. It’s great that this video has been released, but holy crap, how do you tuck something that away for two decades???

A nicely done british parody of 60 Minutes style video journalism. It’s easy to miss how formulaic our news is sometimes. (via B-Tizzle, originally via E-Chizzle)

Colosseo: This is why Cameron is a king and we are all just pawns in his world. I can’t wait to get my hands on this poster. I will point out, however, that the outro credits on the video need some kerning. Someone is going to lose their right hand for that.

Spezify:

New ways of searching are almost never as useful as old ways of searching. Spezify is pretty awesome though. It’s a visually interesting, never-ending, horizontally and vertically scrollable, topic explorer. I don’t think I’d use it for digging deep on anything, but to get a quick visually rich sampling of a topic, it’s quite fun (via tiff, a long time ago actually, over email).

Realism in UI Design:

Reminds me of my favorite logo design advice: “Never waste a stroke”. (via gruber)

Overshared
At the first Doughty show of the night at the Triple Door. If you're in Seattle you should come down for the 2nd at 10. Excellent!
This Kindle ad is cute and Applelike but misses the mark. Advertise what you do well: price and battery life http://bit.ly/cFBw70
@codinghorror Aliased Monaco 9 should be in the Smithsonian.
Why does the media continue to cover what Rob Glaser thinks about the future?
@Trenti Ummm, the Timex Sinclair came out after the VIC-20, beeeeeeeayatch! I will out-old you any day!
@paulsmith Wow. I love the user manual shooting out from Shatner's shoulder at the perfect angle. http://j.mp/am10eU
@paulsmith You have me beat by mere months there! I cut my teeth on a Practical Peripherals 1200 bauder.
@roblifford Probably a 10% chance I fly in at the last minute for a couple of nights. Other than that, planning to skip this year.
I can't believe @shauninman's first computer was a G4. I feel ancient. Mine was a VIC-20. http://5by5.tv/pipeline/5
Wow, how did I not know about Lala until now? Tons of great full albums, free: http://bit.ly/dBrdLw
Thanks for everyone who suggested Brizzly. Going to fire that sucker up again...
Is there a way to unfollow people but still allow them to DM you? Like a "mute" setting or something?
@levifig Burn-in was a bigger issue with first-gen plasmas. They are much better now. LCDs have their own lighting issues as well.
@horsedreamer The black isn't quite as good as some other top plasmas, but it's better than all LCDs. At an inch thick, I'll take it.
@levifig Isn't ghosting mainly an issue for LCDs? I've had a plasma for four years and no ghosting whatsoever.