Overview
SSENSE is a multi-brand, luxury fashion retailer with a unique editorial section, originally founded as an e-commerce platform.
Goal
Create a scalable and flexible system for content authors to easily create and manage articles, each with a unique layout.
Challenges
- Systematize a plethora of layout variations into configurable UI components and an easy to use backend
- Systematize a variety of typographic variations that utilize a custom font
Role and Team
My responsibilities included significant contributions to the frontend design system which consisted of a variety of sophisticated, reusable, Vue.js UI components. I also contributed to the WordPress backend to create custom fields for content authors to easily create and configure thousands of layout variations.
The ustwo team consisted of 3 developers, 1 QA engineer, 1 designer and 1 project manager collaborating closely with SSENSE’s product team.
Results and Learnings
- The WordPress backend was well received by the editorial team and enabled them to amplify their productivity.
- I quickly adopted new technologies and made contributions to optimizations for website performance via server-side rendering via a Node.js/Express.js backend-for-frontend. And automation via a build, test and deployment system via Webpack, Docker, Travis CI, GitHub and bash scripts.
- I also made optimizations to speed up development by streamlining the usage of an overwhelming amount of properties shared by highly customizable UI components. I did this by creating a flexible way to distribute reusable functionality across components via Vue.js mixins and abstracting the properties into reusable and composable objects and mixins.
- I was successful in partnering with designers to define component configurations, reusable typographic styles and systematizing designs into reusable components.
- I also created a VuePlay UI component library to showcase the various configurations of components so that they can be easily adopted and reused in the future.