A comprehensive design system built in Figma, leveraging new features to enhance collaboration, ensure consistency, and prioritize user-friendly experiences for both website visitors and university stakeholders using our design components.
In the journey to enhance the Figma Design System at La Trobe University, a commitment to aligning with proper design standards became the guiding principle.
This project began by addressing the critical absence of features like auto layouts and variables, paving the way for a comprehensive overhaul that transformed the system.
Recognizing the diverse needs of stakeholders, including design agencies and university departments lacking dedicated designers, the focus shifted to creating user-friendly components that catered to their everyday requirements.
To further empower internal teams, a series of training sessions were conducted, providing essential education on the effective use of the design system.
The introduction of variable functionality marked a significant milestone, ensuring seamless support for both desktop and mobile modes, and enhancing versatility across platforms.
Lastly, a robust set of design system guidelines was established to govern future changes. This included a structured documentation format that adheres to industry standards, ensuring consistency and clarity as the design system continues to evolve.
Auto Layout: Streamlined responsive design by enabling components to adapt dynamically to content changes.
Local Variables: Customized styles and properties for components, allowing for easy updates and consistency.
Local Variables with Modes: Facilitated design variations for different screens (desktop/mobile) using modes, enhancing adaptability.
Text Variables: Simplified text editing across components, ensuring uniformity and quick updates.
Switches for On/Off Variables: Enabled toggling of specific design features, allowing for flexible component variations.
Hiding Atomic Components: Protected foundational components from accidental alterations by other users, ensuring design integrity.
Dev Features:
Component Variants: Created variations of components to represent different states or types, improving organization and usability.
Design Tokens: Established a system for consistent styling across the design system by defining colors, typography, and spacing.
Prototyping Features: Developed interactive prototypes to demonstrate user flows and functionality as needed.
for visiting my portfolio and
contacting me!
I'll get back to you shortly! Would you like to see my case studies?