Above: The homepage at rg.linedandunlined.com.
Lifesite
When L&UL redesigned last fall, I wanted to create a kit of design parts simple enough to accomodate a wide variety of content over a long period of time. A “lifesite,” more or less. Some of that content (writing, teaching, resources) existed here already. Some of that content (design projects) existed somewhere else. And some of that content I haven’t even conceived of yet, or it’s been sitting around waiting for a month or two’s worth of rainy days to finally get off the ground. With the redesign, the goal was to find a place for each of these things under one roof.
Once again, Wordpress was the answer, and, again with Randy’s help, we built a project archive, which is now online. It’s still a work in progress, and I will be adding to it in the weeks and months ahead, but there’s enough there now to get a feel for how it works, so go ahead and have a look.
Visual vs Verbal Navigation
This might just be my taste, but when I arrive at site full of design projects I want to navigate with pictures first and words second. Project titles or completion dates may have meaning to their author, but they have little meaning to their user, particularly if the user is unfamiliar with the designer’s work.
I am a huge fan of Flickr’s “Detail View,” which shows thumbnails in a three-column array. If it’s powerful enough to find a needle in a haystack full of reference photos, it’s a good enough for visitors to this archive to find what they’re looking for quickly and easily.
If I do want to use words to navigate, I usually want to use words that I already know. Words like “Books,” if that’s what I need help making. Or “Nonprofit,” if that’s the type of project I’m interested in seeing more of. Or maybe a client’s name or a former studio affiliation. Basically, I want to describe projects with tags, not titles.
Tags
Categories work like nouns and tags work like adjectives. In a typical desktop email client, when you put an email in a folder, it goes in that folder only. You effectively rename it, or assign it a new noun. It goes from being an message in your “inbox” to being a message in your “work” folder. In doing so, you create a rather rigid taxonomy around what you call things how that heirarchy works.
Tags, or, as they’re called in Gmail, “labels,” are lighter-weight descriptors. Rather than renaming what they describe, they simply modify it. You can have an “email,” an “inbox email,” a “work inbox email,” or even an “upcoming work inbox email.” Tags can be flat or they can be a structured taxonomy that mimics categories without renaming content.
This obviously has great implications for a set of related design projects. Instead of deciding upfront how you want to organize all of those projects, which is a category-led strategy, you can simply start publishing the projects and let the structure emerge as you add more and more tags. This strategy is content-led.
If you keep tag structure flat, you can produce as many parallel sorts of your project archive as you want. You can look at all the projects you’ve made for a certain client, or you can look at all the book projects you’ve made for that client, or you can look at all the award-winning book projects you’ve made for that client, and on and on. Each project remains untouched—only the adjectives modifying it have changed, resulting in a new sort.
Views
The new project archive site has an “overview,” similar to a contact sheet, and a “pageview,” similar to the pages of a book or PDF. It is easy to move between these levels or navigate entirely within them using the forward and backward arrows.
Categories as display types
There are only four categories the project archive uses: project, homepage, invisible, and news. A project that’s visible on the site will not be featured on the homepage, but its thumbnail will appear in tag index lists and the post itself will appear as you cilck from one post to another in using the arrows.
The homepage category is a child of the project category and will make a post’s thumbnail appear on the homepage. Homepage posts are “sticky,” meaning I can assign them an order other than chronological, alphabetical, etc. In this way I can curate the homepage view as I wish.
Posts placed in the invisible category are published and have a permalink, but they are not accessible without knowing the direct URL. This allows projects to be archived without being displayed, but these projects can still be shown easily when necessary. Toggling visiblity on projects helps a site feel trim, fresh, and purposeful to users while remaining a vital organizational tool to its authors.
The news category removes posts from the project sort and corrals them in the news area displayed by headline instead of thumbnail view. News is not taggable, but projects can easily link out to their corresponding news posts.
Post Types
Different projects need to be shown in different ways. For a time-based project where a sequence is important, a slideshow may be the best format. Other projects, like exhibitions, may require text and images to be mixed together, similar to a blog post. Still other projects may want to evoke the feeling of a certain experience with a variety of views, almost like a moodboard. A content-led design should be flexible enough to accomodate all of these post types, and more.
