TeXt ex Machina Launched!

I shouldn’t write this blog post now, because I've already spent 15 hours with this Web site today. I know that having a Content Management System to serve up this gorgeous experience means that I can go in at any time and fix the content. But it’s not about the content today.

This is about the whole glorious package; it took us over six months to get here. The TeXt ex machina site has been over six months in the making. Every time we thought we had it all planned out, life happened, or business happened or something in-between happened and we didn’t make it to the drawing board or the draft copy or the template stuff.

This is how the smartest, best and most sought after people in the Web community end up with subpar or outdated Web sites for themselves, while building the most amazing Web apps and Web sites for other people. Not that I’m one of these Web heroes…

Meanwhile, life happens, business happens, the in-between stuff happens. You wake up one morning and it’s been a year or two since you’ve updated your portfolio site. It happens.

TeXt ex machina by design

Believe it or not, if you want to get a designer to whip you a little something up… you’d better know what you're asking for. It took me some time to realise what kind of audience I want to reach with this Web site, who the audience for my services is and all the good strategic stuff that I usually do with my clients.

My friend Maria designed this site. I honestly don’t know how she does it, but she’s a super smart designer / developer / mensch, gifted with the patience of a saint and an innate confidence that she’ll get there on any given project.

To be honest, I’m every designer’s worst nightmare: I know exactly what I want and how I want it. Until I don’t. Then I’m just indecisive. Because Maria is a good friend and knows my weakness when faced with uncertainties, I let her decide stuff for me. It was just faster that way. It’s hard for me to form an opinion on things when I don't have any data, or any research, or spontaneous «turquoise & orange are not colours in my world!» gut reaction.

Apart from knowing the kind of site I wanted and the kind of Web things I like, Maria had permission to run wild with Photoshop. This is the result. Spot on, I'd say.

The tour

We have a preliminary About page which includes information about the work I do. There are two very different contact forms: a simple one for sending feedback and contacting me and a more elaborate collaboration request form. This is the starting point for work enquiries, which makes it the «Hire Amy» section of this site.

The red «Contact Amy» panel on the About and the Contact page presents shortcuts to sending me an e-mail and to the TeXt ex machina Twitter account.

You’ll find that the footer as well as the header navigation stays with you across the whole site, including on the error pages. The only exception is the maintenance page you’ll see when the whole site is in maintenance mode.

The footer sidebars repeat the main points to navigate the site, summarise ways to get in touch and point you towards the search function and the RSS feed for the blog. In addition, the «Content» block shows frequently used tags for the blog posts and links to a table of contents which shows the latest entries and most used tags and lets you search the site.

If you click on a tag, you’ll get a page with all the articles that are labelled with this tag.

TeXt ex machina design anatomy

The premise of this site is that Maria and I both wanted to learn something from building it. Maria threw herself into responsive elements and Drupal 7 while I went on a journey of business discovery. We wanted to shoot for iteration and evolutionary design, which is why there are still a lot of features and content missing coming up. We will add to the site in small, incremental changes and revisions, not in a huge and sweeping redesign every six months.

There’s no Amy bio page at the moment, there are no pictures either, and we still have to implement an e-mail subscription option… we know. We’re working on these types of things.

Nevertheless, this is a beautiful, much more viable than minimal, Web site. It’s functional. Please let us know, if it’s not functional somewhere, we’ll go and fix it. Also, I encourage the typo police to find blunders in the copy. I’m German, so language hiccups will happen. That doesn’t mean they have to stay unfixed, though, so please report them.

Maria chose to do a responsive design, because that’s what the cool future-proof kids do these days. We invite you to visit, read and use this Web site on your mobile device. It should look splendid.

The staples of the site are HTML5, CSS3 and Modernizr. Drupal 7 works in the background to manage and deliver the experience.

The Designer-in-Chief chose two typefaces to go with the design:

The background image «45 degree fabric» by Atle Mo comes from Subtle Patterns. The wonderful icons in the «Connect» footer sidebar and the bullet point arrow for unordered lists are courtesy of the lovely Your Neighbours’ Retro Icon Set.

I like to make informed decisions when considering a project: I clicked together the collaboration request form with the most helpful Webform module to manage project enquiries.

If there are any design details of interest which are not covered here, you can send Maria an e-mail.

Where do we go from here?

That’s pretty much it. :) We’ll collect bugs and glitches this week and will fix those.

Exciting things are on our task lists for the next few months: apart from e-mail subscription options, responsive picture support and a resource section, we want to integrate a few usability features for the longer articles.

The journey is its own reward.

Details & meta

Mon, 15/08/2011 - 22:12