SVG
xpert

Scalable Vector Graphics using Adobe Illustrator

Doug O. Sanchez
MIT '14 2A


Introduction

welcome to 2.009

You are part of a new company that is about to choose its first hardware product on the week of October 23th and publicly launch on December 11th, 2017. Visual communication within your company at this stage is crucial for efficient presentation of ideas and research. Branding is also neccesary as your team prepares to face the outside world. You must choose an image format for two-dimensional graphics that your company will predominantly use. Why .svg?

  • Responsive/Scalable
  • Smaller file sizes
  • Is simply an XML file; you can open an SVG in a text editor and edit the code.
  • Can be styled with CSS; colours can be changed, elements hidden, allowing a single image to be used for multiple purposes.
  • Animation

Product Branding

Web Presence

Print Materials

Tutorial Materials

COLOUR

Contrast Ratio

4.5 : 1

Success Criterion 1.4.3 of Web Content Accessibility Guidelines (WCAG) 2.0 requires the visual presentation of text and images of text has a contrast ratio of at least 4.5:1, except for the following: Large Text: Large-scale text and images of large-scale text have a contrast ratio of at least 3:1;

Calculate Contrast Ratio

2.009 Colour Palette

The download zip contains an Adobe Illustrator colour swatches that you can install. Included in the zip is a read-me.pdf with instructions on how to install the .ase file into Illustrator.

Download the 2.009 Palette Poster Illustrator file below.

Resources