There are three parts to the assignment.
Using a Vector Graphics Drawing program such as Illustrator, create a vector graphic for your website. This could be a logo, a symbol, a user interface element, or an illustration. Your image should include unique forms, layers, and colors.
When your Illustrator image is complete, save it as an SVG file as follows: File > Save As... > Format: SVG (svg) > Save. You can leave the SVG Options at their default settings. After you click OK you will have a web-ready scalable vector graphic.
Note that in addition to the free 30 day evaluation copy of Illustrator, there is also a free SVG editor online sponsored by Google.
In this part, you are to create an SVG image programatically – that is, via code. You will only need a text editor to create the file. Note that depending upon which program you use, it may be easier to save the file with the extension .txt and then change it manually to .svg. You can also read your .svg file with your text editor since it is simply text. Again, you may want to change its extension to .txt first.
For an abbreviated description of the graphics library behind svg, see the tutorial file. There may be extra credit points for an exceptional animated SVG image. There are also many good references and tutorials online including SVG Basics, Jenkov, and, of course, the original W3C documentation.
Add the two SVG images you created to your website inside an HTML page which allows your images to scale (i.e., it is within a container and you mark the image as width of 100%.) You can use the SVG file as you would a bitmap image, with the img HTML tag. (See attached example).
Publish your project on the i6 web server.
Send the URL to your website with the original SVG images on it.
A compressed archive of your website files (including the SVG, HTML, CSS, and any image resources) and the original Illustrator document (ai) should be posted to NYU Classes.