The Blog Studio

We are internet culture creators with a focus on
DESIGN, DEVELOPMENT & SOCIAL MEDIA.

Blog > Blog Design > How to design a blog: part 1, an overview

How to design a blog: part 1, an overview

Peter F, 31 August, 2006 0 Comments

I’m a baaaad baaad designer. That’s the only reason I can give as to why I’m never happy with my own websites.

See, it’s not that I’m bad at designing websites, rather I’m bad a following my own “rules” when designing for myself.

My last design here at The Blog Studio was really nothing short of a
disaster. See, I started the design during a lull in work, fueled by a
desire to move the site to Expression Engine and to test out a couple of
theories I’ve had kicking around in my head about search engine
performance. The lull disappeared almost as soon as I started my design
(of course), and as a result I rushed the process, skipping key steps
along the way.

After only a few weeks, I stripped the design elements off the site, resulting in the bare boned presentation you see today.

They say that what you see is what you get. In the case of the
current site what you see is really not indicative of what The Blog
Studio offers. So I’ve clearly got to do something about it.

I thought I’d open up the process I use when designing a website, and
share the whole thing with you – warts and all. My reasons for doing
this are threefold:

    • Give you insight into how we work

 

    • Give you some tips and techniques that might help you

 

    • Force me to follow my own damn advice

 

In other words, I need a client! And I’m enlisting you, dear old blogosphere, to be that client.

Here’s an overview of the steps we’ll be following:

To start, I’m going to describe the purpose of the site. I’m going to
list my goals for the redesign, and highlight what I like and what I
don’t like about the current iteration.

Next, I’m going to create two documents: a mood board and a target
board. The mood board visually describes the feeling I want the site to
convey. The target board gives best-in-class examples of specific bits
of design related to the project. Every design project is built on the
shoulders of giants. It’s helpful to have a sense of the best of what’s
come before, so that we can have a measure of comparison. It’s hard to
know if you’ve acheived a goal if you don’t know where the goal posts
are.

Following that, we’ll get into designing wireframes. These simple
documents help define the layout of the site. The reason for this step
will be self evident once we’ve completed it.

We finally get into designing the visual elements of the site at this
point. I’ll post all my comps – the good, the bad, and the downright
horrible – to help show that good design is a process of iteration and
evolution.

Once the design is complete we’ll get down to the actual business of
coding. This gets broken down into three stages – write the html and
css, integrate the pages into a cms/blog software, and test the whole
thing across browsers. Again, I’ll share any tips or tricks we use.

I figure the whole process will take about a month to complete, but
may be delayed due to this little thing called workload. I’ll keep you
appraised as we go.

To summarize then, the redesign process will be broken down into the following steps:

 

 

    • design wireframes

 

    • design visual elements

 

    • write html/css

 

    • integrate with CMS

 

    • test

 

I’m looking forward to working with you throughout this project, and look forward to your feedback!

Comments are closed.

Feature

We are looking forward to the holidays. We'll all be at #hohoto supporting an amazing cause & dancing our butts off. Come dance with us.

RFP

Excited? So are we! Fill out our RFP and start from there!

Request For Proposal

Facebook

Flickr

Newsletter

Subscribe to our newsletter!

Subscribe to our mailing list

* indicates required
×