- Vue
- JavaScript
- HTML5
- CSS3
- Sass
Vestiaire Collective is a fashion website, specialising in the sales of second-hand clothing. They wanted to create a bi-annual report of fashion sales, as a scrapbook-style, with a couple of interactive elements in the page.
![](http://www.stevenmcilwaine.com/wp-content/uploads/2020/07/vestiaire-collective-img-1-min.jpg)
The main features of the report were outlined early – it needed to be translatable, it needed to have an interactive globe element in the page and it needed to match the already-supplied design.
When I was brought in to the project, the bones of the site were in place, using Vue and Vue Router as the backbone of the page.
![](http://www.stevenmcilwaine.com/wp-content/uploads/2020/07/vestiaire-collective-img-2-min-1024x640.png)
My biggest contribution was to the interactive element that was required, which are the globes. It is created as a separate Vue component with simple click events that update the visible popup as required. Using CSS animation, the current-selected item shows a halo ring around it.
On switching slide (between the 3 for each globe), the popup resets as the frame goes out of view.
Back to Work