The big guy in the sky

On 19 December 2012, Chris Hadfield was catapulted into the sky to live on the ISS. 

Over the next five months @Cmdr_Hadfield excellently explained various phenomenon to us and answered our questions in between his work. I was lucky enough to follow him on twitter just a few days before he went ‘up’ there, and it wasn’t long before his twitter feed began to outshine the rest.

‘As I transition the Space Station computers, I notice our Houston CAPCOM’s name is … Hal ! The irony, as life imitates art.’

[View on twitter]

Astronauts often grace my twitter timeline, but none had explained and described life in space as well as Chis Hadfield. He just seemed to understand what gravity-bound earthlings wanted to know about. Our little curiosities, like, what happens when you cry in micro-gravity, or how do you get your haircut?

‘Spacewalking has been the most memorable. It is magic to be between the Earth & the Universe, alone, holding on with one hand.’

[View on twitter]

With help from his son, Evan Hadfield, he shared photos of views that few of us will ever see. (Collected here by Guy Moorhouse.) The ISS is on Greenwich Mean Time, and so every night just as I was going to bed, tonight’s finale would appear on my twitter feed and give me a new, grounding, perspective.

‘Almost time to leave Station. Hard to express all of my emotions, but mostly gratitude. I came here on behalf of so many people - thank you.’

[View on twitter]

All in all Chris Hadfield has made exceptional use of social media. Let’s hope that @AstroKarenN and @astro_luca continue the job after he falls to Earth.

In case you missed it, here are some of the highlights:

Just about the best advice I have ever heard.
What happens when you squeeze a soaking wet towel in space.
This Reddit AMA.

:{D

London’s backwaters

12:00

In my hideout away from London in N1, I can hear birdsong and smell the sweet burnt coal from the boats. City noises evaporate and nature resounds.

High-pitched whistles and tweets from the birds push away the heights of crowded buildings, and the clouds are visible once more.

All I dream of is here, in amongst the concrete mass, yet so far removed. Urban sprawl conquered by nature’s sprawl. Lapping water carrying cares downstream.

And in the summer here, it is heaven. Only clouded by the thought of a full turn of the clock.

13:00 and London returns.

Designing a book

It’s all been a bit quiet on here lately. For a very good reason – all my thoughts have been taken up with a book design project I’ve been working on. It’s a book about the history of a school in Dorking, Surrey, and I am designing and typesetting the whole thing. It’s a lot of work as a side project, but extremely enjoyable. My typographic knowledge and confidence have improved and it’s great to have full autonomy on the design. I owe a mountain of typographic debt to The Elements of Typographic Style by Robert Bringhurst for helping me sort out niggling typographic details like how to typeset old British money (italicised virgule and a figure dash) and is it OK to justify text (absolutely). I am also designing the front cover, which strangely seems more challenging than typesetting 200+ pages.

Some brief design details as it’s not yet finished: I’ve used an asymmetrical grid to give lots of breathing space between the images and text, and allows the captions to sit outside of the main text area. I chose Minion and Gill (which was produced by a foundry just down the road from the school) whose characters match the nature of the book’s content.

I definitely want to do more of this.

On the creative working environment

Our creativity is incredibly affected by the environment we work in.

Natural light, or lack of it, has the most immediate impact on us. Working under fluorescent bulbs flickering out sickly yellow light is the antithesis of a creative atmosphere where ideas flow freely from mind to mind. Colours are distorted and eyes are strained in the absence of natural light.

Next, the room itself. Small rooms, with low ceilings and dark colours immediately bring an unpleasant feeling to mind, and yet many buildings are designed in such a way that these spaces have to exist. We feel fenced in and trapped, unlike in a larger space with high ceilings and whitewashed walls.

Thirdly: air quality. Lack of air soon encourages the eyes to droop and breathing to slow, resulting in less oxygen to the brain and less resistance to distractions. Air conditioners are the enemy of fresh air, and are often used unnecessarily, when an open window will work far better.

A room that is not silent, but filled with low-level sounds of discussion, sketching and scribbling, and others engrossed in their work is desirable. A deathly silence can be as oppressive as intolerable noise.

Working on the ground floor emphasises the feeling of existing as a tiny being between huge towering buildings. Yet a view stretching over the bustling city below can uplift your outlook. Interestingly, davidthedesigner has never worked on the ground floor, perhaps contributing to a successful and happy career.

I would not think it unreasonable to turn a job down if the working environment was not conducive to creativity, indeed, spending over eight hours a day in these conditions may take its toll after only a few weeks. Thinking back, the environments I’ve been happiest working in – and most creative – are those with natural light, low noise levels, free-flowing air and a pleasant view.

Lolcat: Teh Exhibishun

I have been lucky enough to take part in Lolcat: Teh Exhibishun, an exhibition endeavouring to display beautiful images of LOLCats, instead of the crudely put together pictures seen on the internet. Jenny Theolin did an incredible job of organising and curating the whole thing, and the exhibition has even been featured in a lovely little video on the BBC website.

The exhibition is at The Framers Gallery in London until 15th February, with 50% of the proceeds going to Battersea Dogs & Cats Home.

Redesign time

I’ve recently redesigned my online portfolio. Whilst it is always a continuous process of minor edits here and there, I tend to have an overhaul every six months or so. Each time I redesign it I try to push myself a little bit further – using more advanced coding or pushing the layout design. There was one thing I particularly wanted to do this time: make it responsive. Previously I resisted this because I found that when I was forced to view a mobile optimised version of a site I already knew, it annoyed me; often information was omitted from the desktop version. But I soon realised that a responsive site was a far more pleasant browsing experience, and could be far more useable to those who might view my website on their mobile.

Grid & Typography

With that in mind, I was looking for a responsive grid to base my site on. What better way to learn than editing code bit by bit from a template or tutorial? I had heard much about Dan Eden’s simple Toast framework (daneden.me/toast), and, seeing from his various side projects that he was thorough in his coding ability, I decided to use Toast to build the grid. It was simple and intuitive to work with, and (as the ☺ licence permitted – licence.visualidiot.com) simple to edit at my will. The only addition I had to make was to add a viewport meta tag in my code to determine how it displayed on smaller screens.

I chose Nimbus Sans for the primary typeface as I wanted an more characterful alternative to (previously used) Helvetica. Across my printed folio and stationery I use Akzidenz-Grotesk, but alas there is no web version of this yet, and Nimbus seemed a close match. This is complemented with Georgia – transitional serifs go well with transitional (or neo-grotesque) sans-serifs as their proportions and stresses are similar.

The dimensions of the grid grew organically from the text, instead of the other way round. By that I mean I tested the size, measure and leading of the type first, to determine the column widths. Type set in 14/18px was the outcome of this testing, and the measure was most comfortable at a width of 350px (two alphabets long, and 52 characters wide – see 2.1.2 in The Elements of Typographic Style). Dividing this figure in half and allowing for a 30px gutter gave me a more flexible grid consisting of 6 columns of 160px. Therefore the body text was always two columns wide, and was pleasing to read. (Disagree? Please let me know in the comments.)

I plan to design subsequent iterations of my site using Ems, as I believe they are more flexible and give the user greater control, but at the moment I am most comfortable working with pixels (with which the maths to work out image dimensions and column widths is simpler.) It was important that when the titling and body text were displayed opposite each other in different columns, they aligned to the baseline. This is the most challenging aspect of designing for the web for a typographer – the baseline is far harder to maintain in the browser than it is in InDesign. Pictures push it out of place and there is no “align to baseline” button to click. When researching how to maintain a strict baseline, I came across code that specified such dimensions as “3.185373” em. Not very elegant.

So my simple typographic scale consisted of:

• H1, project titles of 36/36 (The actual number I used was 37/36 to fix a baseline issue, this amount would have been fine in InDesign but for some reason pushed it out a pixel in the browser.)
• H2, site title of 27/27
• H3, categories of 27/27 (to specify typography, branding, etc)
• Body text of 14/18
• Serif text of 14/18 for small highlights and a touch of variation in the text

H1 intersects the body text every two lines and H3 every three lines.

Navigation

A main element of the previous design I wanted to improve was the navigation, and I did this in two ways: by making use of the visited link CSS property and by changing the way projects were listed.

Firstly I wanted it to be obvious to the viewer exactly how many pages there were so they had a clearer mental map of the site. By using the visited link property and greying out visited links, the user now has a clear idea of which pages they’ve viewed and are yet to visit. This property is surprisingly simple but not often used.

Secondly the menu or list of pages was unclear and almost a bit “hidden” in my previous design I had denoted each project with a thumbnail or intro paragraph, which although it gave an instant impression of my work, was harder to navigate, and definitely harder for the viewer to create a mental map of the site. See →

I removed the thumbnails in favour of a list of projects in the categories Design, Writing and Photography, and three information pages under “More …”. Originally a simple list run over three 160px columns, I quickly discovered that it didn’t work well when viewed on a mobile – there would always be a long list about two (iPhone 4S) screen depths at the top of the page. I needed a responsive menu too. Having no knowledge of how to accomplish this, I sought out a tutorial and found one written by Tessa Thornton. This was a huge help, and, much fiddling of code later, I had a drop-down menu which worked on both desktop and mobile.

In addition to this I wanted a shortcut for clicking through the projects, and an elegant way to do this was to include forward and backwards arrows just under the project title. I had used a similar option in the previous design, but they were aligned to the opposite edges of the page, and were therefore more tiresome to access. See →

Having them in one place gave some consistency to the navigation.

A small note on the images. Previously the viewer had to click through the images in each project one by one. This was fiddly and not keyboard-friendly so in the new design I presented the images one after another. Scrolling through the images is a more natural way of viewing them and gives more of an overview of each project.

The design will likely evolve incrementally over time, until I get tired of it and start again. Such is the nature (and fun) of designing for yourself.

A story of three picture books

Are you sitting comfortably? Then I’ll begin. Once upon a time there were three picture books; a small one, a medium one, and a big one. These three picture books helped shape the very person that is writing this blog post, and for that I am very grateful.

Now these picture books were illustrated and written with such skill that to this very day, they spring across my mind from time to time. They are: The Very Hungry Caterpillar by Eric Carle, The Tiger Who Came To Tea by Judith Kerr, and Out And About by Shirley Hughes. The illustrations in these three picture books were so vivid and bright that they stoked my imagination for a lifetime of visual creation. All the other storybooks on the shelf weren’t nearly as captivating as these.

The three picture books were so very successful because they were incredibly detailed and showed the little intricacies of life in a way that needed no words at all. They helped explain to me about colour and texture and movement and best of all, about letting your mind wander.

In fact, I kept the small, medium and large picture books to this very day, in the hope that my children would have such beautiful images and wonderful stories to fuel their own imaginations.

These stories and images helped form me into a designer from a very early age.

And they all live on in my mind, happily ever after.

Brian Grimwood at WORK Gallery

Earlier today I went to see Brian Grimwood’s retrospective exhibition at WORK Gallery. His work is brimming with playfulness and wit, and features many a visual pun. Just look at these: 

A particular skill of illustrators and artists that I envy, is the ability to make a seemingly simple mark have more meaning; making the finished drawing greater than the sum of its individual parts, if you will. This is how Grimwood captures movements and intricacies which are often more interesting than detailed and exact illustrations (a separate skill in themselves).

His line drawings reminded me of Alan Fletcher’s penned scribbles and sketches, and have a somewhat comical aspect to them too.

Grimwood has also taken to creating illustrations with an iPad (other iPad/iPhone-artists include David Hockney and Mike Reed) and his style transfers to the medium perfectly.

[Image source: Brian Grimwood’s blog]

One of the pieces which caught my attention was the following illustration and accompanying text.

I think I can guess the company in question, but what do we make of that?!

More details about the small but compact exhibition on the London Design Festival website, and here’s Brian Grimwood’s website. 

On “flat design”

I’ve long questioned what I see as the Apple aesthetic. Those bevelled buttons, drop shadows and realistic patterns or textures are styling rather than design, and make many companies’ websites and apps seem similar, almost as if they’re a subsidiary of Apple.

So I was glad to read this post by Allan Grinshtein of LayerVault who asked designers to reject this style, and instead strip their designs down to the very basic elements.

Remove the unnecessary embellishments and keep stripping until you’ve almost gone too far. We believe that elegant interfaces are ones that have the most impact with the fewest elements.

Allan Grinshtein

Whilst I understand the reasoning behind using skeuomorphism was due to concerns about making users feel at home in a new digital world, I think it has reached a stage where this aesthetic is repetitive, unimaginative, and in fact seems out of date already. I think the main issue with what the article calls a “lickable” interface is that the styling is seen before the content – there is no polishing the glass here.

You could say that it’s the equivalent to Victorian ornamental typography, in which the printed page was crammed with fleurons and frills – suitable in a minority of circumstances, but overwhelming when used for text-heavy layouts.

In the best pieces of graphic design, unnecessary elements are removed and the content is always given highest prominence on the screen or page.

By removing embellishments and frills we can create designs that are actually far richer.

Design mentors

As a young designer, I’ve often longed for a design mentor; someone who can help guide me into the design industry, tell me when I’m going in the right direction, and when I’m messing up.

I think our industry could benefit from some form of facilitator, to match up established designers and newbies. Maybe it could match them by a specific area of interest, or simply by how many hours a month they require, or have free to give.

The exchange of knowledge and ideas would reward both in the ‘mentorship’, with the newbie gaining from direction by an experienced designer, who in return would benefit from making a new connection out of their usual circle, and that warm fuzzy feeling earned from teaching.

Perhaps each mentorship could be over the period of six months to two years, matching people in the same cities to bridge the daunting gap from student to junior designer. Maybe it could even go further than that and build connections which last for many years.

Perhaps this facilitator could exist in the form of a website, overseen by an educational organisation like D&AD. Maybe it would work well as an opt-in service, self propagated by helpers and helpees alike.

And then, perhaps, we would have better prepared young designers, and more refreshed established designers. And wouldn’t that be a better industry to work in?

    Page 1 2 3 4 5 / 18   ← Older posts  

Elsewhere

Portfolio
Photography
Twitter

Projects

What Designers Look Like
One Sentence Book Reviews
Transient Type

Network

Fiftytwo
Designspiration
LinkedIn

Useful bits

RSS / Archive
Ask / Likes
Follow

Imprint

Designed by Alix Land, hosted by Tumblr and read by you. Thanks! This is version 2.4 – published on 10^th August.

All images and ramblings copyright © 2010–2013 Alix Land, unless stated.