Design Lessons in Chess

On Tuesday Rob Weychert talked about the analogy between web design and chess.

Correlations

A chess game has a 3-part chronology: the opening, the middlegame, and the endgame. Weychert compared this to the info design, graphic design, and implementation phases in web design, respectively. During the opening, you’re setting up the skeleton for the rest of the game. During the middlegame, you employ broad strategy and short, quick tactics. He showed a Sun Tzu quote that summed up the importance of having both:

Strategy without tactics is the slowest route to victory. Tactics without strategy is the noise before defeat.

Before the game even starts though, you need to research your opponents. In web design, your “opponents” can include 3 different groups:

• The user — you have to make their moves for them, leading them to what they (and you) want
• The client — mimics the back-and-forth response of a chess game
• Your colleagues — you want to play against challenging and exciting people

Lessons

1. Content Is King — In chess, the king is king. Novice players will focus on a particular strategy, forgetting that the king is the critical piece of the game. In the web, it’s easy to become too focused on the technology or tools you already use, and forget that you need to use the best tools for the needs at hand.
2. Know Your History — It helps to look at a game in its historical context. Weychert gave the example of the famous chess match between Bobby Fischer and Boris Spassky in 1972. The contest is all the more interesting when you know it was during the height of the Cold War and that Bobby Fischer is batshit crazy. Another example he gave was of art he created for a friend’s concept album on Tesla. He talked about Tesla’s advertising methods and the design of that age.
3. Think Ahead — Good chess players can think several moves ahead, which is not easy when you consider the exponential growth of possibilities with each step. In web design, the user dictates how the content is read. He gave an example of not thinking ahead with Epitonic’s site, which didn’t allow for more than 3 pages per article. He pointed to Jason Santa Maria’s site as a good example of thinking ahead when planning and designing the site.
4. Don’t Get Too Attached — Novice chess players focus on protecting the queen because it is so powerful. But you can’t get attached to any particular piece or strategy. In web design, this means not using the first good idea that enters your head, but looking around for an even better solution.
5. Act With Purpose — Every move has to ultimately help you reach your goal, either directly or indirectly. Every piece matters. Justify all your decisions. Weychert then explained why he chose the design for his slides — he used the golden ratio, geometric fonts, alignment with similar letters. The only thing he couldn’t explain was the color, but some audience members remarked that yellow was the color of intelligence, or crazy people. :)
6. Obey Circumstance — You have to respond to problems in front of you — there is is no rigid playbook or plug-and-play solution. He gave an example of a design he created for a website that was then copied verbatim for a Russian site — the Russian site was for a totally different product so it doesn’t mesh with the goals of the original design.
7. Principles Are Your Friends. Except When They’re Not — A lot of people are either too pedantic or not pedantic enough. Find the middle ground.
8. The Journey Is As Important As The Goal — There is no single pivotal moment in a chess match where you can say “Here is where the game was won”. Also, you have to build upon your past failures and learn from your mistakes. He argued that nothing is ever wasted, and showed some examples of sites he started building but were never actually launched.