2006 / December 16th/ Live redesign: Organix
It’s been a long time coming, but the time for the format of my site is about to change. Unlike last time, this redesign isn’t going to constitute a framework change (last time I changed all my permalinks, the underlying platform, categories, and COMPLETE structure change). This time I got on the right track with my content, but it just didn’t quite fit… so now’s the time for the next evolution of Warpspire: Organix (inspired after The Root’s album).
Don’t worry folks, luckily for you when I mean live redesign, I don’t mean it like others seem to mean it. I’m instead going to walk you through my thought process while designing. Not to mention, this will most likely take several months to get off the ground.
Things I’ve learned
With my last redesign, I learned a lot about how Wordpress works, a lot about blog design, and a lot about things that work and things that just don’t work.
Things that worked:
- Custom fields: I used these throughout my consumables section and it’s worked out great.
- Custom plugins: I wrote a little plugin called Warpspire Glue that gave me a couple extra fields here and there (such as sidebar content — check it out). I can’t even start to mention how much this has expanded Wordpress’ functionality. The plugin system is stellar and gives you ever opportunity to do what you want.
- Loving the theming system: I didn’t hack one single line of Wordpress source code to get the last version of Warpspire up. The theming system in wordpress is immensely power. Learn it. Love it. Use it.
- Markdown: Oh my. Markdown, how I love thee. Best bonus: all of my posts use consistent markup.
- Pages: Starting with this version of Warpspire I started using pages extensively (such as the content on the home page, the projects page, hemingway pages, etc. It even gives me awesome extras like RSS feeds — perfect for those wanting updates on Hemingway!
- Tags: Although you don’t see any tags displayed I’ve been using (my custom built) tagging system to denote things like my featured articles. Pure awesomeness. I plan on extending this tagging functionality on the next version (although I’m still not sure I’ll even display them on the front end).
Things that didn’t work:
- AJAX commenting: Oh my, that was a mistake. Encoding, usability, everything. It’s not nearly as cool as it seems. I much prefer a standard synchronous request.
- One article on the home page: This kind of really limited me to how I wanted to expand the site. Long story short, it was a good idea at the time, but my intended writing style has changed, and now so must the layout.
- Not backing up: At one point I thought I nearly lost part of the site. Some WP DB Backup + WP Cron fixed that right up. I also keep my site files in subversion, as well as on two hard drives — just in case.
Getting Started
Alright, now that we know what thing to avoid and what things to keep, it was time to start hacking away! Well.. almost. First I decided to create a little kind of outline to my home page. The home page would signify the general hierarchy and weight throughout the site. I wanted to add a lot of new sections and content and needed a way to organize it all on paper. Here’s what I came up with:
Once this was sorted out, I laid out a bunch of fonts. I knew I wanted something clean, crisp, sans-serif, with at least a couple of different weights. I still pretty much suck at Typography, so I kept to the classics and the familiar. The ones in red were my final three choices. I ended up going with the bottom one (Interstate).
Now onto the actual comp! This is starting to get pretty exciting. I knew I wanted a layout that was 900px wide and no more than two main content columns. I laid out a nice grid of 1/4, 1/8, and 1/3 and started playing around:
So far I’m pretty happy with how it’s turning out. keep in mind, most of the stuff I’m doing right now is general layout & typography. After I get the rest of the required content on the page I’ll probably start adding some color & flare (although I do have to say, it’s looking pretty damn hot in that Subtraction kinda way right now).
More on Organix:
12 Comments
Make a Comment
don’t be afraid, it’s just text
Warpspire is the place that web professional Kyle Neath writes about the web. More →
A word from the sponsors. Advertise with Warpspire
Hot Topics
-
2006 / Spotting a fake: “New apple design”
101 comments
-
2005 / Introducing Hemingway
89 comments
-
2006 / (Re)introducing Hemingway
73 comments
-
April 16th / 5 reasons I won’t be getting on the open id train
70 comments
-
2007 / Wordpress community, we gotta talk
69 comments
Feeds / Syndication
Choose your preferred method of syndication. All feeds are full-posts & ad-free. All feeds are protected under copyright and may not be redistributed without permission.
The Network
All my little projects that I leave scattered around the web. Some for profit, all for fun.
December 16th | #
Looks good so far! I’m excited to see how it turns out.
December 16th | #
Looking awesome so far, I’ve always liked your style so I’m sure I’ll enjoy this one (especially since it involves the Roots).
Oh, and thanks for not forcing us to look at an unstyled site for 3 weeks :D
December 16th | #
I like it. Look forward to seeing it in action!
December 17th | #
Very nice. Once my work settles down (applying for college!), I’ll be redesigning my site as well. I’m really looking forward to your next few posts - anything to get into the brain of a real designer :D
December 18th | #
Looking extremely nice… Just my-kind-a style - looking forward to see it implemented :)
December 20 | #
I am enjoying the layout, maybe some color though? Seems a bit dark and unlike you, and going towards Wisdump colors. As well, it looks like of like the layout from Rasterized… with the whole banner-style view on the article, the nav / nav / nav. Hmm?
Who cares, the design kicks-ass and I can’t wait for the release.
December 20 | #
Ryan: It’s coming. Take note of the last paragraph:
December 21st | #
I’d take this colorless version right away.
Love it - not only “so far” ;)
December 21st | #
Looking forward to the new design… now i want to redesign my site.
February 2nd | #
When do you find time to do this!
Great look by the way and there isn’t anything wrong with leaning towards Subtraction.
// Ron
February 18th | #
Man I hate the themeing system in wordpress. There’s too much PHP going on, and the separate header and footer files add more work. It’d be so nice if they used a templating system like smarty. Then the view would be separated from the behavior, and you could have your theme in one very readable file. If this was the case, then wordpress would have a powerful templating engine.
December 30th | #
Nice!