Simple drawing app

  • Status Closed
  • Budget $30 - $250 USD
  • Total Bids 13

Project Description


Develop a drawing application that provides the following functionality:

It lets users create drawings using a combination of straight lines, circles and rectangles. For example, to draw a new straight line a user selects this shape type from some menu or toolbar, and clicks on the desired starting position on the canvas. The user then drags the mouse to the desired end position.

Lets users set the following graphic properties to be used for drawing new shapes: outline color, fill color, outline width.

Lets users select a previously drawn shape and perform an actions on it. For simplicity, when a shape is selected and actioned-upon, it becomes the top-most shape (i.e., it will have the highest z-index). Your application should support the following actions:

Erase the shape.

Move the shape to a new position on the canvas.

Resize the shape.

Change the shape's color, fill, and outline width.

Copy and paste.

Clear the canvas.


This assignment evaluates the use of client-side Web technologies including HTML5, CSS3, JavaScript, JQuery, DOM, and Canvas. You will use these technologies to provide a pleasant experience for your Web site. Refrain from using server-side programming for this assignment; everything must happen on the client-side. Make sure to use CSS style sheets in favor of deprecated HTML tags and attributes.

Your application should be easy to use.

The main entry page for your site should be called index.html.

Make sure your site functions correctly in the CDF environment, specifically under Firefox version 21.0. TAs will not debug so test to ensure it works the first time!

Assume a fixed browser window size of 1024x768


Put all necessary files in one directory, and archive the directory into a single file using tar or a similar utility. Finally, submit your assignment using the BlackBoard system.

You electronic submission should include the following items:

Documentation for your Web site. Include a brief explanations of how it all works, e.g., list of main user-defined objects, and datastructures.

CSS file(s).

HTML file(s).

JavaScript file(s).

Finally, all deliverables should be neatly formatted, readable,and be properly documented .

Good luck!

Get free quotes for a project like this
Skills Required

Looking to make some money?

  • Set your budget and the timeframe
  • Outline your proposal
  • Get paid for your work

Hire Freelancers who also bid on this project

    • Forbes
    • The New York Times
    • Time
    • Wall Street Journal
    • Times Online