What's this about? 
I believe designers should be able to test and validate their ideas at the highest fidelity. Testing an accurate representation of an idea instills confidence in a design direction and also helps explore new possibilities.  
Over the 2 years I've been with Cvent, I have contributed to evolving a prototyping culture using Framer and React. In this post, I walk through the process I followed, my recent contributions and touch on the infrastructure we have built to help designer prototype and validate complex interactions.

Our design system components in Framer X Team Store

How did it all start?
As a designer with an engineering background, I always felt comfortable to build prototypes using code. The process of testing my ideas instilled confidence in me about the design direction. Furthermore, it fostered my relationship with engineers as this process helped me empathize their work. 

I wasn't satisfied with our research process of using static screens to test design solutions. I felt the results weren't accurate and weren't able to capture the emotion of attendees using click through prototypes for complex interactions such as scrolling, dragging and transitions. 

Fortunately, at Cvent designers are given autonomy to use tools that deliver best results for the task. As a team, our results and confidence increased when we test our ideas using prototypes built using Coffee Script and React using Framer. Having seen the advantages, I worked closely with 3 UI Engineers (Kelby, Matt & Jonny) to import our design system into Framer X. This along with other efforts helped convince stakeholders regarding the value of using realistic prototypes for testing ideas.  
What are my recent contributions? 
Having spent the last two years designing calendar/scheduler features, I decided to invest time and built a calendar framework. The intention was to help other designers use the framework across other products and to increase the rate at which we explore and test ideas. 

Calendar Framework 
Designers can use the calendar framework built using Framer X and React to rapid test new features. 

Framer X Calendar package available in our team store

Click on the video above to view calendar framework built using Framer X

Design System Components & Patterns 
At Cvent, I collaborate with the design system team to help investigate patterns used across our product suite and built custom components in Framer X. In the recent past, I've contributed the following components to the design system team - Accordion, Sticky Header and Multi Select dropdown.
Other contributions I've made
I spend roughly 10% of my time at Cvent, helping other designers improve their prototyping skills. This includes organizing training sessions and workshops usually every second Friday. Here are a few workshops I conducted at Cvent in recent times. 
- Framer X Munch & Learn Series, January 2019 
- Designing with APIs, May 2019
- Using React Hooks in Prototypes, August 2019

In addition to conducting internal workshops at Cvent, I actively contribute to the Framer online Community along with hosting events and attending conferences. 
Back to Top