Digital Graphics
This unit explores the core concepts of digital graphics, distinguishing between bitmap (raster) and vector formats, and their appropriate uses. Learners will develop practical skills in planning, creating, and refining graphics in response to a client brief, focusing on industry-standard workflows. Mastery of these fundamentals is essential for careers in graphic design, web development, and digital media.
Assessment criteria
Topic Overview
The Gateway Qualifications Level 2 Award in Digital Graphics introduces you to the fundamental principles and practical skills needed to create and edit digital images for a range of purposes. You will explore different types of digital graphics—such as raster (bitmap) and vector images—and learn how they are used in media like websites, advertisements, and product packaging. This unit covers the entire process from planning and sourcing assets to using industry-standard software to produce final graphics that meet a specific brief.
Understanding digital graphics is essential in today's visually driven world, whether you aim to work in graphic design, marketing, or web development. This award gives you hands-on experience with tools like Adobe Photoshop or GIMP, teaching you how to manipulate images, apply effects, and optimise files for different outputs. By the end, you'll be able to evaluate your own work against a brief and make improvements, building a portfolio that demonstrates your technical and creative abilities.
This qualification fits into the broader Computer Science curriculum by linking creative design with technical problem-solving. You'll learn about file formats (e.g., JPEG, PNG, SVG), colour models (RGB, CMYK), and resolution, which are crucial for efficient digital communication. These skills also prepare you for further study in areas like multimedia, web design, or IT, where visual content plays a key role.
Key Concepts
Core ideas you must understand for this topic
- →Raster vs. vector graphics: Raster images are made of pixels and lose quality when scaled up (e.g., JPEG), while vector graphics use mathematical paths and remain sharp at any size (e.g., SVG).
- →Colour models: RGB (Red, Green, Blue) is used for screens, while CMYK (Cyan, Magenta, Yellow, Key/Black) is for print. Understanding when to use each is vital for correct output.
- →Resolution and file size: Resolution (measured in DPI or PPI) affects image quality and file size. Higher resolution means more detail but larger files, which can slow down loading times on websites.
- →Layers and transparency: Layers allow you to edit parts of an image independently without affecting others. Transparency (e.g., alpha channels) lets you create non-rectangular images like logos.
- →File formats and compression: Lossy formats (e.g., JPEG) reduce file size by discarding data, while lossless formats (e.g., PNG) preserve quality. Choosing the right format depends on the graphic's use.
Learning Objectives
What you need to know and understand
- 1. Understand the principles of digital graphics. 2. Be able to plan design ideas for bitmap and vector digital graphics in response to a client brief. 3. Be able to develop bitmap and vector digital graphics. 4. Be able to review and refine bitmap and vector digital graphics.
- 1. Understand the principles of digital graphics. 2. Be able to plan design ideas for bitmap and vector digital graphics in response to a client brief. 3. Be able to develop bitmap and vector digital graphics. 4. Be able to review and refine bitmap and vector digital graphics.
- 1. Understand the principles of digital graphics. 2. Be able to plan design ideas for bitmap and vector digital graphics in response to a client brief. 3. Be able to develop bitmap and vector digital graphics. 4. Be able to review and refine bitmap and vector digital graphics.
- 1. Understand the principles of digital graphics. 2. Be able to plan design ideas for bitmap and vector digital graphics in response to a client brief. 3. Be able to develop bitmap and vector digital graphics. 4. Be able to review and refine bitmap and vector digital graphics.
- 1. Understand the principles of digital graphics. 2. Be able to plan design ideas for bitmap and vector digital graphics in response to a client brief. 3. Be able to develop bitmap and vector digital graphics. 4. Be able to review and refine bitmap and vector digital graphics.
Assessment Criteria
Key criteria assessors look for in your portfolio
- Award credit for accurately explaining the difference between bitmap and vector graphics, including scalability and resolution dependency.
- Expect the learner to produce a detailed plan that includes initial sketches, colour palettes, and justification of design choices aligned to the client brief.
- Look for evidence of using appropriate software tools to create and manipulate layers, shapes, and text in both bitmap and vector formats.
- Assess the ability to critically evaluate final graphics against the original brief, identifying strengths and areas for improvement with specific examples.
- Understands key principles of digital graphics.
- Plans design ideas for bitmap and vector graphics based on a brief.
- Develops bitmap and vector graphics using appropriate software.
- Reviews and refines graphics to improve quality.
- Explain principles of digital graphics (resolution, colour modes).
- Plan design ideas for bitmap and vector graphics.
- Develop graphics using appropriate software tools.
- Review and refine graphics based on feedback.
- Award credit for clear differentiation between bitmap and vector graphics, supported by accurate examples and intended use cases.
- Expect evidence of a design plan that directly responds to all client brief requirements, including target audience, purpose, and visual style.
- Assess development work for appropriate selection of software tools and techniques, such as layering in bitmap editors or path creation in vector programs.
- Credit should be given for a structured review that compares final graphics against the brief, identifies strengths and areas for improvement, and suggests actionable refinements.
- Understands the difference between bitmap and vector graphics.
- Plans design ideas that meet the client brief.
- Creates graphics using appropriate tools and techniques.
- Reviews and refines graphics based on feedback.
- Saves and exports graphics in suitable formats.
Assessment Guidance
Guidance for achieving higher grades
- 💡When planning, always annotate your sketches with reasoning that directly references the client brief to demonstrate meeting requirements.
- 💡For the review stage, compile a table comparing your final outputs to the original objectives, and include feedback from peers or simulated clients.
- 💡Use the appropriate software for each task: raster for photo editing, vector for logos and illustrations, and ensure you can export in multiple formats.
- 💡Practise using both bitmap and vector software.
- 💡Keep the client brief visible during design.
- 💡Save versions to track changes.
- 💡Practice with both bitmap (Photoshop) and vector (Illustrator) software.
- 💡Always save working files and export in required formats.
- 💡Use a design brief checklist to ensure all requirements are met.
- 💡In planning, explicitly map each design decision back to the client brief to demonstrate thorough analysis and responsiveness.
- 💡When developing graphics, work non-destructively: use layers and save master files in native or editable formats, exporting only flattened versions for final submission.
- 💡For the review, use specific, objective language (e.g., 'the logo does not scale well at 25mm due to pixelation') rather than subjective opinions.
- 💡Practise using layers and selection tools efficiently.
- 💡Always check the file format and resolution requirements.
- 💡Keep a backup of your work at each stage.
- 💡Always check the brief carefully before starting. Examiners look for evidence that you have planned your graphic to meet the specific purpose, audience, and format requirements. Include a clear design brief and mood board in your portfolio.
- 💡Save your work in the correct file format for the intended use. For example, use PNG for images with transparency, JPEG for photographs, and SVG for logos. Explain your choices in your evaluation to show understanding.
- 💡Use layers effectively and name them clearly. This shows good practice and makes it easier to edit later. In your portfolio, include screenshots of your layer panel to demonstrate your workflow.
Common Mistakes
Common errors to avoid in your coursework
- Confusing resolution (PPI) with physical dimensions, leading to bitmap images that are too small for print.
- Applying raster effects (like drop shadows) in vector software without understanding that they convert to bitmap upon export.
- Failing to save draft versions iteratively, resulting in loss of work or inability to revert to earlier designs.
- Neglecting to consider file formats for final delivery; e.g., using JPEG for a logo that requires transparency.
- Confusing bitmap and vector formats.
- Ignoring the client brief's specifications.
- Skipping the review and refinement stage.
- Using low-resolution images for print.
- Not considering file formats for intended use.
- Skipping the planning stage and jumping into production.
- Confusing image resolution with physical dimensions, leading to inappropriate output quality for print or screen.
- Using bitmap images when scalability is required, or incorrectly editing vector graphics in a pixel-based program without preserving editability.
- Neglecting to consider the client brief’s target audience and context, resulting in designs that are visually appealing but contextually mismatched.
- Using low-resolution images that appear pixelated.
- Not considering the target audience or purpose.
- Failing to save source files in editable formats.
- Misconception: 'Vector graphics can be created from any raster image by simply saving it as a vector format.' Correction: Converting a raster image to vector requires tracing or redrawing paths; it's not a direct conversion. Software like Adobe Illustrator can auto-trace, but results often need manual refinement.
- Misconception: 'Higher resolution always means better quality.' Correction: While higher resolution gives more detail, it also increases file size. For web use, 72 DPI is standard; for print, 300 DPI is typical. Using unnecessarily high resolution can slow down loading times and waste storage.
- Misconception: 'CMYK is better than RGB for all graphics.' Correction: CMYK is only for print. If your graphic will be displayed on a screen (e.g., a website), use RGB. Converting RGB to CMYK can cause colour shifts, so always work in the correct colour model from the start.
Frequently Asked Questions
Common questions students ask about this topic
Pass / Merit / Distinction Evidence Checklist
How your portfolio evidence is graded for GATEWAY QUALIFICATIONS LIMITED Digital Graphics
Demonstrate baseline knowledge, accurate terminology, and core practical application.
Provide detailed analysis, structured explanations, and clear workplace reasoning.
Deliver thorough evaluation, original problem solving, and fully justified recommendations.
Before You Start
Prior knowledge that will help with this topic
- •Basic computer literacy: Ability to use a mouse, keyboard, and common software interfaces (e.g., opening/saving files).
- •Understanding of file management: Knowing how to organise folders and save files with appropriate names.
- •Elementary maths: Basic understanding of dimensions, ratios, and percentages (e.g., resizing images proportionally).
Coursework AI Review
Self-check your coursework evidence against P/M/D criteria
Key Terminology
Essential terms to know
- 1. Understand the principles of digital graphics. 2. Be able to plan design ideas for bitmap and vector digital graphics in response to a client brief. 3. Be able to develop bitmap and vector digital graphics. 4. Be able to review and refine bitmap and vector digital graphics.
- 1. Understand the principles of digital graphics. 2. Be able to plan design ideas for bitmap and vector digital graphics in response to a client brief. 3. Be able to develop bitmap and vector digital graphics. 4. Be able to review and refine bitmap and vector digital graphics.
- 1. Understand the principles of digital graphics. 2. Be able to plan design ideas for bitmap and vector digital graphics in response to a client brief. 3. Be able to develop bitmap and vector digital graphics. 4. Be able to review and refine bitmap and vector digital graphics.
- 1. Understand the principles of digital graphics. 2. Be able to plan design ideas for bitmap and vector digital graphics in response to a client brief. 3. Be able to develop bitmap and vector digital graphics. 4. Be able to review and refine bitmap and vector digital graphics.
- 1. Understand the principles of digital graphics. 2. Be able to plan design ideas for bitmap and vector digital graphics in response to a client brief. 3. Be able to develop bitmap and vector digital graphics. 4. Be able to review and refine bitmap and vector digital graphics.
Ready to learn?
AI-powered learning tailored to this unit