Section 4 - Tools of the Trade

Design Software


Lesson Notes

There are 3 main types of design apps.

  • Photo/Raster
  • Vector
  • Web/Layout


Raster graphics store data on each pixel individually, which can then compress areas of similar enough colors to save space. Raster graphics can't be edited or enlarged without making the image blurry or pixelated. Sometimes that's what you want though — I've made plenty of Pixel Art in my day.

My favorite photo/raster design app is Photoshop. It costs about as much as Netflix and will make you way more money than another binge rewatch of Stranger Things.

There are alternatives however!

  • Affinity Designer and Affinity Photo combined gets fairly close and are quite inexpensive, but still lack some of my favorite features found in Photoshop.
  • Pixelmator is a bit more photo-focused but looks pretty good and up to date. I'll be honest, I haven't used it in years, but I'm sure it's good enough in many circumstances.
  • Photopea is a free (ad-supported) web tool that can work with Photoshop files and can do quite a bit, if you can live with the ads.
  • Gimp — but like don't. Please.

Common raster file types: JPEG, PNG, GIF, and TIFF. Oh and BMP if your kids call you old, like mine do.


Vector graphics store coordinates and math which is used to draw the image. This allows vector graphics to be scaled to any size without any loss of quality.

Common rector file types: SVG, EPS, and PDF.

My favorite vector design app is Illustrator, though if I'm doing more simple work I'll often just use Sketch. If you prefer Figma, that's fine too.


Now for the main tool for website design – the web/layout category, My preference is Sketch, though Figma is quite a bit more popular for reasons we won't get into here. Also lots of marketing dollars.

There's also Adobe XD, which is really good at prototyping interactions (animations and flows between pages).

© 2024 Radical Design by Jack McDade