Craft and Care: Future Of Web Design London 2012

Future Of Web Design London is a fantastic yearly conference which I’ve attended for the last four years, and this year I was incredibly lucky to also speak on the Track 2 stage.

As I do with most conferences, I live-tweeted all the sessions that I saw, and I’ve compiled these into a Storify stream for those who want a blow-by-blow account of my conference experience. This post is more of a digest, what I found to be the themes and threads running through the two conference days.

Unfortunately I could only cover the sessions I attended. As there were two tracks I missed some brilliant talks. Those I did make it to were:

  • Notes On Design – Brendan Dawes
  • Client-centric Web Design – Paul Boag
  • Art Direction vs The Web – James Fenton
  • Inform To Inspire: Perfecting Your Creative Workflow – Stephanie Troeth
  • Web Typography: The Good Bits – Jon Tan
  • Creating Wonderful Web App UX – Richard Shepherd
  • Dr Weblove or: How I Learned To Stop Worrying And Love The Web – Remy Sharp
  • You Are A Channel – The Standardistas
  • A Responsive Process – Steve Fisher
  • The Future of CMS: A Million F#%ing Dollar Web Project?! – Paul Bellows
  • Organising Your Stylesheets – Chris Eppstein
  • Failing and Doing It Well – Mark Boulton

In which I get a bit meta

On Day Two of the conference, the Standardistas gave a lovely and inspiring talk, ‘You Are A Channel’, in which they spoke about how we mold our knowledge and ourselves as individuals, where we want to be in life (and in our careers), and how we can use our values and output to get ourselves to where we want to be in a way that is true to our individuality.

When speaking about how we ‘are what we eat’ in terms of the input and output of ideas, inspiration and information, the Standardistas gave the example of being a cow vs being a squirrel. A squirrel will continually collect nuts throughout the year, creating many stores for winter, but when winter comes they will only be able to remember a few locations of the stores and most of those nuts will go to waste. This is like those of us who continually add bookmarks and images to ‘favourites’, collections and ‘Read it later’ services. We may bring all of this information together, but very rarely do we actually go back to these silos and actually get the value from them that we originally intended.

The cow, however, is continually grazing on the small amounts of grass that it needs. As a by-product of this nutrition, the cow is frequently producing milk that makes cheese which is not the same as grass, but is very nutritious to others in a different way. This was a lesson in how we should masticate our information. We shouldn’t take on more than our minds can manage, and we should synthesise the information to increase our understanding and make ourselves into better designers.

And how is this meta?

Well this synthesis is just what I try to achieve through my digest posts. Live tweets are really a way of sharing with others, and a form of quick note-taking. I directly share what I hear and throw these nuts out on Twitter. When I first wrote a digest mindmap after dConstruct in 2010, I was trying to get my head around the ideas that were shared with me.

It reminds me of those reading comprehension tasks you have in English lessons when you’re in primary and early secondary school. You’ll have to read a short story, and then are asked to write about a particular theme or element in that story to prove that you understood it. Now I’m not trying to prove anything, but I do find that the process of trying to connect the dots, link the themes and ideas, helps *me* better understand the ideas of the speakers, and helps me understand how I can use this information to make myself a better designer.

The fact that I blog this stuff? That’s the kick I need to actually get on and digest it. Well, that and I love being able to share what I’m lucky enough to experience with other people.

Craft and Care

One of the overarching themes of Future Of Web Design this year was definitely craft and care. In yourself, with clients or bosses, in your design and development work; as Mark Boulton expressed, having a passion and love for what you do and putting it into your work should be more important than time scales and money. Time limits and worrying about getting paid makes a project much harder to love.

Craft and Care: Yourself

As I mentioned in my meta opening, the Standardistas really focused around the craft and care you put into understanding yourself and your learning. The more you take time to be selective about what information you put into yourself, and the more time you take to assess which of your values are important to project to others, the easier you will achieve your goals and become a better designer.

Brendan Dawes really started off the theme of the value of the individual with an amazing quote he’d heard from Aimee Mullins:

Own what it is that makes you different

The thing we must remember when we’re starting work is you’re bringing *you* to the project. This was a great way to start the conference, empowering the designers, reminding us all that we’re not just an extension of Photoshop or Fireworks, we have value in ourselves.

Brendan also extended the consideration of craft to the world around us, reminding us not to get complacent about everyday things. Not only should we seek inspiration from our surroundings, we should give everyday objects the respect and acknowledgement they deserve, they only became so widely used because they’re such good design.

Craft and Care: in design

Richard Shepherd provided what I think was my absolute favourite thought of the conference:

Great user experience is taking our human desire to please other people and putting it into our apps and sites

Through the theme of craft and care, I see the care in design as being the consideration of user experience. User experience really is something greater than web design; web design is a small part of the experience of a product, but is also the single most important factor in the design of a website.

Both Richard Shepherd and Chris Jones (who won the FOWD Factor five minute talk competition) spoke about using humanity in experience design. Chris’s talk focused around the question “is it human?” and how important it is to consider this when designing or copywriting. Chris talked about something which Brendan Dawes had also mentioned; sometimes we get so immersed in tech, we forget that everything we’re doing is actually for real users.

Craft and Care: in development

Chris Eppstein discussed true craft in CSS development, talking about his experience working on caring.com. Chris pointed out that CSS frameworks aren’t the solution to unmanageable CSS, because CSS isn’t the problem, the developer is the problem.

It was clear that Chris is a true craftsman of CSS as his whole talk was focused around staying true to meaningful, semantic, well-structured HTML, and layering the CSS on top. Being realistic, Chris showed that some HTML needs to acknowledge the structure required by CSS and how he then opts for consistency over flexibility of markup.

As an advocate of SASS and Compass, Chris spoke about how these tools can make CSS stylesheets cleaner, and built upon reusable components, but he really ensured that the audience knew that these were only ways to enhance upon a solid CSS foundation which is well-named, structured, documented and regularly refactored.

The right tool for the job

Much of the talk at FOWD mentioned the tools of our trade. The emphasis however was always on remembering that tools are merely tools, and that our processes are really defined by us, not the apps that we use. In my talk on flexible web design I tried to share my thoughts on how we don’t have the right tools for responsive design, but we don’t necessarily need a killer app, it’s more about us understanding the processes and tools that make us most creative as individuals.

Steve Fisher summed it up better than me in a tweet during the IT/Web Education think tank discussion when he said:

Tools don’t produce great design, people do.

Jon Tan gave an overview of typography on the web, describing how we can learn to best use typography design to give structure and meaning to text. As designers we often think we’re being intuitive in our work, but usually there’s a reasoning behind it based on experience or fact.

Paul Bellows’s talk was a fantastic walkthrough of the problems that CMSs have trying to keep up with the future of web content, and more importantly, the CMS user. Paul pointed out that there are things that CMSs have done for years, but they don’t necessarily correlate with how ordinary people work. If you’ve done it right, a CMS must be sustainable, you get as much (or more) out of it as you put into it and it allows ordinary people with ordinary intelligence solve complex problems. A CMS is *just* a tool.

Both the Standardistas and Steve Fisher spoke about how vital it is to better understand what we do in order to grow as designers and design more effectively. Everyone knows *what* we do, most know *how* we do it, but very few people know *why*.

The definition of web design

It’s an exciting time to be a web designer, and there was a lot of buzz going round the conference about what actually constitutes web design. Steve Fisher said that he believes in as little as a year’s time, responsive web design will just be referred to as ‘web design’ because it will become the norm.

James Fenton also emphasised that graphic design on the web isn’t about adding pretty images. It’s about what we use to make our content easier to use and understand.

In my talk I tried to emphasise the importance of content in web design. Without real content, we are just decorating random text (such as Lorem Ipsum!) not creating anything of any use.

Content is king

Steve Fisher spoke about how a website is a black hole without content in it, and we seemed to forget that for a few years. Well-structured content makes a good website. And the structure is more important when you’re manipulating it responsively, which is why we’re starting to understand how central content is to our work all over again.

Process

The problem with a lot of design conferences past was that they could lose focus on design themes, and fall into predictable talks on web development trends. Luckily FOWD continued a run of recent conferences I’ve attended which ignored these kinds of talks and there was a lot more on interesting design theory, particularly around process.

Especially with the advent of responsive design, we not only need to revise our processes, but also examine what we’ve done in the past in order to formulate new better ways of working.

Ideas and problem-solving

Stephanie Troeth really lead the way on the process discussion talking about how to understand our creative workflow and find the most effective ways to trigger ideas. Stephanie explained how we can get too attached to ideas, and we can feel ownership of our ideas and price them at more than they’re worth. What we really need to do is let our ideas out, ensure they’re not being restricted by our surroundings.

Stephanie spoke a lot about the formulation of ideas as part of the problem-solving process and how framing a problem is the key to understanding it; working out who, what, why, how? Stephanie ended on the ultimate point that the creative process is not an assembly line, we can’t just push out great ideas but we must be heartened that the inspiration is in our hands.

Steve Fisher’s talk covered a huge amount on process. Steve spoke about the importance of research and exploration, explaining how understanding the story is an important part of the discovery stage of a project, it informs our decisions later on. In the strategic direction phase, all the information from the discovery phase is brought together, this helps define the project. The design phase is from sketching to working in-browser and everything in-between, particularly in the case of responsive design where working in-browser is even more significant than before.

Steve had an interesting point in that ‘visual design’ is really just a term used for clients. We know that this stage of the design process is so much more than that, and a culmination of so many stages that went before. Steve pointed out that really the significance of identifying a ‘visual design’ stage is the knowledge it comes later on. Following on from Stephanie Troeth’s talk, it’s understanding that the solution to the problem can only come after we’ve identified the problem itself.

Pattern Libraries and Style Guides

Steve Fisher, James Fenton and I all mentioned using pattern libraries and style guides as part of a solution when trying to express design ideas in a way that can be translated easily into responsive design. Steve explained how style tiles and guides help avoid designing for specific widths. They can help us get an idea for how elements work together.

Feedback and communication

Designer-developer relationships

Remy Sharp’s talk was incredibly popular, broaching many of the issues that developers have when dealing with designers. Remy explained that there’s an huge issue where designers and developers don’t talk to each other and just throw problems over the wall. This often ends in frustration on both sides and a suffering project, and Remy explained how the key to solving it really mostly good communication.

Of course, Remy suggested that learning to write code is the best way to try to understand where a developer is likely to come across problems, but he also gave list of solutions to common developer pain-points that designers should bear in mind when trying to make a developer’s life easier:

  • Show hover states in your mockups
  • Show where the error message would go if there’s an error
  • Show what the logged-in state looks like if there’s a log in box
  • Where complicated graphics are concerned consider if they can be made into sprites to accommodate dynamic text
  • Use grids! That gives the development some structure and hopefully some reusable components
  • Be wary of the fonts you use FLICK isn’t good tightly kerned!
  • When using custom fonts, choose a custom font with an open license, so it can be embedded

With clients

Paul Boag gave a brilliant talk advocating client work, and ways to improve relationships with clients through client-centric web design. I was cheering from the front as I *love* working with clients. It’s not right that the ‘cool’ designers do products and the poor designers do client work.

Paul believes that getting our attitudes sorted out when working with clients is a big part of client communication, and it will give us more job satisfaction. At some stage on all client projects, we tend to have times where we feel like clients are ruining our designs but the client must be involved. We provide a service, we don’t just build websites, we provide a whole customer service experience and that should involve good communication with the client!

Controversially, Paul stated that client work was not about the user needs, but the client needs. I could see where he was coming from in terms of paying the bills, but not really in creating a better web! However Paul pointed out that there is generally an overlap between business needs and user needs, and only occasionally will there be a conflict between the two, at which point you must make a sensible decision (where he errs on the side of the client!)

Richard Shepherd gave somewhat conflicting advice when he stated that a good user experience *serves* business goals. It’s vital to success that the users feel a connection with our sites and apps which encourages use.

Paul Boag also discussed how sensitive our egos can be when designing for clients, and if a client has a good idea, don’t reject it because of your ego! James Fenton also briefly touched on democratising design and involving other team members and clients, using their ideas rather than being ruled by aesthetic decisions.

Critique

Mark Boulton spoke about feedback when working on a project. Mark had the idea that you’ll get more truthful feedback if someone doesn’t think you have spent much time on your mockup. And that this is where sketches are beneficial over more polished prototypes.

Leading on from online discussion over the last week or so, Mark also talked about critiques. Mark explained that design critique is not personal and not a dig; it’s a comment on the work, in public, and a conversation. This seemed like a good way to end the conference, a reflection on how we can use all that we’ve learnt to help each other grow as designers too. The benefit of working on the web is that we’re all part of a greater community all striving to make the web as universal and as good an experience as possible.

Published by Laura

Laura is one of the recently joined nUbelly writers. She's a very friendly and noisy freelance web designer/developer. Since first learning how to build sites (badly, with tables,) she's been mad about the web and the amazing community around it. Her big, but ever-changing, interests are mobile web, lovely semantic HTML, web fonts & WordPress.

6 Comments So Far, what do you think?

  1. Pingback:Craft and Care: Future Of Web Design 2012 — Laura Kalbag

  2. Pingback:Laura Kalbag, conference fiend | Laura Kalbag

  3. Pingback:Future Of Web Apps / Future Of Mobile London 2012 | Ponder, praise & rants

  4. Malinda

    It’s a pity you don’t have a donate button! I’d most certainly donate to this superb blog! I suppose for now i’ll settle for book-marking and adding your RSS feed to my Google account. I look forward to brand new updates and will share this website with my Facebook group. Talk soon!

  5. Novum

    Yes! Finally someone writes about of.

  6. billiards pool

    Just hit the screen of your android tablet and start to labor for the great stakes of multiplayer challenges in this carom pool game. Anyhow it is just the stick, the holes, the 8 snooker balls and yourself.
    Your pool dexterity in pool will be tested in those numerous contests given to you by this top development company. Be the pool master either like a pro or in the casual style given here. Your campaign through disparate types of snooker will be cool and deadly. As you’ll have to push the 9 ball into the one hole you’ll have to use the freedom of view angle, as you can spin your display in any direction you want. 2D graphics give authority to this aplication over its competition. The arduous amounts of game modes will bring you to your edge. This pool game presents you the decisive table contest in numerous billiards lobbies all over the earth. Simply you and the straight rails as you con the fate with your skills.
    For your luck it has a training gamemode so you can work on your artistry as long as you need to start being the ace pool player in the known galaxy. Have a game of 8 ball, pro pool or carom billiards, whatever you prefer. No matter if you arrive from the UK or Russia, there are going to be some native assortment of this awesome cue game.
    Crokinole or straight rail, this thing has everything. As 8 ball billiards this is a cool mobile app.
    The greatest billiards on google play game up to this time! Simulacra of one best games at any point. Tailoring of the playstyle is this time in recreation history so smooth that different 10 ball pools can go and try one pocket with their sisters.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>