You may have seen Keren’s blog post about Pinterest last week. Well over the weekend I blogged about her “Owl” board and found some inspiration for my first illustration of 2012.

Here are a few of my favorite “owly” delights from Keren’s Pinterest board.

And here’s my “Twit Twoo” illustration, inspired by all the “owl” talk here at Top Left Design. Hope you like it!

Then he took a timelapse movie of us working away like the busy bees that we are. We also wanted to send a special mention to Amy who works in our Cape Town Office and hasn’t physically been in our new London office yet.

We did have time to wave at all you lovely folk. It’s good to be famous! Check out the video. it’s truly awesome!

And here is a picture of the kit!

This year I set myself the challenge of of writing a blog post everyday this month. The posts are inspired by the “12 Days of Christmas” rhyme and have opened my eyes to all things Christmassy!

I chose to blog about different designers festive gifts from “brooches” to biscuits, cards to Christmas wraps, and along the way made a few new friends too!

Here are a selection of some of the lovely treats I found on my journey:

Jeff Jospahine Designs

Kate Slater Illustration

Fréya Art

Tina Webster Illustration

Buscuiteers

Have a gander at my 22 festive blog posts so far and keep your eyes peeled for 2 more!

In case you’ve been living under a rock though, Movember is an annual charity challenge, whereby men grow a moustache in order to raise money for Prostate Cancer.

Movember

This year was my 3rd year of participation, and I’m extremely happy to announce that I smashed my target of £1000 – by raising over £1200! Of course I wouldn’t have been able to get to that figure without the help of everyone who donated, and supported me along the way – with words of both encouragement and mockery… So thanks for that!

You can see my donation page here – with a load more pictures and other such moustache related nonsense!

Movember Mike 2011 Website

I took it upon myself to redesign and rebuild my “Movember Mike” website this year – a fresh lick of paint is always a refreshing change, and this time around I built it responsively. Before you ask, a responsive website is one that will re-arrange it’s content depending on the screen size of the device that you’re looking at it on. So it looks great on everything from an iPhone to a 40″ TV screen – give it a try by dragging the corner to make the site larger or smaller! Oooooh…

Digital Sizzle Moustaches

Not satisfied with simply having a new website to promote my efforts, I raised even more “cash for tash” by running an event in aid of the charity – Digital Sizzle! This is a side-project that me and 2 other guys set up, which we run in our spare time: a quarterly networking event for tech-types and media-moguls. We hosted the evening at the Adam Street Private Members Club on The Strand, and had over 250 people in attendance! We even had some moustache judging awards, with our special guest judging panel consisting of Omid Ashtari from Foursquare, Stephen Sobey from Yahoo, and Steve Webb from Google. Needless to say, much fun was had on the night, and a lot of money was raised for a worthy cause – over £3,000 in total from our team!

Me and Chris Shanahan, Top Left Design friend!

The next day saw no rest for the moustache, as I was off to the Official Movember Gala Parté – in full 1940′s military costume! I say this every time around, but it’s the best night of the year without fail – and I look forward to each and every one. There’s something quite special about a venue full of thousands of costumed men and women, all in a great happy charity mood! Nothing quite comes close in my opinion – there’s a fantastic atmosphere, and my kudos goes to the Movember events team for consistently throwing a brilliant party every year.

The Finished Article

And with the end of the month, out comes the shaver once more… Last night I said goodbye to my furry friend, and washed him down the plughole with my own tears – at least 3 times today I’ve gone to stroke my missing follicles… Nevermore, nevermore…

Until next year, that is!

Below is a picture of her holding branded TLD owl cupcakes. Proof!

It started when for a “Make My Lunch” – Tamlyn made them for dessert. This is when one of the team at TLD cooks lunch for everyone and we all eat together. Every company should do it!

Here is what that iconic first batch looked like:

I was so impressed, so I commissioned Tamlyn to make them for all of our seminars. And so it became a tradition! They really taste delicious too. Have a look at just a small selection from recent seminars.

Cupcakes with our logo and the Enthuse Marketing logo for our joint seminar with Tamsin Fox Davies

We had a special owl with sunglasses for our "Pimp My Website" seminar

There was even a unicorn!

TLD cupcakes in the making - an arty shot

Owl cupcakes and hairy cupcakes

We also asked Tamlyn to make them for my cousin's baby shower

Some people come to our seminars just to try them! And they aren’t disappointed!

If you would like to try them, you can! Our next seminar is on the 8th December – Social Media for Professional Services. If you just came for the cupcakes, that would be fine (but you may accidentally learn some stuff too!)

We have just sent our latest newsletter masterpiece and this newsletter was dedicated to the number 8. We all worked on it – writing copy, coming up with all the little details, checking for typos, putting together the HTML and images – a real team effort! Thanks to all those who helped with proofreading our test previews!

It was crucial we sent it out yesterday, before Halloween weekend. Let me explain with 8 reasons:

Friday before Halloween – our newsletter is very much Halloween themed. We have our TLD owls dressed up in pumpkin costumes.

Henry the Octopus – as it’s the end of  October we wanted to create a new character for our TLD zoo – an Octopus. We named him Henry and put a moustache on him. This is him without the moustache!

End of the month and nearly “Movember” – Every year, Michael grows his moustache to raise money for charity as part of November. Have a look at his “Movember Mike” website – we welcome all donations! This means we have to explain to any clients who come and visit us why he has a thick “mo” but it’s worth it, and our clients are really understanding. We also wanted to link to our team page – as we have 8 members of our team now – and also because we updated team page with moustaches in time for November (or Movember)

Tamlyn is off to run the NY Marathon – we needed to let every one know that she is off – before she went – so all sorts of positive vibes could help her in this grueling run! And so, we featured this in our newsletter.

Cupcakes - Tamlyn is also the genius behind our amazing illustration work and also our branded cupcakes. We first discovered her unique talent when she made lunch and cupcakes for us on a “Make My Lunch” day, which is a thing we do here at Top Left Design – we have lunches where one member of the team makes lunch for the others. One day, she made branded cupcakes for us and we definitely wanted to have her make them in time for Halloween!

Weekend reading – we know that on weekends it’s time for relaxation and this is why we want our newsletter readers to be able to sit back and read our newsletter in a relaxed fashion over the weekend. Or, on a Friday afternoon when they getting ready to finish work for the week. Or, when they get in on a Monday morning, before the madness of the week happens. So, Friday afternoon was the perfect time!

8 websites - As we dedicated the newsletter to the number 8 (based on the month October) we wanted to showcase 8 new websites we launched since our last newletter. We may be launching a couple more next week so we didn’t want to risk having too many showcased sites! Clever, huh?

The number 8 - this is the 8th reason – I think it is apt to dedicate the last reason to the number 8. Simple, yet effective, don’t you think?

Here are my top 11 so far (in no particular order):

Get yourself out there!

Networking, blogging and social media are the way forward! At Top Left Design Keren and the team frequently update followers and clients with the latest events, offers and daily office going-ons.

Through this constant contact with people, TLD are continually establishing new contacts, friendships and exciting new ventures.

If you get yourself out there and approach marketing with confidence it will reflect on your business and also your own personal confidence – don’t be afraid to be the boldest of the bunch!

Shortcuts

Designing can be a very long process – unless your equipped with the magic shortcuts!

I’ve learnt a countless amount of shortcuts whilst working at TLD for a range of programmes, shortcuts don’t only save you time but also give your mouse a well earned rest.

*Please note we never take shortcuts when thinking up the brilliant ideas behind your designs, and also recommend to never take shortcuts in life!

Design is where the heart is

One of the best things about working at Top Left Design is being surrounded by a team that are passionate about design! Without this passion and drive we wouldn’t be able to produce the beautiful, professional and unique designs which we’re known for.

Size does matter

When designing it’s always important to have a balanced hierarchy of text and images. We always make sure that all elements work in harmony with one another creating a well balanced design.

The size of text, and fonts are fundamental in establishing headings,  subheadings, and  body text. The key is to use font styles, colours and perhaps two different fonts consistently to represent each section of text, it’s also always important to make sure the text is legible and balances well with images.

A good eye for balance whilst designing really does make a difference  – so you see, size really does matter!

Attention to detail

Good design requires a meticulous eye for detail. Its no use creating a beautiful design with those awful mistakes which make your head feel like its going to pop!

When designing we always check that the line height of text, and alignment of different elements is consistent, it’s also important to allow your design to breath. And of course we always look out for those dreaded spelling mistakes, missed full stops and bad grammar!

The importance of presentation

At Top Left Design we’re always presenting new ideas and designs to clients so its important that these designs are presented clearly and professionally.

Creating storyboards is one way which we present website designs. Live storyboards allow clients to view their designs in a browser, they can then compare each design and are also able to see what their site could look like live.

It’s also a handy way for them to get feedback from a friend or colleague, they can simply forward the link for a second opinion.

How to communicate with clients

Communication is key in any business and here at Top Left Design we make sure we’re always able to communicate clearly with clients through emails, phone calls, and meetings.

I’ve learnt how to structure emails which effectively communicate to clients any changes that have been made to their designs, quote for design work and have also learnt how and when to include polite suggestions for further changes/work – its always nice for clients to have input from the designer to help them along the way with the development of their design project. Phone calls – of course I mastered on the first day! (the traditional – Hello Nichaela speaking, how can I help-pen-paper-message) although the in-depth discussion and meetings are still yet to come…

When approaching a new design project it’s essential for both the designer and client to feel comfortable in developing the forthcoming designs. Its important for us to know the style of design the client desires, so we can feel confident in delivering the designs and making changes. Good communication is what makes your design perfect.

How to spot a good image

When including images on websites, in blogs, newsletters etc. its always important that you choose images which are eye catching, attractive and don’t look ‘clip arty’.

Below are three different types of photography, and two tips which will never fail you – what to look out for when your sourcing images :

Bokeh Photography
Bokeh is an adaptation from a Japanese word meaning blur. Photographers create this effect using lenses to adjust focus in the foreground or background, essentially highlighting one object and blurring and expanding areas of light. Just type Bokeh photography into your search engine and see what comes up – the images are amazing!

Macro Photography
This close up style of photography is always good if you want to show attention to detail. For example if your a restaurant or food company this type of photography will effectively show off your delicious food, or if your a florist it will highlight the beautiful detail of  your flowers in a very sophisticated way.

Tilt Shift Photography
Tilt Shift photographers cleverly create ‘toy like’ scenes using a special lens and movement of their camera. This type of photography creates an interesting and dynamic picture, turning your everyday scene into a miniature world.

Image source: www.smashingmagazine.com

Image source: www.hongkiat.com

Photography with interesting perspectives, arrangements and use of focus
Images with objects or people just plonked in the center aren’t very interesting and don’t draw in peoples attention. An interesting perspective, and arrangement of objects or people and use of focus will always catch someones eye.

Photography with ‘good’ backgrounds
Try to avoid images with white backgrounds as these can look very clip arty – unless of course you need an image with a white background. A nice scenery or textured background is always a great choice.

*remember its always good to think outside the box when choosing  images, make sure they’re interesting, but also relevant to the message you’re trying to convey.

How to mask!

For all you non Photoshoppers out there masking is a very handy tool which can be used in Photoshop, and other Adobe software which I recently found out exactly how to use it!

A mask can be made of one object e.g. a box for an image slider on a website. This mask can then be applied to another object such as an image, this will effectively make the image fit within the exact same space as the box – very handy in maintaining a precise and consistent design! See my example below:

Finished! or am I…

Its important not to get ahead of yourself. At Top Left Design we always encourage clients to let us know of any changes they want to their design work. We do whatever we can to create a design which reflects what they envisioned and recognise the jobs only finished when the clients are happy with their final product.

And last but not least… How to make a good cup of tea (I think)

One of the very first things Keren taught me! I’m petrified of making tea for people in case they don’t like it, but no complaints so far! Looks like Keren’s magic paid off.

Here is what Julien wrote

Hi everyone! I’ve just finished my 10 weeks internship here at Top Left Design. Usually I work more with the programming side of things, and have never really learnt much about the design process. I like coding because I’ve learnt a lot about how to do it, and so now it’s easy for me. But during this internship I saw that design is not so different from coding, you have to always keep in mind some key rules and guidelines to create a good design.

Here are the 7 most important rules I learnt at top left design during my 10 great weeks:

Composition

Align, align, align! Well-aligned elements within your layout make your website look tidy and organized. You can see an example of this on the Performance Resolution website.

Colours

Choosing the right combination of colours in reference to the client’s brief, and referring to the colours of their existing branding, is a difficult and important task in order to create visual harmony within the new branding and website. It’s also good to have some contrast between different elements to highlight important sections of the website, you can do this by using a combination of bright and dark colours, and this can also help to guide the reader through the site.

Visual Hierarchy

You should highlight things important like the services offered by your company, and keep less important things more simple. You can see on the A Business Innovation website that there services are highlighted in boxes making this section stand out to people.

Consistency

The website should be consistent, each page should be identifiable as part of the whole.

The little things matter

Details are very important in any type of work. It is the same with the design: details are the difference between a good design and great design.

When I started working on design layouts, I realised that every final site produced perfectly reflected the final design. This means the margins, padding, backgrounds and borders have to be perfectly consistent through your designs, it’s also important that the colours and fonts stay consistent throughout the site.

At the beginning of my internship it was very hard for me to follow these rules, I found it easy to make small mistakes in a layout, such as remembering to make sure everything is aligned exactly, making sure the right colours are used throughout, and ensuring the titles are consistent sizes. And the fact is I didn’t understand why it was so important because by definition, it was only small details… But now I know why.

Looking out for the little things whilst designing and remembering your ‘rules’ whilst designing really does have it benefits:

• The most obvious: The work looks more professional, if you always make small mistakes your reputation will suffer.

• You don’t waste time explaining these little mistakes when the client is viewing your designs. Everything is perfect and so you can focus spending time discussing the things that really matter.

• It makes you more organized. If you’re organised and have named each of your layers in Photoshop, and grouped these into folders it means when you come to making small changes you save a lot of time. Naming your layers in Photoshop is really important when you are working in a team as it’s not only you that will be working on those files.

• Faster development. For example if you design a blog which is not correctly aligned and you send it off to the programmer to be built, the programmer doesn’t have to waste time figuring out if you made a small mistake or if it was intentional.

Check your work

This tip is linked to my previous point. The final design has to be perfect to avoid a dissatisfied or disappointed client. Everything is double checked to be sure the result is as expected. Sometimes when you work for a long time on a design you can’t detect mistakes easily. That’s why it’s important to have someone else in the team to take a look over the design, and see if there are any little tweaks which need to be made.

Keep it simple

A design can look sophisticated and professional without many design elements which may just prove to be useless. Personally when I’m looking through a website for information about a company, I prefer to see a clean and minimalist design where it’s easy to find what you want, and not be distracted by things that are not as important.

Caroline and Julien are two french students who spent 10 weeks with the team at Top Left Design on a summer internship. 10 weeks have flown by! They have sadly left and will be truly missed by all of us at Top Left Design. In this blog post Caroline shares a little bit about her experience at TLD and the new things she learnt.

Here is what Caroline wrote

Here we are: 10 weeks have gone by, and it’s already the end. When I look at the pieces of paper which I wrote all of my tasks on each week, I think we can say that it’s been amazing. From tasks which took me several days to complete to some which only took me a few minutes, each week has been a new experience.

Of course at University I’m used to working on many projects at one time. But the big difference between school and an internship is that here, there is always somebody to help you to improve your work, and also to explain to you why it could be improved and above all HOW. It’s not just a mark at the end of a semester; it’s a real explanation – a great way to learn how to improve your skills, so each time you design it gets better and better.

Is 10 weeks too short a time to have a well-rounded vision of the world of work, and significantly develop your knowledge surrounding design? Do you really think so? If so, I hope I can persuade you to change your mind…

The 3 common mistakes that I made at the beginning of my internship:

1.  When designing I either made the line spaces too big or too small, but never the size they were supposed to be.

Solution: Be patient and analyse carefully existing designs to find the perfect spacing for yours. You always have to check what size the font is and adapt the line space accordingly. It’s the same for the spacing between the different design elements e.g. image sliders and boxes. The spacing needs to be consistent throughout allowing your design to breathe.

2.  Designing without enough individuality or character!

Solution: Add colours to the design and noise to the background, this makes the website background look textured and helps to make the website look welcoming. The best way to be inspired whilst designing is to have a look at great examples of website design which already exist on the web.

3.  I would sometimes design using too much text – nobody wants to read a page like that!

Solution: Put 2 or 3 colourful boxes to catch the viewer’s attention, and always try to find good images to space out the layout, this will make the page more harmonious. Plus you can always add a read more link.

The 3 types of tasks at Top Left Design which helped me to learn more about design:

1.  Creating a homepage layout using the brief filled out by the client

Even if you have never met the client, you have to be able to understand their brand and brief to be able to create a design which is fresh and new, but also very personal and relevant to the company. It’s important to include all of the design elements which the client has asked for within the layout, e.g. a blog feed, image slider and side navigation.

2.  Design all of the inner pages of a website even if you didn’t create the homepage

When designing inner pages it is important to follow the final design of the homepage. You have to make sure the style of design throughout the rest of the site is consistent with the homepage. It’s important to be really conscientious to ensure that the fonts, colours, and small details such as borders of boxes and so many other things are the same across all of the pages.

3.  Working on the creation of a logo

Such hard work! Of course you need to create a design which suites the clients brief and brand, but you need to have THE idea which will make the logo unique. It’s important to create something recognizable and also distinctive, however with a small amount of intricate details ensuring the logo will remain legible when used at a smaller size.

As you can see, you need much more than simply just knowledge of software to be able to create a great design. University taught me technical skills; Top Left Design gave me the opportunity to go beyond that.

To conclude, my first impression was that the team seemed to be so friendly… And now, the last thing that I can say about Top Left Design is that the team is definitively, extraordinarily friendly!

Many of you already know that we are a teaching company and we regularly take work experience people who love to learn about designing and building websites and all the wonderful things that includes. This week we just took on 2 new interns, who are from France, and I asked each of them to give us one paragraph about their experience here.

Caroline’s comments about her first week at Top Left Design

“Hi everybody!

One week ago, I came from France to do my internship inside Top Left Design. I was a little bit afraid because I have a lot to learn about English, more particularly because of my accent. And if nobody understands me, how can I do?

In fact, the team of Top Left Design is so friendly that all my apprehensions are gone the first day. They take time to explain my tasks to me, and given that they are always smiling, the atmosphere is really nice! I’m sure that I will learn a lot with them.

I worked on Photoshop layouts, I learn’t things about WordPress that I didn’t really know before and I updated information on a website. The work is varied and I do several tasks the same day. Moreover, I noticed that all is really organized and that there is a real project management. It’s nice because it complete my formation at University which is more scientific, even if there is an artistic side too.

I’m sure that I will enjoy my internship in London!

Caroline”

Julian’s take on his first week at Top Left Design

“Hi! I’m Julien, I’m French (from Paris) and I just arrived at Top Left Design for a 10 weeks internship.

My first impression when I arrived in Top Left Design was astonishment. The office is great and I have never been in such working environment: it’s very well located, the place is very nice, and it’s well equipped. So we have everything we need in the flat, lacks only the weather…

For my first week I had to adapt myself at a new way of working, and try to figure out how the team worked. Fortunately everything is really well organised so it was really easy to quickly be productive. Moreover there is always someone in the office to help me if I need something. During this week, I’ve mostly done some maintenance works like adding new content or making small changes on some web designs.

It’s really important when you want to put a website online, to ensure that’s all is fine and work perfectly, so I checked some of the new website that TLD is going to launch soon. I also helped at the creation of website manual for these websites. To produce great content, clients need to have the possibility of update or create the content. It’s sometimes a little bit tricky, that why TLD helps them after the launch of their website, giving them all the instructions and great advices to provide an efficient content.
Hope it will continue in this way!”

And now a screencast using them as an example for how to put images into your blog with “Resizr”

We of course use Photoshop for resizing images but I wanted to include this as their pictures and this blog were the example in the recording. In fact you could say that this blog post starred in the screen cast, and Caroline and Julien are now YouTube stars!