July 4th, 2007
Mark Boulton Design launches
If anyone has done any work for themselves—painted a painting; made a model; built a shed— you will know how difficult it is to finally stop. It’s about the love you see. The craft. Anything done for yourself has to be just right.
In April of this year, I became the Director of my new design consultancy, Mark Boulton Design Ltd. Since then, I’ve been beavering away to get a website up to let the world know what it is we do and who we’ve done it for (so far). Today Mark Boulton Design launches.
It started with a story
The Mark Boulton Design website had to tell the right story. What are we? What do we do? For who? This is all pretty basic marketing and, as designers, we go through these sorts of questions regularly. From those answers, we have to derive a brand. That was a very difficult nut to crack for this website.
If you’re aware of my work—both my writing and my design work—then you’ll know I’m all about the simple things. Simple really doesn’t come easy though; like good tea, it has to be stewed for a while. The design for this site was stewing away for about six months. Most of that was getting the brand right—the tone of voice, the typography, the colour. All of it took bloody ages.
Not just a website
The branding for this project has been applied to a number of things. First off, there is the site. Secondly, there’s the One Page Brochure (available on all pages in the four column footer); a one-page printable PDF document to leave on peoples desks. Then, there’s the RFP project sheet. On top of all of that, I’ve designed new business stationery (and had a ball looking at literally hundreds of paper samples). Quite a lot really.
It’s never finished
When I was in secondary school (about 14 years old), my art teacher would always tell me that I still had work to do on a drawing or painting. It drove me nuts. Every time I thought I’d finish, he’d tell me to go away and work on it for another week. Designing for the web is no different. In fact, this is one of the great things that differenciates the web from other media such as TV or print; it’s a canvas to be worked on again and again.
There’s a load of work still to do on the typography. I want to get the vertical rhythm nailed. I want to get some print style sheets done. I decided today that all of that will have to wait.
Anyway. It’s done. Although my art teacher would probably have asked me to keep going. (note. this is my little ‘it’s not finished quite yet’ disclaimer)
Hi Mark, looks good… one comment though, the download brochure link doesn’t work… apart from that it’s the schizzle
Thanks Graham. Sorted it.
Very nice, Mark. Perfect minimalism, and not a whiff of web3.6 or whatever it is we’re on right now.
Congratulations!
I like the simple elegant design of the new site and the IA feels just right.
A beautifully simple site with equally beautiful typography. But where’s the colophon? What is the font you’re using for your titles/logotype. And how does one obtain, or where does one go to see, paper samples?
Great work!
That’s it? That’s all? Van Dam! What happened to imagery, flash, AJAX, two point ohness? I LOVE IT! Excellent job. Makes me wanna go naked too.
Lovely site, Mark. Great work that shows just how effective layout and typography can be in the right hands. And no doubt the EE back end is just as well executed. Elegant stuff.
Congratulations! Launching your own (fill-in-the-blank) is always a big deal. I recently launched a small web design studio in the US, so I know where you’re coming from when you say you always have that “It’s never done” feeling about your web site. The new site looks great, even if it is “unfinished”. I only wish my finished work looked as good as your “unfinished” work ;)
Gratz Mark.
Beautiful and simple does certainly cover it :)
Hi, congrats for your new firm. I’m on a WinXP machine with ClearType active. I have Myriad Pro installed and it is not well rendered on Windows displays. It is barely legible in Firefox and IE7.
This is all very classy. Your own stuff is always the most difficult, but I can see the long hours that have gone into this. A great example that you don’t need drop shadows and imagery at every turn. Now, can you make the logo bigger?
I love that ampersand!
where’s the design? Ok I love clean and simple too, but this is a bit to much of less is more IMO.
dirk: In a roundabout way, you raise an interesting point.
Being clean and simple — or less is more — with this design isn’t the goal. It’s the result of the design process and the story I’m trying to tell. Now, if the story was about dragons and laser beams, then perhaps the design would be different.
I don’t mean to sound flippant. This design is the result of a considered, lengthy process.
Charles Roper: A colophon might be a good idea actually. The typeface is called Custodia from a foundry called OurType.
Its spot on, don’t change a thing. But I think you do need to say exactlywhat typeface your using, that g is sick.
Looks awesome! Good Luck with your studio!
ps: You live and work in Cardiff, right? Are there any good prospects for young designers coming out of university?
I agree. If you do somthig for yourself, it must be the best. But design of this site is not very nice, standart.
I think the site design is very appropriate. I found the Project Sheet particularly useful, as having a standardized way to build inertia early in a project is something I’ve always lacked. Filed along with Mark Bixby’s identity spectrum for a handy way of getting a crash-course on the client’s needs.
“I don’t mean to sound flippant. This design is the result of a considered, lengthy process.”
Yes I believe that, but it doesn’t look like it was. But I only have that feeling with the homepage. The several other pages are good because of the clear difference between top and content. If I were you, I would reconsider changing the homepage.
Superb Mark, typically Boulton. The content is spot on and I only wish our now ageing site had half the concision (not sure if thats even a word but it sounds good). We’ll be back for inspiration.
It looks fantastic, Mark. You’re an inspiration to programmers like me who want things to look great, but not be filled with AJAX and stupid, superfluous graphical elements. Expect any sites I develop to look descended from yours!
LOL, a designer after my own heart — it’s never finished! We are rarely happy with our own work, always tweaking or improving. I think the site looks great btw. Great typography, great colour. I’m going to explore the rest of the site now!
Hi Mark — love the design, very smart.
One thing I’ve noticed in Safari 2.0.4 is with the Nature logo, I’m seeing this:
Hope it’s an easy fix. Love it love it love it!
David
Thanks David, should be all fixed up.
This is one of the problems of elastic layouts, particularly when you’re including lots of different fonts in your font stacks. The value of an em can vary greatly therefore making the layout a bit fragile.
Anyway, thanks again.
Being that I gobble up every typography post you make I can’t help but love the design. The best descriptor is, of course, elegant.
As for “where’s the design?” It’s all over the page. Design isn’t about whizzy widgets and pastels. It is, to a degree, about conveying information in a specific manner for a specific audience with a specific personality.
If the story you’re trying to convey, Mark, is “We do very pretty things that work very well and you don’t have to worry that we’ll show up to a meeting with the head honcho with a spike through our nose” then I think you nailed that much, at least.
All that said… you might want to change your menu IDs to classes, you have an unclosed DL in the clearfix div, some rampant ampersands, and a double quote mark in the link for your vcard.
I pick nits out of appreciation. :)
Very clean look! Reminds me of Untied Shoes site — both are very good and inspirational. I do like the use of white space to the right of the main content under the post details and that you use that space after the article for the comments — subtle and works well.
Great Job Mark!
The first sentence of this entry is grammatically incorrect.
Feel free to delete this comment!
Very nice. Clean, effective but so much attention to detail!
Just one thing I’ve noticed. Under XP using IE7 (I know, I know, I have FF at home), the main content on your ‘Work’ page crosses right over to the sub-menu on the right, taking the entire width.
Just loaded up my FF Portable on the same machine, it looks like that is using the correct font (IE used Verdana) and the width is correct.
Fully blown with Microformats and all. Very nice work Mark. I would say the only thing that twisted me a bit was the contact form — but that is entirely a personal preference.
The type, the content, the minimalist design all work together beautifully.
Repeating what others have said — well done!
Great job. Simple yet very effective. I love the different typography styles and the grid layout.
Nicely done, but then that’s what we’ve learned to expect from Mr. Boulton. The PDF one-pager is particularly strong. Congratulations, Mark!
Very nicely done, Mark! It’s funny how much more work it can be to produce something so simple. One thing I found a bit odd, though, was that the copyright info at the bottom doesn’t have any whitespace beneath it. It felt a bit abrupt to me, as opposed to the footer on this site. Just a thought.
Always been a fan of your personal website and articles … this is no exception … GOOD LUCK !
Think the level of sensitivity in the typography is great to look at, and its not hard to see that you derive alot of your methods from print.
Have always been a fan of reductive design although its difficult to know when too stop. I would compare it too a writer continually shaving off words without losing the main point of the story.
I like your style…perfect!!!!
Congrats on the site Mark. Love the use of Plantin, well considered. I did notice an em related sizing issue on your contact page viewed with Safari 3(beta).
Been a lurker for some time and this is my first post, though I’m sure not my last.
Really great work! Fantastic typography.
I’d love to hear about how you built the site with EE. Is everything part of EE or only the news bits?
Fantastic work Mark! The typography work you’ve done is really fantastic. Love the gorgeous ampersands, the bulleted lists that snap to the grid, great use of baselines, and thousands of other tiny details you’ve thought out.
What about nudging? I notice the text aligns flush left with the horizontal rules without any padding. I think it looks great flush left. I don’t think nudging would add anything per se, but I’m curious why you chose not to nudge (it is the trendy thing these days!). Is that extra padding only needed when you plan on hover states and such?
Very slick and as always great usage of grids.
Mark,
Simply beautiful. I’ve long awaited the launch. A few things:
1. Copy could use some subbing—a few hanging prepositions among other things. On Contact page under “Want to work with us?” header, you need a space before the open paren of “(PDF, 47kb)” Happy to run throught the entire site for you if you’d like (@ me).
2. I was just itching to see what you did with the typefaces. I was surprised to not see any of the new vista fonts in the stacks. Any particulr reason for this?
3. I agree with Rob W. about the footer. I’d opt for a tad bit white-space on the bottom.
4. Bravo on the hanging bulletts! Only in the in left column though? Was this intentional?
Would love to see a writeup about about the typographic rhythm and grids. I’m (i think we all are) still a little hazy on baseline vs. x-height vs. cap height alignment of secondary columns and image content, etc.. I’ve been trying to get my head around all of this and juiice into an ALA article. See my (timfm) and Irving’s comments (4th and 7th from the bottom) in your Incremental Leading post.
Congratulations Mark. Well done!
Excellent site. Well done. And thanks for the post about the process. As someone who is currently working on his own studio’s site, it’s nice to know I’m not the only one finding the process a lot harder and involved than others might think.
Looks very nice. Love the simplicity and color scheme of it. Keep up the good work!
Great design.
2 things:
in IE7 on this page:
http://www.markboultondesign.com/work/
the text of description of nature.com lays over Projects column.
Other thing — it is impossible to comment from IE7.
I know i got a better browser but anyway :D
Fantastic work Mark. I’ve learned so much from you over the past year.
Speaking of which, sorry to drag it up, but I’ve been dying to give you $20 for quite some time now, any news on that?
Fantastic. You’re among a handful of designers who’ve saved me from a self-destructive life of gradients and dropshadows. It’s also nice to know I’m not alone in my struggle with vertical typography.
I’ve been secretly hoping you were working on creating a fluid site to show us all how to get our grid on…maybe down the road?
Lean, clean, mean and simple — just like you aim it to be , must feel good if it turns out the way you want it — i like it.
Two points i like to point at (humble gesture):
1. your header (markboulton/design) gives me (i know — i am a computer guy) the impression that it consists of 2 parts and there is a markboulton/life somewhere around (i know there is but also on inet ?)
2. the comma in ‘beautiful, simple design’ somewhat hangs out down the line (FF 2.0.0.4) — it looks out of place somehow and seems to be too big
Beautiful! it’s great!
Love it.
Looks like something that hasn’t been designed and to me, that is its biggest strength. No over-the-top forced graphics web2.0 fads. Great job.