One of the great parts of being a website designer is being able to look for inspiration off such talented people. The standard of work and creativity shown by designers today when coupled with the latest browser support is sometimes quite breath taking.

One of the best resources for showcasing this talent is on sites like CSSMania and I spent a short while going through some of my favourite sites that showcase amazing graphic design skills. Please take a few moments to have a click through each of them as the designers of each of the sites are a credit to their profession.

MTGrafik

We shall start off today’s examples by looking at a company called MT Grafik. They’re a Turkish media company that have created a character to be used throughout the site that bears a resemblance to Pinocchio. They have also created a roadway scene with the sea in the background just above the footer. The detail that goes into the design is second to none and its certainly one of the most creative sites I’ve ever visited.

Inspiration Dormant

Inspiration Dormant is a book that is available for the iPad, iPhone or iPod Touch. The site makes use of the images used to create the book and really showcases the design skills of the artist.

OPResume

OPResume is an online portfolio and resume website. The reason that this site is amongst my favourites is that it is developed using the latest JavaScript technologies available. This could have been developed in Adobe Flash but people are starting to create such inventive designs just using clever scripting taking away the need for the Adobe Flash Plugin. The level of detail at the bottom of the sea is quite unbelievable and this really does show that Flash maybe coming to the end of its reign for animating websites.

ISee

ISee is a Portuguese web design company that has created a three eyed monster that is used throughout the site. One of the features that stands out on this site is the interactivity based on mouse movement. This is becoming quite a popular technique in web development to try engage the user with the site.

Pixelbaecker

Pixelbaecker use quite a common idea in that they create one long page that can be navigated by the user. The “scroll to anchor” style feature makes the page easy to navigate without having to move around pages. I think that these sorts of websites are an acquired taste, and certainly not suitable for all projects, but with these inspirational graphics, it works perfect for portfolio style sites.

Intacto10year

Intacto10years is quite possibly the most intricate of the sites listed. It is almost a video presentation when you set the site on automatic, as it scrolls through the past 10 years. The amount of detail that has gone into the creation of the site and the ability to load that much information without the site appearing to lag behind is quite a testament to its creators.

Chilid

Chilid is a Polish site that uses a whale as its main character to navigate you through the site. The whale is seen in many different outfits carrying out a range of activities but helps engage you with the site as you work your way around the site. The site is simple in its design but it is also easy to navigate which helps a broad range of users to find out information they need quickly so it definitely gets the thumbs up from us.

Salveomamute

Salveomamute is a site dedicated to saving the Mammoth. It includes a range of videos and interactivity that makes it a fun site to take a tour around. Although the site is written in Portuguese, the imagery and videos make it a great site to visit without being able to read some of the sections.

Art4Web

Art4Web is the unique site on this list. This is the only site that makes use of photos at the same time as including graphic design. The photo’s they’ve chosen to use have a cartoon feel to them and are really accompanied by shapes and objects all over the page. The page appears clean and I find the typography particularly well thought out to work with their images.

Hello Studios

Hello Studios is a digital studio based in Australia. They have created a few characters that are used to help you navigate throughout the site. They have also chosen to use a one page design with the “scroll to anchor” technique and it loads seamlessly. These types of website have been starting to increase over the last year or so and the ideas people are coming up with to utilise the technology will only get more creative.

Well I hope that some of these websites have given you a little bit of inspiration to go and try out some of these techniques. If you have any more sites that you’d like added to the list, feel free to leave a comment and I’ll add it to our list.

Well it’s another Friday here at Wubbleyou, so I thought I’d take a few minutes to look back at a blog we did over a year ago now based on Purple Web Design. Back when we wrote the original blog, the colour purple was being used by quite a few companies to showcase their services and products.

Today I’ll take a look at some of the more recent designs to be created using a purple colour scheme. We find that it’s quite a common colour used for personal portfolios due to how well it contrasts with a white background. Here are a few examples to give you a bit of purple inspiration:

Creative2Slice

Creative 2 Slice is a company that takes Adobe Photoshop files and creates the coding required to make a website. It uses a wide range of purples and pinks that contrast to make a visually appealing website that is easy to read. They’re still developing the rest of the site but they have a strong theme developed that I’m sure they’ll follow through all of the pages.

Codigo Digital

Codigo make use of radial gradients to contrast their variations of purple. This was quite popular during the launch of web 2.0 style sites and still looks great when used with the latest available tools and plugins. Make sure to check out their services page for an excellent example of how to make use of the “glowing box” technique.

Radhe Associates

This company also makes use of adding gradients to the background of each page to make its content stand out. One reason that this site benefits from this style is the amount of content on each of the pages. By decreasing the amount of content on the page, the amount of white space at the bottom of the page is decreased so the content doesn’t appear lost. The site is simple to navigate and a great example of how to use purple effectively in a site.

Bichomalvado

This is one of our personal favourites from the list. Using the latest web-kit tools available for browsers, they are able to animate areas of the page without the use of Flash. It’s amazing the advancement in browser technology in the last few years and this site shows just how you can use new techniques to make a wonderfully creative site.

Gone Freelancing

This site is an interesting site because at first glance you would probably assume that it is a site created for a mobile application. In fact it’s a freelance designer who is going to a different place of work to every Friday for a year in the UK and then recording his experience. The site is simple in its design but is eye catching and very well created.

David Kopec

This is David Kopec’s photo studio. It follows one of the biggest trends of 2011 by using a large image as a background image for each of its pages. This site has been designed with an eye for detail and the sharp diagonal lines create a unique approach to a rotating banner. The site uses purple as a contrasting colour to the black and white background image and a contrasting white font for the text.

Brice Lechatellier

This site is simple in its design but we appreciate the consideration that has been taken into the colours that are being used. The use of a dark purple gradient contrasting with dark teal doesn’t sound like it should work but it blends quite seamlessly.

Alfred App

Alfred App has been one of our favourite app sites for a while. Its striking colour scheme is uniquely distinctive and the design that’s gone into the site is superb. It’s helped inspire us for a few of our projects now and it’s great to see all these app sites being developed as its pushing the boundaries for web 2.0 designs.

Arun’sfolio

We’re a big fan of Arun’s portfolio due to its quirky nature from its animated welcome screen, to the huge envelope design on the contact section. The site is simple to navigate which isn’t always the case with one page websites.

Alex Malukov

This is perhaps my favourite site out of the selected purple websites. I’m a big fan of using patterns for backgrounds and this site manages to switch between 6 patterns for each of the sections without confusing the reader. The use of imaged arrows definitely shows the creativity that Alex.

Well that’s just a few of the excellent examples of purple websites that we have seen recently. Check back again soon as we rotate ourselves around the colour wheel and choose a new colour to showcase examples of.

One of the biggest worries we found when starting Wubbleyou back in 2009, was how were we going to get ourselves known in such a competitive market sector? There are hundreds of web developers based In Newcastle Upon-Tyne so getting noticed and building a good reputation is hard work.

It’s been a little while since I’ve written a blog so today I’ve put down the cup of hot chocolate, and hope to tell you a little bit about my experience with Networking Events.

Networking Events are seen by many just starting out in small business to be daunting and quite scary. It helps to have an outgoing personality but these events are specifically setup to make contacts within your area so don’t worry if you feel you’ll be a little out of your depth. The chances are everyone else is in the same boat as you.

What you tend to find is upon arrival at a networking event, you’ll start by looking around to see if there are any contacts that you may know prior to the event. It’s great to catch up with clients, colleagues and acquaintances at these types of events as they’re normally informal in their nature and provide a nice surrounding to discuss your latest work or life in general.

One of the easiest mistakes to make at a networking event is to spend all of your time talking to people you’ve met at previous events and miss the opportunity to meet new people and potentially new clients. Being in the web technologies sector, we’ve yet to be at an event where someone has had a question relating to the World Wide Web that we haven’t been able to assist them with.

The idea of these events is to expand your business network. Even if there is no one there that requires your services directly, they may know someone that does.

Here at Wubbleyou, we have a business card wall that contains all the contact details of each of the people we have met at events such as these. We love meeting a wide range of businesses based around the North-East and we always find ourselves keeping in touch with a few of the people we’ve met.

The best advice we could give is to go to these events with an open mind that a potential client or investor could be there and try to talk to as many businesses as possible. People don’t appreciate a hard sell style at these events as they’re meant to be an informal meeting place, so just be yourself, and don’t try and force your services on people. These events are setup to talk about your business, so you will get the get the chance to sell your services.

Location is quite important as well. If you are a local business that mainly trades with people in your local vicinity, it’s a good idea to target events in your area. There a wide range of events available, so don’t feel you have to travel 200 miles to an event if you don’t plan on carrying out business in that area.

A lot of our clients are based in the North-East and we like that we can meet for a quick catch-up once a month. This is why we only really attend networking events within the North-East region to see if we can offer support to try and drive trade for local companies.

That wraps up a little overview of my opinion of networking events. They’re great for meeting new people and connecting with like-minded business professionals so if you get the opportunity to go to a few, I’d certainly recommend it.

One of the biggest headaches for both a website designer and a client is the subject of content for a proposed website. The size of the site will tell you how much content is going to be needed but it’s always one of the most difficult areas to develop for a website.

At the start of a project, a client may not have prepared any pre-written content for any of the sections of the site and may just have an idea. This is where the role of a web designer plays an integral part.

What I will discuss today are a few quick and easy helper hints that will hopefully give any businesses thinking about setting up a website a starting point as to where to begin writing some website content.

Most websites have a similar structure

There are a few basic elements that are included on 95% of websites. These are displayed in a variety of ways but they are included if you look through any site on the web. What I’ve done for this blog is split these up into categories for their corresponding pages.

Index / Homepage

This is always the most important page of any website. It helps to give a first impression to a viewer what it is you do and what your site is about. When it comes to content for the homepage, it is important that this page is informative but doesn’t appear cluttered. It’s a common occurrence for a site to try and have as much information onto their homepage to tell the viewer as much information as possible. This isn’t necessary and we would advise when starting to write content for a homepage, to write a small summary about who you are, and then white a small section on what your site is about. A website is split into separate pages for a reason so that a viewer will be able to choose which content they want to read so keep it brief and to the point on the homepage.

About Us

It’s good to make a head start with the about us section when thinking about having a website created. This is your chance to tell a website viewer any information that you think they would want to know about you or your company. Some of the items you could include are meet the team, where you give a bit of information about the team you work with or a breakdown of the history of the company. People tend to trust companies that have been established for a prolonged period of time so if your company has some history, write a small section on it.

Services / Products

It’s important to break down your company if you sell a service or a product to the viewer. If you are planning on creating an e-commerce shop, a good place to start is to think about the categories you want in the shop and maybe a little bit of information about each of the products you plan to sell. If you provide a service, it’s a good idea to think about each specific service you provide and then write a small piece of content relating to that service. This will help you and web developer know what type of information you want to include within the site and how much text content you plan on providing so they can design a page appropriately.

Contact Us

This is an easy section to prepare as these pages normally include items such as phone numbers, addresses and email addresses. It’s common these days to use a Google Map representation of a location of work if you are a business which helps them find you if you provide a service or to locate your shop. You can also include items such as opening and closing times which will help a viewer know when best to contact you.

Terms and conditions & Privacy

These are items that are very important when having a website online, especially if it’s a trading website or product based service. We always recommend that these sections of a site are drafted up by professionals for example lawyers and solicitors. It’s probably not the first section of content you should consider when the site is being created but it is important to be considered at some point during the project.

These are the most commonly found sections on the web today, but there are of course many different ways of representing this information. There are also pages such as registration screens, catalogues and blogs that you’ll find on many websites today but these tend to be created once a framework has been developed.

Hopefully from these little break downs, it’ll help give you an idea of where to start when it comes to content writing. It doesn’t have to be a painful experience and if broken down into small, easy to manage chunks, it may even help you develop a better understanding of what you hope to get out of the site.

One of the most common questions I get asked as a website developer is “what font should I be using for my site?” There is no definitive answer to this question unfortunately but if you follow a few simple rules and consider simple design conventions then you’ll hopefully be somewhere along the right lines.

I’ll first tell you a little bit of information about fonts in general. I’m sure most of you have heard of the terms “serif” and “sans-serif” fonts.

A “serif” type font includes little projections from each of its letters giving the text an old fashioned style. These fonts have been common practice for literature for several generations and “Times New Roman” seems to be the most well-known. This is a popular font that was used as a standard default font on Microsoft’s software packages for several years.

Example:

ABCDEFGHIJKLMNOPQRSTUVWXYZ – The red fox ran over the brown hill

A “sans-serif” font is basically a font without the projections on each of its letters. The most well-known font of this type is “Arial”. This type of font is seen to be less formal than “serif” fonts but they can arguably be said to be easier to read on computer screens due to their curvy nature.

Example:

ABCDEFGHIJKLMNOPQRSTUVWXYZ – The red fox ran over the brown hill

One of the first considerations that has to be thought about when considering which font to use is “what type of site are you producing?” If the site is a being created for a corporate company or any kind of government agency, then the usual convention is to stick to a font such as “Arial”. This is chosen by many blue-chip companies due to its clean appearance and its readability in small sizes.

If for example, you were running a small business and wanted to use a slightly different font, some of the popular alternatives are:

Verdana – Example:

ABCDEFGHIJKLMNOPQRSTUVWXYZ – The red fox ran over the brown hill

Tahoma – Example:

ABCDEFGHIJKLMNOPQRSTUVWXYZ – The red fox ran over the brown hill

Example – Georgia

ABCDEFGHIJKLMNOPQRSTUVWXYZ – The red fox ran over the brown hill

Trebuchet MS – Example:

ABCDEFGHIJKLMNOPQRSTUVWXYZ – The red fox ran over the brown hill

One of the main considerations that has to be taken into account when choosing a font for use on the web is its compatibility with standalone computers. I would definitely recommend clients to avoid fonts that are not packaged with the main operating system as their main font. If the visitor to the website does not have the font, then a font-substitution will take place and could alter the layout of the site. In my experience, it’s not worth taking the risk and you are better off using one of the fonts suggested above. One way of including custom fonts is to save the heading that includes the custom font as an image and then including the image on the page. We wouldn’t recommend this to clients though as a search engine would not be able to read the text contained within the image and this isn’t the best for the SEO of the site.

Another key question that clients ask is “what is the standard font-size of a website?” This is another difficult question to answer as there is no correct answer. It is important to follow accessibility guidelines when creating websites to make it as easy as possible for the visitor to read information on your site. I’d recommend that the font used for the bulk of the main text on a site be between 10-14px. Anything below 10px is difficult to read in a bulk amount of text and not recommended. This size font can be used for items such as privacy policies in footers but these are items that should be included in sites but not the main focus of the site.

Hopefully this has given you a little bit of information for you to consider when choosing a font for your website. Fonts are fairly specific to the type of site you wish to create, and can help create a unique impression to visitors when they go to the site.

Logos with a semi hidden smile are something that is starting to get noticed and replicated in the corporate world, supposedly a symbol of consumer happiness and satisfaction.  Some see it as a new subtle way to convey a positive experience to the consumer, others as being kicked back into the 70s when Nike came up with the ‘swoosh’ leading to it becoming heavily replicated.

Either way I believe there will be a gradual, yet heavy onslaught of smiling logos to come.

Argos

Argos rebranded early 2010 and went from the outdated swoosh, to the new positively appealing smile.  I do like the simplicity of their new logo and it does look more appealing and consumer friendly.

Volvic

Volvic’s logo is debatable, it looks like it’s trying to be a smile but it could be a swoosh.

Pepsi

Changes are if you gave someone of the street a pen and paper and asked them to draw the Pepsi logo, they’d draw the old one.  Personally I don’t like the new logo that much and I can see Pepsi ‘reverting back to their roots’ the next time they decide to rebrand.  It’s not your conventional smiling logo, but all the same a smile.

Bledina

Bledina is a French firm that sells baby related food stuffs to the French public; I would assume mostly to those with children aged under 3.  This is target audience that requires the upmost confidence in your product, what is one of the ways to accomplish this? That’s right, you put a yellow smile in your logo!

Danone

Danone is yet another company that upgraded their swoosh to a smile.  Admittedly it is a refreshing upgrade from their old boxy and swooshy logo.

Kraft

Kraft is another company that decided to add a bit of happy to their logo.  They decided to remove their 90s font and hexagon and add a smile and what appears to be a flower.  That’s two happy pieces of imagery in one logo!

Thompson

Thompson has for quite some time had the smile in their logo, distorting what appears to be a T and I’m guessing a representation of the sun.

There seems to be a common theme with the smile, their target market is nearly always the average consumer, and some of those appear to be upgrading their swoosh to a smile.  My guess is is that this is just the beginning; prepare yourself for a smiling logo in every shop window in the near future!

More and more people these days are signing up to online services and creating accounts on various websites on the web.  It’s something that is becoming increasingly easier to do with integration of account linking services such as Facebook, Gmail and OpenID.

Registration emails tend to be your first offsite interaction with the user.  For this reason it’s best to do everything you can to ensure you positively capture their attention.

Look and feel

Now it stands to reason that the best way to capture a user’s attention is with a pretty design and relevant content.  Most of the time this is achieved through an assortment of images within a predefined layout.  Something that is largely overlooked though, is how this will look when the email client automatically strips the images from the email.  Email clients do this as it can be used to track which emails have been opened, the email client is acting to protect the user’s privacy.  This can lead to a nasty looking layout filled with broken images.  If you are going to head down the road of an image heavy email layout, make sure the layout still has some sort of visual appeal and integrity if they don’t display.

Content

Usually the primary goal of these registration emails is to confirm the user in question actually owns the email address given.  This is normally done through a link presented to the user in the email which they must click to confirm their account.  Again, these links can sometimes be disabled by the email client for the protection of the user.  For this reason it is recommended that a link is provided in hyperlink form for ease of use, and a link which can be copy/pasted into the web browser’s address bar.

One thing which some websites insist on doing is emailing you your password back to you in plain text.  Now in terms of security that is a big no no!  If the email account is compromised they malicious user could easily find one of the user’s passwords that they use on your website, and maybe many more.

Another reason why this is off putting for me is that it makes me wary of the websites other security principles.  If they are willing to send me an email containing my password how secure are their other procedures? Do they store my password in plain text?

Wording

The best thing you can do is optimise your registration email so that it does not trigger any of the obvious spam filter settings.  The working of the subject and the content of the email can go a long way to ensuring you do or do not end up in the spam folder.

Lists such as this (to be used as a guide, I cannot vouch for its accuracy!) can give you a general idea of what to avoid.  Terms such as Viagra will pretty much guarantee you’ll end up in the spam folder, along with words such as Free, Offer or winner.

So there you have it, a few things that can help you improve the overall look and feel of a registration email.  It’s safe to assume that most first time emails you send to a user will be marked as spam and/or will be in some way malformed to have the images stripped from it.  Don’t let it catch you out, make sure your emails are prepared!

Social media is becoming a big aspect of everyone’s life, more so for those in the business world.  Social media is paving the way for a new level of interaction between the general public and those who make a living from selling to them.  It is radicalising the consumer’s ability to instantly cast a single corporation into the spotlight, be it through a creating a trend on twitter or a Facebook page designed to boycott or ridicule.  This usually happens when a service goes offline or a scandal is uncovered, but it can be equally caused by the release of a much anticipated product or an act which is seen by the wider public as amicable.

The effect caused by social media trends can sometimes be amplified by the press if enough hype is generated around it.  If a topic is being discussed heavily, a media outlet will usually pick up and report on it and use comments from the social media sites as a source of information for the article.  More and more within the press, quotes from members of social media sites such as Twitter and Facebook are being used within their articles to showcase the opinions of the general public.

A recent example of this effect would be that of the shopping centre which caused the police to detain a man for photographing his own daughter.  This whipped up a media storm surrounding the issue exacerbating it further, until finally the shopping centre conceded and removed its policy regarding the matter.

Another recent example is the current problems with Blackberry’s services crashing.  This is also an issue first reported on Twitter and then picked up by the media outlets with many media outlets quoting twitter users in their reports, usually messages of frustration and ridicule directed towards Blackberry maker RIM.

Although it can be observed that trends from social networks sometimes translate into stories released by press outlets, it is much more likely to observe social networks discussing issues after a media outlet has reported on it.  The behaviour observed between the two is a mutually beneficial, almost symbiotic relationship.  Both can exist separately but it is advantageous for both to exist consecutively.

Despite the examples in this article mostly involving big corporations, the same principle still applies to small to medium sized businesses.  The general public is turning to social networking more and more to voice their opinion.  Having the ability to apologise or thank a user for their comment creates a personal connection, and in a situation where that user is frustrated it may alleviate their concerns.

All in all how the discussion begins does not matter, what does matter is creating the ability to interface with these social platforms which will allow a business to monopolise on these trends or limit the damage of a negative perception.  Creating a platform for the public to vent their anger can be hugely beneficial, especially when apologies are issued personally to users through these social platforms.

One of the most common questions we get asked by potential clients is “what process will you be going through to complete my website?” It’s important to think of a website design as a process because each of its elements contributes to the finished product that you provide to the client.

Here at Wubbleyou, we use quite a common process that includes 5 stages of development for each website. The length of each of these stages is dependent on the size of the project and the amount of testing required for example testing for e-commerce sites can take up a few weeks alone!

The 5 stages we follow are: Planning, Design, Development, Testing and finally the Roll-Out.

Below I’ll give you a basic run-down of what goes into each of the stages. One thing to bear in mind is that each company probably has their own processes that they follow. As part of small business management, it’s important to create a process that is efficient and benefits your business model as a whole. Therefore, this article is written to show how we approach each of our projects, and will hopefully help give an understanding of how our 5-step process works.

Planning:

It is well known that planning is just as important as the development stage in a project. If there is insufficient planning taken place, it makes the design stage very difficult as there is no structure to follow. The planning stage starts once a contract has been agreed upon after a client accepts a proposal we’ve created for them. This is used to gather all the information needed before the project can start. This ranges from receiving all the branding and content from the client to creating site-maps and UML diagrams of the structure of the site. Once a plan has been created as to what needs to be created for the clients site, the design work can begin.

Design:

Most of the sites we create include our Content Management System and therefore two stages of design run in parallel together. Our development team will start to design plugins for site-specific elements of the site whilst the design team will be working on draft mock-ups for the site. The design team normally creates a few possible layouts for the project and indicates where each element will be positioned on the site. These are created as images that indicate where the interaction with the site will take place. Once these have been agreed upon by both the client and design/development teams, the project is then moved in the development stage.

Development:

During the development stages of a website design here at Wubbleyou, the previously agreed upon mock-ups start to take shape in the form actual web pages as (.html) or (.php) files. These are usually created as templates that allow the development team to apply the Content Management System to. This is this stage at which the client will be able to see their websites come to life. The development stage is usually where the client will be most involved within the project. This is because revisions of the site are sent to the client to make sure they provide the client with what they required out of the website. Development can be seen as a continual cycle until the final stage when the website is “rolled-out” or when it is made “live” on the World Wide Web.

Testing:

Testing can therefore, be included as a sub-category required within the development process of a website. We find that this is the most overlooked process by some website companies as they rush to get their creations online. We take testing seriously at Wubbleyou, and try to make sure each element of the website is working correctly before it is “rolled-out” in the final production of the site. There are always going to be small bugs that appear when the site is “rolled-out” but it’s important that sites are tested thoroughly before going “live” to the web.

Roll-Out:

Once the site has been given the green light by both the client and design/development teams, the site is uploaded onto the World Wide Web. This is when all the hard work through the previous development stages all pays off. This however, isn’t the final stage in the project design process. After the site is uploaded to its location on the World Wide Web, it is important to test each element of the site in its “live environment”. The world of website design is plagued with version compatibility issues and plug-in upgrades; therefore it is important to provide testing on the final product where potential clients will actually gain access to it. Once each element has been tested, the site will then be made live for access by anyone on the internet.

Hopefully this has helped to give you an idea of what actually goes into the development process of a website here at Wubbleyou. If you have any queries or questions, please feel free to get in touch as we love to hear comments and feedbacks from our readers.

Adobe Photoshop has been the choice for digital media designers for the past 10 or so years. What it’s able to provide in terms of image manipulation power is second to none. There are alternatives such as coral draw and GIMP but when it comes to mainstream design, you’ll be struggling to find a designer that doesn’t know their way around Adobe Photoshop.

Although the program is quite intuitive, if you’re not using the program day in and day out, you may not know some of the key shortcuts that can be used to make your life much easier when trying to edit your files. I personally have a terrible memory but I spend at least 4 hours a day on Adobe Photoshop creating digital media, so these shortcuts have been drilled into my goldfish mind. Hopefully you’ll be able to start using some of them if you haven’t started already. (Please note: This guide was written based on the Microsoft Windows version of Adobe Photoshop).

CTRL + A – Select All

One of the best things about Adobe Photoshop is that it incorporates some basic shortcuts that uses may already be aware of. In Microsoft Word for example, if you hold CTRL + A then all of the text in the document will be selected. This is the same in Adobe Photoshop. If the user presses CTRL + A, the whole canvas is selected. This is useful if you want to copy the whole contents of the canvas but don’t forget, you’ll probably have to carry out a copy merged to copy all the contents in the selected area.

CTRL + T – Free Transform Layer

Being able to transform a particular layer in Adobe Photoshop is vital in image manipulation. Perhaps one of your layers was a tiny bit too big. Simply hold CTRL + T and this will bring up a box around the layer which can be used to resize the layer. A top tip is to hold the SHIFT key when resizing the layer and it will maintain the aspect ratio of the layer.

CTRL + U – Colourise

Perhaps you want a layer to become a particular colour. If have selected the layer from the layers panel, holding CTRL + U will allow you to pick a particular hue and saturation for a layer. One of the features that could help Adobe Photoshop novices out would be to include a HEX colouring system that would allow the layer to coloured based off a single hex colour.

CTRL + G – Group Layers

There is always a big debate regarding the layout of layers in an Adobe Photoshop file. Depending on your level of laziness, or if you have to compulsively label each label separately, this will have an impact on how detailed your layout panel will be. I personally find that grouping my layers and naming the groups is a good way of keeping a layout organised and editable but it’s all about personal preference. A quick way to group layers is to click on a selected layer, then hold CTRL and select any other layers you want to group and then hold CTRL + G. This neatly puts the layers in a folder for the user and now they can

CTRL + R – Show Rulers

Rulers are great to help you line up boxes and layers to exact areas. To show the ruler, simply hold CTRL + R and then when you are finished lining up your elements, hold CTRL + R again to hide them.

CTRL + J – Duplicate Layer

In a future tutorial, we’re going to discover how to make 3D items in literally seconds but to give you a small insight; it’ll basically be using this command throughout. If you have a layer that you need another version of, hold the CTRL + J keys and an identical layer is created.

SHIFT + DRAW – Maintain Square Selection

One of the subtle abilities of Adobe Photoshop is to make a complicated task appear simple. If you need to draw or select a square on a particular layer, all you have to do is hold SHIFT and draw your selection and it’ll be a perfect sized square.

CTRL + LAYER CLICK – Select Layer

If you need to make a selection of a particular layer, the quickest and easiest way is to hold CTRL and select the appropriate layer from the layer panel. This makes an active selection around the layer.

TAB – Hide Windows

This is one of the handy features that I find myself using more regularly. If you’re editing on a screen that is limited as to the size and percentage of the canvas you can work on then hiding the history and layers windows helps you be able to see more of the canvas. A simple press on the tab button can give you another 200px of vision space which can be vital depending on the percentage shown of the image you’re working on.

CTRL + S – Save

Don’t forget to CTRL + S all of your work! Save everything (that means every revision). One of the drawbacks to Adobe Photoshop is that it sometimes only allows you to roll back 12 steps to the stage you were at this point. And if you’ve ever used the brush tool to edit an area, you know these steps are taken up pretty quickly.

I hope some of these shortcuts will help you become a little bit quicker when using Adobe Photoshop and help you produce some quality 21^st century digital media.