Figma Vs Motiff - New AI Design Tool! | Better Pricing, AI UI Design, Design Systems & More

Summary

In this video, the host introduces a new Figma competitor, boasting top product status on Product Hunt. The platform offers a free plan with unlimited personal files and three motive files with premium features. Its pricing is notably lower than Figma's, with a $1/month option for Dev mode only. The interface closely resembles Figma's, but with added features like AI tools for design automation, including AI reduplication, layout generation, and a design system generator. The video showcases these AI capabilities, demonstrating how they can streamline the design process, potentially rivaling Figma's offerings.

Takeaways

• 🌟 The video introduces a significant competitor to Figma, which has gained recognition on Product Hunt.
• 💸 The new competitor offers a free plan with unlimited personal files and three motive files with premium features.
• 🆓 The AI Suite of tools, 'Motive AI,' is currently free during its beta phase but will likely be integrated into the pricing model later.
• 💲 The pricing for the new tool is notably lower than Figma, with a special $1 per month offer for Dev mode only.
• 🔄 The home screen is similar to Figma, featuring projects and recents, and includes an import feature from both Figma and Sketch.
• 🔧 The interface resembles PMA's old design before UI3, indicating a familiar user experience for designers.
• 🔌 A dedicated button for plugins is available, although the number of plugins is currently limited.
• 🤖 The AI tools are a highlight, starting with 'AI Replication' that can duplicate elements and automatically generate new names or images.
• 🎨 'AI Layout' is another feature that automatically creates a structured layout for UI elements, streamlining the design process.
• 📚 'AI Magic Box' fills sections and spaces with content automatically based on a prompt, such as generating a list for music albums.
• 🔄 'AI Design System Generator' recognizes and organizes design elements into a coherent system, although it lacks some aspects like coded elements and detailed tokens.

Q & A

What is the main topic of the video?

The main topic of the video is a competitor to Figma that uses AI technology and has recently gained attention for its pricing and features, including being named the top product on Product Hunt.

What feature makes this new competitor stand out in terms of pricing?

The new competitor offers a free plan with unlimited personal files and three premium 'motive' files, which include advanced features like AI tools. The pricing is lower than Figma, and the 'Dev mode' is available for only $1 per month.

What similarities does the competitor’s interface have with Figma?

The competitor's interface looks very similar to Figma's older design (UI 2), with a familiar project layout, recent files section, and the ability to import files from both Figma and Sketch.

What unique feature does the AI 'reduplication' tool offer?

The AI 'reduplication' tool can automatically replicate design elements, such as name cards, by detecting patterns and generating new names or images relevant to the original content, even considering details like cultural context (e.g., Indian names for Indian users).

How does the AI layout tool improve the design process?

The AI layout tool automatically structures design elements into an Auto Layout format, organizing buttons, images, and other elements to improve the overall layout, which can then be manually adjusted for preferences.

What capability does the AI tool have for generating complete UI designs?

The AI tool can generate a complete UI design by processing a user prompt and creating an app interface with organized elements like buttons, layouts, and images in real-time.

What is the function of the 'AI Magic Box' feature?

The 'AI Magic Box' feature can fill sections and spaces automatically by understanding the screen content and generating elements like music album lists based on a prompt.

What does the 'AI design system generator' do?

The 'AI design system generator' detects elements like buttons, text, and links in a design file and automatically generates a design system, organizing components like typography, color schemes, and effects into layers.

What is one drawback mentioned regarding the 'AI design system generator'?

The 'AI design system generator' lacks detailed layer naming and design tokens for some elements, which could make the design system less organized compared to Figma.

How does the video conclude, and what does the presenter ask from viewers?

The video concludes with the presenter asking viewers to share their thoughts on whether this new AI-powered tool can compete with Figma. They also encourage viewers to like the video and leave comments.

Outlines

00:00

🎉 Exciting New Figma Competitor Launched!

The video opens by announcing the release of a major new Figma competitor, powered by AI. This new tool has already gained significant recognition, even winning 'Top Product of the Day' on Product Hunt. The presenter teases a surprising price point that will interest both users and Figma itself, encouraging viewers to dive right into the pricing details. The competitor offers a free plan with unlimited personal files, a significant perk compared to Figma's paid drafts. Users can enjoy premium features like AI tools for free during the beta phase. A standout point is that the competitor charges only $1 per month for developer mode, a stark contrast to Figma’s pricing.

05:01

🖥️ Interface & Key Features Overview

The presenter reviews the interface of the new AI-powered tool, noting its similarities to an earlier version of Figma's design. The tool includes the ability to import files from Figma and Sketch, something Figma lacks. Plugins are also available, though limited for now. The video continues by showcasing the tool’s AI features, such as AI replication, which automates name and image duplication. For example, if the presenter has a card with their name, AI replication can generate multiple variations with new names, even adapting based on cultural cues like recognizing Indian names. The AI can also handle images, making replications based on the type of image (e.g., photos, illustrations).

🤖 AI Layout & Design Automation

Next, the presenter explores the AI layout feature, which automatically organizes design elements into Auto Layout, a feature that makes manual adjustments much simpler. The tool also generates entire app layouts in real time based on user prompts. The generated app includes well-placed elements such as 'Home', 'Popular', and 'Nearby' sections, all following the Auto Layout structure. The presenter praises the AI’s performance, calling it one of the best tools they've seen for UI design. Another AI feature, called AI Magic Box, automatically fills up spaces and sections based on simple user prompts, making the design process smoother and faster.

📦 AI-Generated Design Systems

The final AI feature reviewed is the AI design system generator. This tool scans a project to recognize and categorize design elements like buttons, text, and links, automatically creating an organized design system. The tool detects thousands of layers and organizes them by typography, color, effects, etc. The presenter appreciates the thoroughness of the tool but mentions a desire for more detailed naming and token generation. Despite a few limitations, they find the tool's functionality impressive and well-organized.

👍 Wrap-Up & Final Thoughts

The video concludes with the presenter encouraging viewers to like the video and share their thoughts on whether this AI-powered tool can compete with Figma. They invite comments and feedback, emphasizing the potential of this new competitor. The video ends with the presenter promising another video next week and wishing the audience well.

Keywords

💡Figma

Figma is a popular web-based interface design and digital product design tool. It allows designers to collaborate in real-time and is known for its vector graphics editor and user interface design features. In the context of the video, Figma is the main competitor to the new tool being discussed, and the video compares the features and pricing of the new tool with Figma.

💡Product Hunt

Product Hunt is a website that features new and innovative tech products. It's a platform where users can discover and vote on new products, and it's often used by startups and developers to gain visibility for their products. In the script, the new tool has been recognized as the 'top product of the day' on Product Hunt, indicating its potential significance in the design tool industry.

💡Pricing

Pricing refers to the cost or fees associated with using a product or service. In the video, the pricing of the new design tool is a central point of discussion, with the presenter highlighting that it offers competitive pricing compared to Figma, including a free plan with unlimited personal files and a low-cost 'dev mode' option.

💡AI Suite

An AI Suite refers to a collection of artificial intelligence tools designed to enhance productivity or user experience. In the video, the new design tool boasts an AI Suite of tools that includes features like AI reduplication and AI layout, which are designed to automate certain design tasks and streamline the design process.

💡AI Reduplication

AI Reduplication is a feature that allows users to automatically duplicate design elements with variations, such as changing names or images. In the video, the presenter demonstrates how this feature can be used to quickly create multiple design elements with different names or images, showcasing the efficiency it brings to the design process.

💡Auto Layout

Auto Layout is a feature that automatically arranges and resizes UI elements to fit different screen sizes and orientations. The video describes how the new tool's AI can create an auto layout for design elements, making it easier for designers to ensure their designs are adaptable and responsive.

💡UI Design

UI Design, or User Interface Design, is the process of designing the look and feel of a software application's user interface. The video discusses how the new tool can automatically generate UI designs based on user prompts, which is a significant feature for streamlining the UI design process.

💡AI Magic Box

AI Magic Box is a feature mentioned in the video that automatically fills sections and spaces in a design based on a prompt given by the user. It's an example of how AI can be used to generate content and design elements, which can save time and inspire creativity in the design process.

💡Design System Generator

A Design System Generator is a tool that helps create a consistent set of design elements and guidelines for a project. In the video, the new tool is shown to have a feature that recognizes and organizes design elements into a cohesive system, which is crucial for maintaining consistency across a design project.

💡User Interface (UI)

User Interface, often abbreviated as UI, refers to the space where interactions between users and a device occur. It includes the design of the display and the controls. In the video, the new design tool is shown to have features that enhance UI design, such as AI layout and AI Magic Box, which help in creating a more efficient and effective user interface.

💡Plugin

A plugin is a software add-on that extends the functionality of a program. In the context of the video, the new design tool includes a feature for plugins, which allows users to add extra capabilities to the tool. The video mentions that while there is a limited set of plugins currently, this feature is a positive aspect of the tool's design.

Highlights

Introduction of a major competitor to Figma, powered by AI, which has been recognized as the top product of the day on Product Hunt.

The new competitor's pricing is set to surprise both Figma and its users.

A free plan is offered with unlimited personal files and three motive files with premium features.

Motive AI, the AI Suite of tools, is currently free until it exits beta.

Pricing for the new tool is significantly lower than Figma, offering a $1 per month Dev mode option.

The home screen is similar to Figma, with projects and recents, and an import feature from Figma and Sketch.

The interface resembles PMA's old design before UI3, which is considered a positive.

A separate button for plugins is included, although the plugin set is currently limited.

AI Reduplication tool can duplicate elements with different names or images automatically.

The AI tool can also create AI layouts by adding auto layout to buttons or pieces of information.

AI can generate UI designs in real-time using prompts, as demonstrated with an app generation example.

AI Magic Box feature fills up sections and spaces automatically based on content and user prompts.

AI Design System Generator recognizes and organizes elements into a design system with detected layers and pages.

The design system includes typography, color effects, and other aspects, although some elements like tokens are missing.

A call to action for viewers to give a thumbs up if they like the tool and to comment on its potential to compete with Figma.

A teaser for the next video and a sign-off until the following week.

Transcripts

hey guys welcome back to the channel

today is a big day for figma and for us

because the biggest figma competitor

powered by AIS here they even got the

top product of the day on product hunt

as well and the pricing is going to

surprise you and figma both so let's

just get started all right so straight

up let's just talk pricing because

that's the first thing they show us so

for most of you guys you can take up the

free plan which has unlimited personal

files yay no more paid drafts three

motive files which I believe will have

all the premium features chat etc for

now motive AI which is their AI Suite of

tools is completely free until they are

in beta but then of course they'll

probably include it under their pricing

now the pricing right now is much lower

than figma I'll put a little screenshot

of figma pricing and if you just need

the dev mode they will only charge you

$1 per month if you need Dev mode only

for all the other features you can just

use it for free which is very good

because it's very flexible again let's

just skip this let's just get the free

plan let's get started the home screen

itself looks very similar to what you'll

find on figma you have your projects

here inside your recents you also have a

import from figma and sketch both so in

figma you can only import from sketch

here you can import from all those tools

the interface itself looks extremely

similar to pma's Old design before ui3

so UI 2 I think that's pretty awesome so

right here they have a separate little

button for plugins which is nice they

only have a limited set of plugins right

now now let's try out all their AI tools

that they of course are boasting here on

their website to begin with they of

course have something called AI

reduplication which is very good if I

have a card with my name on it so pun

chaa and this card I need to replicate I

would need to have multiple names of

different people I can then go here and

say AI reduplication automatically if I

expand this to another card and it is

also giving it a new name live here so

anytime I need to duplicate it I click

on D and just scroll down or stretch it

like this I can duplicate it many times

and it's going to give me new names I

also like the fact that it detects that

I have an Indian name and it's giving

other people Indian names as well which

is really cool the same it can do for

images as well so I have an image of

myself if I duplicate this as you can

see Derek Wong has this kind of a photo

so depending on the kind of image you

have if you have an illustration ncon it

will add images according to it now in

their tool AI can also create AI layout

so I click on AI once again AI layout

and AI builds temporary structure what

it's going to do is it's going to add

Auto layout to every relevant um button

or piece of information right here as

you can see everything now is inside an

auto layout you can then manually adjust

things according to Auto layout and make

everything according to your preferences

you can automatically generate UI

designs as well right inside here using

a prompt I can do that and I can click

on generate and it will generate a app

for me right here and as you can see in

real time it is started to generate my

app right here with all the elements

foodie it's given the name home popular

nearby everything is added Auto layout

uh all the elements are placed and

organized well with information images

honestly one of the best ones I've seen

out there till date the next AI feature

actually fills up sections and spaces

for you automatically using AI called AI

Magic box and inside here if I press

this drag a rectangle like this as you

can see this colorful rectangle develops

right here it will understand what the

content on my screen here is you can

write a quick prompt so a list for music

albums and based on that it will just

quickly generate that particular section

only if I click on it it creates this

and if I want to expand it I'll use AI R

duplication and just drag out and as you

can see more sections more cards can

Auto automatically be created I think

this is a good seamless software works

extremely similar to figma and

everything works nice now the next one

is called AI design system generator

inside the file you can say start

recognizing and from inside here it

starts recognizing buttons text titles

links Etc and will now generate a design

system for us as you can see it has

detected 7,000 layers and as you can see

they have created different pag Pages

for everything here typography color

effects also so things like Shadows

everything has been organized so well

now I would have loved to see other

aspects of Design Systems coded elements

um tokens Etc even though most elements

tokens Etc are here but some are just

named things like used eight

times not I I wish the layer naming as

well as the tokens were here that's the

anything that is missing but apart from

that it's pretty nice if you like this

video or if you like this tool give a

huge thumbs up let me know in the

comments if something like this is

appealing to you do you think this such

a tool can compare or compete with figma

see you in the next video next week

until next time take care God bless