UI Design, Project Management
My agency started working with Neutrogena® in 2019 to help them design and develop their skincare app. The app was decommissioned in 2022 to instead move towards a WebApp offering the same services of helping a user understand their skin better and find products to assist with differing skin concerns, which was primarily done to support more users in accessing the options available to them without having to log into an app or check in.
With this came several different versions of the WebApp: Neutrogena© US, Neutrogena® Canada, Walmart, Walmart Canada, CVS, CVS Perch (in-store kiosk), Neostrata, India, and Brazil. All of these versions of the WebApp had nearly identical designs with the major differences being the products featured, differing copy, some image swaps, and in some cases, translations for international versions of the WebApp, such as Canada and Brazil.
I was not the sole UI designer for this project, but have worked on and supported the different design variations throughout the course of our partnership with them, as well as assisting with Project Management, developer support, QA phases for each new release, usability testing, and working closely with the copywriter to ensure all CMS fields were covered for each version.
There have been many iterations of the visual design phase for Neutrogena© Skin360™ that my agency worked on. We primarily worked in 2 week sprints to ensure quick progress and growth of the experience to benefit users. Myself and one other UI designer started with the mobile app back in 2019 with a few goals in mind for the business; educate users about common skin concerns, promote products that would help mitigate those concerns, and guide users on how to select skincare goals for themselves to stick to. The app transformed into a WebApp experience that offered the same features, and has been expanded on since then.
Our design team was given a style guide (which has since been updated to reflect the Neutrogena© brand) which was used throughout the experience. A friendly blue was used as the primary color for call-outs and UI elements, and a yellow was used as the secondary color for buttons. A user is offered various skincare goals throughout the experience, and a unique color is assigned to each of them to be easily identified. A user is also able to click on each potential skincare goal to find out more information about recommended ingredients for that goal as well as general information about each. After the experience, a user can get an email of their routine breakdown, which I have designed a few different versions of; you'll see an email design example below.
I worked closely with the copywriter from 2019-2025 to ensure that all content was gathered for the various instances of the WebApp as mentioned above (Neutrogena© US, Neutrogena® Canada, Walmart, Walmart Canada, CVS, CVS Perch as an in-store kiosk, Neostrata, India, and Brazil). Much of the copy is the same, but translations were required for international versions of the app, alt text, and a lot of the skin concerns would have varying copy per instance to support the recommended ingredients. I additionally supported much of the QA process during the 2 week sprints. Each time a new feature was released or there was a large design overhaul, I was involved with the process of making sure all business requirements were met and there were no gaps in functionality or experience for the user.
I also conducted usability testing with participants consent on various instances of the app from 2020-2021 to identify any gaps that the experience had at the time as the designs and functionality continued to be improved upon and, on top of being a designer for the project, was a project manager as well, where I would support both the business needs and provide assistance to the developers. Our team has supported Neutrogena© up until 2025.