May 17, 2022

AI Tools for Designers

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).

1.Video Editing with RunwayML

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.

2. Need to upscale an image? Try Enhance

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.

Enhance AI Vance AI Deep-Image
  • Batch Upload
  • Presets
  • Custom Size
  • Virtually no limits
  • Quick processing
  • Auto-adjust color, tone, and balance
  • Portrait Enhancement
  • Improve Night Scenes
  • Fix pixelated, blurry, and low-quality images
  • Enhance color and many other details
  • Upscale from low-resolution up to 4k
  • Remove JPG artifacts
  • Remove unwanted noise
  • Sharpen blurry photos
  • Batch upload and connection to Google Drive
  • Watermarked images on Free plan
  • Limited options for enhancement type
  • Some customers complain of little improvement in image quality
  • Mainly good at upscaling of images
  • No specific options for certain types of images
  • Free plan offers up to 64mb per sec
  • Free trial: 5 credits
  • 100 credits $9/month
  • 300 credits $24/month
  • 500 credits $34/month
  • 600 credits $24.99/month Pay-As-You-Go
  • 200 credits $9.99/month
  • 200 credits $4.99/month - annual plan
  • Pay as you go model, for ongoing credits rather than a monthly fixed plan
  • 100 credits $7.75/month
  • 1k credits $57.5/month


3. Supercharge Figma with Automator

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!


4. Designs to Live Sites with Framer

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.

5. Generative Placeholders

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.

6. Color Generation

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.

Subscribe to my Newsletter

Want to learn more about product and design? Want to get more resources to help your work? Sign up to my newsletter now.

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Tom Jordan

Still struggling to wrap your head around? I've also prepared a complete walkthrough of files, system and logic behind this UI Kit/Framework.

Explore More
Tom Jordan

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.

Explore More