Colour Picker Concept

Challenged with creating a colour picker that doesn’t allow for poor colour choices, and a weekend at home alone, I wire-framed and prototyped this concept based on “colour collections”.

The Brief

First steps

I began by sketching with a pen and paper, adding notes and requirements for each stage and working out some user flows. I wanted to test these user flows and so I turned to Marvel. Once I had converted my sketches to artboards in Sketch, I was able to upload them to Marvel and get playing around with the interactions.

Marvel is a great service that allows Sketch files (or any other images really) to be made it to working protoypes, with buttons that move through the images. Its great to able to spend some time playing with the design and user flow before commiting to any code.

The demo here will highlight the actionable elements when it is clicked.

What happened next

Although I never had the chance to iterate on the prototype above, I did take the chance to play and build a HTML and Javascript prototype. It was a create chance to play around with json and the <canvas> element. What I built can be demo’d here and the source code found here.

View the site