Designed at Candidsky.

For various reasons, work on this project stopped at the design stage. Before that various rounds of designs had been proposed to the client as static high fidelity mockups and wireframes produced by a designer. Finally, I produced in browser prototypes based on my own designs.

The homepage prototype.

My contributions

Browser prototypes and designs

Though some static mockups and wireframes were produced for this project we couldn't agree on using any of them to move forward with. I was asked if I would like some input on the design in order to change this. I suggested that I build prototypes in the browser as this would allow me, as a developer, to produce designs in the most efficient way, as opposed to using something such as Photoshop, Illustrator or even something more web focused like Sketch. We decided to try this approach and I crated a homepage using only HTML and SASS. I decided to ignore any consideration of SASS file structuring and to a large extent class naming, in order to allow myself to focus on the design and not the code at a stage where both could be changed radically. I prefixed every CSS class I created with a "p-" for prototype to try and force each class name to be edited and reconsidered if the styles created at this stage ever made it to the build stage.

Some sample SASS showing prefixed class names and magic numbers.

I found it both challenging and fun to be able to exercise some visual design skills and to be able to exercise them via a familiar tool in SASS. It was also unfamiliar and interesting to write CSS/SASS with little consideration of reusability or robustness, instead opting for techniques such as using absolute positioning inappropriately and magic numbers. Overall I think this approach was a good decision for the circumstances as attempting to learn a piece of software to the high level of a designer seemed to be a inefficient use of time at this stage and for this project. It was always our aim for a designer to take, refine and add to any prototypes that were moved forward with.