Front-end development

Converting designs into code can be a cumbersome challenge. Constant back and forth between a designer and developer can create frustration and bad moral. By having the skills required to translate it myself I can bridge the gap between the design and your development team by working with them to make the design a reality.


I don’t try to force my way of doing things upon your team. I do have my preferences but I don’t care whether your team uses grunt or gulp, sass or less, I maintain a flexible attitude that allows me to adapt to you and your stack. I do however suggest improvements when I see a clear gains for your team.


Translating the design into fully interactive and integrated pixel perfect retina ready web pages, HTML and CSS is the core foundation of the website. The design process should have taken made a clear path to where we want to go but this step is where everything becomes a reality and it is important to make sure the everything behaves as expected.

Meaningful Animation

Animation can help deliver the right message. Some overdo it by drawing attention away from the content. But if done right animation can give a sense of polish and help deliver the right message.

Read more on meaningful animation
Designing interface animation - Val Head (A List Apart)
Motion with Meaning - Amin Al Hazwani & Tobias Bernard (A List Apart)

Responsive design

Taking every device and screen size into consideration ensures your users will have a smooth experience no matter what device they decide to use.

Read more on responsive design
What we mean when we say responsive - Lyza Danger Gardner (A List Apart)
Rolling out responsive - Karen McGrane (A List Apart)
Designing for breakpoints - Stephen Hay (A List Apart)

Style guides

Taking the Visual design and splitting it into atoms in a style guide outlines all the elements in one place. I usually translate it into reusable elements on the development side where you can visit and pick out the styles you need for the development.

This can really help bridge the gap between back-end and front-end developers. The back-end developers can pick out the styles they need and apply them easily without waiting for the front-end developer.

Read more on style guides
Designing interface animation - Val Head (A List Apart)
Motion with Meaning - Amin Al Hazwani & Tobias Bernard (A List Apart)


Nothing is ever finished. Going back to the drawing board after launching a project or a small feature and gathering data from the results is one of the most important steps in design and development. Only by constantly questioning your previous decisions can you really excel above your competition.

Read more on iterating
Iterative design - Wikipedia

Want to learn about my design services?