Team
Product Experience
Data Pod
My Role
Product Design Intern
Tools Used
Figma
Duration + Year
Jun 2nd - Jul 20th, 2023
Overview
Salesloft, the top sales engagement platform, assists businesses in cultivating meaningful customer relationships through an array of sales tools that streamline workflows and automate processes.
I collaborated with a Senior Product Designer to develop a Motion System Documentation. We explored industry standards and Figma's tools to create consistent and engaging animations, improving our product's brand identity and user experience.
Highlights
I delved into the world of motion design and began learning how to create animations within Figma, adding a new skill to my design toolkit.
Collaborated on laying the groundwork for a Motion System Documentation, working towards it becoming an integral component of Salesloft's design system in the future.
Motion Design
This was a collaborative venture with a Senior Product Designer, embarking on the innovation of a Motion System Documentation. Deeply rooted in industry research and practical application within Figma, our journey began with an analysis of the motion design systems from tech giants like Apple, Microsoft, Adobe, and more. These insights became the cornerstone in shaping our key motion principles, specifically tailored to fit Salesloft's product needs. Our collaboration was iterative, supported by feedback, exploration, and fine-tuning, with the wider team involved to guide the project's direction.
From a business perspective, the Motion System Documentation project aims to lay the groundwork for uniform animations across our product, potentially streamlining design efforts and enhancing our brand identity through consistent interactions. Looking forward, it is anticipated to enrich our customers' experience by introducing a more dynamic and intuitive user interface that will guide attention, provide insightful feedback, and elevate the overall user journey.
A demonstration of motion I designed in Figma, featuring a card illustrating an increase and another showcasing a decrease.
Navigating the creation of motion in Figma was a journey filled with trial, error, and growth. Initially, envisioning the end goal and crafting it into motion felt challenging, but as I dove deeper into Figma's prototyping tools without the aid of plugins, my approach progressively improved. This process led to the development of a sense of refinement, enabling me to discern what elements worked and which ones didn't, thereby fine-tuning my creations to better align with my envisioned outcome.
Another example of motion in figma, focusing on a loader example.
Despite the challenges, this iterative approach of learning and refining led to a newfound understanding of balancing motion in designs. This project, which is still in progress, gears towards refining the system, testing its efficiency, and ultimately weaving it into our existing design system. It's not just a step towards future innovation, but a giant leap in laying the foundation of a more interactive and consistent user experience.
A bar chart I created, employing Motion Design within Figma to visualize the data dynamically.
Reflection
Reflecting on this project, I recognize it was a journey filled with enrichment and growth. Initially, the task of creating motion in Figma, particularly without plugins, seemed daunting. However, through an iterative process of trial and error, combined with persistent effort and feedback, I saw my approach and output gradually improve.
Key Takeaways
Looking back on the Motion Design System project, some of my key takeaways are:
• Embracing Iterative Design. The process of experimentation and feedback was crucial, leading to significant development and refinement of the Motion System Documentation.
• Learning New Tools. I gained valuable experience with Figma, learning how to use its prototyping tools to create effective motion without the aid of plugins. This expanded my toolkit as a designer, enhancing my skills and proficiency.
• Value of Motion Design. Through this project, I understood the multifaceted impact of motion design. For our business, it promised to enhance brand identity and ensure design consistency; for customers, it aimed to create a more dynamic and intuitive user experience.
If you want more information about my work at Salesloft or have additional questions, please reach out to me at kirstyn.fagnani@gmail.com
