Innoloft
Reusable UI Design System & CMS Component Kit for product and marketing touchpoints.
Tasks
Product / Visual Design
Design System
Timeline
Apr 2024 - Jun 2024
Context
Innoloft is a B2B SaaS startup building an innovation platform. As a fast-growing company, design resources were limited, and marketing often had to move quickly without a strong design foundation.
Innoloft’s public pages had grown organically. The public website was managed partly through Strapi CMS and partly through developer-maintained code. This created friction: the marketing team lacked autonomy, the IT team was overloaded, and the brand identity was inconsistently applied.
Constraints:
Small startup → limited time and resources, no capacity for deep discovery research.
Existing brand → needed modernization and consistency, not a full rebrand.
Marketing needs → non-technical users needed easy, flexible ways to compose pages.
Challenges
Slow marketing workflows
My Role
As the Product & Visual designer, I collaborated with marketing and IT to:
Clean up and modernize the existing branding.
Build a lightweight design system for consistency and speed.
Expand Strapi’s functionality with a CMS kit of reusable sections, giving marketing more control.
Part 1: Design System (Figma)

Goals
Create a lean design system to clean up and modernize Innoloft’s brand identity, while giving marketing and product teams a consistent set of components for digital assets and web pages.
What I did
Modernized the existing branding (colors, typography, spacing) without redoing the entire identity.
Created a component library (buttons, cards, chips, content sections, icons).
Standardized design tokens (spacing, shadows, font scales).
Documented usage rules to ensure consistency across teams.



Outcome
Marketing gained a faster way to create assets without reinventing layouts each time.
Developers had a single source of truth for UI patterns.
The overall brand felt more cohesive, improving external perceptio

Part 2: CMS Component Kit (Strapi)

Goals
Reduce friction between IT and marketing by building dynamic, reusable CMS sections in Strapi, empowering marketing to create and edit pages independently.
Process &
Decisions
1- Audit → Reviewed all existing CMS sections to identify which were outdated, inconsistent, or inflexible.
2- Prioritization → Worked with marketing to understand which layouts they used most often and where they lacked flexibility.


To document changes and requirements, I created a table of existing CMS sections with notes on updates and editable fields. IT used this as a reference to navigate alterations and ensure everything was controllable in the CMS.
3- Redesign → Updated 13 existing CMS sections to match the design system styles.
4- Expansion → Created 6 brand-new sections, including:
Hero cection with AI Prompt field
Interactive multi-tabs section
Cards section
Features card section
5- Flexibility first → Designed each section to be responsive, modular, and reusable in multiple contexts.



To document changes and requirements, I created a table of existing CMS sections with notes on updates and editable fields. IT used this as a reference to navigate alterations and ensure everything was controllable in the CMS.


To document changes and requirements, I created a table of existing CMS sections with notes on updates and editable fields. IT used this as a reference to navigate alterations and ensure everything was controllable in the CMS.
Outcome
Autonomy → Marketing could now build and update pages themselves.
Speed → Time-to-market for campaigns dropped significantly (no waiting on IT).
Reduced friction → IT could focus on bigger tasks instead of small content changes.
Consistency → All public-facing pages aligned with the refreshed brand.
Key Takeaways
A lean design system doesn’t need months of research to deliver real impact — sometimes it’s about cleaning up and systematizing what already exists.
Combining a design system with a CMS kit empowered non-technical teams, reduced bottlenecks, and made the website scalable.
The result wasn’t just internal efficiency: it also improved Innoloft’s external brand perception, giving them a more modern and trustworthy presence.