.svg)
May 17, 2022
Look into how you can use AI tools to augment your design workflow
Over the past few years, there’s been a boom in AI and Machine Learning research. This is due to a number of factors including processing power being more accessible and cheaper to use, as well as increased investment into research. But with this, we have seen leaps in tools that can impact design. We no longer pitch AI against human creativity but begin to step into a world where AI can augment and help us as designers. Here I walk through a handful of tools I’ve been impressed with and have used in my workflow (so not just a gimmick or one-off things to try out).
RunywayML is a tool to edit videos using Machine Learning. Ever had that person in the scene you want to remove? Or want to change the background but too large for a green screen? Try RunwayML to accelerate your video content creation.
Many a times, I’ve come across an old image, or even free to use image that is just simply too small. Enhance allows you upscale your image and remove artifacts.
Since I began using Enhance there have been a wealth of similar apps popping up across the web. Others include Deep-Image, which is particularly good for it’s integration with Google Drive, UpscalePics and Vance AI which can enhance night scenes and repair old torn photos.
If you’ve run out of free enhance credits, or are a developer, there are alternatives such as the Super Resolution API.
Ever had to create multiple designs for blog posts or marketing needs? Ever needed to bulk swap out images in Figma? Automator aims to automate your Figma tasks.
Automator is smart as it builds on Figma’s existing Product and Design community, as Figma has become the #1 tool of choice for designers use. Automator is already proving popular amongst the community, and having recently raised $3m there is plenty of growth and opportunity to go, so watch out!
Framer has often felt a little behind in Figma in terms of timing. However, it’s recent announcement to become a tool bridging web design and publishing websites, has indicated it could quickly catchup and actually overtake. Framer has seen the opportunity to introduce publishing live sites, with breakpoints for responsiveness and adding a CMS. Meaning design is no longer just a prototype, but any design can be a fully functioning site, removing the need to code.
This may not be an obvious ‘AI’ tool, but it does provide a huge jump between design and code, so in many ways augments the experience of delivering websites.
I’ve long struggled with finding good content and placeholder images when creating a mockup. I’ve often trowled all the image asset sites, copying text over from other sites, or just writing bad copy.
Faker - Generates realistic placeholder text in your Figma File. Useful for copy needs such as addresses, names or otherwise. Removes that need for Lorem Ipsum text. Non-Figma plugins include Text Generator.
Avatar Generator - Figma plugin that places in generated images of people! Has ensured equal levels of diversity so you have a more diverse and inclusive design. Non-Figma include the famous version being This Person Does Not Exist.
For a long time, we have curated palettes and colors. Pantone was formed for the need of defining color in an understandable and shareable way. Now there is a wealth of color usage for us to learn from.
Khroma - uses AI to learn which colors you like and creates limitless palettes for you to discover, search, and save.
Colormind - is a color scheme generator that uses deep learning. It can learn color styles from photographs, movies, and popular art.
Want to learn more about product and design? Want to get more resources to help your work? Sign up to my newsletter now.
Still struggling to wrap your head around? I've also prepared a complete walkthrough of files, system and logic behind this UI Kit/Framework.
All cards designs are available for Sketch as well with all assets as a separate canvas to help you easily put your designs and images in place.
