Menu Search
Jump to the content X X
Smashing Conf San Francisco

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 San Francisco, 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.

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 article1, 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 System2
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 space3 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 Kuler4, which produces a palette based on established theory.
  3. Emotional response
    The extensive research5 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 palettes6 from images.

Adobe Kuler7
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 Moredays9, 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 ClickTale10. 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

↑ Back to top Tweet itShare on Facebook


Paul Boag is the author of Digital Adaptation 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

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

  4. 7

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

  5. 8

    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.

  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.


↑ Back to top