Here’s a handy link to my posts.

We’re not just making pretty interfaces, we’re actually in the process of building an environment where we’ll spend most of our time for the rest of our lives. We’re the designers. We’re the builders.

Spine tingling stuff from Wilson Miner’s Build 2011 talk.

When I was fifteen I started playing in rock bands, whenever we put on shows it was my job to design the posters. I did this using a school library computer and Microsoft Publisher. I would trawl the internet for pictures to use and build the poster around them.

When I was seventeen I realised late on Sunday night I had a college assignment due the next day, the brief was to present part of your life in a mixed-media format. Most kids had made videos and presentations, I had no idea what to do, so had spent to allotted time procrastinating. Out of desperation I fired up Microsoft Frontpage for the first time and stayed up most of the night making a website about how to learn to play the drums, I handed it in, on time, on a floppy disc.

Today I realised that’s what I do for a living.

Born 29th October 2011. Words can’t describe the feeling of becoming a parent.

Go without a coat when it’s cold; find out what cold is. Go hungry; keep your existence lean. Wear away the fat, get down to the lean tissue and see what it’s all about. The only time you define your character is when you go without. In times of hardship, you find out what you’re made of and what you’re capable of. If you’re never tested, you’ll never define your character

Henry Rollins, via Minimal Mac

Stop the comparisons. Today.

It’s a great habit to observe your peer’s work but it’s important to always remember that design is not a competition. Be inspired and take influence from those talented people in your industry but remember nothing good can come from comparisons. Why not compare today’s work to your work a year ago?

Allow your skill to catch up with your taste

Ira Glass puts it better than I could:

Nobody tells this to people who are beginners, I wish someone told me. All of us who do creative work, we get into it because we have good taste. But there is this gap. For the first couple years you make stuff, it’s just not that good. It’s trying to be good, it has potential, but it’s not. But your taste, the thing that got you into the game, is still killer. And your taste is why your work disappoints you. A lot of people never get past this phase, they quit

Excerpt from this interview.

Educate yourself

Pick up a book, address that growing Instapaper queue. Learning a new skill or reinforcing an established skill can motivate you more than you realise. Don’t constrain yourself to your own industry, look further afield and prepare to be surprised by the results.

Stop finding excuses not to work

“It would be so much better if…” “If only it wasn’t…”. You will never land a perfect project. You will never have the perfect client. Your office will never be the perfect temperature.

Switch it up

Change your working habits – wake up at 5 am or stay up till 3am – work in a coffee shop or public library. I find nothing grinds me down more than a routine. Take advantage of all the flexibility your job can offer.

Get healthy

Eat better food; drink more water; take more exercise; sleep longer. Don’t underestimate the power of fresh air and daylight. A brisk walk, a jog or a bike ride can lift your mood and change your perspective.

Keep a to-do list

Keeping a to-do list can be a challenge in itself. I don’t put everything on mine, only the menial tasks I’m likely to forget. When I’m not in the mood for creative work I tackle the to-do list. Knowing I’ve got a few of those boring jobs out of the way can boost my mood enough to get me back in the game.

Maintain your working environment

Keep your workspace clean and tidy. Invest in some decent lighting and a few pictures for the walls. Ensure you have a door to shut or some quality headphones so you can enjoy a quiet moment. You’re more likely to spend time in a workspace that’s a pleasure to be in.

Separate work and play

Don’t work on the sofa, don’t play at your desk. If you work in an office don’t bring your work home with you. It seems like a simple thing but when home working is commonplace and remote working is so easy  you’d be surprised how much the line can blur.

Don’t stop working

The worst thing you can do is sit around and wait for inspiration to find you. When you are feeling at your worst it is tempting to fire up the xbox, lose yourself in social networking or watch those endless reruns.

Inspiration exists, but it has to find you working. – Pablo Picasso

The longer you spend away from work the harder it will be to pick it up again. The more you work, the more you work.

Experts—journalists, analysts, consultants, bankers, and gurus can’t “do” so they “advise.” They can tell you what is wrong with your product, but they cannot make a great one.

I just woke up to the sad news that Steve Jobs has passed away. Rest in Peace 

Until now writing code that can resize videos from every service, at every size, without serving multiple versions or ending up with a ruined aspect ratio has been damned near impossible.

FitVids makes it simple, really simple. I’ve implemented it on this site tonight with no trouble at all and I will keep it in my back pocket for future work. Thanks guys.

Carving the Mountains from Juan Rayos on Vimeo.

Fast forward to today and we find ourselves with a problem. Take a look at any Local Government website or web application and you’ll see screen after screen designed by developers and software engineers.

Wild statement: There are no designers in Local Government.

I wasn’t hired as a designer, nor was anyone in my team. We were hired as a developers. Luckily for my employer we had some design skills. In fact I was a designer disguised as a developer (I left my checked shirt and glasses at home) so they hit the jackpot.

So why are Local Authorities happy to leave design to the luck of the draw? We’ve recently seen authorities hiring a vast range of web professionals – web copywriters, content strategists, service designers (I think thats code for business analysts) and I’ve started to hear whispers about a mysterious new thing called ‘UX’. But what will it take for us to start hiring designers?

Surely I don’t have to reiterate the benefits of good design? We all know that it saves money if we can move our services online; but here’s a thought. What if we made them easy? Pleasurable? Memorable? You can’t do that without a designer.

I would buy one of these for all of my friends.

A fantastic collection of tips and insider advice about what it’s really like to be a designer,  this article kept me up far too late.

Normally I wouldn’t shout my mouth off about a simple compliment, but working in government recently hasn’t been easy, and it made my (and my team’s) week.

If you do get me to fill out your satisfaction survey I will be biased because you have asked for it so arrogantly. You can’t rely on the results you get if you’ve annoyed your customer by asking.

Writing down what I like about other people’s sites in the hope it will give me a wishlist for my own.

Last week I attended New Adventures in Web Design 2011, and I wanted to write a few thoughts about the day. Instead of a blow-by-blow account I’m going to share what I thought made this conference so special, and why I will be attending again. The photos used in this post are all from the Flickr group pool.

The Location

Nottingham is a university city with a vibrant creative community but most importantly it’s located in Central England. This means that those of us who don’t live in the south-east are able to attend without take a week off work and learning what an Oyster card is. It’s also got the East Midlands airport nearby, meaning international attendees are accounted for too.

The Venue

The Albert Hall is a spectacular venue. I heard it criticised by a few for the size of the foyer area during breaks, but I liked that you were elbow to elbow with web geeks. I attended alone, but managed to speak to loads of great people because, in most part, we were forced together in the cosy foyer.

The Talks

Throughout all of the talks I didn’t see one line of code. I don’t go to a conference to learn specifics and take diligent notes, I go to be influenced and inspired by industry leaders. Talks were time-boxed to just 30 minutes, meaning they were lean, focused, efficient and left me wanting more.

The Community

Both before and after the event it felt like the whole web design community had been talking about this conference. Simon Collison is a prominent member of the web design community and we all wanted to see him succeed. While there, everyone from the attendees and volunteers to the speakers were approachable, friendly and always smiling.

Podcasts have become a staple of my weekly routine, I find they are the best way to use those hours of the day I spend travelling to work, driving or doing household chores to do something positive.

I listen to a wide range of podcasts and below is a small list of some of my favourites:

Web Industry

Boagworld: An excellent podcast for anyone “designing, developing or running websites on a daily basis”. It is about to go through a big format change but the 200+ show archive is still available.

Think Vitamin Radio: A bi-weekly podcast from the guys at Carsonified delivering industry news, interviews and case studies. They cover everything from web design to web business so most people will find something of interest

The Big Web Show: Industry veterans Dan Benjamin and Jeffrey Zeldman interview a different guest each week, topics range from web standards to the publishing industry. I’ve found this show so interesting, particularly when they discuss the historical web industry.

General Interest

Stuff You Should Know: Howstuffworks.com‘s flagship podcast. Josh Clark and Charles W. ‘Chuckers’ Bryant walk you through some well chosen topics and themes.

This American Life: If you are going to pick one podcast make sure this is it. Absolutely fascinating topics, brilliantly produced and it’s impossible not to like the host Ira Glass.

Radiolab: This popular science podcast is terrifically produced and the topics and themes are riveting. One of my favourites, full length shows are infrequent but when they publish them they are pure gold.

Answer Me This: Very British, a new one for me although it’s been going for ages. Helen, Olly and Martin the sound man answer listener questions. Very funny and really easy to listen to.

Bonus – Gaming

Gaming podcasts are a guilty pleasure for me, although I can’t file them under passive learning.

Bombcast: A weekly podcast from the guys at giantbomb.com. They are all veterans of videogame journalism and really know their stuff, one of my week’s highlights.

Got any shows to recommend? Let me know in the comments.

It’s not all great though, as it turns out there is no way to transfer an app purchase to the new app store, meaning you miss out on auto updates and other benefits unless you repurchase the license. So the iLife 11 upgrade I bought in October will have to stay in application limbo until the next paid-for upgrade.

As has become the usual from Apple, bittersweet.

I got married, moved house and we are about to go to Australia for three weeks. I haven’t done anything since relaunching my site and probably won’t until the new year – but fear not.

In 2011 I will return and I will be taking on some more freelance jobs, I’m pumped about web design at the moment having just read through Andy Clarke‘s book, Hardboiled web design and am getting excited already.

Here’s to next year!

Once enabled Google Instant performs your search and begins fetching results as you type, something that has to be experienced. I like it, but it will take some getting used to.

There are some amazing replacement iTunes 10 icons on Dribbble following the backlash against the new icon unveiling.

So what’s new?

• A brand new portfolio section – it’s not particularly populous at the moment, but it’s a place to show all my personal and freelance work
• Much simpler layout and design – when I made version 1 it didn’t have a clear purpose, I wasn’t sure how much freelance work I wanted and how much I would be writing so the site always struggled with split personality. Hopefully that will end now
• No more contact form mess – if you want to contact me email me martin[at]mynameismartin.com or send me a tweet @thenameismartin
• Typekit
• and more to come…

As always I’m open to your feedback, this site will always be a work in progress. I’ll be following shortly with a post about some of my design decisions and will upload a few early designs.

What does this mean?

• The general look and feel has come to feel quite clunky and over simple, I’d like to make it a bit more delicate and thought out, but still retain the same general feel
• I’m not counting on using my site to find freelance work via cold enquiries, so less of a ‘salesy’ tone to the copy
• I’m not posting to my blog as often as I could be, due to some decisions made in the last design. I’d like to go much more down the Tumblr route and make the blog less about articles and more about bookmarking and sharing.
• I’m using Twitter more and more so I’ll put that as a higher priority on the site
• If I can, I’ll do it all on one page.

I’ll do my best to post my progress as I go, as I did with this version.

Sources & Essential Reading:

• http://www.smashingmagazine.com/2009/08/20/typographic-design-survey-best-practices-from-the-best-blogs/
• http://www.markboulton.co.uk/journal/comments/five-simple-steps-to-better-typography
• http://www.adobe.com/education/pdf/type_primer.pdf
• http://www.webtypography.net/toc/
• http://www.aisleone.net/2009/design/8-ways-to-improve-your-typography/
• http://www.alistapart.com/articles/on-web-typography/
• http://www.alistapart.com/articles/settingtypeontheweb/
• http://www.smashingmagazine.com/2008/08/11/top-ten-web-typography-sins/
• http://24ways.org/2006/compose-to-a-vertical-rhythm

Line-length (Measure)

A general good rule of thumb is 2–3 alphabets in length, or 52–78 characters (including spaces). A simple way to calculate the measure is to use Robert Bringhurst’s method which multiples the type size by 30. So if the type size is 10px, multiplying it by 30 gives you a measure of 300px or around 65 characters per line.

Why? Long lines of text require longer periods of attention before the eye moves lines, short lines of text require moving lines too often, which can break rhythm, an optimum measure means creating a comfortable balance.

Line-height (Leading)

Optimum line-height is 1.5 x text size (1.5em), this should be lowered for large headings (1.2-1.4em).

Why? Too much leading causes the eye to jump from line to line and can be disruptive to reading, too little leading creates a dense ‘typographic color’ which looks less appealing, and can create the illusion of ‘more’ text.

Measure and leading are related, when increasing your measure, ensure you adjust your leading, longer measure requires greater leading and vice-versa. These rules can change depending on choice of font, for example, a font with a larger x-height (literally the height of the x character) such as Verdana, may require more leading.

Letter-spacing

In most cases letter spacing should remain default, as fonts are designed to work best at this setting, in special cases, such as all uppercase or small caps increase letter-spacing by a small amount (~1px).

Why? Uppercase characters are tighter and will require extra spacing to improve readability.

Vertical Rhythm

Ensure that the spacing between elements is equal to, or multiples of, your line-height (Measure) e.g.

body {
font-family: Helvetica, sans-serif;
font-size: 12px;
line-height: 15px;
}
p {
margin-bottom: 15px;
}

Why? The baseline grid is the skeleton of your typographic layout and provides consistency. Conforming to your baseline ensure flow and improves readability. A continuous rhythm in the vertical space keeps all the text on a consistent grid so that proportion and balance are retained throughout the page, no matter the type size, leading or measure.

Hanging Punctuation

Quotation marks and bullets should always be set ‘outside’ in the gutter outside of your body text, so that the text remains consistently aligned.

Why? Maintaining left alignment means that the text is scannable and rhythm is uninterrupted. The eye looks for straight lines everywhere, when type is indented in this way, it maintains the flow of text.

Got any of your own to add? Let me know in the comments.

Saving for a wedding means I’ve been checking my various internet banking accounts quite often, and although yours is one of the better ones, there’s something that’s been bothering me. You see, when I get to your homepage, I have to click through to log-in on a separate page. How about shortening my journey slightly?

Before

HSBC's homepage before

After

HSBC's homepage after

It may not seem like much, but one thing I’ve learnt is when it comes to customer experience is that it’s all in the details. Your customer’s time is valuable and you should make every effort to streamline your processes.

Just a thought

Its a 48 column, 950px wide template with 3, 4, 6 and 8 columns layouts built in. Feel free to download, modify and redistribute to your heart’s content.

950px_grid_layout

Designing in the browser

Ever since reading about designing in the browser in Andy Clarke‘s ‘Walls come tumbling down’ slides I’ve wanted to push Photoshop out of my workflow and jump straight into the browser.

The first thing that strikes me is how fast it allows me to work, going from one paper sketch to a working wireframe prototype within a few hours, and I’m able to see what works very early on in the process, something that doesn’t usually become clear until after Photoshop. Iterations and revisions are much easier, meaning that what would usually be major, structural changes take a fraction of the time and effort to complete.

I know skipping Photoshop isn’t for everyone, but my first experience has been so positive, adding an element of freedom I haven’t had in a long time and I can’t wait to work like this again.

CSS 3

Although we have been dabbling with CSS 3 at work for a while now, I often feel tied down by our commitment to legacy browsers and always have to tread carefully when implementing some more ambitious ideas. I’ve designed the majority of this site with CSS 3 in mind; the letterpress effect on the headings, differing levels of transparency and rounded corners are all pure CSS 3 and although not every browser will get the same visual experience, the progressive enhancement built into CSS 3 (pictured) ensures I don’t spend time making sure that the basics are in place universally.

Progressive enhancement in CSS 3. Left to right: Safari 4, Firefox 3.6, IE8 in Windows 7

IE6 and friends

I decided to forget IE6 during development completely, save for a glance on launch day, just to see what would happen. After all the CSS 3 and reckless behaviour on my part I was expecting to launch IE6 on a test machine and see a complete mess, although surprisingly, apart from two minor bugs (the background of the content areas isn’t showing, and the accommodation entries don’t line up) it’s completely intact. Maybe all those years of coding defensively have hardwired my brain to avoid IE6 bugs.

Still to come

I’ve still got plenty of things I’d like to build into the site later; I’ve got a pretty neat idea for a countdown timer which I will attempt in-between my client work and when we send out our invitations I’m going to implement an AJAX RSVP form.

Overall this has been a really fun personal project that has given me a chance to try out some new things and work in a way I’ve never worked before, I’m really happy with the final result and would love to hear what you think, so love it or hate it, drop me a comment.

• Cross browser testing – I have no idea what it looks like in IE6 or 7 or Firefox pre 3.6
• Font stacks – The ampersand in the logo is Palatino, I need to do some research into how widely available that font is
• Build an RSVP form

Anyways, enjoy and be sure to feedback

Following the initial reaction from Birmingham residents, local government bloggers and webbies everywhere a group of volunteers led by Stef Lewandowski have combined their efforts to create BCCDIY. A wiki built on the content of the Birmingham website; the goal is to improve the content, and make the information easier to find, understand and update and after their first hack-day, it’s looking great with plenty of advanced functionality already in place.

There are plenty of examples in the wider web world where a wiki style website has worked, but could this ever work for a local government site? Could (or even would) a council effectively hand their content over to the people? It will be a huge investment in time for moderation and administration, but surely no more than writing it all yourself?

What about handing over key online services to third party products and mashups? Green Box Day gives you bin collection times if you are willing to hand over your data, Fix My Street gives you an excellent way to report problems and Get Satisfaction gives a solid customer support service.

Using community generated content and services could have endless benefits in the quality of data and the standard of service but do the pros outweigh the cons? Is there a council out there brave enough to try it?

The truth is I don’t think anyone knows, but when a council does get the guts to go with a community driven site, we will all be watching with baited breath. In the meantime with interest from SOCITM, TV news and even the UK Parliament, BCCDIY will certainly give some weight to the notion.

That said…

When using the search function I keep clicking the ‘Basket’ button because it’s placed so close to the end of the search bar. I’ve done it more times then I’ve hit the tiny orange ‘Go’ button.

Is it just me?

I stumbled across Fever while aimlessly web browsing one day, I am familiar with Shaun Inman and the acclaimed analytics package Mint and I had not long acquired a new web host so I decided to throw $30 (£18) at it and give it a go.

What is Fever?

Fever is a self hosted RSS reader with a twist. Once you have loaded it with RSS feeds it performs some clever aggregation and gives you your feeds sorted by temperature.

How it works

Fever gives you multiple choices when adding an RSS feed. The feeds you read every day get marked as ‘kindling’, other feeds of the kind that you may not want to read as consistently get marked as ‘sparks’. For example I have a feed from Smashing Magazine which I read daily so I’ve marked that as kindling, whereas the feed from Digg’s technology section that is not always going to contain stuff I want to read gets added as a spark. When an item appears in one or more kindling feeds and also one or more spark feeds the temperature of the item is raised.

What you end up with is a chart of the hottest items by week (this is the default but you can change the timeframe). This is great for those busy periods when you can’t read your feeds all day long, you can get a good overview of the most talked about things. Fever still functions like a traditional RSS reader if you are into that kind of thing, and it allows grouping of feeds and saving so you can categorise feeds however you like and save RSS items you want to remain in your feed.

The roof is on fire

When I first installed Fever I had somewhere between 65 and 70 feeds to add, over the next few days I got the bug and went feed hunting, I used my Twitter following list, anything I could get my hands on. The great thing about Fever is if you aren’t sure about a feed you just mark it as a spark and you don’t have to read it, it just makes the whole program work better. Imagine that, an RSS feed reader that work better the more feeds you throw at it.

The downside?

Because Fever is a self-hosted service you need a web server (not IIS), with PHP and MySQL. If you are familiar with the above technologies then installation shouldn’t cause you too much trouble, if you aren’t though you may struggle as you have to do some fairly low level stuff to prepare your server for deployment, such as creating a database and setting up a user and the installation notes don’t exactly walk you through the process.

Fever will use your server’s bandwidth and CPU time so if you are on a cheaper, limited hosting plan you will want to keep an eye on it. You can configure Fever to update via cron jobs to limit this. It’s not a bandwidth hog or anything but if you regularly run at the red line you’ll notice.

What are you waiting for?

If you only want an RSS reader to manage 10 or so feeds then maybe Fever isn’t for you. If, like me, you have a lot of feeds to manage and traditional RSS feed readers don’t quite cut the mustard then I wholly recommend you check Fever out, it has completely changed the way I read on the web and has actually allowed me to do much more reading than back when I was wrestling with 65 tabs. Since installing Fever I have doubled my subscribed feeds and I’m far less afraid of adding more to the reading list. While I’m not saying it will work for everyone, it has worked for me after many years of trying to crowbar passive RSS into my daily routine.

In the article, Paul breaks context into five aspects:

Environment

The kind of information or service the customer requires will be dependent on their location, a customer wishing to report a broken street light may well be standing under it and will want different information to a customer who is sat in the comfort of their home.

Device

As the article acknowledges, environment and device can go hand in hand, a customer in the middle of a muddy field is likely to be using a mobile device, but this is not the only context affected by a customers device.

The device will determine the input methods available, on a mobile phone or handheld there is unlikely to be a mouse and on a games console the keyboard is onscreen. Using complex forms or rich applications such as maps may be impossible using devices with limited input methods.

A mobile device may have other input methods we could take advantage of, such as built-in GPS or a camera, allowing the customer to take a photo of a pothole and record it’s exact location.

Comfort

Physical comfort is something we can only guess at, but we can allow location information to give us clues. The most relevant aspect of comfort is when it is due to physical conditions, such as a disability or injury. We can’t expect a customer with back pain to sit for a great length of time to complete a job application without some method of saving and resuming later.

Mood

As the article discusses, emotional whims will affect attention span or toleration of bad design and needless steps in a process. This is especially relevant in local government because often a service is required because we have done something to inconvenience the customer or because we have imposed a complex process. Take the example of reporting a missed bin collection or applying for planning permission.

We should make every effort to make these kinds of services as simple and intuitive as possible to minimise errors and abandoned sessions.

Time

Customers who are under a time constraint, for example applying for a job before the position closes or paying a parking fine before the amount escalates are less likely to be tolerant of unnecessary steps or buried content. But also, if it takes longer to report a problem online than it does to pick up the phone you are actually costing the customer and yourself more.

To be truly ‘customer-focused’, an understanding of our customer’s context is paramount. Using context to shape the way we design and deliver services puts the user at the centre of the process.

If you can’t quite make it out, let me explain. Thats an input for a memorable date and a PIN number when opening an account, and they have disabled your keyboard completely so you must enter the numbers by clicking the onscreen keypad.

UPDATE: Since opening my account I have locked myself out twice, why? Because to add to the confusion the order of the numbers on the keypad changes every visit.

Research is a diverse activity and can range from reading industry blogs and magazines and interviewing clients to looking at the competition and the wider industry. It can be used to predict customer needs, support or inform your decision making and as a catalyst for change.

Research is not wasted time, and past research should always be kept handy. You never know when you’re going to encounter the same problem again, or find another use for some prototype code or wireframe. Having a good repository of research means you have something to refer back to, although managing this research repository can be large task in itself, there are plenty of tools around around to help.

We should not be afraid of approaching new challenges or doing things we have never done before, if we use research it can help the unknown become known, it can turn guesses into more concrete, realistic estimates and most of all it can help us broaden our knowledge and experience.

I think too often in the design community we like to jump right into the design stage of a project, relying on inspiration or chance to help us, but taking a moment to research can lead to better decisions, better designs and most importantly better websites.

There are still some things that need my attention until I can relax, including the measure in blog posts (feel a bit short to anyone else?), IE6 testing and finally I need to build the portfolio section (and get rid of the ‘coming soon…’ placeholders). I’m holding off on the latter until I get a few jobs under my belt.

In the meantime please take a look around, feel free to critique and report bugs to your heart’s content