Colgate Ai Image Generator
Summary
Mission
The goal of this project was to create an enterprise AI image generation platform that empowered Colgate-Palmolive teams to produce marketing and internal visuals efficiently, while maintaining strict brand consistency. A key focus was implementing governance tools to ensure all generated content adhered to company guidelines, preventing the use of unapproved imagery and reinforcing brand integrity at scale.
My Role
Tasks
-
User Interface Design
-
User Experience Design
-
User Research
-
Usability Testing
-
Stakeholder Interviews
-
Competitive Analysis
-
Wireframing
-
Prototyping
As a Product Designer, I built the Image Generator MVP from scratch – I took the web app through all stages of the UX design process and got it ready for launch. Along with this I educated myself on the backend functionality for image generators and collaborated with developers to understand all technical limitations.
Discovery
User Research
In order to gain a full understanding of how we could be build a product that would be impactful to our users. We conducted over 20 user interviews with Colgate employees that cover a wide range of responsibilities. The takeaways we gained from this research is:
-
80% of participants create imagery for external and internal use and want a tool to help them quickly generate images.
-
Users struggle to find the right images to use that fit Colgate guidelines
-
Users struggle to edit images to meet specific needs
-
Users want a tool where they can generate professional photos so that they do not need to pay for professional photography of products
Feature Planning
After finalizing our findings we began planning out the scope of the project, and what features were necessary to be included in the MVP. The main pieces to be included in the MVP were; provide users with prompt and editing tools so that they could tailor the image to their needs, provide governance so that all images were within Colgate's policy, and to provide a library where users could see previous prompts and images.
Wireframes
Once we had a structure in place, we moved onto wireframes where we explored how each screen would be laid out. This allowed us to quickly sketch out different user flows without having to spend too much time thinking about visual design of those screens.
The main focus during the initial stages was on how to structure which tools to show on prompting vs editing, and the governance flow. This laid the foundation for further expansion and paved the way for introduction of additional tools. With the governance flow we were able to implement a system check that once a user uploads a reference image to use in their generation
UI Design
After we were happy with the wireframes, it was time to translate them into UI designs that would be handed over to the developers for implementation. This included defining the webapp's visual identity that aligns with the brand guidelines, while also following UI best practices.
One of the biggest accomplishments was being able to create designs that were not only accessible to beginner users but were also comprehensive enough for power users. We did this by building a "learnable" platform in which encouraged discovery of different tools and encouraged users to experiment in order to create the best image.
