screenshot of the old, old Unicorn Free site

Hey, where’d Unicorn Free go?

It’s dead, Jim.

After 8 loooooooooong years of service, we’ve retired Unicorn Free — the domain name, the brand, the design, and the ineffective and irritating blog format.

Ol’ Mr. Pointy is finally put out to pasture.

Welcome to Stacking the Bricks. Newer, sexier, better.

Don’t worry: all the great content is still here. And your old links/bookmarks will still work!

This move was over a year in the making.

Read on for all the nerdy details of…

  1. The design
  2. The technology

(And I really am not kidding about all the nerdy details. If you’re not into a nerdy novella, just know this: We’re hard at work to make your user experience amazing.)

The redesign

While yes, the new visual design and layout is both dope and fresh, the visuals aren’t the most important thing about this new site.

The most important thing is the function. Both for us, the authors, the makers — and for you, the reader, the learner, the do-er.

(Although, visuals-wise, I did massively streamline the layout for readability: nice big fonts, no sidebars, and a max of 14 words per line for maximum fluency. Yeah boy.)

What I’m saying is Unicorn Free was a blog; Stacking the Bricks is anything but.

Here’s the problem: Teaching with a blog requires you to spend a lot of time trying to work around chronological sort. Blogs are designed to let content fade away and disappear:

  • The most recent post is so often not the most important — or the most useful to the new visitor.
  • If you e.g. write a series, well, you’ll either have to install a special plugin (prone to breakage) or manually maintain cross-links.
  • Maintaining a hand-curated list of links is an exercise in sadism (or masochism?)…

And obviously these are my pains, the pains of the producer, but they also hurt you, the reader! All that extra suffering means we couldn’t deliver what you deserve to receive.

That’s why with Stacking the Bricks, we blagged the blog.

We’re hand-curating our content into guides to help you get shit done.

Here’s the very first one:

Yeah, it’s a little pathetic to launch with just one guide, but we wanted to JFS it, baby! I also put together a proto-guide with just stuff for those of you who already have a business you want to grow.

We’re hard at work putting together so many more, with topics ranging from product design, launching, pricing, customer feedback, and more.

This means:

  • you can go straight to what you need
  • and it will be comprehensive, rather than divvied up into many random posts
  • and it will be organized in a logical fashion (not just by date!)

We can start tailoring the site to you. You can tell us where you’re at, and we’ll offer you the guides that are right for you, right now.

Beyond the post

When you run a blog, it’s hard and kind of weird to add guest authors, and even to link to really good outside stuff. For a guest author, you’ve gotta “onboard” them with an account and permissions and on and on. And what, if you want to share an external thing but don’t want to write a whole essay about it, do you just post a 5-line update with a link? Is that how it’s supposed to work? Feh!

The guide format solves both these problems.

One, the site is static, so user accounts and permissions don’t even exist. Done.

Two, it doesn’t matter who wrote the guide itself. Inside the guide, it’ll be dead simple to add a bit of explanatory text “written by XYZ” to any part of the guide, or linked content inside the guide.

Three, you can just as easily link to outside blog posts, articles, presentations, videos, and so on, as you do to internal stuff. And because it’s not a post, you don’t have to worry about wasting your valuable ‘update space’ to do so.

So much better!

Plus, obviously, there’s a rich vein of potential personalization we can tap. Soon we’ll be able to send you updates to the guides you’ve expressed particular interest in…

And then when you’re really looking to level up, we’ll be able to offer you just the right goodies, events, and products that you need and want, right now.

Lastly, this is the way “content” was always supposed to be. Doing the right thing makes my little information architect’s heart smile. And that little heart was pretty damn shriveled from 8 years of Wordpress, so yay!

A little bit of fun

I’m bringing new.gif back. That is all.

new.gif is the bomb

The technology, for you developer-types

The future is also the past! The past is the future! You’re not loading dynamic content right now — you’re on a static web page. Gasp!

This site is built with our custom version of nanoc, a Ruby web site generator.

That means that you’re loading a static HTML file, which was generated by a Ruby script. There’s no “back end.” There’s no dynamic anything. We don’t need special hosting. (And it’s so cheap!) It doesn’t need to install new plugin updates every day just to keep ahead of the scriptkiddies. It can’t be compromised.

*BREATHES DEEP* So fresh!

Here’s how it works…

The workflow

  • We write our articles in Markdown
  • We use git locally to save our work
  • We use github to share the repo across our team (me (Amy), Alex, Thomas and Becky)
  • As we edit local files, the local (developer) copy of the site is continuously refreshed by guard
  • The podcast listing and individual pages are automatically generated from our podcast feed
  • When we git push, all committed changes are automatically deployed to our host
  • We use YAML for article meta data
  • We added some features to nanoc to make curating our content so much easier, and will be adding so much more!

The functionality

Here’s a screenshot of what the metadata looks like:

screenshot of YAML

Much of this is custom stuff we added. nanoc is easy to build on (unlike a lot of other article generating tools). Thomas has barely cursed at it at all.

The heart of our customization is our custom link_to_slug helper:

screenshot of our custom helper

Every piece of content has a slug — or short name — we can use to build links without having to touch absolute URLs. That means if the filename or path for a page changes, so will all the links. (YESSSSS.) Plus I find it just so much easier to read than AHREFS everywhere.

And it paves the way for stage 2. Soon it will power some really awesome customization stuff… all without a dynamic backend. But that’s a story for another day!

The developer experience:

When we run nanoc locally, we detect that we’re in “dev mode” and display this really helpful palette on top of the page:

helper palette

So far this does several useful things:

  1. Clicking the link_to_slug line will copy the code to the clipboard.
  2. Clicking edit article will open the local file in Sublime Text (best feature ever)
  3. Clicking todo_list will take you to a global list of all the little notes we left ourselves — @TODO do this thing — from across all content files

(Also: in dev mode, those @TODOs are obnoxiously highlighted wherever they are, but hidden when the site is published! Ahhhh!)

Without these features, working with a static site generator is kind of annoying. But this makes allllll the difference.

I’ve also some other features planned that’ll help take static site generation from a twee hipster affectation to just plain efficient good sense. You can do so much with so little, if you really sit, think, and observe the pains and how to kill them.

Huge thanks to my brilliant husband Thomas, who churns out the seemingly impossible features I ask for as if it ain’t no thing. (Point of fact: nanoc does not have a dev mode, and he hunted down some fairly obscure stuff to make the edit article feature work!)

Thomas, of course, is also the genius behind the animations on the homepage as well as the animations when you scroll down any page

The future… and the background

There’s more to come.

There’s more to talk about, and in greater detail.

There are more features and strategies we have yet to implement.

The new site is just stage 1! But after a year spent with me sick as a dog, we decided to just fucking ship the simplest possible v1 to get it out the door and start stacking bricks on top.

I’ll be writing a lot more about site design, information architecture, web site personalization, CTAs and conversions in the months ahead.

Here’s some of my greatest hits on the topic of software, product, and experience design:

Don’t miss out on my next essay… get it straight to your inbox!

There's more where that came from

We email every Wednesday with the latest insights from our business, our students, and our research. Drop your email in the box below and we'll send new stuff straight to your inbox!

Absolutely no spam, ever. We respect your email privacy. Unsubscribe anytime. Huzzah!