Skip to main content
SingaporeDesign StudiesSyllabus dot point

What digital tools do designers use, and why does the difference between raster and vector matter?

Describe common digital design tools and the difference between raster and vector graphics, and choose the right tool and format for a task

A focused answer on digital design tools for O-Level Design Studies. Raster versus vector graphics, resolution and scalability, common software types, file formats, and choosing the right tool and format for a task.

Generated by Claude Opus 4.88 min answer

Reviewed by: AI editorial process; not yet individually human-reviewed

Have a quick question? Jump to the Q&A page

Jump to a section
  1. What this dot point is asking
  2. The answer
  3. Examples in context
  4. Try this

What this dot point is asking

This dot point asks you to describe common digital design tools and to understand the crucial difference between raster and vector graphics, so you can choose the right tool and file format for a task. Most design today is created or finished on a computer, and a designer must know what the main software types do and, above all, when to use pixels (raster) and when to use mathematical paths (vector). You should understand resolution, scalability, the main file formats, and how to match the tool and format to the job. This is practical knowledge that prevents common, costly mistakes.

The answer

Raster (bitmap) graphics

Raster, or bitmap, images are made of a grid of tiny coloured squares called pixels. They are excellent for photographs and detailed, continuous-tone images, because each pixel can be a different colour. Their key limitation is resolution dependence: an image has a fixed number of pixels, so enlarging it beyond its resolution makes it look blurry or blocky (pixelated). Raster images also tend to have larger file sizes as detail and dimensions increase.

Vector graphics

Vector graphics are made of mathematical paths: points, lines and curves defined by equations. Because they are calculated rather than stored as pixels, they can be scaled to any size, from a tiny icon to a giant banner, with no loss of quality. They produce clean, sharp edges and small file sizes, and are ideal for logos, icons, type and illustrations with flat colour. Their limitation is that they cannot reproduce the fine, continuous detail of a photograph.

Resolution and why it matters

Resolution is the amount of detail in a raster image, measured in pixels or, for print, in dots per inch (dpi). Print needs high resolution (commonly around 300 dpi) so images look sharp on paper; a low-resolution image prints blurry. Screens need much lower resolution, so using huge images online needlessly inflates file size and slows loading. Matching resolution to the output is essential, and only matters for raster images, since vectors scale freely.

Common types of design software

Designers use several kinds of tool. Raster (image) editors handle photographs and pixel-based artwork. Vector (illustration) editors create logos, icons and scalable graphics. Page-layout software arranges text and images for multi-page documents such as magazines and brochures. There are also tools for user-interface and prototyping work, for 3D, and for motion. The skill is choosing the tool whose strengths match the task: photo editing in a raster editor, a logo in a vector editor, a brochure in a layout tool.

File formats

The right format depends on the use. Common raster formats include JPEG (good compression for photos, but lossy), PNG (supports transparency, good for web graphics), and TIFF (high quality for print). Common vector formats include SVG (scalable graphics for the web) and PDF (reliable for sharing and printing layouts). Choosing the correct format preserves quality, controls file size, and ensures the file works for its destination, whether screen or press.

Examples in context

Example 1. A brand rolled out everywhere. A company logo built as a vector appears crisp on a business card, a phone screen, a poster and a giant building sign, all from one scalable file. This shows why vector is essential for identity work that must live at every size without ever looking blurry.

Example 2. A photo-heavy travel website. A travel site edits its photographs as raster JPEGs optimised to screen resolution so pages load fast, while using vector icons and logo for sharp interface graphics. The mix of raster photos and vector graphics demonstrates choosing each format for what it does best.

Try this

  • Cue. Find a logo and a photograph on your device and zoom in on each. Note how the photograph eventually looks blocky (raster pixels) and explain why a logo should be vector to avoid this.

  • Cue. Explain in a short paragraph what resolution you would prepare an image at for a printed poster versus for a web banner, and why using the wrong one causes a problem in each case.

  • Cue. For a project of your choice, list which type of software and which file format you would use for a logo, a photo, and a multi-page document. Justify each pairing by matching the tool and format to the task.

Exam-style practice questions

Practice questions written in the style of SEAB exam questions on this dot point, with worked answer explainers. The year tag is the paper they imitate, not the source.

Original6 marksExplain the difference between raster (bitmap) and vector graphics, and state which you would use for a logo and which for a photograph. Justify your choices.
Show worked answer →

Raster (bitmap) graphics are made of a grid of pixels. They can show complex detail and continuous tones, but they lose quality and become blurry or blocky when enlarged beyond their resolution.

Vector graphics are made of mathematical paths (points, lines and curves). They can be scaled to any size with no loss of quality, but are less suited to photographic detail.

For a logo, use vector, because a logo must scale cleanly from a tiny favicon to a large banner without losing quality.

For a photograph, use raster, because photographs are continuous-tone images of real detail that vectors cannot reproduce.

What markers reward: a correct distinction (pixels versus mathematical paths; resolution-dependent versus scalable), and the correct, justified choice for each (vector logo for scalability, raster photo for detail).

Original4 marksExplain what resolution means for a digital image and why it matters when preparing an image for print versus for a website.
Show worked answer →

Resolution is the amount of detail in a raster image, usually measured in pixels (or in dots per inch, dpi, for print). A higher resolution means more pixels and finer detail.

It matters because print and screen need different resolutions. Print needs a high resolution (for example around 300 dpi) so the image looks sharp on paper; a low-resolution image will look blurry or pixelated when printed. Websites need only screen resolution (lower), and using huge high-resolution images online wastes file size and slows loading.

What markers reward: a correct definition of resolution (pixels/detail, dpi), and the key idea that print needs high resolution for sharpness while screens need lower resolution for speed and suitable file size.

Related dot points