Visit the weblog archives, check out some fun links, or learn more about the site

Category “Design”

Links Round-Up: October 16 2011

Posted Oct 16, 2011 in Culture and Design Comments 0

Rounding up the week that was:

The "Branding" link at Salon was particularly sobering. Outlets for bread-and-butter, professionally produced, creative labour are drying up fast.

Why Aren't We Converting? Posted Oct 12, 2011

How to respond to a client when a good redesign doesn’t give the tangible results you’d expect.

In Lieu of a Colophon

Posted Oct 09, 2011 in Design and Meaningful Labor Comments 0

A few notes about the latest redesign.

Markup

  • Still XHTML 1.0. It won’t be hard to convert the site to HTML5, but I adjusted the markup only minimally this time around. I do want to improve the site’s semantics, though.
  • See if you can find where I’m using an ARTICLE element in the markup, though!
  • Future plans include custom styling for code examples. I want to dive into more technical topics in the future.

CSS and graphics

  • Reasonably restrained use of CSS3 properties, such as text-shadow and RGBA colour (for semi-tranparent panel backgrounds, etc)
  • Fewer gradients!
  • For the first time on one of my own sites, I’ve constructed the CSS with SASS, the Syntactically Awesome Stylesheet Language, and Compass, the SASS CSS3 framework. Together, these tools make it easier to write well-structured, scalable, cross-browser-friendly stylesheets. It’s the future, man.
  • I’m also experimenting with what’s called a “semi-fluid” layout. Fixed width over 900px wide, narrowing dynamically as you resize your browser window. A Compass plugin called Susy made that possible without me going mad at the maths.
  • Next step will be to make it even more dynamic and resize to a mobile-friendly view where appropriate.
  • I’m basically not worrying about IE support right now. Feel free to let me know how the site works in your browser of choice, however.

Tech

  • Still with Textpattern, though I’ve finally upgraded to TXP 4.4.1. Still does everything I want it to. Still easier to use than any other option.
  • I do need to spruce up some of the plugins I use, though.

Type

I count this as a work-in-progress, but I’m pretty pleased with the outcome so far.

Migrating Textpattern Designs

Posted Sep 29, 2009 in Design and Web Design Comments 4

Textpattern is a content management tool for blogs and small websites. It allows site designers to exercise a great deal of control over the layout and functionality of websites through a highly expressive template language modelled on XML markup tags.

One downside of TXP, however, is that the templates are all stored (along with page content and sometimes the CSS file) in the TXP database have to be constructed almost entirely inside TXP’s administration interface:

Now, editing code directly in browser textareas isn’t the worst thing in the world, but it’s not a lot better than, say, using Notepad on Windows. At least Notepad lets you use the tab key. And when you have to move a design from site to site, you have to recreate each template page and snippet (reusable snippets of template code are known as “forms” in TXP parlance) one by one.

However, I’m not here to critique TXP’s minor functional limitations. Instead I want to share a small but fairly advanced trick I discovered as I was trying to think of a way to move a fully working and complete design from a TXP install on my localhost up to the install on my production server. And it’s here that TXP’s database-centric template system becomes a significant advantage.

All TXP template pages are stored in a database table called “txp_page”. All TXP forms are stored in a database table called “txp_form”. So potentially, all you need to do to initiate an updated design on a TXP site is to over-write each of those tables in your production MySQL database with two exported tables from your local database.

Easier said than done, right?

Well, unless you’re really comfortable with command line MySQL, you’ll need, at minimum, a working version of PHPMyadmin on your server and some kind of database tool on your development machine. I use Sequel Pro, which makes finding and then exporting the requisite database tables as a “.sql” file very easy. Remember, you have to export each table separately for this to work.

As an aside, a real MySQL pro could probably tell me a much faster way to do what I’m describing. And I hope they do! But I’ve tried this method and it works a charm.

Important note: It should go without saying that you really have to back-up both your local and production database before you attempt this trick. I once lost several weeks worth of posts when I ran a database operation that I shouldn’t have. Though in my defence, it was a dodgy TXP database plugin that I was using AND I thought I was hitting the “run backup button”. Always double-check every action when you’re messing with databases.

So, once you’re in PHPMyadmin, select the first database table you need to update. Choose “import”, select the .SQL file on your local machine, then hit “go”. Once that’s merged into the database, choose the next table, import again, and, whammo-bammo. You’ve got a whole new Textpattern template live, without having to cut and paste into a single textarea. Pretty neat, huh?

JQuery and Web Standards

Posted Jun 22, 2008 in Design Comments 1

I may be running behind the pack on this one, but I’m starting to get the feeling that JQuery is about to become the javascript library of choice for the discerning web standards developer. See, for example, Dave Shea discussing his use of JQuery for the Bright Creative redesign.

Maybe this will finally spur me into getting my portfolio in working order!

On Keyboards

Posted Apr 30, 2008 in Design and Usability Comments 1

Via Daring Fireball (who devoted an entire episode of his podcast to Apple keyboards), Mark Llobrera rants entertainingly about the pathetic state of keyboards in our diminished world of the Fourth Age.

I actually have a Matias Tactile Pro keyboard. I don’t use it anymore because the noise really is a bit much for a shared work environment. Plus, some of the keys (like the Return!) work very poorly. And the plastic housing is amazingly brittle and I’ve already injured myself on some of the razor-sharp shards that break off it. Catriona wondered very quickly after I bought it why I’d dropped AUS $200 on a computer keyboard. I sometimes wonder about that myself — and I’m still searching for the perfect QWERTY interface.

Interview: Bjarne P. Tveskov, Classic LEGO Space Designer - Boing Boing Gadgets

Posted Feb 13, 2008 in Design and Graphic Design Comments 0

Interview: Bjarne P. Tveskov, Classic LEGO Space Designer – Boing Boing Gadgets

It’s kind of scary to think how much of my design sensibilities are owed to this guy.

Briefly free accessibility report

Posted Dec 18, 2007 in Design Comments 0

The Nielsen Norman Group releases a major (and moderately expensive) accessibility review for free as a Christmas gift. Thanks, guys.

T-Shirts

Posted Nov 15, 2007 in Design Comments 0

Breaking radio silence to announce a new product initiative: I’ve started designing t-shirts again and will be selling them through Zazzle. I’m pretty impressed with Zazzle’s product range and they seem to have the all-important black t-shirt issue solved. I’ve stuck a widget on the home page to promote my new snarky and science-fiction-related offerings. If you want to help spread the joy, pass around the following URL: www.zazzle.com/rocketpilot* (including the asterisk, which is used for the associate program).

Boing Boing redesigns

Posted Aug 28, 2007 in Design and Comments 0

And comments threads are back. But this time, they’re being moderated by the woman who invented disemvowelling.

First impressions are positive. I’ll post a more detailed review… soon?

Boneheaded move from Letterhead Fonts

Posted Mar 21, 2007 in Design and Comments 0

Letterhead Fonts have added digital rights management to their font library. Now, I have no real problem with them wanting to protect their copyrights. But these kinds of moves generally are incredibly counter-productive and cause all kinds of inter-operability issues. Case in point. They’ve specifically prevented font embedding into PDFs.

Adobe really did a disservice to font designers (not to mention helping people to violate their license agreements) when they allowed for embedding of fonts into PDF files. While it certainly makes things easier for the graphic designer, it creates headaches for the font designer. And since we are trying to strike an even balance for both parties, we need to understand that there are utilities available that are created for the sole purpose of extracting fonts from PDF files.

This does not mean that Letterhead Fonts cannot be used in PDF files though. You just simply convert the text to curves (also called outlines or paths) before generating your PDF file.

Now I don’t know this for sure, but I’d imagine that would blow away any accessibility features in the PDF. I’m willing to be corrected, though.

User Interface Design Links

Posted Nov 25, 2006 in and Design Comments 0

Just dumping some interesting UI design links I’ve found this morning while I should have been house-cleaning.

Saluting Dr Ozone

Posted Oct 01, 2006 in Design and Comments 1

One of my most important discoveries on the fledgling Interwebs was the dazzling, vaguely prog-rockish website of Dr Thaddeus Ozone and his astonishing Hands On Tutorials site. For it was at this site that I first learned of the power of the mighty drop-shadow and the mysterious wisdom of the bevelled edge.

His techniques were decidedly old-skool. His interest in the concept of “restraint” was entirely absent. But his generosity in meticulously revealing the secrets of the most arcane Photoshop sorcery cemented my love affair with that august application.

I note sadly that he has only rarely updated his tome of magick. But more spells are available in the Guru’s Network and through the Ozone Asylum web forum. Dr Ozone, I salute you.

Art 1: Alien Head

Posted Sep 29, 2006 in Design Comments 0

Just for fun, I’m trawling through my hard drive for old art and pics that I’ve worked on but haven’t looked at for ages. Here’s a rather nasty alien head. If I remember correctly, all hand-drawn with Wacom tablet.

Pretty Mac Apps and other things

Posted Sep 29, 2006 in and Design Comments 0

Via Daring Fireball, word of a new Mac app. An insanely cute new Mac app. Cha-Ching—a simple personal finance manager. With a cute icon. I paused about 20 seconds before buying it as a discounted beta-type app. I am a sucker for the pretty. Somebody help me.

I’m beta-testing VOX, 6Apart’s new move into the MySpace, er, space. It’s prettier than MySpace (which wouldn’t be hard, as MySpace is ugly like a billion cat eyeballs rotting on your living room carpet) and it’s better organised and structured than Livejournal (the community blogging tool recently purchased by 6Apart) but it has some work to do on the basics. The rich-text editor is hideously hard to use, and it seems to do some kind of predictive insertion of text as you write. Or that’s just a bug. I found myself taking 5 minutes to write a short paragraph, as random characters kept disappearing and writing themselves over complete words. Basically, I was just longing for a simple text-edit box with Textile functionality.

« Older