Menu Search
Jump to the content X X
Smashing Conf Barcelona

You know, we use ad-blockers as well. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. our upcoming SmashingConf Barcelona, dedicated to smart front-end techniques and design patterns.

Are You Ready For A Web Design Challenge?

This is not a normal Smashing Magazine post. I’m not going to teach you something new or inspire you with examples of great work. Instead, I want to encourage you to complete a Web design challenge. I believe this will help to address a weakness that exists in many of our design processes.

If you complete this challenge, it will make it easier for clients to sign off on your designs, and it will improve the quality of your work.

Further Reading on SmashingMag: Link

So, what are we waiting for? Let’s get started.

The Challenge

If you’re like me, you did some form of higher education in art and design and will know about “the crit.” These meetings involve the class coming together with tutors to analyze and provide constructive criticism on each other’s work.

These were terrifying meetings in which I justified my design approach and defended it against criticism. Although I hated every minute of them, I believe they nurtured one of the most useful skills I have as a Web designer.

The ability to logically justify our designs is a skill many of us lack. This is the heart of the challenge I wish to lay down.

My challenges is this:

Write a blog post justifying the design approach you took to one of your websites. Then, encourage other Web designers to provide feedback and ask questions.

Admittedly, this might sound like a lot of effort, so let me explain why it is worth your while.

Why This Challenge Is Worth Undertaking

As I said in a previous article4, being a great designer is not enough. You can produce outstanding work and be the envy of your peers, and yet struggle to convince clients of your approach. The reason is that clients do not understand design the way your colleagues do. Therefore, you need to be able to articulate what makes your design right.

Our ability to justify our choices is crucial to our relationship with clients. Without it, clients will lack confidence in our abilities or, worse, feel excluded from the process. A lack of confidence leads to micro-management, and exclusion leads to frustration and resentment. Therefore, explaining our approach is vital.

However, it isn’t just about the client. It’s also about your personal development. If you don’t have a clear idea of what works, then improving will be difficult. Design critiques are as much about improving the quality of your work as justifying it to others.

Unfortunately, this requires that we overcome two barriers.

First, many of us don’t fully understand why we have designed a website a certain way. We design at a subconscious level, based on years of experience. When you have been driving for a while, you cease to think about the process of driving. Likewise, design decisions are often handled at a deeper level than the conscious mind.

Secondly, many designers haven’t had to justify their approach in the past. Either they haven’t gone through the rigorous critiques that I experienced in university or they don’t have the experience required to articulate their decisions.

It is for these reasons that this challenge is so valuable. By writing a blog post about a particular design and encouraging feedback, you move your decisions from the subconscious to the conscious level and gain valuable experience in articulating them.

Of course, knowing where to start such a challenge can be a challenge in itself.

Where To Start

If you are not used to thinking about design at a conscious level, then you might struggle to begin. While there is no right way to do this, I can share the approach that I use.

When discussing my design with others, I tend to look at the various components that make up the product. These usually are:

  • Grid,
  • Layout,
  • Color,
  • Typography,
  • Imagery,
  • Styling.

Ask yourself, why did you approach each of these elements the way that you did? Let’s consider each in turn.


Why did you use that particular grid structure on the website you are reviewing? Can you articulate your reasons for using a 12-column grid instead of a 16-column one? What about the margins and padding? If a client complained that there was too much white space between columns, would you have a response?

Another common issue is when you purposely break out of a grid. Was the choice intentional, with good reasoning, or just an impulsive decision? What would you say if the client asked about it?

The choice of grid might be based on the content or on the constraints of the style guide. It could have to do with making the website work on mobile devices or with allowing flexibility for future changes. Whatever the reason, you need to be able to clearly articulate them to yourself and the client.

960 Grid System5
Are we selecting a particular grid because it is right for the website or just because we have fallen into the habit? We need to be able to justify our approach to our clients and ourselves.


Layout and grid might sound the same, but they’re not. By layout, I am referring to white space and the placement of elements on the page. These are often points of conflict between the designer and client, so being able to explain your approach is important. For example, how would you justify all of the white space that Google has chosen to use on its home page?

Why did you leave so much white space6 on the page? Was it to draw the user’s eye to a particular element, or perhaps to improve readability?

What about the positioning of elements? Why is the search box in the top-right corner? Is it because this is the convention and people look for it there, or perhaps because you wanted to associate it with other elements that are in proximity?


Color is probably the most controversial of subjects, and so we need to understand our motivation. I tend to approach color selection in one of four ways:

  1. Corporate branding guidelines
    The palette has been defined by the guidelines, and I work within these constraints.
  2. Theory
    I use a tool such as Kuler7, which produces a palette based on established theory.
  3. Emotional response
    The extensive research8 done on people’s responses to colors informs my palette.
  4. Main image
    If the website has a dominant image that has already been approved by the client, I use it as the basis for the color palette. There are great tools for extracting color palettes9 from images.

Adobe Kuler10
Adobe Kuler is just one of many tools that help you apply color theory to your palette selection.

By explaining your choices in these objective terms, you prevent color from becoming a matter of personal preference and thus avoid conflict.


Something as seemingly simple as typography consists of many different decisions. These decisions extend far beyond the selection of typeface and encompass line height, size, weight, kerning and much more.

With services like Fontdeck making so many fonts available to us, the need to understand and justify our choices is more important than ever.

You need to be able to speak confidently about your choices if you are to demonstrate your expertise and convey that what you do is a lot more complex than it might appear. Taking the time to explain the complexity behind your typographic decisions might sound boring, but it will impress. It will also force you to put more consideration into your choices.


To many clients, imagery is merely about subject matter. But we know it is about much more. We select imagery based on the mood it sets, the colors it contains and even things such as the eye line of the person in the photograph.

We need to be able to articulate these decisions so that others recognize that you cannot easily substitute one image for another without significantly affecting the design.

Do you know why you selected one image over the thousands of others in your library? What made that image special? Can you explain this to yourself and the client? Was it really more than a “That’ll do” decision?


For me, styling refers to screen elements that are not directly content-related: buttons, links, call-out boxes and the plethora of other elements that need to be decided on.

How you style these elements can dramatically shape the feel of the website. From the chrome buttons on Apple’s website to the sketched buttons of Moredays12, styling can make a huge difference.

A comparison between the navigation on Apple and Moredays
Styling dramatically shapes the feel of your website. But can you justify why one approach is better than another?

Can you explain why your styling creates the right feel? Have you shown the client alternative approaches? Did the client sign off on moodboards, which set the style? If so, refer back to them when justifying your design.

Reference Material

In fact, whenever justifying a design, always refer to the material that has already been agreed upon. For example, if the client has signed off on moodboards, we should use these to justify our choice of typography (“I used the same typeface that we agreed on in the moodboarding stage”). We can also refer to the target audience, business objectives, branding guidelines and even previous comments by the client.

Reference material can be taken from farther afield, too. For example, when justifying your decision to ignore the fold, you can refer to research done by ClickTale13. Citing research and experts is a great way to justify an approach.

But remember, being able to explain your design is only half of the objective in this challenge. The other half is about improving the quality of your work.

Improving Our Work

Getting into the habit of justifying your decisions will inevitably improve the quality of your designs. Instead of leaving it to the subconscious, the act of considering imagery, layout, typography and so on becomes a part of your conscious decision-making process.

The act of discussing your process refines it and makes you more efficient as a designer. For example, in carrying out the challenge, you will probably struggle to justify some of your design elements, elements that in hindsight would have been better left out or presented differently. This will inform your next website, and over time you will find that your designs become more refined, simpler and more effective.

So, What Are You Waiting For?

Smashing Magazine has a quite large readership and a remarkable community. We have an amazing opportunity to start talking about our work and providing each other with constructive criticism. Write a blog post on one of your designs, justifying your approach. Then link to it in the comments below. Encourage other people to provide feedback on your design, and take their criticism to heart. Finally, don’t forget to make comments and ask questions of other people who have posted their own work.

My hope is that this post will not only help us speak confidently about our designs and improve the quality of our work, but encourage a dialogue about the design process. We are good at showing off our products but bad at explaining how we came up with them. As a community, we could benefit from more discussion about the process itself, rather than endless inspiration galleries.

(al) (il)

Footnotes Link

  1. 1
  2. 2
  3. 3
  4. 4
  5. 5
  6. 6
  7. 7
  8. 8
  9. 9
  10. 10
  11. 11
  12. 12
  13. 13

↑ Back to top Tweet itShare on Facebook

Paul Boag is the author of The User Experience Revolution and a leader in digital strategy with over 20 years experience. Through consultancy, speaking, writing, training and mentoring he passionately promotes digital best practice.

  1. 1

    Awesome post. I haven’t been adhering to steps like this so I felt that I was building great site that people didn’t want. I wasn’t putting, for instance, typography into so much consideration. Wonderful and insightful post.

  2. 2

    I am on. Love this challenge.. but my designs are not all that great..

    • 3

      You need to have confidence in your work. Who says what is great and what is not? The point is that you need to be able to justify your approach.

      • 4

        Couldn’t agree more. Confidence is essential in every art form, especially design. To say that something is great is in the eye of the beholder. The approach is where it counts.

      • 5

        Its really great words.. paul

  3. 6

    Stephen Van Tuyl

    September 21, 2011 6:29 am

    Being totally self taught, I approach this challenge with some trepidation but, at the risk of being shredded by my better trained peers, I think I might participate.
    Great idea BTW.

  4. 7

    Incredible article. Thank you very much dude. Respect for you.

  5. 8

    great… thanks for the information… will try my best :D

  6. 9

    this post is something for me :)

    few days ago I decided to create project for fun
    using my best knowledge of HTML5, CSS3 + jQuery

    best practices from

    grid from
    twitter bootstrap

    injected with MEDIA QUERIES
    so it suits screen + ipad :)

    and so on

  7. 10

    Dennis Coughlin

    September 21, 2011 6:40 am

    Good post Paul.

    I agree with your overall idea, but think you need to change your Challenge slightly to accomplish the goal.

    “Write a blog post justifying the design approach you took to one of your websites. Then, encourage others (who are NOT Web designers) to provide feedback and ask questions.”

    Like you said, I think we need to practice explaining and justifying our designs to our Clients. Doing this exercise with other designers won’t produce the desired result.

    For example, you mentioned explaining the chosen grid to justify white space on a page. I know if I starting explaining the 960 grid to “the business”, their eyes would glaze over, they’d wait until I finished and then say, “Yeah, but there’s too much white space.”

    And understandably so. It’s not their business to know about grids or worth their time learning about them. In that situation, I think I’d produce an example site with lots of white space that they can relate to or show an example from the mood board like you suggested.

    It’s a big challenge trying to explain design principles to people outside of the Web Design industry and you’re right, it’s a very worthwhile skill to develop.


    • 11

      To be honest I think there is value in both. I found peer to peer design crits very useful at university especially when the designers are willing to seriously challenge you. That said, asking non designers is very useful too.

      • 12

        The challenge is NOT collapsing under the crit! I think some things I do are innate. When asked to justify them – it sadly comes down to – because I like it.

        BUT – the “because I like it” is usually based on some logic I had at some point in my career as justification for using it.

        I’m not totally logic driven – but”because I like it” doesn’t translate always to “the client likes it!”

      • 13

        My old music teacher grilled me once when my sight reading chops under par. I felt really bad, ashamed about it & practiced my but off. In the next lesson, he explained thats he’d created an uncomfortable experience intentionally so I’d do something & change what I was doing.

        Since I’ve been doing web & design I take that grilling episode and remember my old teacher when people give opinions on my work. Wether people are designers or not, all *sincere* opinions are valid.

  8. 14

    What I like about this post is that it takes you out of that passive reader state, definitely my favourite one so far.

  9. 15

    I will try critiquing a past project, and take this in consideration for future projects… thanks Paul

  10. 16

    Now this is something totally different. I love it. I just might take you up on this. I look forward to the conversations that will come from this. Thank you!

  11. 17

    Nice article Paul, thank you.

  12. 18

    This is great idea… My next theme design I will write the process and ask for critique and feed back on my blog, before coding into WordPress theme, this should be interesting experience..Thank you

  13. 19

    I’m down! This rocks. So true that without “justifying”, “explaining” (or whatever you want to call it) your design, it leaves a big gaping hole in the client’s understanding of the work. 

    I recently learned about this bigtime. I made a bad design presentation to a longtime client, expecting I’d get the job anyway. Lost the job, then was given a shot at another one. After improving my presentation (alot) the response was all positive. 

    Designs need to be “sold” in order to be “bought” – just like anything else.

  14. 20

    what an AWESOME post… really very helpful for beginner’s like me.. my designs are always at subconscious level… and i think may be this is a part of being creative :D :D but i was wrong.. this article is like an eye opener , showing me the path… Thank u so much..
    and when i was reading this article i was thinking ,if i do this challenge to whom will i discuss this , who guides me with creative criticism… your last lines about sharing and discussing this challenge here , made me really happy.. Thanks alot..

  15. 21

    Enter the lair, if you dare…

    Don’t say I didn’t warn you, because I just did. In that sentence….up there.

    Man I can rhyme good. I didn’t even try. That’s talent. Don’t Hate. I can’t help how awesome I am sometimes.

  16. 22

    This is a great idea. Class Crit days were my least and most favorite days in college. I really felt it helped me become a better designer. I don’t work in web, mostly print media, but I think I may do this anyways with my signs and brochure spreads.

  17. 23

    Scott Richardson

    September 21, 2011 1:21 pm

    Cool idea, though I dislike that it starts with discussing about what ‘grid’ you used. We rarely, if ever use grids – though we have consistency in margins, paddings, and gutters etc, we don’t confine ourselves to the strict nature of the grids.

    • 24

      I find grids to be liberating rather than confining.

    • 25

      I too didn’t make use of grids, in fact, I totally loathed them for quite some time. But, I’ve discovered that they are amazingly liberating and are a ‘golden’ key in web design.

  18. 26

    Thank you! What a great post and full of useful information that I will most certainly use in my next client meeting. I have been looking for a way to up my game and develop my work so that I’m truly happy with it. I think this was just the info I needed to understand just how to do that.

  19. 27

    Great article! I find it so important to explain my designs to the client when I present it to them. It shows that thought was put into the work and that their goals for the project is brought out in the design. Here’s a link to my design that I would like class crit on (it’s not a web design but included web designs in it):

  20. 28

    I think this is a great challenge, well done for pointing out such an important skill that a designer can have.

    I’ve had to justify the reasoning behind a design with a client this morning, analysing your own works makes you think about why you designed something in a particular way – even if at the time of design you thought of a certain element or layout that ‘just felt right’.

    It’s actually quite surprising how well it can work – if you can rationalise a design well enough and the reasons why you think it will work, then you have every chance of changing a clients opinion from disliking a design or element to becoming an advocate for it.

    It’s something I’m going to try on every design from now on – even if it’s with peers or friends providing critiques to try it out more.

  21. 29

    Great Idea! Love this challenge…I’m currently redesigning my blog( theme and I will definitely write the process to get critiques and feedback.
    Smashing magazine is no doubt the best place to find so many talented designers and developers and it’s very useful to me to get critiques, feedback or suggestions from them. Thanks for this awesome challenge.

  22. 30

    Here’s my link, process, woohoo! Check it out y’all:

  23. 31

    This is a brilliant post and an awesome challenge, the amount of my clients who have been more impressed with my work over the past few months since I have been providing evidence that I have considered the approached to their projects; effectively completing this challenge for them all in an email.

    Doing this as a best practice also ensures that you always consider and question your own perceptions – “that looks nice” – why? Why have I put that there? Why did I use these colours and fonts? And so on.

    Brilliant stuff, you’ve really contributed towards building better designers, or at least more reflective ones with this, thank you!

  24. 32

    Very nice challenge indeed. I can’t wait to read more about other designers’ choices.
    Here is my little contribution :

  25. 33

    Ok so here it goes this is the first time I have every done a post about my work

  26. 34

    Hey gang,

    Great idea! I really enjoy the design vs. coding my design challenge.

    I have a question – I love all the feedback on Smashing Magazines articles.

    However – I always have questions regarding design or coding.

    Does everyone here use a forum too? SM doesn’t have one. Does anybody have a favorite?

    My intention is NOT to hijack the thread. So I apologize. I just don’t know where to ask (SM readers seem to be the most attuned to what I do) – – Thanks!

    • 35

      There is a kind of forum at LinkedIn. A Group called “Smashing Magazine Fans”. You can ask questions there, or find a more specific group per topic question you have. I am involved in lots of groups at LinkedIn. I love it.

      You could probably also ask about the location of more formal forums within the group.

      • 36

        Thanks Heather – I appreciate it. I work by myself and often like to run ideas by people – or ask questions about technologies I haven’t caught up with.

        I really hated to ask this question because it wasn’t related to the article – but didn’t know what else to do! :^)

    • 37

      You might want to checkout the forum associated with my own site.

  27. 38

    Awesome article. I have been designing for last 16 years. After the class criticism when I was in school…I never even thought about how constructive criticism helps you develop further until I read this article. As you had mentioned I have been designing things just because I like it without much thought given to it. I hope I can break that habit and start implementing your suggestion.

  28. 39

    I’m still new in terms of being a web designer, but a long time blogger so explaining my design is probably easier than actually making the design (which was over a year ago):

    My portfolio is located at

  29. 40

    I find that I really enjoy doing PSD to HTML conversion but when it comes to designing websites from scratch, I get frustrated with the design process. I don’t have a formal design background and I’m very critical of my work. That said, I would love to be able to create amazing designs. What do you all recommend? Is formal design education the answer? Can self-study and persistent practice take the place of formal education?

    • 41

      I believe you enjoy Front End Development over actual Design, some people find it easier to code and slice other people’s work. Some people prefer designing their own. I don’t think there’s a problem with doing both.

  30. 42

    Autson is the pioneer in the field of web development, web design and Internet marketing. We provide unique and innovative web development and design solutions as well as we ensure you a strong online presence which can expand your business. Your expectations are our priority and we will never let you down.

  31. 43

    Raring to go. Always love the challenges

  32. 44

    I remember these as well. Now when I’m finished with it I tend to miss these critisism forums but I do also remember the dread of presenting your work to a class of 60:ish students and a few teachers who would then throroughly pick you to pieces if you couldn’t defend every odd descision.

    To be honest though I equally learned to defend and explain my descisions as I did to recognise that some peoples opinions or critisisms are pure bullshit and to weed out those responses from what you take seriously. This is also something that you should have taken up in this article since alot of the time people will just not “like” a certain thing and they will ad-hoc reasoning to why this should be wrong.

    I remember one project in particular where we had made a printed design and we had a graphic element near the bottom to balance the page since it was heavy leaning to a certain side (this was alot due to the clients graphic profile) so the element did alot to balance up the page. One teacher asked about it, we explained this and showed the page in 3 versions without this element to show that we had thought of that issue and he kept adding reasons for it not to be there since he is a die hard minimalist designer and will shred anything that isn’t to his personal subjective liking. Mean lesson here is that your design could be fine. The person could be wrong or just an ass. =)

  33. 45

    Zheta International

    September 23, 2011 5:40 am

    First of all, congratulations to Smashing Magazine for the very interesting articles published. You are of great value to the web industry :)

    To keep it in short, we have accepted this challenge and published the documentation based on the above criteria in our blog.

    We would really appreciate feedback from fellow designers and developers on:

    Thanks in advance!

    • 46

      Amazing design! Like the ample “breathing space” and the intriguing full screen width slider. Bookmarked for future reference. Thanks for sharing.

  34. 47

    Here is my contribution to this challenge/dialog/discussion! Feel free to comment!

    The blog post:

    My website:

  35. 48

    First of all I would like to express my gratitude towards the very good work done by the Smashing Magazine team.

    The company I work for has taken this challenge and produced the following documentation:

    Let us know what you think!

  36. 49

    I love this challenge idea! The best way I have found to keep projects on track is too simultaneously educate clients about type, imagery, style and layout while earning their trust. In college and early in my career, critiques were a two sided discussion with the stronger negotiator won and all of his or her design choices were made.

    My work is much better today and revisions rarely exceed one round because I have learned to be a good educator. Starting at our first meeting, my clients are afforded a solid understanding of how their personal design and functionality preferences will affect the business’ bottom line. We make decisions together based on budget, articles, past projects and our prefrences. When a crit comes around there is little left to debate because all of the decisions were made together. The process is fun and rewarding. I learn something new from every client.

  37. 50

    Guy .. Beautiful .. Wonderful .. I will bookmark your blog and take the feeds alsoI am happy to search out a lot of helpful info right here in the post, we’d like work out extra strategies on this regard, thank you for sharing. . . . . .

  38. 51

    Great idea. I’ve been wanting to write this for a while now so it’s good that you guys came up with this idea. I needed that little push :)

  39. 52

    Great post,

    I would like to participate, but i have to see if i can find the time to write something.
    I have a check list for clients and usually a project is divided up in different sections.

    In short:
    Depending on the project it mostly is divided in content, layout/wireframe/grid, mood, colors, typography, functionality. This way the client can sign of each individual section of the design process and we can talk about (instead of “fight”) and improve on those decisions.

    I started doing this after some heavy discussions with clients and the need to defend my design. The problem is on one side that a client can’t understand what were talking about. The other problem is information overload. Anybody can at least grasp the fundamental principles of typography, color, grid or whatever design element used (or understand the importance of them). It is just that when we go to a client explaining it all in one time it is just too much information to handle. Most of us have been practicing for years to grasp all these principles and it is simply impossible explaining a client all of these things in a little presentation. We need to be a guide to our clients or otherwise well end up with a client judging the design on a personal instead of a professional level.

  40. 53


    September 26, 2011 8:31 am

    Hi, there!

    Great post! To stand for the design and to be able to explain the design point to the client is part of every project. Recently, we had a case where the client proposed changes after the final agreement for corporate identity design. He came and said: what if we do it like this… We decided that this is a good chance to make an experiment.
    So, we sat togeter with the client and made the changes he wanted, accompaigned with explanations what each change will break in the corporate identity idea and why we chose what we chose for his design. The final result was, that after swimming a bit with us in redesigning and trying out his own ideas, he was completely in love with what we already had setup for him and he deeply understood his corporate design because of all additional explanations we gave.
    We spent 1 hour into this case study and we were very happy to do it. It proved from upside down that explanations about chosen design and approach are absolutely necessary to keep up the good work and relationship with the clients and they are finally thankful for this additional information.
    Thanks once again for the great post! We will use some of the information to refine our approach.

  41. 54

    this post is so beautiful that I took notes about every sentence from here.
    A millions of articles like this are online, but this is unique, simple and understandable!

    Next time I know where to start..:)
    Thanks very much!

  42. 55

    I will accept your challenge :) Two or Three days later i will post in my blog :)

  43. 56

    That was fun. It was interesting to look at what others had to say.

    Here’s mine:

  44. 57

    Hello everyone, I am fairly new in order to right here, so Hi!

  45. 58
  46. 59

    I thought this post raised an interesting point, if we make design decisions consciously are we more likley to match the clients requirements and to be able to justify decisions which we’ve taken?
    Interesting stuff, I’ve had an attempt at justifying some of the decisions taken on my personal website, and would welcome feedback as I’m not a designer!

  47. 60

    Better late than never! We loved participating in this challenge and reading through other comments. It was a great way to reflect on a project and the discipline and instinct involved. Thanks Smashing Magazine for issuing this challenge.

    Our response is in our blog today:

  48. 61
  49. 62

    i am accept your challenge. and i am going to create theme for his challenge. every one ready to see soon my work?????………………..

  50. 63

    Espen Brunborg

    October 4, 2011 8:17 am

    Some good stuff here, really like this post.

    After far too much procrastination, I’ve finally got my response live:

    I’d appreciate any feedback from all of you lovely people.

  51. 64

    nice posted!

  52. 65

    I had some struggles presenting the design to clients and this is a great guidelines to start with.

  53. 66

    Great idea Paul and SM! I’m going to take a slightly different twist on the theme and write the blog post as I go through the design of my next site, rather than taking a retrospective look at one of my previous designs. I’ve already started and it’s actually really useful in making some concrete decisions where I may have been indecisive or just gone by “gut feeling” – one of the perils of being a freelancer working alone!

  54. 67

    Glad I found this link, even if it is ages old. You really should be proud of this article. I am a crap designer in my opinion but I am just now learning and by that I mean i’m just now learning EVERYTHING, I can’t read HTML, java, PhP, or any other language for that matter. But I have been practicing by altering my scripts and learning some SEO skills. I hope to actually learn to code but I’ve been very doubtful that I’m capable of learning something as complicated as code but I’m still planning on trying. Thanks for this article.

  55. 68

    great idea! it’s very interesting to hv good ideas like this flowing……..


↑ Back to top