This is not a term restricted to the ladies out there, opacity in this instance is not related to how see-through your tights are!

It refers instead to the density of a color. The opacity of an image or graphic element can range from totally transparent or see-through (0% opacity) to fully opaque or not see-through (100% opacity). Transparency is the measure of how see-through something is or how much light can pass through an object or image.

These overlapping circles are all yellow but have different levels of opacity applied to them, one is 30%, one is 40% and one is 60%. As they lose opacity they become transparent.

Opacity and transparency offer designers an excellent way of creating depth and texture in their design work. Designers utilise these tools in logo design, to create watermarks on stationery and many other ways, the possibilities are endless! Below is an example of a photograph with text and a graphic element placed on top of the photograph with 50% opacity applied.

Opacity was once limited to print design but recently it has moved into web design. Lots of exciting effects can be created using opacity and transparency in web design.

If you think that opacity would suit a print or web project you have in mind, let us know, we would love to explore the possibilities with you!

This week we’ll be looking at navigation, but put away your compass and sat nav, this navigation is online!

When used in relation to websites, the term navigation refers to the menus and links which allow users to move from page to page within the website. Designing a well-structured and user-friendly navigation system is one of the most important stages in the development of a website.

Visitors have come to your site for two main reasons:
1. To find some information – e.g. your phone number, address, opening hours
2. To perform a task – e.g. buy a product, check the status of their order, post a message or contact you.

If your visitor cannot find the part of your site that contains the information they need or the tool to perform the required task, they will become frustrated and may leave very quickly.

This is why having clear, consistent and well-structured navigation is essential. There is no point in having a beautifully designed site with fantastic content if the visitor cannot use it or find the content they are looking for.

In order to be easy to find and use, all navigation links should be clearly labelled. Using an image without text or an obscure/quirky phrase as a link will just confuse and frustrate your users.

There are three main types of navigation.

Primary Navigation
The most important links - e.g. Home, About, Contact etc. should appear in the same place on every page of your site. This is called “primary”, “top-level” or “global” navigation. These links are always visible to your visitors whether they are on your home page, a product page or reading your Terms and Conditions.

On this site, our primary navigation is in the yellow bar at the top of each page. Primary navigation also often appears in the top left of websites.

Secondary Navigation
Secondary navigation refers to menus that do not appear on every page of your site – e.g. a list of product categories in the sidebar of the shop section.

It is important that these are organised logically so that users can easily find the content they are looking for.

A good rule of thumb is that it shouldn’t take more than three clicks to find any piece of information on your site.

Footer Navigation
Extra links to help users move around a website are also often found at the bottom section of a website (the footer). Footer navigation usually repeats some of the primary navigation links as well as containing links to pages such as the Terms and Conditions and Privacy Policy.

Got a question about navigation? Contact us or leave a comment – we’d love to help.

A few weeks ago we blogged about different file formats and how to reduce the size of your files while maintaining image quality. This week we are looking at the actual units which measure file size - Kilobytes, Megabytes, Gigabytes etc.

A bit is the smallest amount of data that can be processed by a computer, it can only have a value of 0 or 1.

We rarely work with information that is so small it can be saved in bits. Bits are usually assembled in groups of 8 to form a byte. A byte is only large enough to store one letter or character. The word “curious” has 7 letters and so would take 7 bytes to store.

A kilobyte (KB) is 1,024 bytes, instead of 1,000 bytes as you would expect. This is because computers use the binary system rather than the decimal system with which most of us are more familiar.

1 Kilobyte (KB) is 1024 Bytes

1 Megabyte (MB) is 1024 Kilobytes

1 Gigabyte (GB) is 1024 Megabytes

1 Terabyte (TB) is 1024 Gigabytes

1 Petabyte (PB) is 1024 Terabytes

1 Extabyte (EB) is 1024 Petabytes

It has been said that 5 extabytes could store all the words ever spoken by human beings!

Confusingly, many hard drive manufacturers use the decimal number system to define amounts of storage space. In other words, 1 MB is defined as one million bytes, 1 GB is defined as one billion bytes, etc.

However, as your computer uses a binary system you may see a difference between your hard drive’s stated capacity and the capacity your computer recognises.

For example, a hard drive that is said to contain 10 GB of storage space can store 10,000,000,000 bytes. However, on your computer you need 10,737,418,240 bytes to reach 10GB. As a result, instead of recognising 10 GB, your computer will only show that there are 9.31 GB available. This is not due to a fault in the hard drive, it is simply the result of the two different systems of measurement.

Got questions on file size? Get in touch - we’d love to help!

We’ve all heard of logos, branding and visual identity but what is the difference between the three?

Logo
A logo is a symbol or graphic mark used to identify your business or organisation.

A logo can be

1. A wordmark or lettermark - the name or initials of your company e.g. Coca-Cola or CNN
2. An symbol or icon e.g. Apple or Nike
3. A combination of a symbol with text e.g Puma or Carlsberg

It is not essential that a logo represent the product or service of its company, but it must be memorable and easy to recognise and describe.

It is also important that logos are scalable (so that they are still recognisable at small sizes) and work in black and white (so that they can be used in situations where colour printing is not available.)

Visual Identity
Your visual identity is the visual representation of your company.

Your logo works with your corporate colours, typefaces, signage, stationery, brochures, and website etc to create your visual identity.

To create a strong visual identity it is important that each of these aspects are consistent - for example if you have corporate colours they should be used throughout your visual identity, in your signage, your website, your stationery and any other printed materials you produce.

Branding
The broadest area is branding. Your brand is your company’s personality, your values and aims. A brand is more than visuals, it is everything that a company or organisation owns, does and produces. Branding can encompass everything from customer service to events, copywriting, products and posters.

Need help with your brand, visual identity or logo? Contact us today! We’d love to help.

Are you puzzled by PNGs, jaded by JPEGS? Do you go googly eyed at GIF’s? Our simple guide to JPEGS and other common digital image formats is here to help!

Two of the main factors to consider while saving digital images are image quality and file size. Typically, high quality images take up a lot of computer memory, however, choosing the correct file format can help you maximise your image quality while minimising file size. File size is particularly important for images used on websites, as anyone with a slow Internet connection will tell you!

One of the reasons there are so many different types of file formats is the need for compression. Compression describes ways of reducing the size of the file. Compression can be “lossy” or “lossless”.

JPEG

Image saved as JPEG - Size:24k. Note: blurry edges on logo.

When you save a file as a JPEG you can choose how much compression to apply, the more you compress your image the smaller a file it will be, but you will lose image quality. JPEG Compression is “lossy” which means that you lose some of the file information and your image is subtly changed when you save it as a JPEG.

JPEGs are typically used to save photographs or any images with lots of tones or gradients. They are not good with sharp edges, text or line drawings; these can appear blurred unless saved with very little compression.

GIF

Image saved as GIF - Size:56k. Note: grainy texture on photo.

Unlike JPEGs the GIF format gives very good results when saving text, logos, line drawings or any image with sharp edges and limited colours. The GIF file format is limited to a total number of 256 colors or less so it does not give good result for images with gradients or a wide range of tones (e.g. photos). GIF files also support animation.

PNG

Image saved as PNG - Size:176k. Note: large file size.

The PNG file format was developed to replace GIFs and is not fully supported by very old web browsers. PNGs are non-lossy files. Unlike JPEGs photographic images can be compressed without degrading image quality. The PNG file format also supports transparency (e.g. images with a transparent backgrounds) better than the GIF file format. PNGs are usually larger in size than JPEGs and are best used for text, logos or line drawings or for images that need a transparent background.

Looking for more advice on the best file format to use? Get in touch! We’d be happy to help.

This week’s design a-z term is hosting – website hosting that is, not dinner parties!

If you are unfamiliar with web hosting all the technical terms associated with it can be confusing so we’ve put together a simple explanation.

Web hosts don’t serve canapés but they do have computers (called servers) that are connected to the Internet.

Websites that are stored on these computers are visible online to anyone with an Internet connection.

When you pay for hosting you are renting space for the files that make up your website on one of these computers, so that your website can be seen online.

Barring technical problems, a web host operates constantly, 24 hours a day, 7 days a week so that anybody in the world can view your website at any time.

As well as hosting your website online you will also need a domain name ( the address of your website – our domain name is curiousdesign.ie) - this can be purchased through your hosting company.

We are happy to organize hosting and domain name registration for our clients. Got a question about web hosting? Contact us today!

Organisation and structure, do these two words make you smile or cringe? Well like them or not, they are both very important in everyday life and also in the design world.

The best way to organise anything is to plan, and to visually map out the best way of tackling the task at hand. Whether that means structuring your working day into little segments or pockets of time, or drawing up the blueprints for a building. Most projects or tasks benefit from a little forward planning. If you fail to plan, you plan to fail*

A grid is a tool used by graphic designers to structure the information that they need to communicate. It is our job to take information (text and images) and translate it into an easy to understand yet visually interesting end product. The finished product might be a website, a book, a magazine, a poster…

Grids help us to decide where to place elements within our designs. Rather than randomly placing images or text on a page, we design a grid and use it to guide our design decisions. A grid acts like the foundations of a building and the building blocks are the information. Although we use grids to help us to decide where to position information, we are not strictly bound to the grid that we design. Grids are very flexible and provide endless layout possibilities!

To help understand how grids feature in everyday life, take a look at a newspaper. Most newspapers are designed using a strong vertical column grid. These grids consist of a margin and a number of columns with a small space between (this space is known as the gutter). This grid structure is so important to newspaper design that phrases such as “writing a column” have become everyday.

Front page from an edition of The Irish Times.

Grids not only help when we are designing for print, they are very important when creating designs for the web. The most important features of a good website are ease of navigation and clear layout. Both of these are greatly aided by the use of a well designed grid. Our very own website was designed using a grid, we design grids for all of our projects print and web alike.

Sometimes grids are very obvious, like in newspaper design and other times they are trickier to spot. Can you make out the grid that we used to design our website?

*Quote from unknown source, repeated to me by my husband

Today we are going to talk about foiling, often referred to as hot foiling. This is another print finishing technique that is used in many different ways by designers and printers.

The type of foil we are most familiar with in day to day life is good old kitchen tin foil which is not too dissimilar from the type that we are going look at, it is thin, shiny and comes on a roll!

To help understand what I am talking about, take out any bank note from your pocket or wallet (if you are lucky enough to have one!) and have a good look at the fancy shiny silver strip or shape on the right hand side of the front of the note. This is a type of foil that is applied to the note after it has been printed. In this instance it is used to verify that the note is genuine. This is a special type of holographic foil that is specifically designed for euro bank notes. It has textures and numbers designed into the foil to prevent counterfeiting. Concert tickets and some vouchers also use a very similar type of foil.

Foiling is also used on book covers, leather products, business stationery, packaging, greeting cards – the list is endless!

This image shows gold and silver foils on black card, image courtesy of design context

The process of hot foiling begins with the artwork that the designer intends to be foiled. This artwork is given to a die making company who etch or carve the negative of the design into a metal block or die. The dies are usually made of magnesium which is a cheap metal and can only last for a short period. Sometimes they are made of more expensive copper which lasts a lot longer and can be used again and again.

The first die shown is made of magnesium and the second is copper. Images courtesy of profoil.

The next step involves the die and the item to be foiled being positioned accurately onto a machine. Just like kitchen foil, the foil used comes on a large roll. The foil is sandwiched between the item and the die. When the heated die presses the foil against the item, it is forced onto the item and the design is created. The pressure used also leaves a slight indentation.

The range of foil colours and textures available are infinite and pantone colours can all be matched, the possibilities are endless!

If you would like to find out more about foiling or if you have a project in mind that you think would suit this technique, give us a call!