The topic of the event was Design for the Future, with a focus on the impact of young people on design, and how design can be ethically and socially responsible. If anything, my talk was about designing for the past, with examples of using local historical archives in film and on websites.

To keep things snappy, the format of the evening employed a Petcha Kutcha approach (pronounced pa-charch-ka in case you’re wondering). Each presenter is allowed 20 images, shown for 20 seconds each. That’s a pithy 6 minutes 40 seconds per person with a strict one minute gap between talks.

With presenters forced to be concise, and the audience not looking at their watches, the pace and length seems perfect for a brief overview of any subject. The other speakers were Lyndsay Grant and Clara Lemon from Futurelab; Scott Farlow; Claire Selman; Conway and Young; Kate Rudman; Rob Law of Trunki; Romy, Sandra and Tanya from Knowle West Media Centre and Walter Jack. Big thanks goes to Holly from RIO for organising the event.

For the past three years I’ve delivered a presentation on web design to a class of graphic design students here in Bristol. This is always an intimidating prospect, not just the thought of presenting to a design-savvy audience who have grown up with the internet, but also considering what level to pitch my talk at.

Too simplistic and it may appear condescending. Too advanced and it ceases to seem appropriate or stimulating to a room of visually-minded people.

With this in mind, I have chosen to share some of my points in a series of articles. These are aimed at mid-degree (second-year) graphic design students who have been tasked with creating a web presence for the first time. If the articles have broader appeal to a wider audience - print designers considering the transition to the web for example - then even better. Over time I hope to open up discussion and comment on the articles so that the presentation can be improved for next time.

A personal point of view

All the usual disclaimers apply - this is my personal take on the subject and is intentionally narrow in scope. While I will try to draw on real-life experiences, I’ll respect the confidentiality required for the many client projects. I’ll also try to avoid geekspeak wherever possible, although introducing a small amount of technical jargon will be necessary, though I hope not discouragingly so.

What is a ‘web presence’?

First I’d better discuss what I mean by a ‘web presence’. Traditionally this refers to a small number of web pages linked to one another and typically comprising of an about, portfolio, contact and home (or front) page. This structure - which covers any visitor’s checklist of who, what and where - can still hold you in good stead at the start of any website design.

For a self-promotional site of the kind students may produce, an ‘about’ page expresses some of your background, experience and personality perhaps with a downloadable CV; The portfolio is often a gallery space with a reasonable amount of photos, illustrations and layouts; ‘Contact’ should enable visitors to get in touch with you easily and the home page is probably the first thing they see, so should be a summary of all the above - as well as an pleasing expression of your design sensibilities.

Everyone is a designer now

While that all sounds reasonably straightforward, let me throw in the following thought. The ‘classical’ outline above is the best place to begin but is by no means the only sort of effective web presence. Chance are, if you use Facebook, you already have one that is updated on a frequent, perhaps obsessive basis. MySpace pages can also be styled and ‘designed’ to a degree that only a few years ago would have been beyond the capabilities of many a web design guru. It’s getting easier and easier for anybody to publish and maintain impressive websites without the apparent need for a designer. And if that sounds scary enough for your future job prospects then print designers should take little comfort either.

That said, I think that while web design exists in a constant, healthy state of flux and change, design thinking is invaluable. Combine solid, fundamental visual skills with a curiosity about the new mediums and you should weather any technological storms. I believe this is the most exciting branch of graphic design to be involved in right now, and my commitment to work more on the web side of things (with the occasional print commission) demonstrates that I’m putting my money where my mouth is.

The proper definition

So that’s my upbeat spin on things - time for an ‘official’ definition of web design courtesy of premier online encyclopedia, Wikipedia:

“Web design is a process of conceptualisation, planning, modelling, and execution of electronic media content delivery via Internet in the form of technologies (such as markup languages) suitable for interpretation and display by a web browser or other web-based graphical user interfaces (GUIs).”

Hmmm. While that sounds very authoritative I’m guessing it doesn’t help most of you. Let’s take a deep breath and a moment to break it down:

“… is a process” - So we should know design is a process - it doesn’t just happen - and one that requires care and consideration to do well. Breaking a complicated process down into stages or bitesize chunks - which I’ll attempt in later articles - makes it all feel much less daunting.

“conceptualisation, planning, modelling” - More than just visual graphic design then, however important the look and feel is (and I regard it as very important).

“electronic media delivery via Internet” - Delivery is the key word here, but for now let’s say we are publishing on the web to an potential audience of millions (note italics).

“Markup languages” - The programming DNA that makes the web work so wonderfully. As designers we can learn these intensely and become fluent speakers or we may just pick up enough to get by. Put another way: you can spend a weekend in Paris without knowing any French, but you’ll have a better trip if you can chat with the locals. For a tangible example look for a ‘View Source’ option on your web browser to see the underlying code that makes this webpage tick.

“interpretation by Web browser” - Many designers are shocked at first to see their carefully crafted websites look different on other people’s computers. You may be using sleek Safari on a Mac with a gorgeous screen, while someone else is stuck with an old version of Microsoft Internet Explorer on a clapped-out PC. What’s more it may not even be on a regular computer, but a mobile or iphone.

“Graphical user interface (GUI)” - And here, right at the end of the definition, is our first mention of graphics. Icons, buttons and layouts have all have been carefully designed to make online life easier and, sometimes, more beautiful.

When I first quoted Wikipedia for this definition to use in my presentation, the following footnote appeared at the bottom of the page:

“This article may need to be rewritten.”

While meant as an invitation to improve the user-generated encyclopaedia entry, it also carries a neat relevance to web design itself. By the time a second-year student graduates, the working landscape for digital designers will have changed considerably.

In future articles, I will look at the elements of web design in more detail (time-permitting) and open this series up for much-valued feedback.

exchange2improve.eu is an online collection of case studies to support shared learning and encourage the development of excellent Social Enterprises across Europe.

There are contributions from five countries across Europe and I worked closely with UK partner Social Enterprise Works to present the resource in a clear and accessible way. Each case study needed to be searchable by different criteria (by country, topic or alphabetically) and also fit into the EFQM Excellence Model. Designed for professionals working in the Social Enterprise sector, the homepage diagram enables visitors to quickly see all case studies under each of the nine EFQM categories.

‘Exchange2Improve was created in close co-operation between the transnational EQUAL partnerships DESE and XoP in 2006-2007. It aims to provide a bank of empirical, credible knowledge of social economy. The website presents examples of good practice from social economy enterprises from the partner countries, as well as general performance improvement tools proven in practice and contextualised in SEE reality.’

The Institute of Physics Publishing asked me to design and build a site for their AS and A2 level Physics courses. The previous site was difficult to maintain and complex to navigate, making it difficult for students and teachers to find what they wanted. A newly designed site had to reflect a re-branding of the course and be consistent with the print material and course publications. The knowledge base contains many downloadable resources and help for Teachers and Technicians.

Working closely with the design studio and the IT departments at IOPP ( Institute of Physics Publishing) the resulting site is more visually exciting and easier to use, as well as being fully updatable by staff members.

From ‘About the course’:
‘Our core aims are that the course:
Makes physics exciting and relevant
Is contemporary in content and modes of delivery
Is attractive and accessible to the widest possible variety of students
Sets physics in a variety of contexts, illustrating connections with everyday life, people, places and cultures
Rewards students for initiative and commitment and allows them to develop their own interests
Fully supports and recognizes the use of essential mathematical methods in physics, helping students to understand them
Fully supports teachers using extensive tried and tested resources and ongoing support’

Visit the Advancing Physics website

Around the time I moved into Spike Design, Gill Nicol became Director of Spike Print Studio and I was asked to take on the graphic design for the largest open-access print studio in the South West. The first job was to introduce a comprehensive visual identity that could be used across print and web, followed by a large amount of print from leaflets to artist catalogues.

The website continues to grow and reflect the mission of the Studio - is to provide exceptional resources, inspiration, training and space for artists. It is regularly updated by staff (including a blog from Gill) and there is a section for Members to display a selection of their artwork online. (http://www.spikeprintstudio.org/members-artwork/)

I have built an area for Members where they can post opportunities and exhibition details and discuss printmaking online. The website has since attracted the attention of printmaking studios from around the world and raised the profile of Spike Print Studio both here and abroad.

For those interested in studying at the UK’s world-class dance, drama and circus arts schools, the Conservatoire website (www.cdd.ac.uk) is the place to visit.

The Conservatoire for Dance and Drama (CDD) was established to secure the future of conservatoire-level vocational training in dance, drama and circus arts in Britain. I was commissioned to design and develop a website to help existing and prospective students from around the world find the very best courses to study in the UK.

The site also delivers information about the activities of the Conservatoire and is a valuable resource for staff members from the Affiliate Schools. This has recently been developed further with the introduction of a Staff Area as a space to discuss and disseminate information between Schools.

The website is fully updatable and I’ve delivered training in using the site to Conservatoire staff members.

I also design many of the printed publications and annual reviews that the Conservatiore produces.

The affiliate schools of the Conservatoire are Bristol Old Vic Theatre School; Central School of Ballet; The Circus Space; London Academy of Music and Dramatic Art; London Contemporary Dance School; Northern School of Contemporary Dance; Rambert School of Ballet and Contemporary Dance; Royal Academy of Dramatic Art

Bristol and Bath has a vibrant and diverse social economy sector, covering everything from childcare to wood recycling. Social Enterprise Works provide free guidance and practical business development assistance to prospective, newly formed and established social enterprises during critical periods of their start up and development. They have supported over 400 social economy organisations in Bristol and beyond since 1993.

The website will announce regular events, distribute resources, display the latest news and provide answers to key questions. An online Social Business Directory lists organisations and allows visitors to leave their comments. The Director’s blog is one of the first in this sector.

‘Paul Matson designed our website. It was our first website, and we had little knowledge of the process and having just re-branded our organisation we needed a strong web presence, and as a membership organisation something that was accessible, interactive, fresh and lively. Paul delivered all this and more, we are really pleased with the website, how it looks and works, and have had really strong feedback from users. Paul also explained all our options clearly and made the process a pleasure. We have learned a lot, and our website has raised our profile and is something we are proud of as an organisation. Thanks Paul.’
Rob Webster-Communication and Marketing Manager

Visit the Social Enterprise Works website

Electric December 2006

The online advent calendar reached it’s eighth year and the third year I’ve been involved as design and technical co-ordinator. 24 more days of digital distractions to enjoy in the countdown to Christmas, with contributions from local community and education groups alongside those from leading creative media companies. It’s also part of Bristol’s bid to The Digital Challenge. This year’s identity was developed with the extremely talented Ginger Monkey.

Electric December 2005

This popular online advent calendar has evolved since 1999 into an eagerly anticipated annual event. The 24 digital presents included contributions from small organisations and schools alongside major companies such as Aardman and the BBC.

In 2005 I created a new design identity for the event, based around the theme of Connecting Bristol. The website became more direct than ever, as presents were one click away.

www.electricdecember.org/05

Electric December 2004

In 2004, I was responsible for design and technical co-ordination. Contributors from Cornwall and Plymouth were involved, as well as Bristol and Bath.

www.electricdecember.org/04

“3,166,034 hits in 88 countries”
2004 website statistics

My first Electric December project back in 2001 was this animated tale of a couple who lives, due to thier different working patterns, rarely intersect. Presented under the banner of Decode Publishing the present can be found under day 7.

View Working Patterns, Day 7 (Decode) on Electric December 01

This animation was produced in collaboration with the Truspin collective in Bath with the support of Statement Media Arts. It was an Electric December present in 2003.

Watch the 21st Floor animation on Electric December 03.