My Submission

[spencergray96]

Colour Chisel User Test

User Information

Name: Spencer Gray
Programming Experience: 3
UI/UX Experience: Yes
Languages Known: javascript, typescript, nodejs
Is the language useful?: its fun
what further functionality would you like to see?: move x or y values from a certain point

Tests

Exporting the different constants.

Please input and export a blue hex (#0000FF), a red hsl value (hsl(0,0.5,0.5)) and a green rgb (rgb(0,255,0)).

export (#0000FF);
export (hsl(0,0.5,0.5));
export (rgb(0,255,0));

Finding compliments

Export your favourite colour and its compliment.

export var fav = (rgb(255, 0, 0));
export fav > compliment;

Making a path

Make a path consisting of your favourite colour and its compliment.

export var fav = (rgb(255, 0, 0));

var myPath = [
  fav,
  fav > compliment
];

export myPath;

Find the analogous a path

Create a path and find an analogous path that is 45 degrees over. Export both paths.

export var fav = (rgb(255, 0, 0));

var myPath = [
  fav,
  fav > compliment
];

export myPath;
export myPath > analogous 45;

Scale a path

Create a path and make 2 versions of the path. One version of the path should be larger (closer to edge of the colour wheel), and the other should be smaller (closer to the middle of the path). Export all the paths.

export var fav = (rgb(150, 50, 120));

var myPath = [
  fav,
  fav > compliment
];

export myPath;

export myPath > scale 0.69;
export myPath > scale 4.20;

Combine 2 paths

Create 2 paths, with no overlapping values. Combine these 2 paths and export the new path.

var red = (rgb(173, 104, 83));
var green = red > compliment;
var blue = red > analogous 69;
var f = (rgb(255, 255, 255));

var path1 = [
  red,
  green
];

var path2 = [
  blue,
  f
];

var path69 = [
  path1,
  path2
];

export path69;

Make the 'S'

Using only a single hex, rgb or hsl value, use transformations to make the S shape (An example of the S shape is on the 'Paths' example on the other page, this used 6 inputs, try and do it with 1 input).

var ass = (hsl(60, 0.5, 0.5));
var ass2 = ass > analogous 30;
var ass3 = ass2 > analogous 30;

var ass4 = ass3 > compliment;
var ass5 = ass4 > analogous -30;
var ass6 = ass5 > analogous -30;

export [
  ass,
  ass2,
  ass3,
  ass4,
  ass5,
  ass6
];

Draw a picture

Can you draw a picture on the colour wheel? Let me see your creativity. This one is for fun.

var eye1 = (hsl(60, 0.5, 0.5));
var eye2 = eye1 > analogous 60;
var mouthA = eye1 > compliment > analogous -30;
var mouthB = mouthA > rotate 30;
var mouthC = mouthB > rotate 60;
var mouthD = mouthC > rotate 30;
var mouth = [
mouthA,
  mouthB,
  mouthC,
  mouthD
];

export eye1;
export eye2;
export mouth;
export mouth > scale 1.1;
export mouth > scale 1.2;
export mouth > scale 1.3;
export mouth > scale 1.4;
export mouth > scale 1.5;