Project: Diving 2000 - webshop

 Back to All Projects
  • Ongoing job
  • Stack: HTML, Angular, Grunt, Sass, PHP Smarty

Goal: Webshop selling scuba gear as well as snorkeling - and swimgear, courses and trips.

A lot of things have happened on this website over the course of the year I've maintained it.

I re-designed it in intervals, and eventually I had to re-code the whole thing from scratch as we switched not just from one host provider to another, but also from the old stack (let's call it the "Multiple Developers Didn't Know How To Clean Up After Themselves" stack, or perhaps the "If One Version of jQuery Doesn't Cut It, Try Adding Another But Leave the Old One, Just In Case" stack) to a new stack (Frontend: Angular, Sass, Grunt - Backend: PHP w. Smarty templating engine).

I was regrettably not able to choose the stack myself seeing as this decision had already been made before I joined the company. But I was single-handedly tasked with coding the new site and integrating with the new backend, third-party solutions and the company's economy system.

I also implemented SSL on this website as well as on most of the other websites hosted by Diving2000.

But let's start at the beginning - from late November 2016 to early September 2017 the website went through two re-designs, which built on each other and were really step-wise implementations.

The design I inherited looked like the following. It looked like it had never been updated at all (which was sadly not the case) and the code was clearly showing how many developers had had their hands on it. It was a gigantic, unwieldly mess.
Screenshot of the original design before I started working on it

The first re-design I did was met with certain constraints because the code was so messy there was no way I could single-handedly clean it up in time. But it was still an improvement over the old design:
Screenshot of the first revision of the original design

The second re-design struck a chord with our users. They started exploring further whereas they previously didn't use the top menu or any of the content on the front page to navigate. Now they did, and our Hotjar reports showed that they navigated both via the top menu, the side menu and the frontpage content boxes. In the process I did away with over half of the CSS and JS previously used on the site. I was so proud of myself.
Screenshot of the final design before migration

So, when I had to migrate the system, I built on top of the last design which had proved to be succesful - I just cleaned it up and removed some extraneous elements:
Screenshot of the final design after migration

For now, the task is maintenance and updates. But that's a piece of cake compared to moving the entire platform, backend and frontend, and re-coding the frontend from scratch. It seems as if the users are satisfied for now, and that's what matters. We'll see where it goes from here.

© Katrine-Marie Burmeister, June 2019