website & graphic design

Ever wondered what the differences between a .jpg or .png file are? What the heck is a raster image versus a vector image? What are some modern alternatives to using .bmp or .jpg? These are the sort of questions we seek to answer in our MXVI Design+Online tutorial series based on image file types - what they stand for, where they come from and how to use them.

Raster images are images that uses individual blocks, or pixels, in order to construct the image. Every digital photo, web image or printed image uses the process of rasterization, or pixelation in order to create these pixels which are then imposed onto a screen or display for you to see. 

​Rasterized images are based on a pre-defined resolution, which means you have a specific number of pixels to work with. The more pixels you have, the higher the resolution. Conversely, if you reduce the resolution, the number of pixels decrease and you will no longer be able to increase the resolution - the image becomes pixelated if you increase the size of the image using the same number of pixels. 

Examples of common raster image file types are .jpg, .png, .tif, .bmp, .gif - most modern image creation or drawing software such as photoshop or paintshop are raster based. It is important to remember to save raster files at the exact dimensions needed for the application. In the next few tutorials being shown over the next few weeks, MXVI Design+Online will explain what each of these file types are used for, how they came to be & how to use them in different scenarios.

​Stay tuned for the next tutorial series on vector images explained coming soon. 

Design elements are the items that make up a design - and design principles are the foundation of what designers do with those elements. A successful design is determined by how you apply these principles & what is done with its elements. This is the foundation of good design.

The basic elements of design include such objects as, but not limited to, lines - linear marks or the edge of two shapes meeting; shapes - self-contained areas of geometry or of organic origin such as natural shapes; colour - includes hue (red, green, blue etc.), colour value (light or dark) as well as intensity (bright or dull); space - negative space intentionally left blank, creating shapes as you would any other element; texture -  surface quality of a shape (rough, smooth, matte, glossy) helping to create immersion; direction - horizontal lines convey a sense of stability, tranquility or calmness, vertical lines convey balance, formality and hierarchy, oblique or distorted lines emphasize action, movement and mayhem: type - or typography - the font and style of your words tell readers what to expect, whether it be serious, playful, or traditional and can also make your text look distinctive and memorable.

Design principles use these elements in order to create an integrated, beautiful, cohesive piece of work or art. Of course, beauty is in the eye of the beholder, but great design can consist of fundamental principles that when done well, becomes so transparent and simple, we often do not even notice it. Different people will have different numbers of fundamental principles, which is why some may say there are only 4 or 5 fundamental principles, while others may consider 7 or 8 principles as "fundamental". Modern design principles draw from many disciplines such as behavioural science, sociology even physics and ergonomics.
SIZE - aka scale - the relationship of the area one shape occupies in relation to another. By changing the scale and size of your objects, shapes, type and other design elements, it adds interest and emphasis to something that may otherwise be very mundane. Typically taken into context with the content within, subtle variations in size suit more professional content while bold, striking variations in scale tend to be used by creative enterprises. 
COLOUR - the light that is reflected off of objects, it can be designated as an element as well as a principle. Colour creates a specific mood as well as provides a degree of meaning to a brand. Every colour tells you something different and can be used in singularity or mixed with combinations to alter that impression further.
ALIGNMENT - aligning elements with one another allows a visual connection. For example repetition, which can be construed as a subset of alignment, creates consistency, association as well as rhythm. By tying elements together, alignment helps emphasize order and organisation. Simultaneously, the proximity of design elements further provide a focal point for this visual connection.
CONTRAST - Defined as the juxtaposition of opposing elements, such as light and dark, black and white, horizontal and vertical -  high contrast allows for the emphasis of key elements. It helps bring a visual impact to the design with one element typically being dominant to another.
BALANCE - The weight distributed in design by the placement of various elements - it provides stability and structure. Symmetry and asymmetry can be used for different purposes, asymmetry typically being more eye-catching than symmetry, but symmetry is not without its place. Radial symmetry and mosaic symmetry are two other forms of symmetry that can bring an overall adequate balance to a design. 
SPACE- Another dual element/principle - it refers to the distance or area between, surrounding or within each element. Positive and negative space is important in creating harmonious design - when all pieces work together with nothing being superfluous. Great design is just enough and never too much.