Speck Work do clients really understand why speck Work harms their business as well as harming the designer producing it.

Is there a way to educate and advise clients on how to find the perfect design match. First Let’s be sure we all understand what Spec work really is, the quote below explains it nicely

This type of work is widely considered undesirable and immoral by the design community, as it requires the designer to commit time and resources to a project with the chance of getting nothing in return. While a client may feel they don’t want to invest money until seeing some work, designers should not have to prove their worth to get a job. Instead, clients should choose a designer based on their portfolio and experience and commit to building a working relationship with him or her. Only then will both the client and designer see the best results.

-Not sure

Let’s look at this issue from every angle, I am hearing of more and more clients and employers expecting designers to produce designs before any contract or job has been signed or offered. This increase seems to be a by-product of the recession. Jobs and clients are becoming harder to find and everyone is having to compete for every scrap of work.

Every client that I have ever interacted with come to me with an idea of what they were looking for. Usually they are looking for their idea to be professional produced and developed. Sounds good, so where do things start to go wrong. Could the problems start when budgets get tight and clients get worried about risk, clients are always taking a risk commissioning design work. Could their answer to this be to get designers to deliver before any real risk has been taken. This all sounds great, a master plan from the clients prospective. How can designers educate clients on the downsides of this new found way of working? Picture this, the dream client we have all heard of them they come with a respect for the design profession, an understanding of how design adds value, willingness to learn and a knowledge of how buying design works. Is there a way we can we help transform every client into this perfect model?

Help is out there

The design community has some great resources for educating clients on Speck Work.

• no-spec.com
• I won’t do free design work to win your business – here’s why
• AIGA position on spec work

Industry leaders also have voiced their opinions on Spec work

• Andy Budd (Clearleft)
• Jeffrey Zeldman (Happy Cog)

My process

I recently came up against this from a prospective client -

Just to give you a heads up other potential employees have put together a mock site
and others have already redesigned our logo just to show potential.

- The uneducated client

In the clients defense all they were doing was letting me know what other people were doing in order to gain an advantage over their competition. Just to set the scene, this was only the second time I had spoken to the potential client, they had already viewed my portfolio and assessed my experience.

This left me with three options.

• 1. Do I take up the challenge and get involved in this type of engagement?
• 2. Do I try and educate the client?
• 3. Do I remove myself form the running?

If I went for option one I would have to get involved with producing work before I truly understood the clients needs and also before the client had committed to any contract or payment. For all of the reasons above I didn’t think this was the best option for me or the client. I then moved on to option two. How could I make the client see that designers producing work without clear goals and a true understanding of their services would only produce something that would be visually pleasing to the eye but would not be solving any of their real business problems. I took up the challenge of trying to give the client the knowledge to confidently understand how to commission designers. I gave the client an overview of Speck Work as I was unsure of how aware the client was of Speck Work, this also contained some of the links shown above. I outlined my views on why designers are producing design work without a clear understanding of their services and why this would not be very beneficial to them in the long run.

On this occasion my approach did not change the clients view on things. I am not sure why, did the client just not have the time to read over the information I sent over or did they need further explanations and examples. It might have been that I was not clear enough with my explanation. My suspicions are that it might have been a combination of everything and the influence of seeing their ideas in reality was to great a pull. And who can blame them I see a similar behavior when I work with new
designers they are desperate to produce something visual. Diving into Photoshop or designing within the browser before they truly understand the problem they are trying to solve.

Sadly I was only left with the last option. I removed myself from being considered. This was a very hard decision to make I was walking away from a job that promised riches and short term security. But I had to look at things in the long term, producing designs without understanding the real business needs will always end in dissatisfaction as they will not be solving real life problems. I always try and keep this quote in mind when I have to walk away from a potential job

I know that the clients I want to work with are the ones who understand the value of design and respect me as a professional.

- Andy Budd

I was involved in helping South Lanarkshire National Entitlement Card develop a new fully responsive website.

The Scottish Government, Young Scot, local councils and other organisations have worked together to offer citizens across Scotland the National Entitlement Card, a nationally recognised electronic smart card, which make it easier to access their services.

The website had to cater for three very different user groups -

• 11 – 25 year olds Young people
• Older people 60+
• Disabled people

With this in mind we had to carry out a very broad range of research. We began with user research working all this into sketches, personas, user flows, wireframes then we developed click through prototypes, and finally we built up the final site.

Html5 animations

We also developed some HTML5 animations to help get the message across from the homepage.

Mobile view

View the site: South Lanarkshire NEC

My experience is usually good when i do my weekly online grocery shop with ASDA. They have a simple layout that is easy to navigate and clear call to actions.

I normal use my Ipad for this type of thing, it means i can relax on the couch and take my time selecting all the nice things I want to eat. This week however I ran into some real issues, everything was going smoothly until my son closed the browser on the Ipad. This should have been a small irritation that would be easily fixed by simply opening the browser back up again. The first thing i noticed once the browser had loaded was that I had been logged out of my shopping session, I thought ok seems fine good security and all of that i will simply log back in and get going, this is where things became problematic.

Ipad in landscape view

Ipad in portrait view

The first issue that i had was in landscape view i could not see what i was inputting into the login field, i managed to resolve this by changing to portrait view. I continued to input my email address then the second issue arouse, how do i enter my password? there was no way that i could see to tab to the next input field. After a few minutes of scratching my head i came to the conclusion that once i hit go it will ask for the missing password so i hit go and the error screen did appear “Sorry we did not recognise the details you entered! Please check and try again.” but it had removed my email address and was still looking for the two fields both user name and password.

After 4 or 5 times round this loop I abandoned my shopping with frustration levels very high. I do understand that no online experience will ever be 100% perfect but this does flag up the importance of testing all functionality on all devices and also making sure there is continued testing as things are always changing.

Come on ASDA development team sort it out and bring my Sunday shopping experience back to a joyful and relaxed one.

Local government websites have came a long way since the dark old days of the poorly managed do it yourself table based layouts of the late 90’s. Now most sites are backed by web professionals and are running great content management systems that help produce some nice results.

I was recently involved in helping South Lanarkshire Council take their reasonably well designed fixed width website which was optimised only for the desktop and make the site adapt and respond to the many different devices that their users are now entering the site on.

Here is a brief outline of how it was built

Delivering a truly device independent website experience, an outline of the raw materials that we used

• A flexible, grid-based layout,
• Flexible images and media,
• Valid HTML 5 and CSS
• Media queries

The sizes of devices that had to be considered –

320 x 480 For small screen devices, like phones, held in landscape mode and Ten-inch tablets like the iPad (768×1024) held in portrait mode.

1024 x 768 (iPad – Landscape) and desktop

Wide screen (1200 pixels) For widescreen displays

Times are hard, businesses are going under left right and centre. For the lucky few still in business money is tight and most of them are looking to cut the fat and tighten their financial belts just to stay in the game.

Design seems to be one of the first things small businesses cut back on, it’s seen as a luxury only relevant for good times or big brands with big budgets. Larger businesses also cut back on this luxury item, preferring to focus budgets on other essential areas of their business.

The Tortoise and the Hare

This type of scenario reminds me of how some people try to keep fit,

Jan – March: Great enthusiasm
Apr – June: Loss of momentum start finding it hard to find time to workout.
July – Aug: Holiday inspiration,
Sep –Dec: Things get very hard, bad weather – low motivation.

Their keep fit routine is a real rollercoaster of activity, making gains then losing them. The point I am trying to make is, rather than going all or nothing and gaining ground then losing it, a far better approach would be to keep up a consistent flow of activity which could be adjusted depending on circumstances. Studies show that companies who cut their marketing and design budgets during a recession fall behind those who didn’t, so when the recovery does come they need to apply more effort to catch up.

Great things come from small beginnings

A strong brand can differentiate you from your competition without drawing you into competing on price, without it dropping your price, quality or something else might be your only option, also businesses that cut back on design could be damaging their reputation and long-term chances of success.

Picture this you decide to go out for a nice meal, you are not sure what restaurant to visit your favourite restaurant or the new restaurant that has just opened up in town, both serve very nice food, hard decision. You start by looking up both their websites to view their menu and opening times etc … times are hard your favourite restaurant decided not to get their site designed and branding up-dated properly, they got a friends brother to do it and the owner decides to take the Art Director lead, much cheaper option. You find that their site is very slow it’s also hard to find what you are looking for, things don’t look that good, poor food photography, hard to read, colour is a bit off and the up-dated branding doesn’t quite look right. On the other hand the new restaurant in town invested in their brand and got professional help, their site looks fantastic, very fast and easy to use, your mouth is watering just browsing through their photos and they also provide a very easy way to book your table and information on parking which you like. Where would you spend your money.

One question that seems to arise time and time again from clients is code validation. Most seem to have the understanding that if you have errors on a webpage, the HTML code is bad. Most clients are now very aware of how and what affects their website ranking and users access.

A bit about the W3C – The World Wide Web Consortium (W3C) is the organisation in charge of setting best practices and standards for coding in HTML.

This subject has been a controversial topic among developers and clients for several years. Most professionals agree that properly validated code will help a website rank higher, prevent problems and issues arising if new technologies are developed. For me and other professional web craftsman this is great news, but what are the real advantages of having valid webpages.

Lets start with some arguments against code validation

• - extra development time needed which equates to extra cost.
• - Expertise and good knowledge of HTML needed
• - Googles own homepage has 69 errors on it – so why bother if they don’t

There is also a video by one of Google’s quality engineers about this subject where he explains that Google does not award a site a higher ranked place because it validates.

Now the arguments for code validation

Validation as a debugging tool

While contemporary Web browsers do an increasingly good job of parsing even the worst HTML “tag soup”, some errors are not always caught gracefully. Very often, different software on different platforms will not handle errors in a similar fashion, making it extremely difficult to apply style or layout consistently.

Validation as a future-proof quality check

Checking that a page “displays fine” in several contemporary browsers may be a reasonable insurance that the page will “work” today, but it does not guarantee that it will work tomorrow.

Validation eases maintenance

It is reasonable to consider that standards such as HTML and CSS are a form of “coding style” which is globally agreed upon. Creating Web pages or applications according to a widely accepted coding style makes them easier to maintain, even if the maintenance and evolution is performed by someone else.

Validation is a sign of professionalism

As of today, there is little or no certification for Web professionals, and only few universities teach Web technologies, leaving most Web-smiths to learn by themselves, with varied success. Seasoned, able professionals will take pride in creating Web content using semantic and well-formed markup, separation of style and content, etc. Validation can then be used as a quick check to determine whether the code is the clean work of a seasoned HTML author, or quickly hacked-together tag soup.

For me it all boils down to this, if you adhere and follow web standards you can always be confident of building rock solid web environments, even if as on this website not all your pages validate. On this site we use meta data for some of our mobile stuff that at the moment will not validate, we show 4 errors all from meta tags not validating, which is a bit of a pain because we like valid web pages, but we are confident enough to know that although we don’t get the green tic our sites, are always coded properly and future-proofed.

One of the biggest challenges I have faced as a designer is – how do I stop a client making bad design decisions?

I am sure every designer has faced the same issue at one point in their professional career, after a project has been completed you sit and review it with a sense of uneasiness that the final design and message has been diluted and watered down, sometimes to the point where it no longer solves the original problem, and worst of all it has your name written all over it. This quote always plays in my head, can’t remember who said it but It seems to be my biggest fear if I let bad decisions into the final design -

“The client may pay for the work, but who takes the blame when the client campaign fails miserably because the client did not listen to the advice of the designer?”

I have studied and researched this problem for years. I now think that I might have finally found an answer. Before I get to my answer I feel that I need to show how I came to my conclusion. First I had to investigate the cause – Why It Happens, lots of people have put across their opinion on this but for me I think it boils down to -

• Lack of trust - The client feels that they need to micro manage every decision within the project
• Fear - Very closely related to lack of trust but comes into play even if the client rates the designer highly, “the panic effect” example – midway through the design process someone shows the client a rival site or they get some negative feed back.

I know there is a lot more to this and this article goes into this in more detail – Why Design-By-Committee Should Die but for me if a client is not sure of my ability the design process will not work, I have to say this is more common within larger organisations where one person or a department hires and trusts the designers decisions but other people and departments within the business may not.

This is how I think this can be fixed

First of all don’t work with bad clients, make sure your clients understand and know the value of great design. – How to spot bad design clients

• Clear Objectives - I always get the main objectives clear from the start and make sure everyone involved with the project is very clear on what they are.
• Concept feedback - If more than 2-3 people are involved in the design decisions I apply a filter/hierarchy on all feedback on the project. Makes evaluation designs easier.
  • A. Stake holders – most important
  • B. Users – very important
  • C. Dev team – important
  • D. People outside the team – not that important
  • E. People’s mothers, wives, grannies etc…. – not important at all.

• I ask good questions / no more personal opinions - We need to stop asking people what they think! Instead of asking “What do you think?” which often elicits a long-winded emotional response. Ask questions that require the participant to consider objective factors, i.e. “Does the design meet our stated business goals?”. I always challenge personal opinions by asking questions that dig deeper and expose the core of the issue. Determining whether or not the opinion is valid and relevant to the objectives.
• Use Real World Testing - “how do we know if a design decision is working or not working” – Involve the user in everything you do! From start to finish
  • 1. Meet with users
  • 2. User testing groups
  • 3. Conduct user a to b testing on all our big design decisions
  • 4. Involve user in design process.

Please note - Sometimes even the best clients can have an off day and so can you, designers are not always correct, sometimes the clients wisdom and experience about their product gives them the extra bit of insight to find the best solution. It’s all about a two-way flow of respect. On a final note if you do all the above and you come across the situation of “The head of products wants a pink button” and the only logic behind it is they like it, you can use this -

Bad design decisions disclaimer

“We/I did not follow the advice of the designer and made our/my own design decisions and we/I take full responsibility for how this will effect the website and will refrain from using the designers name when challenged about why bad design decisions where made and why the site now is not working the way it should.”

I have found that even after you have pulled out the big guns of a Bad design decisions disclaimer, this still will not deter the determined ego of some people, it will on the other hand give you the evidence and reassurance that you need when in six months time the inevitable questions are asked “who hired that designer, that pink button looks ridiculous and the stats show no one is using it”

]]> http://www.s224520479.websitehome.co.uk/big-s-web-design-320/blog/design/bad-design-decisions-disclaimer.html/feed 0 http://www.s224520479.websitehome.co.uk/big-s-web-design-320/blog/design/someone-ripped-off-our-old-websites-design.html http://www.s224520479.websitehome.co.uk/big-s-web-design-320/blog/design/someone-ripped-off-our-old-websites-design.html#comments Thu, 14 Jul 2011 11:18:17 +0000 Stewart http://www.s224520479.websitehome.co.uk/big-s-web-design-320/blog/?p=72 We Look through our Google Analytics reports every day so when I noticed some strange page titles for our website, I had to investigate. It turns out that someone liked our old design that much they decided to make their own version.

Don’t get me wrong i am all for copying and creative license, as Picasso said “Good Artists Borrow, Great Artists Steal”.

The way we look at this type of thing is every artist borrows, steals and is influenced by other people’s work. “Imitation is the sincerest form of flattery” and people who do not apply their own creative flavour will always be just not as good as the original a bit like the supermarkets own brands of coke, looks ok and tastes not bad but as coke have said for years there is nothing like the real thing.

Spot the difference -

Our old original design



The other design



]]> http://www.s224520479.websitehome.co.uk/big-s-web-design-320/blog/design/someone-ripped-off-our-old-websites-design.html/feed 0 http://www.s224520479.websitehome.co.uk/big-s-web-design-320/blog/design/web-development-for-the-ps3.html http://www.s224520479.websitehome.co.uk/big-s-web-design-320/blog/design/web-development-for-the-ps3.html#comments Mon, 20 Jun 2011 08:45:50 +0000 Charlie http://www.s224520479.websitehome.co.uk/big-s-web-design-320/blog/?p=24

The PS3 uses the NetFront browser. Developing for this is like web development in the days when ie5.5 or ie6 were the dominant browsers. Some things I have picked up that might help someone when developing for PS3:

• 1 - There seems to be a scrollbar that appears all of the time and the best way to get rid of this is to add the attribute scroll=”no” to the body tag
• 2 -The html star hack works for targeting the browser (* html)
• 3 -JavaScript events are set up with attachEvent and removed with detachEvent. So if you want you events to work cross browser I suggest using something like John Resigs cross browser addEvent function
• 4 -If you want to use a JavaScript library I found that BBC glow works well. The JQuery ready function would not fire, admittedly I did not spend much time trying to get to the bottom of this but I have found Glow to offer everything I required.
• 5 - Absolutely positioned elements dont seem to receive focus when you tab with the dpad
• 6 -If you want to align you site vertically in the middle of the screen then you will need JavaScript. I took the route of hiding the site, positioning it and then showing it as this prevents an FOUC
• 7 -I worked with a fixed width and height but there is scope to make your site fluid. However remember that users can be viewing you site on 52inch TV’s so you will probably need hi res images which can be bandwidth hungry to download
• 8 -Sony told a work colleague of mine that playstation owners tend to take a while to update so build and test for a the browser version that is a year old.
• 9 -The browser cache can be quite aggressive and I often found that even when I cleared the cache in the setting the HTML would not change. The best way to sort this is to attach a query string to the URL
• 10 -CSS sprites and transparent pngs work fine
]]> http://www.s224520479.websitehome.co.uk/big-s-web-design-320/blog/design/web-development-for-the-ps3.html/feed 0 http://www.s224520479.websitehome.co.uk/big-s-web-design-320/blog/coding/mobile-website-development-tips.html http://www.s224520479.websitehome.co.uk/big-s-web-design-320/blog/coding/mobile-website-development-tips.html#comments Sun, 12 Jun 2011 08:50:21 +0000 Charlie http://www.s224520479.websitehome.co.uk/big-s-web-design-320/blog/?p=29

Some of the things we have found useful and helpful as we develop mobile websites:

• Keep it relative – Use percentages for horizontal widths and em’s for vertical padding and margins. I have found this to be the most consistent way of getting results without pixels.
• Let it breath – I like to keep a gap at the sides of my sites to help them breath, to achieve this I create content thats 96% width and give it 2% left margin. This way if there are any rounding bugs (which there often are with percentage based layouts) the not defining of the right margin give you some room to breath.
• For spacing items out e.g. navigation or form input boxes, Use padding top and padding bottom as line-height dosen’t render in Opera mini
• If you compress your CSS with google closure be aware that it dosent like media queries that define a specific the media type. You need to leave out the media type which makes it default to all. So use @media (max-device-width:320px), instead of @media screen and (max-decice-width:320px)
• When using google maps I found that the markers need to be customised and made bigger to handle the iphone4 retina display. Otherwise the physical click was appearing above the marker. Also when creating markers the iphone didn’t seem to like using sprite images
• Not all phones with Android 2.2 support flash due to the phones hardware capabilities. Here are the phones that do
• When testing in multiple devices use a URL shortening service like bit.ly, it saves a lot of typing
]]> http://www.s224520479.websitehome.co.uk/big-s-web-design-320/blog/coding/mobile-website-development-tips.html/feed 0