The article in Computer Arts Magazine, Issue 200. Photo by Luisedtr.

How should designers determine an hourly wage?

There are a number of factors to keep in mind when figuring out what your worth such as what you think your worth, what you can get away with, your experience, the amount of work you currently have on, how badly you want an individual project and the terms of the project, as well how long you think each project will take. There are many other factors to consider, but this is a start. See here for more info on how much to charge for design work.

What are the pros and cons of fixed pricing versus and hourly rate?

Pricing hourly has its benefits at times and you should always be flexible in which way you choose, however, I would personally recommend pricing per project as it demonstrates that you will give results, not just X number hours of work.

How can designers ensure they price competitively?

Ask your friends in the industry and also do some competitive researching. How do your competitors charge, and what do they charge? Once you know this valuable information, you will have better judgement on how to price your work, as well as how to position yourself. Learn how to negotiate budgets also.

As someone who gets notified of a copyright infringement of my work every week (yes, every week!) I will tell you that it is a lot of effort to resolve these issues. You should be protective of your work, but don’t let it bog you down. I usually send a polite email at first and in most cases, they remove the work straight away with their tail between their legs. A few times I’ve threatened with a a DMCA take down notice but fortunately, I’ve never had to go further.

On this topic, be sure to read ‘how not to write a personal biography‘.

Do you recommend a designer has a legal eagle check a contract?

At the very least you should read over anything you sign, at least once or twice. If you’re work and fees are getting high profile, then yes it may be worth getting an ‘eagle’.

Can a designer ever charge more than they originally quoted?

If a project is going out of the original scope, known as scope creep, then yes of course.

Have any other questions that you’d like my opinion on? What’s your opinion?

In April, I spent two weeks in Costa Rica, traveling around Guanacaste province. I took about 900 photos on my Sony NEX 5N (a great portable cam!) and have have finally filtered through them. Feel free to check out the album on Facebook, which features forty of my favourites.

Costa Rica is definitely an awesome place to visit and below were some of my highlights:

• White water tubing
• Ziplining
• ATV riding
• Volcano exploring (mud, steam, etc.)
• Bathing in the hot springs
• Backwards abseiling
• Rock climbing
• Horseback riding
• Hiking & exploring the rainforests
• Off road four-wheel driving
• Riding an ox
• Tarzan swinging into a refreshing pool
• Driving around from place to place
• Interacting with nature, monkeys & wildlife
• Surfing Tamarindo
• Watching the amazing sunsets
• Enjoying Costa Rican food & culture
• and of course relaxing at the pool & beach.

Feel free to subscribe to my personal Facebook updates or this blog only.

Have you been to Costa Rica? There was plenty I missed and would love to explore the rest of the country. What would you recommend? If you haven’t been, I highly recommend it!

Win this HP ENVY 14 Spectre. Details below.

I was recently invited to attend a ‘top secret’ event held by HP. They emailed me and asked if I would like to attend an exciting ‘hunt’ between 4 and 8pm on a Thursday afternoon, at an undisclosed location. They were extremely vague about the event and they said to just show up, “it would be worth it”. Knowing how HP works with PR, I agreed and showed up.

What was to follow was a set of extraordinary events, especially if you know how the company Accomplice works – the company that runs the show / hunt / tour / experience. Without giving too much away the hunt consisted of a variety of random, extremely funny events and objects. A few are outlined below.

Singing Italian construction workers, fortune cookies, live frogs, 3D maps found in locked boxes held by paranoid bums, Russians on the the run from the police, USB sticks with self exploding videos, blind men giving directions, albino midgets holding lemons and flying snakes.

With a line up like that you can just imagine how interesting, weird & fun the tour was – I highly recommend checking out Accomplice if you are in New York, London or Hollywood.

Anyway, at the end of the hunt, a winner was chosen from our group to win a HP Spectre laptop. Unfortunately I didn’t win, however I do have one to give away! Check out the photos and how to win below. (Entries now closed)

Me, awaiting the announcement of who won the HP Spectre at the event. Sadly, I didn't!

We picked up a live frog from a singing construction worker.

The "blind" man who gave advice to the group.

Eating with the group and a 'Russian' Accomplice actor / comedian.

The group testing out the HP Spectre at the end of the hunt.

About the HP ENVY 14 Ultrabook

• It has scratch-resistant glass on three surfaces for a stunning look
• Beautiful 14” inch high definition display and up to 9 hours of battery life
• Beats Audio sound technology, designed by HP with Dr. Dre and Jimmy Iovine, and an analog dial to adjust audio levels
• Backlit keyboard for those late nights

You can read more about the HP ENVY 14 Spectre here or a review here.

Win a HP ENVY 14 of your own. (Now Closed)

I’d love to get some feedback on my blog and how it is currently running, so to enter, simply let me know what things you think could be improved on my blog. Let me know what you like, don’t like and what you would like to see (or not see) on the blog. Simply leave your comment below, that’s it!

• Only USA residents can enter
• Only one entry per person
• The winner will be drawn from the best ten answers
• The winner will need to fill out a a W-9 tax form
• The winner will be emailed directly and announced on this post on May 20th

The Winner!

Congratulations to Stan Banks of Delaware, the winner of the HP Envy. Thank you everyone else for your entries, and may the odds ever be in your favour.

Legal Disclaimer:
Prizes and promotional support was provided by HP. I was not compensated for this post in any way. Good luck!

Every design project is different. When it comes to making a final decision on which commercial printing process to choose, designers must take into consideration the quality and volume they desire and their budget and timescale.

The two main forms of commercial printing are digital and traditional offset printing, both of which have their pros and cons. Before you make your final decision, weigh up their pros and cons against what you want from your print job and make an informed decision.

The Pros and Cons of Digital Printing

PROS

Digital printing is incredibly fast, making it ideal for projects with a tight deadline. Traditional offset printing has a much slower turnaround due to the set up, so consider your deadline carefully when choosing which type of commercial printing to opt for. If the deadline is short and you’re running out of time, digital printing could be your best choice.

Budgetary concerns are extremely important when choosing how to print your project. If you have a low volume print job, digital printing is far more cost effective than traditional offset printing.

One of the key advantages of digital printing is the accuracy of the proofing it allows. Extremely detailed samples can be made of your print job quickly and cost effectively, enabling you to hold a sample in your hands which will be exactly recreated in the final print run.

Another great strength of digital printing is how easily a design project’s text, images and colours can be customised during the print process without significantly slowing it down. If you need to customise different parts of the print run, for diverse marketing campaigns for example, Variable Data Printing presses are by far the best option in terms of speed and affordability.

CONS

What are the cons of digital printing? Well, despite digital printers constantly improving, they still can’t quite match the colour quality and sheer flexibility of traditional offset printers, which offer a wider range of paper, ink and finish options and use the Pantone Matching System and inks to deliver unparalleled colour accuracy. Digital printers use a four colour printing process utilising a colour matching process to simulate colours, which cannot compete with traditional offset printers.

Another weakness is that digital printer inks aren’t fully absorbed into the print paper, which means cracks can appear in the colour near edges which are folded in the finished publication. This isn’t a problem in traditional offset printing.

It’s also important to remember that traditional offset printing can be more cost effective than digital printing for higher volume print runs as the individual unit price comes down.

The Pros and Cons of Traditional Offset Printing

PROS

The pros of traditional offset printing are clear. It remains the best quality type of printing available for graphic designers, particularly when image quality is concerned. Technology has developed so that the computer-to-plate system delivers superlative accuracy and quality.

As previously mentioned, traditional offset printing enables more choice when it comes to print materials. Many graphic design projects demand unusual paper types and sizes, specialised inks and finishes. If this is the case with your project you should use a traditional offset printer. Special effects like spot varnishes are far better quality when done through traditional offset printing.

The combination of the Pantone Matching System and the Pantone inks makes traditional offset printers the best choice when complete control is needed and colour accuracy is paramount. The four colour process used for digital printing simply cannot compete with traditional offset printers, so if colour counts opt for traditional offset printing.

If your graphic design project is high volume, traditional offset printing is not only more cost effective but can be quicker. Much of the costs and time involved with traditional offset printing relate to the preparation and press set up. However, if you have a high volume print job the unit costs are drastically reduced, because once the set up is complete the extra units are relatively cheap to print.

CONS

What are the cons of traditional offset printing? It is far more difficult to personalise and customise print jobs during the print run as the printer set up has to be adjusted. This  can be rather time consuming, particularly when compared to digital printing, which is perhaps the best option for print jobs requiring a lot of customisation within a short time frame.

Traditional printing is also slower and more costly for lower volume print jobs than digital printing. This is because of the time it takes to set a traditional printer up for a job, which raises the individual unit prices for shorter print runs. Digital printers remain the best choice for quick and low cost short run print jobs.

Summary

Your choice of commercial printing process will depend on your quality and volume demands, budget and time schedule. Carefully list what you require before following the above guidelines and making your final decision. Remember, commercial printers are there to help, so always contact them for further advice on your project.

What’s your preference? How do you usually decide on which printing method you use?

Photos by Shutterstock & Inkjet Catridges.

This article is a product of getting into Pinterest and clients coming forward saying, “What is Pinterest?”. In fact, there is a lot to learn from Pinterest and it is worthy of analysis which I will get to below. According to ExperianHitwise, Pinterest is now the #3 social media site behind Facebook and Twitter. It is also the #16th most visited site in the USA, so it is not something you should ignore.

Let’s have a look at what Pinterest is, why it’s different, who uses it, what makes for the most popular pins and how to optimise websites for the best Pinterest exposure.

What is Pinterest?

“Pinterest is a pinboard-style social photo sharing website that allows users to create and manage theme-based image collections such as events, interests, hobbies and more. Users can browse other pinboards for inspiration, ‘re-pin’ images to their own collections and or ‘like’ photos. Pinterest’s mission is to “connect everyone in the world through the ‘things’ they find interesting” via a global platform of inspiration and idea sharing.”

Why is Pinterest different?

Pinterest is an excellent site for inspiration and ideas and it is also a very cool community filled with artistic souls. ‘So what?’ you might be thinking, I already belong to ten of those and I don’t have time to read all the blogs and articles as it is… so here are four reasons why Pinterest is different:

• Pinterest uses a new type of social interface to drive traffic and it is linked to Facebook and Twitter.
• Pinterest appeals to both the general public and to the art & design crowd
• Pinterest is an excellent marketing tool
• Pinterest is the first of similar sites and it signals a shift in Internet marketing, viewing and usage.

Pinterest challenges most social media and current computer trends. It’s fast, beautiful, visual and easy to use. Just as so many sites are opting for utility over beauty, Pinterest invites users to think visually and appreciate beautiful things every time they enter the site. Most importantly, it saves you time especially when researching.

Who uses Pinterest & why?

The social king pings of the moment, Facebook, LinkedIn and Google+, take copious amounts of time to interact with. Twitter, at least got the speed part of the equation right. Time intensive social media such as those mentioned above, is fine for college kids or even unemployed professionals, but neither group is exactly the demographic most businesses are targeting. According to Alexa, Pinterest users are predominantly female between the ages of 25-34.

Facebook in particular has an interface that is purposely constructed like a series of rat holes to keep viewers on the site as long as possible. This is a carefully chosen strategy to increase the ratings of Facebook in the SERPS. However, it isn’t user friendly and one of the top reasons people leave Facebook or refuse to join, is: Facebook takes too much time.

In contrast, Pinterest is easy to learn and quick to use. The visual interface is stimulating to the brain and it invokes almost an addictive response in users. This is appealing to both the art crowd and to general users. Males, although they do not currently make up a large section of Pinterest viewers, could in the future due to the male affinity for visual stimulation. In addition, from a conversion perspective a buyer interested in shopping for anything, can quickly assemble a Pinterest shopping list on the site and come back to it for comparison-shopping when ready to buy.

On a side note, there is now an app that turns Facebook into a Pinterest-like board.

A look at how to use Pinterest

A quick search & compilation of ‘dining room chairs’ took exactly 6 minutes to create.

This included creating the board, searching, and selecting products from Pinterest and Google search. This is a busy buyer’s dream. The introduction of this type of fast, visually based shopping platform could spark a small ‘revolution’ in how websites are designed and constructed; especially for large online retailers.

Designing with Pinterest in Mind

Pinterest pulls photos from a website and then provides a link back to the source. The use and reuse of these photos as they are repinned may not be in accordance with the photo usage agreements that were established with the photographer or photographic copyright holder. But legally, the responsibility of pinning and copywrite infringement exists with the pinner, not the site owner or Pinterest.

However, in reality the photographers will come after the site owner rather than Joe Pinner for compensation related to copyright infringement. Large clients need to clarify the ownership rights and contracts with their photographers in the event that they start to see an up tick in profits from Pinterest photo pinning and re-pinning. There are also ways to block images from being used as pins.

Clear, beautiful engaging photos are the backbone of Pinterest… but what makes for a good pin?

What makes for a popular ‘pin’?

Clients looking for pins by the community should have several excellent photos available for pinning on every page of their site, keeping in mind that great photos, logos, infographics and memes are the most popular pins. Pinterest’s own search engine includes a “popular search” and a quick examination of the most popular pins reveals the following:

Sample: 500 Most Popular Pinterest Pins by Type

• Photos: 317 total pins; includes most categories.
• Meme / infographics: 129 total pins; includes anything that has text/and or visuals in the pin.
• Practical: 36 total pins; are how to posts, excludes food.
• Ads: 10 total pins; professional marketing ads or brand logos as pins.
• Celebrity: 7 total pins; excludes celebrities used in memes.
• Video: 1 total pin.

Sample: 500 Most Popular Pinterest Pins by Category

• Black and white photos that didn’t fit into another category: 14 pins
• Color photos that didn’t fit into another category: 47 pins
• Memes / infographics that didn’t fit perfectly into another category: 97 pins
• Food and Drink: 64 pins
• Home design: 47 pins
• Nails and Hair: 31 pins
• Fashion / jewelry / clothes: 30 pins
• Love / Wedding: 35 pins
• Crafts: 34 pins
• Garden: 22 pins
• Practical: 15 pins
• Pets: 19 pins
• Children/baby: 11 pins
• Ads: 10 pins
• Celebrity: 7 pins
• Tattoo: 6 pins
• Health and sports: 7 pins
• Car: 3 pins
• Tech: 1 pin

The data above is only a single sample. Furthermore, it is seasonally influenced by seasons, such as Spring when weddings and prom are popular topics. Similar samples would need to be collected over time to establish valuable data but even one sampling is revealing. For example, health and fitness is surprisingly absent in this particular sampling.

Tips & Pin Optimisation

Pins that generate comments and are physically longer, dominate the Pinterest site. The five-column format naturally favors vertical orientation of both photos and memes. The majority of both in the most popular section are vertically oriented. Comments and lengthy text increase the page space accompanied by any pin making it more likely to be repined and shared by other viewers. Consequently, adopting and using vertical formats into web designs, where pinning is desired, makes sense.

Even though ads make up only a small percentage of the most popular pins, many were presented as logos. For example, Trader Joes’s logo is one of the most popular pins on the site. Each time the logo is pinned it is an endorsement not only for the store but also for the designer of the logo – if it is credited by the pinner.

Also check out these 40 interest Pinterest boards for designers.

Over To You

I’d love to know if you are using Pinterest and what value you get from it? How have you optimised your site for Pinterest, if anything? Got any other Pinterest tips to share?

I’ve been using Adobe Photoshop on a near daily basis, since 2006 and over this time I’ve learned quite a number of tips & tricks. I’ve optimized Photoshop for performance, learned all the essential shortcut keys and tools, and have recently found out what I consider the ‘ultimate web design workspace’.

What is a workspace?

“By saving the current size and position of panels as a named workspace, you can restore that workspace even if you move or close a panel. The names of saved workspaces appear in the workspace switcher in the Application bar of Photoshop.”

For more information on workspaces, see here.

The Ultimate Web Design Workspace

In this post, I outline how I have personally set up my web design workspace and why I have found it to be the most productive layout for producing web work since I’ve started using Photoshop. Take note that I am using a 27″ monitor at 2560×1440 resolution though this layout should work on monitors 17″ and up.

You can download the workspace here. Instructions for installation can be found in the link above.

1. Document Set-Up

This is where the magic happens, the blank canvas. I usually start with the 960 GS and set the width at 1400 pixels. The main Photoshop tools are still on the left (by default) with the canvas in the middle and the other windows on the right of the screen.

2. Layer Comps

If you’re not using Layer Comps already and you’re working as a designer, you’re mind is about to be blown. This isn’t the place to give a tutorial on them but having them in your workflow is pretty much essential, as it saves hours of time. Layer Comps are also very handy for putting together a presentations via the ‘Export Layer Comps’ script.

3. History & Snapshots

The History window allows you to go back in time based on every change you make. I usually have my history settings set at the default of 20, but often take ‘Snapshots‘ so I can easily come back to previous states with a simple click. Take note that snapshots do not save with the PSD.

4. FontShop & Extensis Web Font Plugins

FontShop & Extensis allow you to view and use web fonts right within Photoshop. I only click this icon when needed as it often can slow PS down. Also, take note for Extensis you will need the Suitcase Fusion font management software, which is available for 30 day trial.

5. Folders & Layers

A large Layers window allows for easy scanning and organisation which boosts productivity while designing. I break down each ‘page’ down into 4 general folders; Header, Content, Footer & Background.

I also have ‘Auto Select’ set as ‘Layer’ and the ‘Show Transform Controls’ checked on. See the very top left toolbar in the screenshot to toggle these to your liking.

6. Swatch Palette

The Swatch palette ensures that the colors you use are consistent through the document. Simply add colors to the Swatches palette and then when needed, highlight your text or layer and change the color.

7. Styles Window

Similar to the Swatch window, the Styles window allows you to easily change colors and add effects to elements throughout your document. Handy for buttons, forms, rectangles, navigation, etc.

8. Character

The Character window allows you to easily change the most common text settings on the fly such as the font, size, leading, tracking and color. Pretty much essential for web layout.

9. Paths / Channels

I break up the Character and Paragraph windows with Paths & Channels as a personal preference so the type tools don’t seem so cluttered. The Paths window allows you to easily create paths, shapes & selections and Channels is mainly used for photo editing.

10. Paragraph

The Paragraph window controls the justification of text, as well as margins, spacing, hyphenation (set this as off by default) and roman hanging punctuation.

So there you have it, the ultimate Photoshop web design workspace. What do you think? Do you have any Photoshop workspaces to share? Please do!

More Photoshop Tips & Tricks:

• Tips For Working with Photoshop & Dreamweaver
• Tips For Working with Photoshop & Illustrator
• Tips For Working with Photoshop & InDesign
• Speed up Photoshop Projects using Adobe CS Review

With my recent rebrand and website update, came a few nifty features and one of them is the ‘hidden’ drop down menu in the top right corner of the website.

On each reload, there is a new slogan that is displayed, such as:

• JUST™ Amazing
• JUST™ Be Happy
• JUST™ Did It
• JUST™ Drop That Bass
• JUST™ Believe

There are already a good handful being rotated up there, but I thought it would be great to have JUST™ Creative readers be able to have their own one up there. So be creative, and leave your “JUST™ ____” idea in the comments below, and you could win some awesome gear as outlined below. Please keep submissions between 1 and 5 words and enter as many times as you would like!

Win Free Design Swag! (Competition Now Closed)

Patrick King, of the awesome Typography Shop has put up some cool graphic design & typography related prizes such as the ‘Make The Logo Smaller‘ t-shirt & mug featured above. I’ll be selecting the best 3 submissions and winners can choose any in-stock t-shirt or mug from the shop.

The competition is open to all countries, but mugs can not be shipped out of the USA. Winners will be emailed & also announced on this post, on April 17. Winners announced below.

Good luck and I look forward to your entries!

Congratulations Winners!

After looking through every entry, I narrowed down the list to 200 that I will be using on the site, however these you will have to see over time. Below you can find the winners and the close runners up. Congratulations, I will be in contact with you shortly.

Winners

• JUST™ Leave Your Mark (Miguel)
• JUST™ A Spoon Full of Sugar (Michelle Stevens)
• JUST™ Put Another Shrimp on the Barbie (Rosleigh)

Runners Up

• JUST™ The Tip of the Iceberg (Meg)
• JUST™ Ignore IE (Andrew Grehl)
• JUST™ Us (Danny)
• JUST™ Make It Pop (Minksy)

Thank you everyone for your entries, they were really creative!

This is a guest article contributed by Vail Joy.

As Opera evangelist Bruce Lawson puts it, “Everyone’s talking about HTML5”. It’s perhaps the most hyped technology since people started putting rounded corners & gradients on everything. In fact, a lot of what people call HTML5 is actually just old-fashioned DHTML or AJAX. Mixed in with all the information is a lot of misinformation.

HTML5 is simply a new set of standards, semantics and rules for coding website markup that can take advantage of several new “native” browser features such as offline storage, multi-media playback and a small level of interaction. Much of what we see on HTML5 websites that is really cool or innovative isn’t the actual markup, but a combination of CSS3 and jQuery, both themselves new and exciting standards evolving right alongside HTML5.

As designers, we tend not to fuss about with code and semantics and JavaScript this or that, but whether your expertise is in identity and print design or includes a little of web design, expanding your comfort zone to include the fundamentals of these new technologies is necessary to stay competitive and sharp in our crowded industry.

For now, let’s dispel some myths about HTML5 to pique your interest. There are several HTML5 resources at the bottom for those of you who want to learn more.

Myth #1: HTML5 was invented because Apple stopped supporting Flash .

Apple seems to get blamed for everything, but while HTML5 has some amazing solutions for mobile, it was not created to meet the demands of the iPhone.  In fact, Opera and Mozilla got together back in 2004 to try to solve the problem of a messy web, defining seven principles for good design. Their goal was simple – propose these principles to W3C as a roadmap for a sleeker, faster, better HTML standard. The principles covered aspects such as backwards compatibility, error handling, practicality, open development and avoiding device-specific profiling. It wasn’t until 2006 that the proposal was accepted, and in three short years a new spec was drafted, closed and made ready for use.

Myth #2: HTML5 won’t be ready till 2022.

I’m not even sure how this myth began circulating, but the working draft was closed – meaning nothing more can be added or significantly changed – in 2009. Because it has been driven by Opera and Mozilla from the start, it may even reach W3C’s Candidate Recognition this year, as almost the entire spec is supported by both browsers. Even still, you can use HTML5 right now and rest assured it will degrade gracefully and work in older browsers with the inclusion of some lightweight JavaScript, all the way down to complex Canvas implementations. All current browsers support HTML5. What you need to be careful of isn’t the markup, it is the CSS. Even with pre-made CSS resets intended to help out older browsers, design built around CSS3 can fall apart in older browsers unless you take care of the details.

Myth #3:  HTML5 requires CSS3.

It makes the most sense to use semantic class names and CSS3 declarations when building something with HTML5, but it isn’t a requirement. HTML5 is just markup, so it gets along just fine with CSS2 styling, but what it does require is complete styling for all presentational elements of your design. In other words, the HTML5 spec removes attributes and tags that control the look or style of any element, and is no longer tolerant of inline styling. The browser is now the supreme governor of how your site is rendered and what rules you need to abide by when creating layout with your markup. For example, in HTML5 you need a “display:block” declaration for each HTML5 element for them to be understood properly in IE8 and earlier. In short, HTML5 needs styling to look good, but it doesn’t necessarily have to be CSS3.

Myth #4: HTML5 ruins accessibility.

On the contrary, HTML5 is built around accessibility. While drafting the spec, utmost care was taken to ensure each element works with WIA ARIA landmark roles.  These roles are specialized attributes added to your tags that allow accessibility devices such as screen readers to better interpret the site’s flow and content better. Converting a site to HTML5 may ruin the accessibility if these roles aren’t understood and implemented properly, but that won’t be the fault of the markup! See font accessibility.

Myth #5: HTML5 will kill Flash.

The fact is that Flash is still used by several million websites and developers world-wide. The misconception was born, once again, from the high profile fallout between Adobe and Apple and the rapid adoption of HTML5 audio and video for application and mobile development as a result. However, though HTML5 is great for low volume video playback, full HTML5 support requires two or three times the encoding chores of Flash support and still lacks many critical features currently available in plug-in based technologies. Currently, sites like Vimeo and YouTube use HTML5 technology largely for technology’s sake, and will not be moving away from Flash too rapidly. Developer Viki Hoo points out several other reasons why Flash will be around awhile in her compelling argument here.

But let’s get back to Flash with regards to web design. In that context, we are likely to see a rapid switch from Flash to HTML5 in the coming years. HTML5 is easier to learn and use, even for those of use without a high level of JavaScript mastery. It doesn’t require a 3rd Party plugin to work, loads faster and is extremely mobile friendly. So it isn’t that HTML5 will kill Flash, it’s that it will dominate the mobile design and development market.

Myth #6: If I add the new HTML5 doctype to my site, it is now HTML5.

It will be HTML5 as far as the browser is concerned, but HTML5 is more than a doctype. It is a full set of best practices, semantics and layout elements such as <header>, <nav>,<section>,<article> and <footer> that will make your website truly take advantage of the new capabilities of the browser and validate as HTML5. Naturally, adopting the new doctype is a step in the right direction to adopt HTML5, but it is important to learn what really makes an HTML5 website HTML5 before buying into an app, theme or platform that claims it is built with HTML5. Adobe’s new Muse app is a perfect example of this myth in action. You must also take into consideration the number of elements and attributes that have been depreciated in HTML5 and review your existing markup to ensure the best chance of compatibility.

Myth # 7: I’ll get more chicks/jobs/cash/respect if I use HTML5.

Mastering HTML5 probably won’t get you voted the sexiest man or woman alive; although it seems to have worked for Bruce Lawson. It is also not enough to get your foot in the door at a lucrative digital agency. In the end, your design skills and attention to detail are what will make you successful. With that said, learning about and adopting new technologies quickly does take passion and perseverance, which are both admirable traits. Your peers will probably respect you more if you use your knowledge to help them, or can achieve something new and great.

For those who want to get their feet wet with HTML5 but don’t have much coding chops, you may like to check out Wix, who recently launched “the first full-featured HTML5 website builder” on the web. It’s basically a tool that helps you create completely custom websites without mucking about with styles, scripts and markup – unless you want to.

Recommended HTML5 Resources:

• HTML5 Spec at WHATWG
• Opera’s Bruce Lawson on HTML5
• Why designers should care about HTML5
• Everything You Need to Know About HTML5 Audio and Video
• HTML5 Canvas: The Basics (Opera Developer Community)
• HTML5 Please helps you out with recommendations for polyfills and implementation so you can decide if and how to put each of these features to use.
• Can I Use provides extensive browser compatibility and support information for CSS3, HTML5 and more.

Do you have any HTML5 tips or resources to share?

+Vail Joy is a professional writer, designer and developer with a vibrant background in music business, photography and social media. When she is not contributing her expertise to blogs and e-zines, she is building HTML websites and slaying dragons for Obox Design.

After a soft launch on Twitter, Facebook and Google+ yesterday, I am now ready to share with you the new JUST™ Creative responsive web site.

Feel free to explore and let me know your thoughts. Below is a quick outline of some of the features found throughout the site.

Website Info & Features

• Built using WordPress and the Skeleton Boilerplate
• Web fonts (Proxima Nova and Droid Serif) served by Typekit
• Hosting by Media Temple
• Responsive design with 5 viewport sizes (resize your browser to see this in action). Features Retina Display optimised images.
• Custom designed by myself in Photoshop & Illustrator, using the 960 Grid System
• Developed by Dan Rose with HTML5 and CSS3 (Hoodie Framework). Portfolio functionality from Reaction (Brandon Jones), developed in part by Craig Waterman.
• Filterable gallery portfolio with multiple layouts (see icons on right of portfolio page)
• Logo rollover over effects on main navigation
• Dynamic drop down photo which reveals my bio (in sidebar on article pages)
• Dynamic ‘To Top’ button to easily get to the top of the page, displayed when needed
• jQuery vertical accordion menu for the mobile drop down menu navigation
• jQuery / CSS article sidebar for easy navigating
• jQuery transition slide effects
• Responsive ads so they are displayed on all view ports
• Hidden pull down menu to view recent work and more (Find it?)
• Threaded comments on new posts
• Highlighted author comments
• Hidden track backs / backlinks that you can reveal
• Google Custom Site Search for accurate and quick searching
• prettyPhoto integration for showing photos in a Lightbox
• Large footer that can you can hide or show depending on your preference

Still To Do

• Add a dynamic slider on the home page (will also work with touch gestures)
• Add more portfolio items
• Fix speed problems across the server. (Having troubles with this, as I believe it is related to memory / apache – something I am not well versed in).
• Fix bugs as they are found

Bugs / Suggestions / Feedback

If you find anything that looks out of place, or have a suggestion please do let me know. Please note your browser and it’s version when sending, thank you!

A few words from Wes McDowell about a recent Podcast I did with Deep End Design…

–

Last week I had the pleasure of being able to sit down with Just Creative’s Jacob Cass and talk logo design. Sure, we happen to be on opposite ends of the country, but through the magic of Skype, we made it work.

I am a co-host of “The Deeply Graphic DesignCast,” a podcast for graphic & web designers, and the idea of talking shop with Jacob was just too good to pass up. So I asked if he would like to join us for our next episode, and he graciously agreed. The result is a pretty compelling listen.

Jacob’s episode, which is all about the logo design process is now live and available for free download on iTunes. He gives a lot of great insights into his process, as well as client relations and how he prices his jobs. If you are a fan of Jacob’s work, then you won’t want to miss it!

Listen To It Here.

This is a guest article contributed by Brad Shorr.

–

Smart marketers squeeze every possible benefit out of their digital content. But even top-notch companies overlook opportunities to repurpose Twitter content, which is unfortunate because Twitter is generally regarded as a somewhat frivolous medium. It doesn’t have to be, if you think outside the box. So for the purposes of this post, let’s think outside the tweet and take a quick look at five ways to get a lot more value out those 140 little characters.

1. Use Tweets As Testimonials

From time to time, people may give you unsolicited praise on Twitter. If you monitor your brand, you can catch these tweets and “favorite” them so they will be handy whenever and wherever you need credibility-building testimonials. @justcreative is a good example of someone who uses this favoriting method. Among the many places to display testimonial tweets:

• Website home page
• Interior site pages connected to the tweet’s content
• PDF literature
• A custom Facebook tab
• Email signatures

You’re only limited by your imagination — and since this blog’s community includes a lot of designers, my guess is you’ll come up with better ideas than these in a matter of minutes. See some of your favorite favorited tweets here.

Finally, if you don’t have unsolicited Twitter praise — solicit some! There’s nothing wrong with asking your Twitter community for feedback, help, or an occasional plug. I’m sure you’d be quick to do it for others if you liked them and believed in what they do.

2. Put Tweets In Presentations / Sales Material

As part of their content strategy, most companies tweet about the benefits of their products and services. They may also post astute comments on important industry developments and issues. If you favorite these tweets and organize them, you can later display them in Keynotes/PowerPoints, webinars, PDF literature, and on relevant site pages. The advantages of displaying this information in the form of tweet images:

• Tweets are visually engaging and spark interest.
• Displaying tweets is still a bit of a novelty, which makes your presentation stand out.
• Tweets provide a subtle element of credibility, since many will regard them as published and therefore authoritative data points.

A big benefit of doing this, by the way, is that it will improve the quality of your tweets. We tend to be more thoughtful about what we say if we know it may be used “in print” later on.

3. Use Tweets for Internal Knowledge Building

If a expert I’m following on Twitter says something insightful on say, SEO, I’ll shoot a link to that tweet over to our Director of SEO. This sort of thing can help keep everyone on the team being — and feeling — up to date and in the know. Sharing knowledge via tweets can be accomplished in a more organized fashion, by favoriting tweets by topic and emailing a digest of the links to the appropriate person. This technique works very well when a lot of team members are not on Twitter very much or at all. Because of that, circulating a digest of your own tweets also can be helpful; your team as well as your Twitter community should see your own great Twitter content.

This is how I try to communicate information from Twitter. These are a couple tweets about social media I grabbed that are tremendously useful:

• What Others Like and Dislike about Your Tweets
• Women Value Reciprocity More than Men

Sure, I could just as easily link to the articles rather than the tweets, but I think it helps for people to see the source and sometimes, the commentary.

4. Feed Tweets Into Your Website

You may have seen business sites that display a real-time feed of five or 10 of their tweets, usually done via a widget. This is a great idea in terms of sparking interest, as we’ve already talked about. However, if you want to do this, be careful about what you tweet. For example, if your live feed displays a lot of random, silly tweets, it could confuse visitors and turn off potential customers.

What some people do to get around this is create a separate Twitter page that is exclusively for tweeting information around a particular product or service or department. For instance, a company could feed its customer service Twitter page tweets into its site’s customer service landing page. I like this idea a lot in terms of content relevance, but managing multiple Twitter accounts does have its complexities, so proceed carefully. Another possible way would be to use #hastags, but this could backfire too.

5. Feed Tweets Selectively Into Other Social Networks

I’ve written elsewhere about the dangers of overfeeding your social media accounts. However, selective and strategic feeds can relieve some of the content-production burden and strengthen your reputation across all of your social platforms.

The “secret” of smart feeding is understanding the nature of your communities on LinkedIn, Facebook, Google+, and whatever other networks you are active on. For example, I know a couple of things about my LinkedIn connections; first, a lot of them are not social media-savvy, and second, they are interested in high-level information. Knowing this, any tweets I feed to LinkedIn will be non-technical and relevant to business owners, leaders and managers. On the other hand, our agency’s Facebook page draws a lot of people who are interested in “how-to” marketing tips, so any tweets I feed to it will be on the technical side.

Probably the biggest takeaway from all of this is to be a strategic tweeter. There are many ways to repurpose Twitter content, but you won’t be able to take advantage of them if all you’re doing is haphazardly dashing off tweets.

More Twitter related articles:

• Ultimate Twitter Guide
• Twitter Interview & Tips with Jacob Cass
• 10 Twitter Design Lists to Follow
• The Power of Simple Engagement on Twitter
• List of Designers, Creatives & Geeks on Twitter

How do you re-purpose your Tweets?

–
Brad Shorr is Director of Content and Social Media for Straight North, a leading Chicago SEO firm working with clients in very tough B2B niches such as credit card payment gateways. He has been an active blogger and social media participant since 2005, and writes frequently on content strategy, SEO copywriting and social media topics. Photos by: Shutterstock and Gallivant.

In the next few weeks (The site is now live!) I will be launching my brand new responsive website, along with a new domain, business name, profile picture, brand and logo.

My old business name ‘Just Creative Design’ will be replaced by ‘JUST CREATIVE’ and the domain name will also change to http://justcreative.com which I bought off a domain squatter a few months back.

In fact, you are already on the new domain name!

Erasing The Pencil

It is sad to announce that I will be dropping my award winning & often plagiarised JCD pencil logo. (Did you ever see the J,C,D or pencil in the logo?) It’s a real shame to leave it behind, but it’s time to move on to brighter pastures.

I felt I needed a new look, one that was more more modern, professional, clean, streamlined and with personality. With this said, today I wanted to give a sneak peak into the new brand look coming for JUST CREATIVE.

JUST™ Created

You can see the new logo above, and below in context on my new ‘Luxe’ business cards, courtesy of Moo (10% off link). You will also notice my new email address which is jacob[AT]justcreative[DOT]com.

Below is an earlier teaser poster based on the new look and the familiar Keep Calm poster series. You can download the A3 sized poster for free here if interested.

More surprises to come with the website launch so stay tuned. Feedback always welcome!

I often share my new work via Twitter but often forget to share on my blog so I thought I’d share some of my recently launched website designs. Each site has been developed by Ammirati unless otherwise noted. You can click on the images below to view each live site.

Ammirati

This is the website of the agency I work at in New York and I was responsible for comping out the mobile views. Check out the site and while your there, re-size your browser. Great team effort from the guys at Ammirati; a hat tip goes out to David Roach, Patrick Drury & John Vitelli for bringing the responsiveness to life.

Next month I’ll be launching a responsive version of my site, with a brand new look so stay tuned for that.

FXDD Masters Live

FXDD Masters Live is a conference held in different locations around the USA, teaching others about foreign currency exchange.

Flywheel

I posted about this last month, but here it is again… Flywheel; The ultimate stadium cycling experience. Development done by Flywheel.

Streetfighter

This is the website for the game ‘Streetfighter x Tekken’ where users can pre-order the game for the PS3 or XBox. I was involved with the pre-order & gem grid pages only.

Upcoming Work

I’ve had the pleasure of working with some great people & brands (Jerry Seinfeld, Vitamin Water, OMEGA, Sweet’N Low to name a few) over the past 7 months at Ammirati and I look forward to sharing those projects once launched. Some soon, some quite far off.

Comments are always welcome.

Scope Creep. No it’s not that guy that’s been sitting in the corner of the cafe staring at you. In fact, if you don’t know how to deal with scope creep, it could be much worse.

Scope creep, put simply, refers to uncontrolled changes in a client’s project scope. For example, a typical scenario could be when you’ve finished your design project to the original specifications and then the client emails you with a dozen different new changes and ideas. That is scope creep. The scope of the project may get bigger, but the budget may not.

The problem is that clients may not know what they want the finished product to look like until the design project is nearly over, so they make last minute changes and then you’re loaded with an extra day’s work, but not an extra day’s pay.

If you didn’t prepare for this with a contract up front, and the client is constantly changing their specifications, politely warn them that you limit your revisions to a certain number, so they are aware that whilst you are willing to be flexible, any additional changes will meet an additional charge. After all, you may have to work on multiple projects at one time and more time spent on one project cuts in to the time you will spend on another.

So how can you deal with scope creep in the future?

Make a contract. Before starting any project you should always sign a contract with the client, where you lay out your terms. It doesn’t need to be too long or detailed but you do need to outline your working conditions. This should include limits within the project scope and anything outside that will be subject to extra charges.

You could sign a completion document with the client, which states that the project is complete and that any further work will be charged at an hourly rate. Although hourly rates are not always the best, scope creep at an hourly rate could benefit both you and your customer in terms of over all time and money spent.

Four other ways to kill scope creep are to say:

1. Glad to help, here’s a new estimate.
2. I can’t make that deadline.
3. I can, but…
4. No.

How do you deal with scope creep?

–

Angel photo & graphic design freelancers from Shutterstock.

This is a guest article contributed by Rebecca*.

–

Delicious is a popular social bookmarking site which you can use for saving your favorite website links. The process is termed as bookmarking. This will enable you to share your bookmarks among others as well as allow you to browse bookmarks of other users’. Tagging and search tools help you in browsing as well as organizing topics of interest. It enables you to both create multiple tags and tag sites with manifold keywords.

Every tag produces a page with all website links associated to it. You can share each of these pages with others simply by providing them the URL, such as Jacob’s bookmarks here. With bookmarks being hosted on Web instead of on your desktop, you can access these anywhere provided you have access to internet. There are a couple of reasons for using delicious. Here is a list of few creative ways for using delicious bookmarks.

1. Organize Things You Want To Do

Your list may be endless like places you desire to visit, restaurants to try, ideas for several projects you desire to complete or begin books you wish to read and things you desire to accomplish. Sorting out your list at one place will help you to accomplish your goals. The social bookmarking site makes it easy to access your lists wherever and whenever you need them.

2. Bookmark Your Social Networking Profiles

Following the explosion of social networking sites, it is indeed simple for creating profiles on several that you often have the tendency of forgetting of returning and visiting them. As a result bookmarking each of your social networking sites at delicious will undoubtedly help you in keeping track of all the sites as well as easily sharing them provided you so desire. To add to it, registering your social networks at delicious will also offer SEO benefits as delicious operates as backlinks for all your profiles.

3. Organize Portfolios of Inspiration

You can use delicious for organizing art, articles and photographs on the web as well as create diverse categories for varied types of works. The bookmarking process to share inspiration among others is hassle free. Instead of sending people to numerous sites for viewing content, you can send them on one page, where every link is listed at one place.

4. Use RSS to Bookmark your Guest Articles

You can also use the delicious RSS feeds for creating customized portfolios. You can use it as your own writing portfolio by separating guest posts from that of article directory entries via exercising the feeds for your bookmarks tagged with articles and guest post.

5. Organize Your Backlinks

Delicious can be used for keeping track of backlinks for your website. In this social bookmarking site, you can tag the backlinks by type, topic or quality for keeping track of varied categories.

6. Bookmark Articles To Read Later

One of the most obvious reasons for using delicious is for organizing contents you encounter daily for future use. It is indeed a tough job for reading each great blog post which is shared with you via other social networks like Facebook and Twitter. The best solution is to bookmark these for later so each time you are searching for some information on a topic; you will have a wonderful and systematic compilation of most preferred pages and articles to choose from.

Delicious is an outstanding mean for archiving information from the internet, discovering useful and new sites and tracking hot topics. Its collective intelligence constantly adds & reviews, as well as filters new information. The community enables you in finding some of the finest resources on the internet devoid of having to struggle through all the junk. This social bookmarking site also offers you centralized management system to systematize information from the net.

Do you have any other creative ways to use bookmarks? What other bookmarking services do you use & recommend?

–

*

After a month of voting on the Top Logo Designs of 2011 the voting has now closed and I am pleased to announce the 2011 Logo Of The Year.

The 2011 Logo Of The Year

Fork & Knife Restaurant by Nick Sickelton.

The Runner Up

Bread & Breakfast is a coffee shop / bakery that serves breakfast all day and sells bread and baked goods. The aim was to create a logo that will combine the two elements of business (bakery and coffee shop) without creating an overload of visuals. The positive/negative design of the coffee cup and the bread image that is created by the coffee itself, along with the use of light blue and brown, create the desired combination that we set out to design.

Credits: Sigal Vilenski

3rd Place

Peru country branding.

Credits: FutureBrand Buenos Aires

Poll Results

Thank you everyone for your votes! Also, please feel free to suggest a logo for your chance to win a Logo Of The Day award, or maybe even Logo Of The Year.

Flywheel started with a simple idea… make indoor cycling epic.

To make that happen Flywheel partnered with Ammirati (the agency where I currently work) who re-imagined the Flywheel brand experience. A bold, new look enforced by striking photography & solid copywriting was implemented across all facets of the Flywheel brand, including the Flywheel website which I had the pleasure to work on.

Ammirati and I had to restructure, rewrite and redesign all pages of the Flywheel website, for both the front and logged in sections of the site. We’re happy to announce the site successfully launched on January 25th.

The aim of the redesign was to provide Flywheel riders with the best possible branded user experience, while reflecting Flywheel’s strategic goals. This involved strategically placing information and clear calls to action throughout the site, driving users to explore, buy and reserve their bikes for the ultimate stadium cycling experience.

An intuitive reservation and checkout system, preexisting & proprietary to Flywheel, was implemented with a vastly improved UX and UI, thus allowing users to quickly and easily get where they need to be… flying! To further improve the experience, Flywheel developed an innovative leaderboard for us to design out, thus allowing users to track and compare their performance statistics recorded at each class.

Overall, there were 45 custom designed pages, and a good handful that utilised base templates. A few of the pages are displayed below, but I recommend checking out the live Flywheel website in all its interactive glory.

As always, feedback is welcome!

The Results

Within 6 hours of launching on Wednesday, there were literally pages of positive responses. I’ve compiled some of my favourite responses from Flywheel members below.

“The new website is #droolworthy!”

from @mkhennelly

“Your new website is EPIC. The lifetime stats feature is incredible.”

via @Cheryl_Wayne

“Loveee the new website!! Made me want to sign up for even more classes!”

via @casemahoney

“Love the new @flywheelsports website. The weekly leaderboard is SICK. Great inspiration.”

via @chapsholic

“Nice! Love the colors and it’s so clean and informative without effort. As a fitness freak, the reserve section is beautiful.”

via @cashewstyle

“LOVE,  LOVE,  LOVE the new website!! So much easier to navigate, great features, nice pics. And Lifetime Stats – nice touch.”

via Facebook

So what are your thoughts? Feedback is very welcome! Thank you.

I was recently humbled and amazed at an email I received through my brand identity questionnaire and I just had to share the story, not only because it opened my eyes to something amazing, but something I would never have thought of and I’m sure not many others would have either.

To cut to the chase, the lady who was inquiring about my brand identity / design services was blind.

Although accessibility should be built into in all websites, I still find this fact extremely fascinating. I simply can’t fathom the process of trying to find the right designer without being able to see their work. Thankfully these days, there are text-to-speech programs for the visually impaired, that literally read aloud the words on the screen. There are also Braille displays.

Have you ever thought about how a blind person may go about hiring you? It just goes to show there is much more to the business of design than your portfolio.

Interestingly enough, the reason for her choosing to contact me as stated in my questionnaire, was that she could “hear the integrity of my work”, when her computer read aloud my articles. This to me is extremely humbling, especially considering the words are spoken with a robotic, computerized voice.

The lesson learned here is that blind people still need designers too! To put this into context, in the US alone there are over 17 million people with a visual impairment! Quite a niche I must say.

Have you had a similar experience with accessibility?

Photo credit: Shutterstock

This is a guest article contributed by Daniela Baker*.

–

The success or failure of a business depends on how wisely you allocate start-up funding. As a solo-preneur you can monitor every expense and decide where your money will best be spent to get your business off to a good start. Here are four suggestions for controlling start-up costs.

Be Flexible & Smart With How You Get Funds

The cost of borrowing, along with the terms attached to most loans, can make them quite prohibitive to the small business owners. However, there are several other options new business owners may consider when seeking inexpensive and flexible financing. One of the most common methods is to raise capital from family and friends as these loans often offer attractive terms with very low, if any, interest.

Geoff Morris, chair of the Entrepreneur’s Forum, is a strong proponent of this approach. Mr. Morris advocates the use of funds from family and friends since terms are favorable with low, if any interest.

Keep in mind that borrowing from family and friends could put a strain on these relationships if the business does not grow as you had anticipated. For this reason, it may be best to borrow smaller amount from a wider range of people than large amounts from just one or two.

Think About Your Office Space

As a designer or freelancer it is likely that you will be working out of a home-based office so this may not be a significant issue. Too many new business owners fall into the trap of spending too much money on the trappings of a luxury office. As per Mr. Morris, new business owners should use utilize extra space in their home, even the garage for as long as is feasible. Another possibility is to join a start-up incubator. An incubator is a great option for new entrepreneurs as these spaces typically provide access to a copier, scan, telephone and fax services. Not so incidental is that an incubator also permits you the opportunity to interact with other start-up business owners for support and camaraderie.

Consider Your Options for Computers / Equipment

As a modern designer, it is is more than likely you will need a computer / laptop with a consistent Internet connection, along with software. The next step is to identify the least expensive option for purchasing these products. One idea for new business owners is to rent and lease a laptop rather than purchase, since this gives you the flexibility to change models as your business grows. Because a computer is essential to your business as a designer, do not shortchange yourself in this one regard. Also, remember there is no magic button.

Use Low-Cost Marketing Strategies

There are several low-cost strategies small business owners may employ to keep marketing costs down, especially with social media. Create a page on Twitter, Facebook and LinkedIn and engage prospects with status updates that pose questions or ask for feedback. Engage with your network. Join discussion groups or start a blog to become recognized as a thought leader in the field. Email can be used to promote special offers. Write an article or series of articles and submit to article directories or as guest postings on the sites of colleagues.

Do you have any other tips to help keep start-up costs low?

–

*Daniela Baker is a small business blogger at CreditDonkey, where she helps startups compare small business credit cards to maximize rewards.  She says, to sum up the philosophy of start up costs: Spend small to grow big! Photos by Shutterstock.

This is a guest article contributed by Lior Levin.

–

You have probably been in a situation where you felt like a client was not willing to pay you enough or did not appreciate the quality of work you had put into a project. For freelancers & business owners, this is not something unusual.

Many people who hire you, especially if you are a freelancer, may undervalue your work or even insist that they pay you as little as possible for a ridiculous amount of work. Far too often, designers in that position cave into these outlandish demands and end up in an unbearable situation.

These types of clients are ‘low quality’ clients, and there is little you can do to change that. Instead of trying to convince low quality clients to set the bar higher, you should focus on attracting ‘higher quality’ clients. There is no magic formula that will attract them, and there is no absolute way to stave off all low quality clients from even contacting you. But you can orient your business or freelance services toward higher quality clients by increasing your self-confidence and following these tips.

1. Know Your Worth

This may be easier said than done, but you should know what your services are truly worth. Few people think their time is worth $5 an hour, but fewer still realise the true value of the work they produce.

If you appear desperate, as though you will starve if your client does not hire you, it will reflect in his or her perception of your worth. High quality clients want high quality designers, and they will make an extra effort to get someone they think will deliver something spectacular.

If you have the confidence to say, “I’m worth more than that. My work is worth this much,” high quality clients will take your word for it. If they do not, you need to be firm and insist on the price you can actually afford to deliver. Taking low-paying gigs too often may be a way to get noticed, but it will be the wrong type of attention – that of low quality clients.

This is not a license to be arrogant. You are not indispensable, but there is nothing wrong with making it seem like you and your business are. If your clients truly believe no one can do it like you can, they will pay top dollar.

2. Be Flexible but not Bendable

Some clients expect you to be on call for their every need, yet they are not willing to pay for the actual cost that such a service would require. Instead they pay the basic design fee but then are constantly emailing you, calling you, and even asking for you to add additional features and components.

It is OK to be flexible, but don’t get yourself in a knot. If you start a project and the client decides to change something, make it clear that a change is fine, but there may be additional costs for it. If you were painting someone’s house red and then halfway through that person decided he wanted brown instead, you would have to charge him extra for the paint you have already wasted and the work hours it took for the half-painted house. Your design work is no different.

Make sure your clients know exactly what they are getting from you up front. That will help avoid awkward moments and animosity over what they perceive as unfinished business. The best clients will trust your creative genius and allow you to freely take control. Others will attempt to micromanage every detail. In either case, make sure you dictate the flow of the development process and keep the client within your boundaries.

3. Offer Services Clients Really Want

Find out what types of options and features interest high quality clients. They have likely come up with some idea about what they want by looking at larger business websites or even at their competitors. Those sites likely have certain features that attracted them. Find out what those features are and make sure you highlight them in your advertising and sales promotion.

You may want to invest some time in market research to find out what the clients you want to attract need and what types of services attract them. In some cases, it may be that one feature you say you offer that makes them choose you over someone who may offer the same thing, but not mention it. This will work particularly well if you are able to provide samples of those features in action.

Find a Balance

It is important make sure you balance your ideals with your reality. Sometimes it is impossible to know that a seemingly high quality client will turn out to be horrible. But in most situations, you can usually tell from the beginning. For some situations there have to be compromises, but you should never leave a project feeling as though you worked for too little or were not able to do your best work because of client restrictions. Find a balance that works for you and stick to it.

Remember, the best designers are those who find good clients.

What methods have you used to attract higher quality clients?

–

*Article by Lior Levin who works for a psd to xhtml service company from Oregon and also advises as an online marketer to a to-do list tool company. Photos by Shutterstock.

For the first time in over fours years I have updated my profile picture, which you will notice on the left side bar of the website and across my social media profiles (Facebook, Twitter, Dribbble, etc.). Although it may seem like a small change, there is a lot of brand equity and recognition that is built up within a profile photo. A profile photo is what represents you across the web & offline, similar to how a logo represents a business or product.

The New Profile Photo

The new photo was taken on a cruise ship, using a Nikon D80 at 1/125, using a white back drop and two umbrellas. The photo has been converted to black and white and when used on social profiles, it will feature a transparent bottom left corner (see below), which will turn the profile into an ‘arrow’. You can see how the arrow works, when used on Tweetdeck below. This arrow feature will also be evident on the upcoming re-design of Just Creative Design.

Upcoming Re-brand & Website Re-design

Just like my profile picture, this website design has been around for over four years. I’ve been meaning to redesign it for a few years now, but never followed through, but I’ve since found some time. Within the next few months a custom redesign of Just Creative Design will launch, including two new responsive template pages and an updated portfolio. Below you can see a sneak preview of the design, and more on the Dribbble Project Page as time goes on.

A New Domain

In other news, I’ve acquired the domain http://justcreative.com so that may give a hint to the way the re-branding is going.

Would love to hear your feedback on the new profile picture and website.

These are the top 12 logo designs of 2011 as voted by you (the awards that won Logo Of The Month) on my other site Logo Of The Day.

What logo do you believe should win the 2011 Logo Of The Year? Cast your vote at the bottom of this post. Voting closes January 31st.

And just so you know, we are always accepting new logo submissions. Feel free to suggest a logo for a chance to win the Logo Of The Day award.

You can view the top logos of 2009 and 2010 here.

January: Bread & Breakfast

Bread & Breakfast is a coffee shop / bakery that serves breakfast all day (after all – it is the most important meal!), and sells bread and baked goods. The aim was to create a logo that will combine the two elements of business (bakery and coffee shop) without creating an overload of visuals. The positive/negative design of the coffee cup and the bread image that is created by the coffee itself, along with the use of light blue and brown, create the desired combination that we set out to design.

Credits: Sigal Vilenski

February: Fork & Knife

Fork & Knife Restaurant

Credits: Nick Sickelton

March: Peru

Peru.

Credits: FutureBrand Buenos Aires

April: The New Record

The New Record Co.

Credits: Redkroft

May: Edge Board

“Edgeboard are handmade chopping boards from the Northern Beaches in NSW that possess a special feature; an edge which you use to slide off the chopped food against. They use a natural anti-bacterial wood sourced form the Byron Shire.

“The identity is based on the board’s special feature, the edge, and the brand comes to life using the edge in any any application. A simple, structured logo is used in combination with textured and environmentally friendly stocks.” See in use.

Credits: Hampus Jageland when at Maud.

June: Fashion Law Institute

Fashion Law Institute is a new center at Fordham Law School in New York that will train and advise designers, lawyers and design students in areas of the law affecting the fashion industry.

Credits: Pentagram

July: Fine Cell Work

As surprising as it seems, thanks to the charity Fine Cell Work, hundreds of UK prison inmates fill their hours sewing cushions and quilts. They earn money, gain skills and create a real sense of community. The logo we created for Fine Cell Work came from the contrasting worlds of UK prison life and needlework.

Credits: The Partners

August: Radio

Mashradio

Credits: Voov

September: Lamp of Wine

It’s a logo for Polish blog about wine – lampkawina.com. In Polish, for glass of wine we use to say “lamp of wine”.

Credits: LUKS

October: Fast Eddies

Fast Eddies Barber

Credits: Richard Arthur Stewart

November: City Tech

CityTech IT Consultants, Chicago.

Credits: Unknown

December: Bright Carrot

Credits: Hatchmarks

Cast Your Vote:

I’m always fascinated to see where and how other people work and  I wanted to share my personal set up, focusing on the tools & resources I use every day as a designer. I recently posted part one on hardware I use as a designer and today I am featuring the software and apps I use on a daily basis.

Software

DESIGN / CODE

• Adobe Creative Suite 5 – Mainly Photoshop, Illustrator, Acrobat Pro & InDesign.
• TextMate – Text editor that I use for coding / writing.
• Linotype FontExplorer – Font management.
• CyberDuck - FTP Client.
• ColorSchemer Studio 2 – Great colour scheme creator & colour tool.

WEB / SOCIAL

• Tweetdeck - Desktop + mobile Twitter client.
• FireFox – My browser of choice. Plugins include Firebug, ScreenGrab & Web Developer Toolbar.
• Jing Pro – Easy sharing of screenshots & videos.
• iChat - Instant Messenger / Chat

MUSIC

• Spotify – My music player of choice. I subscribe to their Premium subscription so I can sync & listen to the music on my iPhone too. I use the iPhone Spotify Remote App to change songs from wherever I am.
• iTunes – For buying music.

BUSINESS / PRODUCTIVITY

• Skype – International phone calls and meetings.
• TextExpander – Saves me from re-writing commonly used phrases & emails. See how to use TextExpander to conquer email.
• Alfred – Launches my software & searches with speed. Super productive. I use the shortcut key Cmd+E.
• Microsoft Office – An evil necessity.
• Apple Time Machine – Backs up my files to external hard drives.

Web Apps

• Google Apps – Handles my email (10 reasons you should try out Gmail), docs & syncs my calendar with my computers and iPhone.
• Google TaskBar – I don’t use any fancy time management software, but rather use the ‘Tasks’ bar in Gmail. I use Harvest to track my hours.
• DropBox - In the cloud file sharing & storing.
• PayPal – Invoicing & advertising payments.
• Shutterstock – My preference in stock imagery.
• MediaTemple – Where I host my websites.
• Delicious – Where I save bookmarks everyday.

Have any other recommended software or apps or designers?

This is a guest article contributed by Alvina Lopez* looking at some crucial topics to consider if you are planning to live a long-term freelancing life.

–

If you’ve just begun your journey into the exciting world of freelance work, welcome! Freelancing is an incredibly rewarding way to make a living—it enables you to pursue your passions freely while being able to spend more time on the things that matter, like friends and family.

As the very structure of our economy changes, becoming more globalized, more and more people will resort to freelance work. Still, even though it may be enjoyable as you first begin freelancing, it becomes more complicated if you want to be self-employed permanently. There are various things to consider, like obtaining health insurance independently, learning how to file your taxes, and planning for your retirement.

Health Insurance

We are living in tough economic times, and skyrocketing health insurance premiums have made it difficult for freelance workers to be properly insured. Still, if you do your research, you’ll be able to find the right health insurance plan for you. Some of the best and most affordable health insurance plans are provided by your local chamber of commerce, which operates for the express purpose of improving the economic viability of your local community.

Most chambers of commerce offer individual health insurance plans for freelance or self-employed workers. Another good option for health insurance is offered through the Freelancers Union (US). The most important thing to remember is to look into each plan and ask questions. For more options, check out this Freelance Folder thread.

Filing Taxes

Filing taxes can be pretty tough on freelancers, so again, it’s best to do as much research as you can so that you won’t be overpaying. As a freelancer, there are many expenses that you can write off (e.g. your computer, your printer, and any other equipment that is necessary for you to complete your work).

According to this insightful article featured on Kiplinger.com, you can also deduct your health insurance premium and half of your self-employment taxes. If in the US, keep in mind that you will be required to fill out two additional forms (either the Schedule C or Schedule C-EZ, as well as the Schedule SE), along with the 1040.

If you are a first-timer to filing freelance taxes, then the best option is to work with a tax professional who specializes in self-employed taxes to maximize your return. If you oversee the process carefully, asking questions along the way, you’ll eventually be able to do it yourself.

Planning for Retirement

Traditional workers often don’t have to worry so much about retirement. Full-time American employees have the benefit of having a company-supported 401k plan, which essentially enables them to save for retirement without even thinking about it.

For us freelancers, however, saving for retirement is a responsibility that falls squarely on our own shoulders. Paying into social security may seem like it will be sufficient for once you retire, but the truth is that this is most definitely not enough to live on once you no longer can, or no longer desire, to work.

If you are young and just beginning your freelancing career, then your best bet is to simply set aside a specific percentage of your monthly income into a savings account allocated for retirement. This will get you comfortable with the idea of saving for the future, which is a mindset that many young workers take some time to develop.

Once you are financially secure and have built up a fairly solid nest egg, seek out a financial planner who can educate you about the various retirement accounts out there. Financial planners who have worked with freelancers before are best to approach, so try to get a referral from a fellow freelancer, or run an Internet search for planners in your area.

This U.S. News and World Report article gives an overview of different retirement accounts for freelancers that you can ask your financial planner about.

Keep an Eye on the Future!

These are just a few of the important things to keep in mind if you intend on having a long and sustainable freelance career. Although we freelancers are something of a live-in-the-moment bunch, keeping an eye toward the future is essential if you want to continue enjoying your free lifestyle for years to come.

What health care plan do you use? Do you use a professional accountant to file your freelance taxes? Are you planning for retirement?

–

Alvina Lopez is a freelance writer and blog junkie, who blogs about accredited online colleges. She welcomes your comments below.

Photo Credits: Shutterstock

This article was put up a few years ago but it’s still relevant so I thought I’d re-share. If you really want to please your designer friend for the holidays / Christmas / birthday I suggest getting them one of these presents below. Please feel free to add your own!

What to get a designer or creative for Christmas / Birthday?

• New Books (Or a voucher for a book store that sells graphic design books)
• Pens & Pencils
• A Large Clock
• Graphic Design Magazine Subscriptions
• Drafting Table
• Lightbox
• Paints
• Art Paper / Canvas
• Pantone Swatches
• Sketch Pads / Moleskine
• Dot Grid Book
• Easel
• Blank Canvases
• Post It Notes
• A Digital Camera
• iStock Credits (or other stock sites)
• Designer Tshirts
• iTunes Shop Credits
• New Speakers

Computer Goods… for the rich friend

• More RAM
• Screen Calibrator
• New Video Card
• New Mouse – I recommend Logitech MX Revolution
• New Computer (Mac or PC?)
• New Large Screen Monitor
• A Second Monitor
• New Cordless Keyboard
• New Software (Adobe Creative Suite)
• Software Updates
• Wacom Digital Graphics Tablet
• Scanner
• Multi Function Printer
• A Massive External Hardrive
• Multi Card Reader
• Multi USB Connecters

More Great Gift Ideas for Designers

• 20 gifts for the productivity nerd
• 15 great gadgets & gifts for designers
• 25 gift ideas for creatives
• 20 cool & creative gift ideas
• 20 emergency holiday gifts for geeks

Feel free to add your own wish list / suggestions in the comments below.

This is a guest article contributed by Richard Larson.

–

Facebook represents a fantastic marketing opportunity for any business via shares & referrals, however, just like WordPress and other platform based user sites, it’s critical to incorporate SEO strategies into your Facebook pages in order to get exposure out of them. Here are 7 Facebook SEO strategies to make sure your Face is getting the amount of Book it deserves!

Whether you are setting Facebook up for yourself or for a client it’s important to keep SEO strategies in mind. According to Google, they aren’t actually looking at Facebook “shares” as a separate part of their ranking algorithm, but traffic is traffic.

The number one thing to remember with Facebook shares: Their marketing value resides in the fact that they are coming from a reputable source; from someone known to, and respected by, the person on the other end. This invests the shares with clout and makes them very valuable. Make no mistake, Facebook is a marketing tool but nothing a business puts on their Facebook Wall should ever break that kind of trust. Period.

For businesses, Facebook is a delicate dance between, “be my friend” and “pay me money.” Always difficult, in the Facebook world it is critical to fall on the side of plushy slushy soft sell. This is why SEO strategies for Facebook are important. SEO by its nature lies behind the scenes and therefore customers can’t possibly interpret it as marketing.

1. Choose a Great Facebook Page Name

Back up; choose a great business name. Not too spammy, not too generic. Something descriptive and easy to remember. If it’s too generic Facebook might blacklist the name. Once you have a name, don’t change your page name. Once established, keep it and brand it. Renaming isn’t ever a good idea from an SEO perspective.

2. Facebook URL Names Are Also Important

Facebook now allows vanity names so make sure to add one if you can. The URL won’t exactly be yours but www.facebook.com/justcreativedesign is a lot better than www.facebook.com/11586454. DavesGarden is interesting, theirs is: http://www.facebook.com/davesgardencom. As long as the user name incorporates one of the terms related to your business you now have a URL that is searchable. It’s important to know that Facebook requires 100 fans before you can pick a username, of which you can then do by going to http://facebook.com/username

3. Use Keyword Rich Text to fill out the “About” and “Info” Sections of Your Facebook Page

This will place searchable terms near the top of the Facebook page in the CSS. These are small areas so refine the elevator speech! In addition, make sure to include address information so that the page will pop up on local searches- a favorite of Google’s. In the info section also add links to your website.

4. Make Facebook Picture Descriptions Count

Facebook is a visual medium. Facebook will change titles on photos but descriptions live on. Use keywords as often as possible. Read each description from two angles- once for your customers and once from a computer’s angle. “Jack and Jamie enjoying the Keys on their 40th” could as easily be: “Luxury Florida Keys Bash by Private Jets Charter for Jack and Jamie’s 40th.” Both descriptions are better than “Jack and Jamie at their 40th Party.”

As a side note, give your clients an extra reason to stick with you as a designer by showing them how they can get lots of free advertising if they structure online promotional campaigns properly. For example, Private Jets Charter could offer a Groupon for birthday parties/events, get the event for the couple, encourage them to advertise the party through Private Jets Charter’s website and Facebook page (where everyone can easily get directions to the plane) and then provide/post pics of the party (with permission) afterwards using keyword descriptions. These photos will be strongly shared and each time they are, the words in the photo description, “Private Jets Charter, luxury, Florida Keys” are racking up ranking points.

Moreover, as the designer, you will likely get extra design work out of the process. Great designers always need to show ways in which their creativity in invaluable to their clients. With better and better templates and platforms around it’s critical that designers venture not only into SEO but also into marketing. These are two things that a customer can’t buy ready made or download for free.

Above is an example of descriptive text and URL slipped into Facebook code.

5. Use Keywords in Your Facebook Status Updates

Updates provide a great place to include your keywords and increase visibility. This is also the place to drive traffic to your own website. Never forget that one of your primary objectives for having a Facebook page is to drive traffic back to your website where you and not Facebook can take advantage of the traffic.

When you “attach link” FB gives you the opportunity to edit the text by clicking on the box. Include keyword-enriched text as early as possible. (Be aware that FB will channel this link through their own menu bar so this isn’t going to get you a direct link.) Next, include the URL of your website. Third, don’t put everything on Facebook. Instead provide an interesting enticing bit that will make people want to read more and make it clear that they can do this on your website.

6. Use Notes and Discussion Boards On Facebook

The content on both of these is indexable. Notes and the Discussion Boards are indexable and therefore they can make for great SEO. In addition, some people just use Facebook and do almost nothing else online. Using a discussion board gives you a way to reach this group of people. It’s important to note that automatic pull in of blog posts are now being phased out of Facebook.

7. Include Shares & Likes on your websites

Although not directly SEO,  you should include Facepage shares and likes into all of your websites. Also, take some time to stay on top of the Facebook Developers news. The developers page is also a great place to come up with new ideas about how to monetize the platform and get the most out of Facebook.

In summary, use Facebook as effectively as you can by paying attention to SEO. Take the time to use the above suggestions and then compare and track the changes in your FB code (Available to anyone for any page by viewing “source code” in your browser). Over time, graph long term changes in your traffic to see if the extra time and energy is really paying off.

More SEO related articles:

• 10 SEO Rules for Designers
• 9 SEO Tips You’ve Probably Forgot About
• How to Get Free Advertising on Google
• Designing Websites with SEO & Conversions In Mind

–

*Author: Richard Larson is Brand Manager for Go Promotional the leading promotional items supplier online.

Like photo by Shutterstock (mkabako)

I’m always fascinated to see where and how other people work and today I wanted to share my personal set up, focusing on the tools & resources I use every day as a designer. Part one will be focused on the hardware and part two, will be the software & apps I can’t live without.

Hardware

• Apple Macbook Pro (MBP) 17″

The main weapon of choice for all my design & browsing is the Macbook Pro 17″ (3.06 GHZ Intel Core 2 Duo, 4 GB DDR Ram, 500 GB).

• Apple 27″ Cinema Display

I hook up my MBP to my 27″ Cinema Display when at home and place the MBP on a Pole Notebook Holder so I can make use of the two screens. Pretty handy as you can rotate and move the screen as needed.

• Apple Macbook Air 11″

I take the 11″ MacBook Air traveling and hardly ever take the MBP now. The Air is super light weight, tiny and handles all my design & media needs when on the go. A highly recommended combination.

• Apple iPhone 4s

My iPhone is rarely out of site and is probably used the most out of all my hardware. My most used apps include Tweetdeck, The Weather Channel, New York Times, Spotify, Facebook & NYC Subway. The iPhone is also used as my calendar, alarm clock, email center, site monitor, music player, etc. It’s a smart phone indeed.

• Logitech Performance Mouse MX
  

I’ve had this mouse for a few years now and still love it. It was previously called Logitech MX Revolution but since undergoing a few refinements is now called Performance MX. Why do I love it? It has a neat ‘infinite scroll’ feature and is extremely comfortable in my large hands, as apose to the Magic Mouse which gives me cramps.

• Canon Pixma MP560 Scanner, Photo Copier & Printer

Nothing too fancy but it does everything you need in an office; prints, scans and copies.

• Bose QuietComfort 15 Noise Canceling Headphones

These headphones gets you in the zone by canceling out all outside noise, especially useful on airplanes.

• Microsoft Digital Media Keyboard 3000

This full sized keyboard has extra handy shortcut buttons, great for media and editing.

• Seagate 1 TB Portable External Hard Drive

An external hard drive that automatically backs up my files each night using Time Machine. It also stores the majority of my media files. The first thing I’d take in a house fire.

• Wacom Intuos 4 (Medium)

A neat graphics tablet for easy maneuvering in Photoshop.

• Ikea Desk + Drawers + Chair + Lamp + Mousepad

The desk draws are the most handy, hiding away all the clutter (pens, notebooks, graphics tablet, the Mac Air, etc.) and the slim nature of the desk forces me to keep the top of the desk clean.

• Name Plate

A gift given to me before leaving for NYC. Comes in handy when you forget your name.

• Moleskine Large Plain – My sketchpad and idea generator.
• Dot Grid Book - Great for logo designs.
• Artline 0.4 Fineliner Pen – My pen of choice.

Office Inspiration

• Where We Design – Office space inspiration
• 11 Tips for making your office more comfortable
• 25 Elegant Work Stations

On The Wishlist

After using a Herman Miller chair at my day job, I’m keen to get my hands on one for the home office too. They have much more support & are comfortable to sit in for long periods of time.

What are some of your favourite designer hardware tools? Please feel free to share your set up too!

The 2011 Future of Web Design Conference was recently held in NYC and I was fortunate enough to attend the two days of talks. Below is the summary of Day 2. The Day 1 FOWD summary can be found here.

As a disclaimer, these notes were quickly jotted down & summarised and may not be understood out of context but I’ve done what I could from my notes.

Below are the summarised keynotes which you can click to jump to.

• Pith, Passion & Productivity – Cameron Moll
• Design Principles: The Philosophy of UX – Whitney Hess
• Future of CSS – Dave Shea
• Future of Mobile UX – Steve Fisher
• Responsive Web Design and Embracing The Unknown – Aaron Weyenberg
• The Lost Art of Design Etiquette – Dan Rose
• Extensis Photoshop Font Plugin
• Future of Branding – Randy Hunt
• The Design Revolution – Brad Haynes
• Future of HTML5 – Tim Wright
• The Unknown Voyage – Josh David

Pith, Passion & Productivity – Cameron Moll

PITH & PASSION

How can you make a name for yourself? Write.

• “If you don’t write, you don’t know how you think.” – Jeffrey Zeldman
• “The details are not details, they make the product.” – Charles Eames
• Words with pith, convey knowledge & personality.
• Good writing not only comes from grammar & sentence structure, but practice.
• Start writing, don’t just convey information but write with authenticity, passion & pith. And persist.

Recommended reading: Editing tips for designers

Who’s A-Game Pithy?

• @fictivecameron – Creator of Gimme Bar
• @Ether Brian – His tweets are exercises in creative writing.
• Ethan Marcotte – Author of Responsive Web Design

PRODUCTIVITY

Cameron uses these methods for productivity:

• Sorted iPad App and TeuxDeux app.
• SimpleNote – recommended application.
• Has Scuba dive pads in his shower as they are waterproof and allows him to jot down ideas in the shower.

Recommended reading: Future of Self-Improvement: Grit is more important than talent

Design Principles: The Philosophy of UX - Whitney Hess

User experience is the establishment of a philosophy about how to treat people. Visual design is the establishment of a philosophy of how to create an impact. Each have distinct goals and both vary depending on the goals of the product / service. There is a standard set of principles for creating an impact, as outlined below.

10 Principles of Visual Design

A principle is a rule or belief / philosophy to govern a behavior.

1. Contrast
2. Emphasis
3. Variety
4. Balance
5. Proportion
6. Repetition / Rhythm
7. Movement
8. Texture
9. Harmony
10. Unity

Why use principles?

• Consistency
• Constraint
• Vision
• Objective Evaluation

Good design does not mean good experiences, but it should.

Principle’s of Good Experience Design

1. Stay out of people’s way.

Make it easy and simple to use. Don’t have information there that is not needed. Hide unneeded information. A good example of this is Tumblr’s hidden ’30 reasons’ on their home page.

2. Create a hierarchy that matches people’s needs.

Make the most important information the most prominent. Take note of size, color, space & proximity. Match real world scenarios to the design.

3. Limit distractions

Just because items are alike does not mean they have to be.  People can not multi task so make users focus on one task, to keep people in the moment.

4. Provide strong information scent

Use clear language, properly set expectations so you don’t lead users down the wrong path.

Bad: Tropicana orange juice has hard to distinguish bottles. Only one color band difference.

Good: Quora’s information search has search suggestions. Tags are displayed as users write.

5. Provide signposts and cues.

Make it incredibly clear where people are. Don’t let people get lost especially on the web, where there are so many paths that lead people away. Provide sign paths. Show people where they came from and where they can go which allows them to expect to be taken in the right direction,

6. Provide context

Ensure that designs are self contained and don’t break people out of the experience, unless for a purpose.

7. Use constraints appropriatel

Preventing error is much better than recovering from it. Guide people towards successful interactions.

eg. Toilet lavatory in planes, lights turn on and off when entering.
eg. TV entertainment on planes notify users when the movie is longer than flight time.

8. Make actions reversible.

Make sure your actions can be undone if needed or have some sort of back up plan.

9. Provide feedback

Give feedback to users. eg. Asthama puffers & tape rolls should show how many puffs are lef.

10. Make a good first impression

Make a good first impression as you don’t get a second chance. Use welcome messages. Make people feel comfortable. Set their expectations. Ease them into the process. Be attractive, strong. You want people to stay with you for a long time. Create purpose with user experience.

Future of CSS – Dave Shea

This article was a bit more technical so couldn’t take as many notes but here are few snippets & recommended resources. You can get the slides here.

• By mid 2012, Google Chrome will become next prominent browser, then IE, then FF, Safari and Opera.
• CanIUse.com – Good compatibility list.
• Use CSS Gradient Generators to make gradients compatible back to ie6.
• ‘Shadow DOM Web Kit allows you to customize checkboxes & form elements including the scrollbar.

Future of Mobile UX - Steve Fisher

Steve’s slides can be downloaded here.

• Focus on the mobile context & it is not about shrinking it down.
• Design outside in. Make it make sense. Make it obvious.
• It is not about the device, but the mobile context. The web is not fixed width.
• Patterns are repeatable solutions to a common problem.
• The mobile web is about coherence and how it works across all devices.
• Make navigation obvious. The less screen you have, means it is even more important.
• Remember what’s obvious to you might not be obvious to someone who is new to the experience.
• Create once, publish everywhere. Well structured content and interactions matter.

Responsive Web Design and Embracing The Unknown – Aaron Weyenberg

• There is no desktop web, no xyz web, there is no device web. It is just the web.
• There is always going to be ‘the unknown end user’.
• BostonGlobe is a great example of responsive web design.

Recommended reading on Responsive Web Design:

• Responsive vs Adaptive design
• A Dao of Web Design by John Allsopp

The RWD Stack – Use percentages & max widths.

3 Choices for RWD

1. Desktop Down
2. Mobile Up
3. Ranged Media Queries

RWD challenges

• Images
• Tables
• Ads
• Process

To Do

• Forget pixel precisions – they are for egos.
• Move to the browser early.
• Do rapid prototyping.
• Create structured content & use progressive enhancement.
• Try mobile first.
• Build content out.

Recommended Reading

• Responsive VS adaptive web design
• What to look for in a UI typeface
• Mobile web content adaptation techniques
  

The Lost Art of Design Etiquette – Dan Rose

I didn’t attend this talk but you can see the slides here: The Lost Art of Design Etiquette.

Also be sure to check out The Photoshop Etiquette Guide for Web Designers.

Extensis Photoshop Font Plugin

Extensis released a new Photoshop plugin that allows you to use their 2000 fonts + Google’s Web Fonts too, all from right within Photoshop. Best thing is that it’s free, although it is bundled with some font management software. Worth checking out.

Future of Branding – Randy Hunt

At the moment there is a blurring between community and customers, between offline and online, home and work. This is because they exist at the same time.

What cuts through the blurriness of branding?

• Smart content and an honest story.
• An experience that people can relate to and people empathise with.
• A memorable personality or character that is not forgettable.
• The best brands are the ones you can believe in & actually mean something to people.
• Brands manifest themselves through people and active engagement. The community defines your brand.
• Designers are product makers. Products become expressions of the brand and brands are products.
• Make people happy.
• Rather than differentiating, make brands likable and loveable. Successful brands aren’t made up, they are the ones that are believed in.
• You don’t want a web design, you want a web solution.

The Design Revolution – Brad Haynes

• We are moving from an Information Age to a Conceptual Age.
• Systematic jobs are being automated or outsourced.
• Right side brains are big pictured, empathetic, emotional.
• The Wholefoods experience is pleasing and enjoyable. eg. Flowers at entrance, dimly lit, homely. Think “How can you improve the ROI?”
• Find the opportunities that allow you to make a larger impact.

Recommended reading: A Whole New Mind by Daniel Pink.

Future of HTML5 – Tim Wright

I wasn’t at this talk but the slides can be found here: Future of HTML 5.

The Unknown Voyage – Josh David

This talk really couldn’t be transcribed. Let’s just say that Josh “might hold the record for the most f**ks at TED”.

• Learn to embrace failure to arrive at success.
• If it is right, and you believe in it, do it.

Thank you to the speakers and placemynamehere for the photos used in this article.

What was the most insightful talk / summary for you?

I was recently interviewed on BrightLounge TV, which is a website focused on providing “relaxing video podcasts on the topics of  design, startups and technology”. The questions I answer in the video are outlined below. The video is also combined with some great freelance travel tips from the interviewers, Bryan & Catalina.

My interview goes for about 12 minutes starting at 9:35. You can view it below or much larger over on BrightLounge.

1. How did you get started with identity design?
2. What was your first experience with a big client like?
3. Have you ever had an experience with a client who had strange expectations or made awkward requests that you wouldn’t have expected?
4. What is one piece of advice you would give to freelancers getting started with identity design? Is there anything that you learned the hard way?
5. What is the role of identity design in social change? Can you brand a cause and change people’s behavior or attitude about it?
6. What do you do to turn a logo design project into a long term commitment with the client where you continue to work more on things like their overall branding strategy?
7. During your travels, have you noticed any kind of cultural differences in how the idea of identity design has evolved and is being implemented? Anything you haven’t expected?
8. Where have you traveled? A traveler like you probably has a really cool story related to your experiences in a different country. Tell us some of those stories.
9. When you travel, how do you optimize your workflow, if you have to also work on a project while traveling? Any tips for traveling freelancers?
10. Besides traveling, what else do you enjoy doing in your free time?
11. What is something that excites you right now, it can be anything, doesn’t need to be related to design.

Let me know if you have any other questions!

A few weeks back I announced the 2011 Future of Web Design Conference being held in NYC and today I attended Day 1 of the event.

Below is a summary of the talks I attended. As a disclaimer, these notes were quickly jotted down & summarised and may not be understood out of context but I’ve done what I could from my notes. Below are the 6 summarised keynotes which you can click to jump to.

• The Secrets to Instagram’s Success – Kevin Systrom
• How To (and not) Get Hired - Andrea Graham
• The Myths of Mobile Context – Josh Clark
  
• Web Design is a Cloud, Not a Clock – Sarah B. Nelson
• Type On Screen: Choosing & Using It Well – Daniel Rhatigan
• The Power of Side Projects and Eccentric Aunts – Tina Roth Eisenberg

Videos of the talks will be available soon.

The Secrets to Instagram‘s Success – Kevin Systrom

When designing for the web VS desktop you should take into account:

1. Device Context – new contexts (sizes, resolutions, etc.) & new devices
2. Place Context – people are on the move, not behind a desk. This changes way people interact with products.
3. Needs context – time, speed & capabilities of devices.

Users are no longer in the web browser – what can you do with that? There are also many features of mobile devices, that are not on the desktop. What can you do with them?

Users want to navigate single needs at a time. For example, Facebook Messenger is a breakaway from the core Facebook platform.

Instagram Stats

• 12.6 million users in a year.
• 1.5 users per second.
• 250 million photos.
• “Costs 2 really nice cars” a month in hosting.

How to make it in the mobile app market

1. Have a vision – Something may be a feature, but it could be turned into a single context that ‘saves the world’. Don’t work on things that don’t add value or work with the vision. Don’t announce features before you start working on them.
2. Turn features into products – Silly features should be considered as “What can this become?” What can be next?” This limits & expands what you’re going to work on.
3. Always be an editor – This allows you to decide what you should and should not work on. Trim down the app and features to the most important parts. As an example, Instagram does not allow high resolution photos as this slows down upload speeds. Even though people ask for it, it goes against the vision of the company. Ask “What should not belong?” Unused or unpopular features should also be cut. eg. the Instagram ‘Gotham’ filter was not used much, so it was cut.
4. Make it fast & simple – People are usually in a rush and need things done quickly. As an example, did you know Google pre-loads your Gmail inbox? Instagram also starts pre loading images to the web after they take the shot. They’ve taken perceived latency and moved it elsewhere which makes speed seem instant. You should consider the relationship between flexibility and simplicity. More flexibility means more complexity. A blend between simple and flexible is the key.
5. Make it Magical – How much time does the user spend and how much payoff do they get? With a little effort you get a lot of pay off. Eg. 15 seconds gets a photo filtered & uploaded.
6. Make Your Product Grow – How will people hear about your product? How do you take 1 user and turn into more?  Make people be able to share at all times. The content is an ad for the product in itself. Eg. Each photo has a ‘Download Instagram’ link. Think about the flow of the product. Eg. Foursquare photos with a check-in is much more successful due to the thumbnail as eople want to click on the thumbnail.
7. Make It Addictive – Make people come back and use it again, by making it magical. Make people think ‘How did you do that’? What makes it unique? How often & what should be the payoff? A variable ratio should generate the highest rate of activity. Eg. The Pokie machine = random excitement. Ask yourself how do you create a “social slot machine”? Likes & comments are the rewards, just like wins on the slot machine. More likes = jackpot.

Mobile Success Recap:

• Have a vision – shows you boundaries of playing field.
• Turn features into products.
• Be an editor – trim to the most important.
• Make it fast & simple – hide latency.
• Make it magical – make products that are exciting.
• Make it grow – make the flow turn 1 to 1000.
• Make it addictive – make it bring joy.

Treehouse Launch

Treehouse (formally Think Vitamin membership) was launched at the event. It’s a place to learn web design, web development and iOS Development.

How To (and not) Get Hired - Andrea Graham

Marketing For Web Designers

The slides are available here.

How Not To Get Hired

• Having comprimising photos online. Untag compromising photos. A simple Google / Facebook search can find many.
• Misspellings and bad grammar.
• Venting on social networks.

How To Get Hired

• Ensure your portfolio & website is up to date.
• Determine your work and for whom you want to work
• Get ownership of products or create your own.

On Finding Agencies

• Send out your links, attend events, find internships, network and make friends.

On Finding Clients

• Join up & network to find clients. Read local publications, make friends and do pro-bono work. Make 1 on 1 relationships. Your friends work for businesses, create relationships with their bosses.

Use your resources

• Agency recruiters look on social networks. Job boards, social networks. Are you there?
• Start a blog.  Do roundups. Establish yourself as credible.
• Do tutorials.
• Attend events and meet ups.

How to get hired again

• Make it easy for people to refer you. Meet deadlines.
• Ensure people know you are available for work. ‘Hire Me’ is better CTA than Contact Me.
• Try out incentive based marketing.
• Be your own biggest fan. Toot your own horn.
• Embrace your weaknesses. Know when to say no. Recommend others who you know are experts.
• Become an expert an something. Keep learning by doing tutorials. Follow through on projects.
• Bill hourly and honestly. Have more accurate timing.
• Do good work.
• Don’t burn bridges.
• Deliver cupcakes / rewards after a project has been completed. Say Thank you.

The Myths of Mobile Context – Josh Clark

This was my favourite talk of the day, extremely interesting & informational. Good news for you too, as you can download Josh Clark’s slides here in PDF form, with accompanying notes.

To understand mobile context, you must understand users needs. Think of platforms as cultures.

Myth 1: Mobile users are rushed and distracted

• Mobile isn’t just on the go, it’s on the couch, its waiting, its on the bus, its on toilet. “40% of users use on the toilet. 60% lie.”
• Mobile versions don’t have to do less or ‘be lite’.
• Don’t remove content or freatures, just because it is mobile.
• Mobile users use because they are “multi-tasking, they are local, or bored”. They are ready to spend attention to the phone.
• 25% of US adults are mobile. 8%  use mobile exclusively.

Myth 2: Mobile = Less

• Mobile is not lite, or less.
• Don’t confuse content with intent. Just because paperbacks books should be lighter, it doesn’t mean you need to remove chapters.
• Mobile apps should have full content & core content.

Myth 3: Complexity is a dirty word

• People don’t want dumbed-down apps, they want less complicated app. Make complexity, uncomplicated.
• People don’t care how it happens, just help them get it there. eg. The umbrella iPhone app simply answers “Will I need an umbrella today?” Simple but fulfills certain user needs.
• Give users the minimum to reach their goal. Understand who you are designing for, as this changes everything.
• You can create sub apps within the app or outside of the app.
• Managing complexity isn’t about putting all the information on the page. You need to manage tasks and screens. Clarity trumps density.

Myth 4: Extra taps and clicks are evil

• Have content that is cached and ready.
• Worry about tap quality, not quantity. Every tap should give delight and be worth it. Explore information, ask and receive.
• Teach users about hidden content. Show once until they learn the functionality.
• Mobile should mean more. Give your app super powers based on the features of mobile devices. Stop thinking about mobile, but think about mobile content. What you can do with the device, as apose to a desktop. Progressive enhancement.

Myth 5: You must have a mobile website

• There is no mobile web, don’t think in terms of mobile websites but in terms of mobile devices. How can the device enhance the experience. Use media queries. This approach is not dogmatic so use good judgment.
• Ethan Marcotte – Responsive Web Design book is great approach.
• Mobile First – Start with mobile first as it can define what is really useful for the website as it makes you make the hard decisions. What is the most important?
• Think about the content and API as the show.

Myth 6: Mobile is about apps

• An app is not a strategy, its just an app or a container.
• Your product is not a product at all. If you pull back, you need to accept that your content is going to be displayed in many forms.
• Content is like water. Build content out, don’t put it in a container. Start thinking about flexible content that can be displayed on any device. You should be able to get content any time, any where. NFL ad is a great example as this.
• We’re all cloud developers. Be www.futurefriend.ly – Design for the future. We can not control the form or context that content can be displayed. You need API’s that can be used across any device. Content should be open so users can use the information. Eg. The Guardian, NY Times, NPR.

7. Content & API are for database nerds

• Metadeta is the new art direction. Structure your content well and you will get a foothold for design across all the devices.
• Apply rules for the robots to follow. Repurpose content, not design. Don’t design pixels, design content.

Mobile Context Recap:

• Mobile is not rushed or less.
• Complex is not complicated.
• Tap quality not tap quantity.
• Focus for all platforms.
• No such thing as mobile web.
• Don’t think app: think service.
• Metadata is the new art direction.

Web Design is a Cloud, Not a Clock – Sarah B. Nelson

Clock problems can be measured and analysed, rebuilt and can find problems. They’re tangible.

Clouds are dynamic systems, they can be analsyed in some parts but can not be predicted or remodeled or picked apart. The problem is that we take cloud problems and treat them like clock problems.

The design process is an emergent system. Once you see the parts you can work on them. Working agreements are the heart of collaborative work and the strength of those relationships. This directly impacts the quality of the designs. They are not necessarily formal. Below is a list of points for great working agreements.

• Have a clear sense of purpose. Know why and how they are doing it so they can make decisions and know how success will be measured.
• Trust. Even if you don’t use same tools, etc. you can still make a promise and deliver on it. Having a history helps as you work better together, based on consistant actions. Failure is an opportunity for growth, not blame.
• Clear roles and responsibilities. On the particular project what are the team really accountable for? Sometimes these need to be rotated. How do you know they know what they are doing? They can articulate with their mouths what they are doing.
• Agreed upon approach. Set realistic expectations and deadlines.
• Deadlines make us more creative. Structure makes us find creative ways to deliver the product in a different way.
• User Involvement – Regular involvement is crucial. Personas based on feedback and what you know. The team should have an understanding of who your users are.  They should have references / touch stones that everyone can agree on. Design with users, not at or for them.
• Stakeholder Engagement. Talk with people who have no idea with what your doing and know how to engage. Not a list of changes type of engagement but workshops and hands on involvement designed to get information and to let them know they are heard and that you are listening. Revaluate how it is working.

Pre-project kick offs are a great way to start a project. When starting a project, every member of the team should have a conversation about how you are working together. Make your working agreements. Put everyones name up there. Have goals for each project… why is each member there? What are the fears? Expectations? eg. List Names, Titles, Goals, Fears, Expecations.

Type On Screen: Choosing & Using It Well – Daniel Rhatigan

Thanks to Jason E. Beaird for the Type on Screen notes below.

Screen typography has come a long way, but it’s still evolving. There are font licensing issues, device support issues, font rendering inconsistencies and fonts that don’t work well on screen. Rasterizing software and screen hardware also take different approaches, such as E Ink.

Choosing a typeface:

• Vertical Proportions – Most web safe fonts have similar proportions between upper and lowercase text. A taller x-height can make the text feel more dense at the same size.
• Shapes – Straight lines and clear forms work better than subtle angles or curves. At small sizes, good hinting can help keep these details from causing trouble.
• Open Spaces – Generous spacing within and around letters (within apertures and around forms) will increase legibility at small sizes.
• Family Selection – Makes sure that italic and bold styles look as good as the regular.
• Opentype Features – Support is beginning to increase. Ligatures, alternate number forms, swashes or contextual alternatives and real small caps.

Using it well:

• Compensate for inconsistency – Adjust the size and line-height as needed to get contrasting fonts to work together.
• Be generous – If in doubt, slightly larger text size & extra line spacing will be easier to read.
• Choose color carefully – Contrast between text and background not only makes text more readable, but it also makes fonts easier to rasterize. More steps between the colors.

There are ‘E’ Versions of popular print faces such as Bembo and Helvetia Neue which have adjustments to the weight, proportion and spacing. There are also new faces being created specifically for screen like Malabar.

The Power of Side Projects and Eccentric Aunts – Tina Roth Eisenberg

Things Tina will teach her kids:

1. Love what you do & be flexible because the goal you set may not be what you had in mind when you set the goal.
2. Make something you love. Trust your intuition, don’t always go off numbers.
3. If an opportunity scares you, you need to take it.
4. Don’t be a complainer, make things better or let them go. Best way to complain is to make things.
5. Make time for side products. If you’re a designer, you have all the skills to create a product. Side products lead him to the next job.
6. Surround your self with like minded people. Human connections.
7. Ignore haters. Give haters none of your time. Zero.

Stay tuned for Day 2 of the Future of Web Design Conference 2011.