Posts Tagged ‘design’

Lefft, my new portfolio site

Monday, September 5th, 2011

My new portfolio site has just emerged into the world wide web, blinking in its responsive juices. Have a look at Lefft.com to see some of my illustration and design work.

More work coming there soon.

Announcing WeeNudge!

Monday, April 18th, 2011

So pleased to announce WeeNudge, a resource to help web designers educate their clients on the mysteries of the web. Created by myself and ‘Internet Ace’ Jack Osborne.

We hope you like it.

It needs to ‘Pop’

Monday, November 1st, 2010

An age old favourite of clients which, without fail, causes immediate groans when it innocently flutters into the inboxes of designers. Along with its siblings ‘It’s a good start’ and ‘I think we’re almost there, but…’, this phrase does nothing but drive another wedge into that gap between client and designer…

Make sure and check out the rest of this editorially designed article.

Designing a blog

Sunday, November 23rd, 2008

Hello there Internet!

Well this blog has been up and running for a few weeks now so I suppose I should tell you a bit more about the design.  Coming up with a site design is incredibly hard work and anybody not in the web design business wont understand this.  It takes many hours of sketching, testing and struggling with CSS and IE, and then when you finally get it all done you discover that something isn’t working weeks after launch.  Oh the fun.

So enough ranting.

WordPress

You would be insane not to build your blog with WordPress these days.  It’s the ultimate player in the open source CMS market, allowing you to avail of all the delightful plugins and tools to make your blog as easy as possible to update.  This was my first real experience with building a fully working wordpress blog and it was surprisingly simple.  I had used wordpress themes before but never built one from scratch so this was a great experience.

Messy

I wanted a really simple blog where the content could speak for itself, a white background being firmly in my head from day one.  For it to have a kind of ‘workspace’ feel appealed to me greatly.  A bit of untidiness and a scatterbrain look was a key aspect I wanted to convey while not distracting from the content.  I could make a really slick, ‘include me in a CSS gallery please’ type of site, but that didn’t really sit well with me.  No, really it didn’t!

Post Its

I have a bit of an obsession with post-it notes, as you may have discovered.  Come on, they may be the pinnacle of inventions!  They stick, but are easily removable with no mess!  Never mind.  I use them constantly for jotting down ideas, reminding me of stuff, arranging websites etc so I knew I wanted to include them in this site.  To have them as the about section was an important decision, as (while I don’t believe in this religiously) you need to be able to summarise yourself in the amount of space on a post-it note.  In this amazingly fast paced world of email and stuff, people don’t have time to listen to you.  They want to now what you do and what they can get out of you in 50 words or less.  So having the about post it in the centre of the header shows this.  Although I couldn’t help but have amusing/strange stuff on there too.

Randomness

A great technique for keeping your site looking ‘fresh’ and constantly changing is to have it, er, constantly change!  Of course the best technique is to keep adding relevant content to it all the time but there are certain other tricks that can all add up to make your site more dynamic.  The post it text and my profile picture both change randomly each time the blog is refreshed.  I write down a variety of things on the post it now and again and include them in the rotation.  Hopefully once people notice this subtle change when they visit the site for the second time, encouraging them to come back more and more.  Not for this sole reason obviously but it all adds to the experience.  The profile picture, displayed in a polaroid style, also changes randomly.  I also keep adding to the photo set to hopefully one day have a huge collection of photos so you almost never see the same photo twice.

Twitter Bird

The origami Twitter bird logo was included to encourage people to follow me.  It’s quite irresistible and you really want to click on it, don’t you?  There are a few techniques used to increase your following, such as include your Twitter URL everywhere, on your blog, email signatures, whenever you comment etc.  I will perhaps make a blog post about these techniques, hang on, I’ll just jot that down on a post it.  Done.

The Sidebar

The sidebar had a little bit of a reconstruction a couple of days ago.  I added in cute little icons for links to my different projects. Using a little bit of CSS magic, I changed the opacity on rollover instead of using a background shift technique or some Javascript.  It’s hard to make out exactly what the icons are as they are so small, adding a bit more to the curiosity factor and urging people to click to find out the details.

Searchbar and RSS/Twitter icons are a must for the sidebar.  I added in my little Twitter bird icon, with a speech bubble rollover, and then listed the categories of my blog posts.  I think it’s so so important to include your Twitter feed on your blog in some way.  It’s pretty much a ‘live’ account of what you are doing right now and allows you to update your blog appearance far quicker than writing blog posts.  The tweets are short, non-intensive packets of information and will show people that you are active, adding another incentive for them to follow you and return to the blog.  Below this are my Flickr and Delicious feeds.  If people are interested in what you write about, chances are they will be interested in what you see on the net and in the real world.

Main stuff

Blog posts about my projects, interesting stuff on the web, latest internet trends, web design and a whole host of other thoughts make up the main content of the site.  This had to have a clean layout to go with the rest of the site. As there is a desktop, workspace theme running through the site, I decided to make each post look like it was printed on paper, but fade the background out a little as you scroll down to show that we’re still on a digital platform.  Muted colours and consistency allow this to be easily read and scanned for relevant content.

Comments

I used a tip from Lee Munroe’s post on WordPress hacks to highlight my comments in the list.  It makes it much easier for other readers and myself to scan and see where I have replied to comments.  The comments alternate colours, making the readability that little bit easier.

Done!

There’s a few other things I could waffle on about the blog’s design, but these are the important points.  I am in the middle of creating a portfolio site for myself but for the time being, this is where all updates on my work will be shown to the world.

Hope some of the tips were useful to you.  Have fun!