The personal disquiet of

Mark Boulton

Articles

On A List Apart

Sav­ing the Spark: Devel­op­ing Cre­at­ive Ideas
For most of us, ideas have to be squeezed out of us every day. To stand up to this chal­lenge, you need to arm your­self with some good tools.
Whitespace
Some­times, as in web design, it’s dif­fi­cult to add whitespace because of con­tent require­ments. News­pa­pers often deal with this by set­ting their body con­tent in a light typeface with plenty of whitespace within and around the characters.

On Vit­amin

Look­ing At Type
Have you ever been some­where where you couldn’t speak the local lan­guage? Sur­roun­ded by sig­nage, news­pa­pers, shop fronts — every­where you look there are let­ters, but you don’t under­stand what they mean. It’s even worse if they’re not Roman characters.A couple of years ago, on my hon­ey­moon in Thai­l­and, I was astoun­ded by the myriad of typo­graphic design styles. Not only was it a lan­guage I didn’t under­stand, the let­ter­forms, to my eye, were little more than squiggles. Yet some­how I was often able to under­stand the mean­ing of some signs. How? Good typo­graphy, that’s how.

On Web 2.0 Journal

Design­ing for Web 2.0: “It Will Be About People”

Print media CSS: The Guard­ian example

{title}Print media stylesheets are rarely used by text-heavy web­sites to present their con­tent in the best pos­sible way for when users press the print button. 

This example of The Guard­ian uses a rebuilt web stand­ards tem­plate to present the exist­ing design for the screen. The print media stylesheet how­ever presents the con­tent more inline with the Guard­ian news­pa­per rather than the website. 

View the example or see the related art­icle in the Journal. 

Five Simple Steps to design­ing grid systems

This series of art­icles cov­ers grid sys­tem design from easy two column grids for print pub­lic­a­tions to com­plex, ratio based, adapt­ive grid sys­tems for mod­ern web browsers.

  1. Sub­divid­ing ratios
  2. Ratios and com­plex grid systems
  3. Grid sys­tems for web design: Part 1
  4. Grid sys­tems for web design: Part 2 Fixed
  5. Grid sys­tems for web design: Part 3 Fluid

Five Simple Steps to bet­ter typography

The first ‘Simple Steps’ series cov­er­ing five simple ways to improve your typography. 

  1. Meas­ure the measure
  2. Hanging punc­tu­ation
  3. Lig­at­ures
  4. Typo­graphic Hier­archy — size
  5. Typo­graphic Hier­archy — weight

Feel­ing your way around grids

Mak­ing sense of the Golden Sec­tion when design­ing grid sys­tems. Ori­gin­ally pub­lished in Design in Flight (April 2005)

For cen­tur­ies there has been a link between art and math­em­at­ics, but how can you quantify beauty? How can you cre­ate a for­mula for aes­thetic appeal? Philo­soph­ers, math­em­aticians, archi­tects and artists have tried to answer these ques­tions for thou­sands of years. 

Dur­ing art col­lege I was sub­jec­ted to a lec­ture on the Golden Sec­tion (who remem­bers that lec­ture, come on hands up?), that ambigu­ous set of rect­angles that is requis­ite art school dis­cus­sion. Dur­ing this lec­ture I was shown slide after slide of seem­ingly tenu­ous links between paint­ings and sculp­tures, and this set of rect­angles. My lec­turer at the time seemed as equally unin­ter­ested, dron­ing along in self-imposed bore­dom. What he failed to con­vey at the time, has taken me over 15 years to even begin to under­stand. So what is the import­ance of these bor­ing rect­angles and how do they relate to design? 

Design and the Divine Proportion

Many design­ers, whether tra­di­tion­ally schooled or not, have trouble with com­pos­i­tion. I’ve sat with plenty of design­ers who simply moves things around until they feel ‘right’. 

Design is, in essence, com­mu­nic­a­tion (I know, I know, I rant about this enough, but this isn’t one of them) but the vehicle for com­mu­nic­a­tion is the design. One of the key com­pon­ents in the vehicle of com­mu­nic­a­tion is com­pos­i­tion, and in design school­ing it is some­thing that is taught as some­thing you should feel rather than cre­ate logic­ally. This has always bothered me.

Card Sort­ing — Part 1

Card Sort­ing is a user test­ing method for organ­ising data into struc­ture. There’s a lot of inform­a­tion about on what they are, how to con­duct them. Prob­lem is, they’re all over the place and mostly they’re writ­ten by sci­ent­ists so tend to be a little dif­fi­cult to grasp and bogged down in ana­lysis (which can take over your life if you let it!) I’ve decided to doc­u­ment my under­stand­ing of how to plan, con­duct and ana­lyse a card sort, from a prac­ti­tion­ers point of view. 

Card sort­ing. Part 2 — Facilitation

Fol­low­ing on from part 1, you should now have everything ready to con­duct your card sorts — cards, users, observ­ers and most import­antly a clear object­ive of what you want to achieve. 

Card sort­ing. Part 3 — Ana­lysis and reporting

In the final part of the art­icle I talk about per­haps the most import­ant part of the pro­ced­ure — Ana­lysis. This is the part in which you can get the most bogged down. You must be thor­ough, ruth­less and accurate. 

Why use a grid?

Grid design is a fun­da­mental skill of any designer. Under­stand­ing pro­por­tional rela­tion­ships, white space and com­pos­i­tion are all vital in con­struct­ing a grid for any deliv­ery plat­form — web, print & real 3d environments.

The One 2 One story

Ori­gin­ally in the archives of this site. This art­icle rep­res­ents a body of devel­op­ment for the redesign of One 2 One’s web pres­ence in 2001. The redesign revolved around mul­tiple access from mul­tiple plat­forms as well as integ­ra­tion of new mobile services. 



  • Me

    Hello. My name is Mark Boulton. I’m a designer, an author, a speaker and I run a small design agency where we work with lovely cli­ents and pub­lish books as we go. This is my blog.

  • More of me

  • Publications

    Design­ing for the Web
    Start­ing from £19 + VAT for a PDF Down­load. £29 for a full col­our paperback.
  • Where I work

    Mark Boulton Design
    A small design stu­dio doing good things for nice clients.
    Five Simple Steps
    Pub­lish­ing easy to read design books.
  • See me speak

    @Media 2010
    June 8th — 11th, Lon­don, UK.
    Drupal­Con 2010
    August 23th — 27th, Copen­ha­gen, Denmark.
    dCon­struct 2010: Design 1010 workshop
    Septem­ber 1st, Brighton, UK.
    Web­d­a­gene
    Septem­ber 29th — Octo­ber 1st, Oslo, Norway
    Web Developers Conference
    Octo­ber 27th, Bris­tol, UK.
    New Adven­tures in Web Design
    Janu­ary 20th 2011, Not­ting­ham, UK.
  • Copyright © 1999–2010 Mark Boulton. Made with an Apple Mac in Wales. Running on WordPress and VPS.net.