What is a pixel or vector-based graphic?
If you’ve ever briefed a designer to create a promotional brochure for your company they may have asked you for your logo as vector-based graphics, but what is this?
Firstly we need to define the 2 main formats of how images are digitally created and used in certain software and applications.
Vector graphics
These images are created using lots of lines or paths (are mapped out using mathematical equations which calculate where the edges of the shapes sit in relation to one another). This format is commonly used in Auto CAD software to create building plans and 3D images but is also used in design software such as Adobe Illustrator to create logos, icon designs and infographic examples.
What Are Vector-Based Graphics?
- Scalability Without Compromise: Vector-based graphics excel in maintaining crisp clarity regardless of size, making them the ideal choice for projects requiring scalability, such as exhibition designs and large-format graphics.
- Effortless Editing: The inherent mathematical equations that define vector graphics enable seamless editing, shaping, and recolouring. This flexibility ensures that your design evolves effortlessly with your creative vision.
- Compact File Sizes: The efficiency of vector graphics extends to their file sizes, which are notably smaller compared to pixel-based alternatives. This not only aids in storage but also contributes to quicker loading times in various digital applications.
- Conversion Versatility: Vector files can be converted into different formats without loss of quality, adding an extra layer of versatility to your design toolkit; so are commonly used in exhibition designs and large format graphics
Pixel graphics
Pixels are used to create images, these are lots of coloured squares put together to create an image as you see on a TV screen if you look very closely. Software programmes such as Adobe Photoshop are used to edit this format, this is where the term ‘Photoshopping’ comes from. Qualities of this format are:
- Create stunning images: Pixel graphics excel in creating visually striking images, with the ability to apply filters and effects for added visual appeal.
- Apply filters and effects: While pixel graphics allow for a certain level of editing, their flexibility is not as extensive as that of vector-based graphics.
- A certain level of editing can be applied
- Used on all digital devices and software: Pixel graphics find their place on all digital devices and software, making them a great format for various applications.
- File sizes can differ: The size of pixel-based files varies depending on the dimensions of the image, with larger images translating to larger file sizes.
Both formats have their benefits and using the format that suits your needs going forward should be considered before the start of a project. Vector files can be converted into pixel-based images but pixel-based files can not be converted into vector files so would need redrawing. This point is highlighted when a logo is created in a pixel format (such as a jpg) and is then required on an exhibition stand panel for example. Scaling the logo (pixel-based image) up to the required size causes the logo to become blurry or commonly referred to as pixelated.
File formats
Here is a list of vector file formats:
- .ai: They maintain the editable layers, allowing for intricate modifications and future adaptations.
- .eps: Widely used for print media, .eps files are versatile format for vector-based graphics compatible with various design applications.
- .pdf (if created from a vector file): It retains vector properties, making it an excellent choice for sharing designs across platforms while preserving scalability.
- .svg: They are resolution-independent and can be easily manipulated with CSS for dynamic web design.
And below is a list of pixel file formats:
- .jpg: Ideal for photographs and detailed images, this utilises lossy compression, balancing image quality with file size.
- .png: They maintain image quality without compression artefacts, making them a preferred choice for logos and illustrations.
- .gif: These files are often used for simple graphics on the web, they offer lossless compression but may not be suitable for complex images.
- .tiff:Common in professional photography and print, .tiff files support lossless compression and maintain high-quality images.
So what format do I use?
This largely depends on what you are creating and how this is going to be used. For any logo creation (or artwork you are going to use for printed materials and large format graphics) we would create this as a vector-based graphics file so that this can be used at any size without the loss of quality. For any on-screen use only (such as websites, PowerPoint, Word etc), then .jpg and .pngs are now the most common formats used.
Looking for something different?
If you found this helpful you might be looking for a new agency that likes to support its clients. We have created a service specifically for clients looking for quick turn-around, high volume and no-nonsense design service, we call it Toast Design Services. Check out our new Graphic Design Subscription Packages, tailored to their ongoing needs.
