• Layered Licks Creative 3D development diagram - layer 1 Layered Licks Creative 3D development diagram - layer 2 Layered Licks Creative 3D development diagram - layer 3 Layered Licks Creative 3D development diagram - layer 4 Layered Licks Creative 3D development diagram - layer 5 Layered Licks Creative 3D development diagram - layer 6 Layered Licks Creative 3D development diagram - layer 7 Layered Licks Creative 3D development diagram - layer 8
  • Portfolio image of the Licks Creative site
  • Licks Creative project image
  • Screenshot from the Licks Creative development project
  • Project screenshot
  • Licks Creative website screenshot
  • Screenshot from the Licks Creative development project

Licks Creative

lickscreative.com

HTML5, CSS, jQuery, RWD, & PHP

Licks Creative is the website and online portfolio of Mike Etheridge; a London-based freelance interactive/digital designer, and a personal friend.

Mike and I have shared many projects over the years including work for the The London 2012 Olympics, as well as some of the things you will find here in my portfolio (Analogue Baby, Gintenreiter Photography, and in2wrk to name a few). This collaboration allows us to push each other just that little bit further each time we work together so it is no surprise that his new website was something of a challenge!

With his keen eye for the finer details, it was extremely important that this new website and online identity reflected his creativity, ability, and fastidious nature. This meant that every aspect of the website - from the positioning of elements to animation durations - came under careful scrutiny to ensure that the final development matched his original concepts. I also wanted to ensure that his site was fully accessible on any device, necessitating a considered responsive and adaptive approach to reflowing the page layouts downwards (a desktop-first approach) and adaptive JavaScript interactivity for less-capable devices.

What resulted is a responsive HTML5, and jQuery build featuring CSS animations and vibrant imagery. Interactivity is further enhanced by the inclusion of touch interactions such as the touch-drag capability of the full-screen, fluid-width billboard slider found in his portfolio. From this billboard slider each project is loaded via AJAX to provide a more app-like feel and to improve page-loads; each featuring its own unique layout, flows, and colour schemes.

With its graphics-heavy appearance the biggest challenge on this project was keeping the weight of each page as low as possible whilst maintaining the highly-detailed and high-resolution imagery. Highly-optimised PNG images along with the use of AJAX to only load in portions of the portfolio as a user requested them has helped significantly with this.

Since originally going live three years ago the site has continued to evolve; a personal website is never truly finished!

Top