Assignment 6 - SVG

Create an a web page with an embedded SVG drawing, as shown in the Scalable Vector Graphics Introduction.

Requirements

  • Generate the drawing by hand. Do not use Illustrator or Inkscape or similar.
  • Create a cohesive image. For example, a house. Abstract circles and rectangles won’t score well.
  • Use multiple types of SVG drawing commands. If you use nine different SVG commands, you’ll score full points. See SVG Intro at W3Schools for a full list of commands.
  • Use color.
  • Be detailed.
    • At least 40 lines of SVG code.
    • When counting lines, I’m only looking at the number of lines for the image. Lines for the web page, blank lines, comments, don’t count.
    • 40 lines of code that only draw a grid of lines won’t score well, as it isn’t very complex, despite hitting the line count.

Common Issue

Use just only one pair of <svg> tags. You put all your drawing commands in between those SVG tags. If you use more than one, your drawing will eventually get messed up enough you’ll probably have to start over. This is the most common mistake in doing this project. So one <svg> and one </svg>, no more.

Rubric

../../../_images/rubric5.png

Examples

Blossom Powerpuff Girl Score:000 Lives:3 BARK! BARK! Welcome! //cat //tail //body //ears //left //right //head //eyes // left //right //left pupil //right pupil //nose //mouth //line down //smile //paw //left //right //left //leg //left //right //bow //bottom left //bottom right //left side //right side //middle //christmas tree //trunk //bottom layer //2 layer //3 layer //4 layer //top layer //star //center //bottom right // top point //top right point //top left point //bottom right point //bottom left point //ornaments

Example 3

A J O K E R J O K E R

Example 4