UNIFYING BRAND COLORS
Color and typography and iconography were the main points of contention for Litmos and alignment came down to listening and choosing your battles. By simplifying the colors it allowed the Dev team and the UX team the clarity to see opportunities to use brand colors effectively.
CREATING TYPOGRAPHIC HIERARCHY
Typography for the key components needed to create distinction by opening up the ends of the scale. Naming convention was suggested and altered until a suitable agreement was found that required minimal complexity to implement for the Dev team and the UX team.
BRAND VOLUME
Without having proper discovery and exploration of the brand, it became a matter of trial and error to determine the brand volume and tone.
At first Blue was used to indicate the customizable color and then Litmos Purple became more of an obvious choice to stand in for the primary brand color to be customized in this platform.
DESIGN EVOLUTION
Extending the design language from thin lines to something with more visual weight for the empty state illustrations.
LITMOS AI ASSISTANT
Prior to the project's launch, there were ambitious plans to integrate artificial intelligence into the platform's core functionalities. This included initially implementing AI within the chat feature, followed by its integration into Search and, ultimately, into the course and content creation tools. The goal was to empower users to construct comprehensive training programs with AI-assisted support. My role in this project was focused on enhancing the user experience through branding and visual design. I specifically worked on creating the icon and designing the interactive elements of the chat window.
ANIMATIONS
Small touches were created for moments of the AI chat to show activity when the AI was thinking on an answer depending on how long or short the response time.
CONTENT CARDS
My initial focus was on redesigning the content cards, which had already undergone several iterations without achieving the desired outcome. Content is the heart of our platform, encompassing both third-party and company-specific materials. Given the diverse nature of content (learning paths, time-sensitive, free vs. paid), we needed a design that highlighted essential information upfront while providing more details upon interaction.
LENNY 404
Injecting the product with personality helped to align with the brand and made small moments like an error message more amusing.