Art
Illustrator Basic 01 - Handy Tips
Wednesday, October 8th, 2008 | Art, Design Inspiration, Web Design | No Comments
For all those people out there who have up until now been afraid of using Illustrator for their web design and logo designing needs, now is the time to get stuck in and start using Illustrator to help you. There’s no need to be afraid of Illustrator, in fact, once you pick it up and get some good practice in, you’ll like it more than PSP. Naturally you will need both PSP and Illustrator for your web development needs but there are some things only Illustrator can provide and that’s why you need to buckle down and start learning.
To help you make your first baby steps with Illustrator, here’s a quick tutorial on some handy keyboard shortcuts and how to use the pen tool.
• “Ctrl” & “-“
Zoom out of picture
• “Ctrl” & “+“
Zoom into picture
• “Spacebar” & “Left mouse click”
Hold click and drag to move the paper around
• “V”
Return to selection tool (Handy when you use the pen and want to stop making lines!)
• “P”
Return to pen tool
• “Ctrl” & “Left mouse click”
Press control and then left mouse click outside of the selected box to stop what you are doing and deselect the object.
The Pen Tool
Open up a blank new document in Illustrator and select the pen tool (Or press P), now click anywhere on your page a couple of times. You will notice all these lines are straight.
Now click and hold on another location and drag away from where you clicked. Now you will notice your line starts to curve and you have two blue lines extending from your point. Try testing out these curves in your document and getting used to the way they work. When you think you are used to it, try tracing the contours of a simple image. You may find it harder than you first think but you will get used to it with practice.
Try making a curve and then holding “Alt” down as you click the last point you created. Now make a second point and see how the line reacts differently. “Alt” turns any point into an angle point so you can navigate corners and still create curves.
If you extend the two lines from your point too far your curve will develop an opposite curve as well and may even cross over and loop in areas. It is recommended you keep these lines within one third of your line length and do not extend them beyond your points. Once you have mastered this, you will have got the foundations of illustrator and be ready to start making some pictures!
Competitor Research
Wednesday, October 1st, 2008 | Art, Design Inspiration, Web Design | No Comments
Following on from our stock art related articles, web design enthusiasts can help create their own unique and well balanced web designs with a varied use of unique stock art pictures. However, if you are unsure about how to start off with this, or how your project is developing with its imagery, look and feel you may wish to try checking out your competitors. Having a sneak peak at what other people are up to in the world of web design and development can help inspire you and give you ideas for your own unique imagery. Have a look at other web developers and see what kind of pictures they typically use for certain concepts. What kind of image are they representing? What idea of the business do you get from the overall design of the website as a whole?
When designing any concept for web design you need to think about your target audience and at the same time, how the client wishes their business to appear. They can choose to be bold, exciting and innovative which will require bright, artistic illustrations and innovative design features. They may want professionalism to be a high priority in which case smooth website transitions, professional sleek and simple logo designs and simple toned down colour combinations work well. Your website design may have the younger generations in mind which will need funky colour schemes, interesting imagery and probably lots of pictures of rebellious teens, graffiti and other features to keep them entertained. If the business wants to be cute and fun and is aimed at kids primarily you need bold simple cartoon imagery with simple bold colours, lots of interactivity and above all an extremely user friendly interface.
All of these should be bringing up different images and pictures in your mind to suit the situation. Even if you envision a woman with a head set for the help page, a ten year old user isn’t going to be impressed with it. Instead a cartoon figure, bubbly question mark or the website “mascot” would be much more entertaining.
Do some thorough research on your client’s business, the website target audience and what kinds of imagery other competitors are using. Never copy another web developers work, but you can use it for ideas and inspiration to get you on the right track.
The Design of Photographs (Use Stock Art part 2)
Wednesday, September 24th, 2008 | Art, Design Inspiration, Web Design | No Comments
Stock art is not just about picking up random images as we touched upon in our previous post. Stock art is about deep and thorough design and thought. Every image presented on your website has to be carefully selected and should discourage the ideals of stereotypical information. Placing a girl with a headset for the “Customer Support” team is like committing electronic suicide. These harsh stereotypical and un-imaginative images will only serve to provide a negative, cheesy and wholly unprofessional look to your website. It is in fact, these types of images that people will envision when you talk about stock art, and it is these myths we must endeavour to dispel.
When considering each individual piece of stock art you wish to use, you need to ask yourself a series of questions. For example; is this concept a stereotype? Is this image relevant? Is this picture artistic, unique and interesting? Will this image appeal to the target audience of your website? You need to satisfy all of these questions before you can consider if the image is suitable.
Get a good feel for the imagery that the competition uses. Research websites that have content like your own and what kind of images they are using to convey their own ideas and products. You may find a wide range of different viewpoints stemming from one single concept. Examine which images most appeal to you and why they work and alternatively examine the ones that are uninteresting and have a negative impact on the company and think about why that is.
Creating the right blend of stock art in your website is like a well put together collage. You can have some interesting splashes of colour and random images that don’t jump out on their own as relevant or immediately associated with the concept in question. When you put them all together with a well designed website you can create a beautiful and stunning collage that immediately conveys all the right messages and ideas
Say it with Colour
Thursday, September 4th, 2008 | Art, Design Inspiration, Web Design | No Comments
Colour plays a very important role in graphic design for all mediums. Whether you are designing for TV, print or for the web, your choice of colour can serve to enhance your overall message and can communicate on a more subtle level with your audience. Conversely, bad colour choices can actually contradict what you are trying to achieve and lessen the impact of your design.
As an example of how colour can work against you, think about the primary colours, red, yellow and blue. These colours are bright and vibrant, and when most people see them, they automatically think of children. The primary colours have often been used for toys, commercials aimed at children, and for children’s websites to make them feel more exciting and playful. Now imagine, if you will, that you are searching for an accountant online and you come across an accountant’s website that uses a colour scheme based on the primary colours. Is this likely to inspire your confidence? The chances are it would make you less likely to take them seriously.
A lot of research has been done into the psychology of colour, and the meanings of colours can vary depending on what country you are in. You can easily see this by looking at the websites of international companies. Lots of these companies have separate websites for each of the countries they operate in, and to a certain extent, their websites will have varying colour schemes to suit the country as well. Of course, for those corporate giants with worldwide branding, their logo and marketing materials will influence colour choice, but there should still be some subtle differences.
Some generally accepted meanings of colours here in the West include: Purple for luxury or royalty, Blue for trust and tranquillity, Green has come to signify ecological concerns as well as its traditional associations with nature, money and encouragement. Colours also tend to take on a slightly different meaning depending on the other colours around it You can use colour schemes that fit certain ideas, for example, such as a colour scheme of reds, yellows, oranges and browns for Autumn, or you could use orange and black for Halloween.
Another consideration when choosing your colour scheme is that of contrast. The eye will naturally move to the area of highest contrast whenever we look at something, and you can use this principal together with a good knowledge of colour theory to guide the viewer’s eye around your design anyway you choose.
Learning more about colour, the many meanings of colours, and how to choose an appropriate colour scheme based on the content and the target audience, is definitely time well spent. A good understanding of colour will show through in your work, adding that little extra something that makes your designs stand out from the rest.
Light vs. Dark Websites - What should you use?
Friday, August 29th, 2008 | Art, Design Inspiration, Photoshop, Web Design | No Comments
There has been a lot of discussion since the spawn of web design about what colour schemes are better. Light colour themes? Or, dark colour themes? Here’s my opinion on the matter.
Firstly, ill just go a head and say it. I do, slightly, prefer light coloured web themes over dark ones.
Light Themed Websites
I think lightly themed websites, ignoring the ones full of bright multi-colours look very professional. I am talking about the typical plain websites with a lot of white space. If you think about, virtually all the major big professional websites such as Amazon, Google, eBay, PayPal, etc (the list can go on forever) use a very light colour scheme and are full of white space (which will be discussed in a future article in this blog).
I think light themed websites are better suited to websites which needs to convince their visitor that it can be trusted. For example, PayPal and eBay deal with customers’ financial information such as credit cards, bank accounts, etc. If the website used a dark colour scheme, naturally, the website would look ‘dodgy’.
I think lightly coloured themed websites, with a lot of white space, are better when used with websites like online shops, business homepages, company websites and so on.
Dark Themed Websites
Dark themed websites actually look quite cool. I think websites that use dark colour schemes are better suited to entertainment related websites. This includes gaming sites, film websites, online gaming websites, etc. One of the largest and most popular gaming websites on the internet (GameSpot.com) uses a dark colour scheme and it pulls it off very well while at the same time looking incredibly professional.
Dark themed websites also look good on ‘underground’ sites such as small message boards with online friends and any other websites that are supposedly cool.
Conclusion
If your thinking about what colour scheme to use for your website then think about what was mentioned in this post. Think about what type of website you have. And then honestly think about what would suit it best.
At the end of the day don’t be afraid to experiment. You never know what might actually turn out good.
Coming Soon: The White Space - Good or Bad?, Great Web Design Resources and more PhotoShop Top Tips.