The new MacRuby website is alive and kicking with a new look and feel (courtesy of me) and a nice Webby-based backend (courtesy of Rich Kilmer).

Webby is a Ruby framework that allows the user to work with model files to build a static site. We have a lot of helper methods and ERB that ends up dumped out as HTML when we run the deploy command. It’s similar to WordPress in that way, and it is a phenomenal tool for building static sites that feel dynamic. While it does support things such as HAML and SASS, we relied on good old Textile to get the job done.

The site is run without a database. It uses structs and helper methods to generate everything. For example, if Rich wanted to add someone to the “Project Team” list, he would simply update the Ruby array of people objects and the helpers loop through and make it all nice and styled. There was more info presented on this page initially, being the name, URL, focus and company affiliation, but it was simplified down for some of the presenters. The Special Thanks are handled in the same way.

We’ve been very happy to see some of the recent press about MacRuby as well. If you haven’t seen it, please check out:

Upcoming MacRuby Implementation to be Substantially Faster (at ArsTechnica)

I’ll be presenting at the DC Pecha Kucha night next Wednesday at the Corcoran in downtown DC near the White House. I’ll be presenting on the short film Meticulous made called “The Sandbox” in a 20 minute, 20 seconds per slide showdown. Hope to see you there!

Having grown up with pica sheets and crop slides with wax pencils, I come from a world of print design effectively dead with the advent of QuarkXPress, Pagemaker and InDesign. I still remember learning the rule types in high school yearbook design sessions and in some cases, I’ve recently implemented what’s known as a Harvard Rule line in a design.

What is a Harvard Rule? The old yearbook publisher I worked with defines it nicely:

A standard rule line is any printed line that is less than two picas wide. These rule lines can also add variety to your page. Common rule line weights are one, two, three, six, nine and twelve points. Rule lines are intended to unite design elements, not separate them. A Harvard rule line is two parallel lines, with one line wider than the other. Standard widths are one, three, six, nine and 12 points. When used as a border, the thin line is usually inside.

First off let’s get these terms right. A pica is 12 points. There are 72 points in a printed inch. (Sorry Windows users, someone back in the day thought 96px to an inch was better than 72. Apple is 72px/inch.) There are, therefore, 6 picas in an inch.

I didn’t want to use an image to do this, and wanted to accomplish it with html and css. Luckily, there’s an HTML element called “HR” that is a horizontal rule. These, in their basic implementation, are plain and simple ugly:

but some CSS can make it pretty:

That’s not nice to use. So with some HTML and CSS hackery, we can get something that looks a lot nicer. In your HTML, you first want to call the rule:

  <hr size="0" noshade />

Since it’s XHTML we’re using here, this is a self-closing element. The CSS for this isn’t too complex. We need to define the base colors to hide the original element. We then need to apply borders to finish the magic. You can alter the margins to space it out from other elements.

  hr {
    /* Faking a Harvard Rule */
    color: #fff;
    background-color: #fff;
    height: 2px; /* this is teh white space between the lines */
    border: 0; /* this removes left and right borders */
    border-top: 4px solid #aaa;
    border-bottom: 1px solid #aaa;
    }
  

With that in place, we can give these unique styles and flip the lines as needed.

You can also accomplish a double rule this way:

These are all being used in the forthcoming MacRuby redesign.

Enjoy!

For those of you who don’t know, I started working at InfoEther last fall as their UI/UX/Design guy. One of the floating projects I had been tasked with was the redesign of the InfoEther company site. In light of getting me back into Ruby on Rails, they also decided that I should be the one to code it.

The site is done and up and will probably expand as we have time and new things happen. Now it’s off to work on wireframes for our new product.

You can see the site at infoether.com.

For those of you who didn’t know, I have a Masters in Architecture. I strayed from the path when I worked at RTKL as a 3d animator and designer right after college. I’ve done things here and there, but mainly still focused on the 3d rendering side of things [ Meticulous Portfolio ].

My high school civics teacher contacted me to ask if I would be willing to work with her son, Robert Eccleston, as an “architect” on a design for the Virginia Public Safety Memorial. I was ecstatic to be able to work on something like this again and, over the Christmas holiday, met with Robert in Williamsburg and dove in on the project. He had the maquettes started and we finished the plaza plan that day. From there we got the maquettes scanned into 3d models and I built the rest of the plaza in Maya. Render forth and this is what we had.

We submitted this yesterday and will find out in 3 months if we make the next round. Fingers crossed!

I designed a mockup for Waldo earlier in 2008 and today it launches on Richmond Sunlight. Erik Kastner did the HTML/CSS sexiness for it.

For those of you not familiar with the Sunlight projects, they are sites dedicated to increased transparency in the legislative process. This particular site focuses on the Virginia General Assembly. For more information you can read about the Sunlight Foundataion.

Check it out live: Richmond Sunlight

The website for RubyConf has gone live. I did the design for my friends at InfoEther. I’ll be down in Florida for the event (baring unforeseen circumstances) but will not be talking. I’m not the Ruby programmer you may think me to be. I make pretty pictures for Ruby programmers. And dabble a bit when i have time with archaeopteryx and MaxMSP.

Hello, friends. We’re your usability consultants.

Is your web app tired? Run down? Listless? Does it poop out at diggings? Is it unpopular on del.icio.us?

The answer to all of your problems is in this little bottle consulting package. Hyphenated People Prix Fixe. Yes, Hyphenated People Prix Fixe contains vitamins, meat, vegetables, and minerals and 150% of your daily dosage of usability expertise.

Yes, with Hyphenated People Prix Fixe you can buy your way to web application health. All you do is take a big dose after every meal once. It’s so tasty, too. Tastes just like candy. So why don’t you join the thousands of happy peppy people and order your Hyphenated People Prix Fixe today. That’s Hyphenated People Prix Fixe.

Hyphenated People Prix Fixe

Over at Hyphenated People, we’ve been spending the summer cooking up something new: a fixed-price deal. Fun and challenging for us, and affordable for you.

For a flat rate, you can choose either:

• The Inspector. In which we explore and analyze your entire application¹ and deliver to you a fancy report including a written analysis (including callouts and sketches) and suggestions for improvement. Topics considered include application structure, flow, individual screens’ usability and layout, insights about targeted users, and aesthetics (aka “the pretty”).
• The Drive-By Design. In which we explore your application, and thence, with that knowledge, take any single, full page of your choosing and redesign it from the ground up to be more effective. In this case we deliver to you a fully-realized design, original design source files (PSDs) and a written explanation of our recommendations for that page and its situation in the entire application.

Either package is ideal for smaller companies and startups, and anyone who is having a difficult time loosening the purse strings for hiring usability consultants for a long-term project.

There’s no further obligation. Our reports and advice are yours. We will happily make ourselves available for further assistance (availability permitting), but you can implement our suggestions any way you want, and with whomever you want.

That Price, Which is Fixed

The price for either package is just $3,500 USD. If you’d like further details, drop us a line at yo@hyphenateme.com with your preferred method of contact and we’ll give you a prompt return call or email.

Write us now. You know you want to.

Nota bene: We’re only budgeting the time for a few of these projects this summer. It’d be a clever marketing tactic to make that up and then urge you to contact us now if not sooner, but it’s actually true. This is something we’ll be doing in addition to our normal, larger jobs. We will of course deliver our very best (as we always do), but this is an experiment for us from a business standpoint.

[1] This assumes a fairly typically sized application: similar to or bigger than Basecamp, smaller than Salesforce.

This past week, my business partner, Amy Hoy and her fianceé, Thomas Fuchs, created something so simple and so damn cool based on the twitter API and some great javascript. It’s called Twistori

They built it and launched it in one day and announced it solely with one post on twitter each.

Check it out. You’ll be hooked.

The Royal Mint held a competition to replace the design of the British coins in circulation since the 1970s. The final designs are simply, beautiful. They are based upon the shield of the Royal Arms, as if each coin was a vignette onto a part of the shield, with the one pound pice having the entire Shield on it’s side. Hoefler and Frere-Jones have a nice comparison between this new coinage and the Department of the Treasury’s new Five dollar bill, complete with a purple “5” in Helvetica.

Maybe the US Federal Government should hold a design competition. (via Ministry of Type)

Way overdue, but I finally have posted my SXSW photos to flickr.

Amy and I gave our panel on the first day of SXSW interactive and it was a blast. It was nice to have it out of the way so we could chill and enjoy the rest of the week. Despite a one day sickness that I warded off (and developed into South By Scurvy upon my return to DC) I was out and about at the conference center and Sixth Street Environs.

Here’s the breakdown of Photos:

SXSW Interactive

SXSW Music

Hotel Café Tour @ Parish

Sara Bareilles @ Parish

Honor by August (my band) at the 7th & Trinity Guitar Hero Stage (photos by our manager Trish on my camera)

and finally, but not least of all, Paramore at La Zona Rosa

The talk that Amy Hoy and I gave at SXSW this year is now online at behyphenated.com. Check it out!

Our talk pitch: Zen masters taught it. Isaac Newton knew it. Scott Adams writes about it. Now you can know it, too. We’re talking, of course, about the manifold benefits of being a n00b (at something). And, of course, about all the good stuff that happens post-n00bishness: the excellent side effects of being good at multiple things, even if they’re not related – heck, especially if they’re not related. So many of humanity’s important discoveries, innovations and beautiful leaps of logic have been made by people whose brains were leveled up by the cross-fertilization of multiple interests and disciplines. Nano-thin specialization is out, a broad understanding of life, the universe, and everything is in. It’s time to synergize, baby. So, reach outside your comfort zone, be a beginner again, and you’ll be smarter, sexier, better at your job… even more valuable. With the wisdom of the ages (and a little bit from modern pundits), we’ll talk about how, why, when, and where you can go about it. You won’t regret it.

Just in time for the holidays, Lowwatt Recording releases the new Lowwatt Glow compilation. Twenty tracks from different artists that have worked at the studio with Ted Comerford (also my producer). I did the design work for it. You should love it. Try to grab one from one of the bands or from the studio or various shops around Raleigh, NC.

I recently completed two sleeves for some far flung clients (and friends). The first is for Spectre’s new release:

Ryan Hudson, the band’s singer, sent me a variety of lightwire creation photos he made. Mixing it together with the band’s wings logo and adding that to some distressed type worked out well. They just had their CD release party at the Key Club in Hollywood. Not only do they have great originals, but they completely rock a cover of Sade’s “No Ordinary Love”.

The second disc is for my friend Daniel from Texas. He performs under the name of Johnny Citizen and his new record:

I met Daniel years ago at the Dr. Dremo’s open mic and we kept in touch through a few long years on both accounts. He had these great drawings from a friend of his and we put them together into a digipak sleeve.

Anyway, you can get these records from various locations. They’re both great and you should check them out!

Amy and I have been accepted to a new thing at SXSWi coming up in March in Austin, TX. It’s called a “Core Conversation” and we’ll be holding one on our concept deemed “Career Rev 342: Dabble Dabble, Toil and Kick Ass”. The basic premise revolves around a lot of what Amy and I have been through: broad, multi-faceted learning, generally out of the classroom, and lots of nose to the grindstone. It’s also a discussion about how mutliple facets improve team interactions (as opposed to specialists who don’t understand each other’s specialties).

We don’t have any details yet, but we’ll update you as we move towards March.