Discover and read the best of Twitter Threads about #Figma
Most recents (24)
Tutorial: Stacked Cinematic Shots (#midjourney + #figma)
I've been loving stacked images lately. During @HBCoop_'s Twitter space yesterday, we realised people wanted to know how to do it.
Luckily, it's super easy! Find everything you need to know it the thread below!
I've been loving stacked images lately. During @HBCoop_'s Twitter space yesterday, we realised people wanted to know how to do it.
Luckily, it's super easy! Find everything you need to know it the thread below!
Why use this format?
It looks cool and gives your feed an advantage. The post takes up more space than the usual grid of 3 to 4 images, increasing the chance of it being seen. Plus, you don't need to create a vertical shot for Twitter's cropping when working with 3 images.
It looks cool and gives your feed an advantage. The post takes up more space than the usual grid of 3 to 4 images, increasing the chance of it being seen. Plus, you don't need to create a vertical shot for Twitter's cropping when working with 3 images.
How to build a story?
There are many approaches to this; however, here is a template that always works: Create three shots with the aspect ratio of 21:9.
1. Set the scene with a wide shot.
2. Capture a close-up shot of the main subject.
3. Take an action shot of the activity
There are many approaches to this; however, here is a template that always works: Create three shots with the aspect ratio of 21:9.
1. Set the scene with a wide shot.
2. Capture a close-up shot of the main subject.
3. Take an action shot of the activity
3 WAYS UX DESIGNERS CAN USE AI TO THEIR ADVANTAGE
These are few ways designers can incorporate AI tools into the UX design process.
1. Analyzing user data
With AI tools like Research AI, UX designers no longer need
These are few ways designers can incorporate AI tools into the UX design process.
1. Analyzing user data
With AI tools like Research AI, UX designers no longer need
to comb through data manually. Instead, they can quickly gather and analyze large volumes of user data with ease.
Using powerful algorithms, AI can predict user behavior, track page visits and engagement, and detect patterns in user data that might otherwise go unnoticed.
Using powerful algorithms, AI can predict user behavior, track page visits and engagement, and detect patterns in user data that might otherwise go unnoticed.
By reducing the time it takes to process user data, UX designers can quickly gain insights into how users behave and interact with their product—allowing them to make informed design decisions.
2. Creating user personas
AI can help UX designers quickly create data-driven user
2. Creating user personas
AI can help UX designers quickly create data-driven user
Tutorial thread Blender 3-D Population Density👥📊🗺️Maps through @KonturInc using #QGIS and #Blender....#esri users you can follow along too because it can be done in your software too #gischat #thread #geospatial
So I would divide this tutorial into four parts
1. Data Gathering(with @KonturInc )
2. QGIS(Black map and Color Map)
3. Rendering in Blender(No geometry nodes)
4. QGIS or other softwares (final touches)
1. Data Gathering(with @KonturInc )
2. QGIS(Black map and Color Map)
3. Rendering in Blender(No geometry nodes)
4. QGIS or other softwares (final touches)
So @KonturInc is a really good geospatial data provider together with risk management solution provider who deal with a lot of things as shown in link below But we will focus today on Their wonderful population data
kontur.io
kontur.io
10 Useful Design Systems to Learn From (Mega thread) 👇🧵
#ui #uidesign #ux #uxdesign #design #productdesign #designsystems #uikit #sketch #figma #adobexd #google #apple #ibm #airbnb #audi #shopify #ecommerce #atlassian #webdev #ios #materialdesign #iphone #react #js #css
#ui #uidesign #ux #uxdesign #design #productdesign #designsystems #uikit #sketch #figma #adobexd #google #apple #ibm #airbnb #audi #shopify #ecommerce #atlassian #webdev #ios #materialdesign #iphone #react #js #css
2. Apple
The Human Interface Guidelines contains guidance and best practices that can help you design a great experience for any Apple platform
developer.apple.com/design/human-i…
The Human Interface Guidelines contains guidance and best practices that can help you design a great experience for any Apple platform
developer.apple.com/design/human-i…
I spent an hour pursuing the Complete Web Design Course by Vako Shvili on Udemy today.
So far the course seems to be great and completely value packed.
Here's what I have learned today:
So far the course seems to be great and completely value packed.
Here's what I have learned today:
1. In web design, It all starts with alignment and grid.
Everything that is orderly, symmetric, and organized will be perceived as more beautiful than anything that is chaotic and disorderly.
Just as you would perceive a clean room better than a messy one.
Everything that is orderly, symmetric, and organized will be perceived as more beautiful than anything that is chaotic and disorderly.
Just as you would perceive a clean room better than a messy one.
2. One should start web design by using imaginary grids (not necessary though).
As a standard, the entire webpage should be divided into 12 grid columns with each column being separated by the other by a gap(gutter) of 30px
As a standard, the entire webpage should be divided into 12 grid columns with each column being separated by the other by a gap(gutter) of 30px
👉🏻 Découvre 25 plugins Figma !
☀️ Je te file ma petite liste perso de plugins à ajouter à ton figma et à tester sur un projet ! #graphisme #ui #design #graphicdesign #tool #figma #plugin
Thread 👇🏻
☀️ Je te file ma petite liste perso de plugins à ajouter à ton figma et à tester sur un projet ! #graphisme #ui #design #graphicdesign #tool #figma #plugin
Thread 👇🏻
1️⃣ BETTER FONT PICKER
➡️ Pour avoir un aperçu visuel de tes typos
➡️ Pour avoir un aperçu visuel de tes typos
2️⃣ IMAGE TRACER
➡️ T’évites de passer sur Illustrator pour une vectorisation rapide d’image.
➡️ T’évites de passer sur Illustrator pour une vectorisation rapide d’image.
👉 2023 - Top UI UX Trends you need to know🔥🚀
As we explore UI UX Trends 2023, #Adobe's $20 billion acquisition of #Figma still surprises us.
A UI UX collaborative prototyping tool costing so much is unbelievable. #UI #UX has evolved into a crucial business process.
👇Thread
As we explore UI UX Trends 2023, #Adobe's $20 billion acquisition of #Figma still surprises us.
A UI UX collaborative prototyping tool costing so much is unbelievable. #UI #UX has evolved into a crucial business process.
👇Thread
Top UI Design Trends of 2023🔥
• Large font size and immersive experience
• No more parallax scrolling
• Generative AI in the design process
• Make full use of the card UI component
• Light mode with an option for dark mode
• Large font size and immersive experience
• No more parallax scrolling
• Generative AI in the design process
• Make full use of the card UI component
• Light mode with an option for dark mode
👉Large font size and immersive experience
Their websites have immersive homepages. Clean websites display only the most important information and categories. Some of the world's largest companies with multiple product segments, categories, and locations had information-packed..
Their websites have immersive homepages. Clean websites display only the most important information and categories. Some of the world's largest companies with multiple product segments, categories, and locations had information-packed..
[THREAD] Connaissez vous Locofy.ai, l'outil qui vous permet de transformez vos maquettes #figma en code frontend (React, React Native, Nextjs, HTML-CSS et Gatsby) 👇
Installez le plugin locofy.ai sur Figma
➡ Utilisez ensuite votre design/maquette existant ou récupérez un modèle auprès de la communauté Figma
➡ Utilisez ensuite votre design/maquette existant ou récupérez un modèle auprès de la communauté Figma
La première étape consiste à baliser vos calques, tel que les CTA ou les vidéos
➡ Locofy dispose également de LocoAI qui peut scanner vos maquettes pour vous recommander les bonnes balises pour chaque élément
➡ Locofy dispose également de LocoAI qui peut scanner vos maquettes pour vous recommander les bonnes balises pour chaque élément
1. @autoflowplugin Autoflow makes it easy to draw flows. Simply select 2 objects and a line will be magically drawn between them.
Shipped this AI design tool on Figma two weeks ago, and here’s a sneak peak of what’s coming next: fine-tuned models with consistent styles. #stablediffusion #aiart #figma
Here’s the plugin on Figma Community: figma.com/community/plug…
Prompt: snow globe halloween vampire castle highly detailed; Style: 3D illustration
I found these ui guidelines really useful
Document by @its.dezinx
A thread 🧵
#uidesign #figma #uxdesign
Document by @its.dezinx
A thread 🧵
#uidesign #figma #uxdesign
More …
More …
I asked designers for their favorite @figma keyboard shortcuts.
220+ responses and hours of synthesis later...
Here are the top 10 keyboard shortcuts to supercharge your workflow:
220+ responses and hours of synthesis later...
Here are the top 10 keyboard shortcuts to supercharge your workflow:
@figma #10: Copy properties → ⌥ ⌘ C
Easily transfer styles from one shape to the next. Amazing!
via @ImAndrewPons
Easily transfer styles from one shape to the next. Amazing!
via @ImAndrewPons
@figma @ImAndrewPons #9. Pick color → ⌃ C or I
Just tap `⌃ C` or `I` and be amazed as a color picker appears out of thin air.
And here I was using the Apple digital color meter like a chump…
via @TeeAnn__
Just tap `⌃ C` or `I` and be amazed as a color picker appears out of thin air.
And here I was using the Apple digital color meter like a chump…
via @TeeAnn__
Shortcuts are absolutely very useful for speeding up your workflow and design process. Let’s see them ⬇️
Shortcuts for:
Tools, Text, Shape and Cursor
…
Tools, Text, Shape and Cursor
…
💬 Here are some of the most useful Figma Plugins to create and properly develop your products.
a thread 🧵
a thread 🧵
1) Use of Absolute Position
Where to use absolute position
Let’s go…
Press F in figma to draw a frame, use codes below 👇🏿
1. Toggle switch
2. Text fields
2. Text fields
3. Drop-down list
4. Icons
…
4. Icons
…
01: Blog posts
02: Product cards (holds details of a product ie Product name, price, relevant icons eg favorites, and a CTA button )
Page one
Take your design and rotate it by -15°
We want to design a super easy and minimal tab or nav bar
Step 1: at the bottom of your frame, draw a rectangle with a distance of 24 to 32px from around.
Create a rectangle with the right proportions and add corner radius of 30-40px
Add linear fill to the shape, check photo for details…
Use colors from a team library. 📒
A color library will help communicate your stylistic decisions while staying consistent across bigger projects and teams.
Colors and text could be partitioned into separate libraries your team could access without cracking ongoing work.
A color library will help communicate your stylistic decisions while staying consistent across bigger projects and teams.
Colors and text could be partitioned into separate libraries your team could access without cracking ongoing work.
Tag styles to find them faster. 🏷️
Tagging styles is a great practice to speed up your workflow in Figma. Tagging styles will allow you to quickly find the needed color, text, or component through Figma menus by typing a name containing a symbol or an included “tag” name.
Tagging styles is a great practice to speed up your workflow in Figma. Tagging styles will allow you to quickly find the needed color, text, or component through Figma menus by typing a name containing a symbol or an included “tag” name.
"Of course I stole it!
Who never stole a UI design concept hands in the air... No hands!"
It's totally okay to imitate design seen on the internet.
"Imitation is the Mother of invention"
Who never stole a UI design concept hands in the air... No hands!"
It's totally okay to imitate design seen on the internet.
"Imitation is the Mother of invention"
Here is a list of websites to get User Interface design inspiration from:
pinterest.com
dribbble.com
muz.li
awwwards.com
siteinspire.com
mobbin.design
pinterest.com
dribbble.com
muz.li
awwwards.com
siteinspire.com
mobbin.design
On this note, I humbly demand that you follow @Yemyjerry like, retweet and comment.
#uiux #figma #design
#uiux #figma #design
Checked out Figjam new features yet?(Follow thread)
Figjam's birthday party was yesterday. Party was out of this world🎉
I traveled around the world via Zoom😂😂. Met Figmates from Europe, Asia, South America..💃💃
1/6 #Figma #uidesign #FIGJAM
Figjam's birthday party was yesterday. Party was out of this world🎉
I traveled around the world via Zoom😂😂. Met Figmates from Europe, Asia, South America..💃💃
1/6 #Figma #uidesign #FIGJAM
