Documenting Interactions

Here's just a fun lowfi mockup simulating a concept for the transition between a patients preview and edit mode.

Designers Dilemma:
I started out as web designer. The more inaccurate my designs were being translated and implemented from design to dev, the more code I decided to take under my belt. Now I've got about 10 years of experience doing frontend, which has been extremely helpful when designing for the web. I figured that if I could be both designer and developer, I could guarantee preserving the integrity and functionality of the design..

However, the more time I spent learning frontend the less I invested in growing as designer. I had found myself biting off more than I could chew by wanting to be great at both dev and design. The distinguished unicorn all the while diluting my main value prop. In a way you could say that I lost sight of my first love.. design.

So I'm back. After being honest with myself in what I really enjoy doing I've decided to focus my efforts back in the design world. It's been great! One hurdle now is to give as much context to developers so that when implementation time comes, both developer and designer will be set up for success. The closer that partnership is the better the outcome.

But the challenge these days isn't as much to do with translating the designs to code anymore as much as it is preparing expectations for transitions and ui/ux interactions. Documenting these interactions before the developer hits the ground running is essential. Outside of creating lowfi or even highfi gifs of how these interactions would work, I haven't found a good solution yet to document this. Other than taking over the developers job, I'd be interested to here what others do here.

Thanks!