Assignment 3

In this assignment your task is to implement a color scheme chooser. Your completed program should implement the main features of this application:

Color Scheme Designer

The exact details of the requirements are specified in the marking scheme below. You are not responsible for implementing features of the Color Scheme Designer that are not specified in the marking scheme.

Marking Scheme

This assignment is marked out of 20.

  • 1 mark for a colour wheel, the wheel should show all of the fully saturated, and bright colours in the HSB colour space. It does not need to include any of the fancy markings shown in the website.
  • 1 mark for a colour area that shows the selected colour(s); the colours can be shown as fully saturated and bright colours of the chosen hue (i.e. you don’t have to show multiple rectangles with different shades). This is the equivalent to the website’s large colour rectangle to the right of the colour wheel.
  • 1 mark for drawing scheme icons for the mono and complement colour schemes. The icons do not have to be the same as those shown in the website, but they should represent the schemes.
  • 1 mark for text underneath your two scheme icons, the text should match the icon (mono or complement).
  • 1 mark for text showing a title
  • 1 mark for text showing the currently selected hue value in degrees
  • 1 mark for making the mouse cursor change to a hand when the mouse is above one of the scheme icons or the small moveable circles on the colour wheel, and changing back to an arrow when it is not.
  • 1 mark for drawing a single small circle on the colour wheel when the mono colour scheme is selected. The circle should contain a different shade of the colour that it is above.
  • 1 mark for allowing the small circle to be dragged around the colour wheel. The circle’s direction of movement should correspond to the movement of the mouse but it should always remain the same distance from the centre of the colour wheel (like it does on the website).
  • 2 marks for making the colour in the colour area correspond to the colour underneath the small circle.
  • 4 marks for allowing the user to choose between mono or complement colour schemes
    • 1 mark for drawing a second small circle opposite the first circle at the same distance from the centre of the colour wheel.
    • 1 mark for drawing two coloured rectangles in the colour area that correspond to the colours underneath the small circles. One of the rectangles (the one that corresponds to the main colour) should be larger, similar to the website.
    • 1 mark for making the icons indicate which of the colour schemes (mono or complement) is currently selected.
    • 1 mark for allowing the user to switch between the mono and complement colour schemes.
  • 2 marks for implementing a third colour scheme – either triad or analogic.
  • 3 marks are for the quality of your source code. Specifically:
    • 1 mark for consistent and sensible indentation of your code.
    • 1 mark for sensible and self-descriptive variable names throughout your code. There may be a lot of variables in this program, so good naming is important!
    • 1 mark for using functions in a sensible and appropriate way in your program.

What to Submit

Please name the program you write for this assignment asn3. Submit the folder called asn3 that contains the program (which should be automatically called asn3.pde) and any image and font files it needs. Compress this folder as an archive named (please only use .zip, and not some other archive format).

Submitting this Assignment

Please submit this assignment on-line no later than the due date listed on the course marking scheme. Late assignments may not be marked.


  • Start small. The marking scheme is a reasonable indication of the order in which you might want to implement the various features.
  • Whatever you do, don’t try and implement everything at once without testing – this is likely to result in disaster!
  • Carefully test each feature before moving on to the next one.
  • If you make major changes to your program make a backup of the previous version.
  • You can find an example that uses the HSB colour scheme on the Samples page
  • The Polar Coordinates page covers converting between Cartesian and polar coordinates and also has an example of a for loop
  • Implementing mouse dragging is discussed on the Special Effect: Dragging and Dropping page

Table Of Contents

Previous topic

Assignment 2

Next topic

Assignment 4