How to create 3D perspective mockups with Vectary and Iconscout
Ever wonder how to create beautiful perspective mockups? Here’s how to do it with Figma, Iconscout and Vectary ✨You’ll learn how to create a token in Figma (so you can copy and paste Figma frames into Vectary!), add lighting, background color, import 3D assets and more.
Try Vectary Studio Beta 👉 https://www.vectary.com
Follow along the tutorial with these design assets👇
Figma exercise file: https://www.figma.com/community/file/1090232335370431514
Iconscout assets: https://iconscout.com/3ds/abstract
Clone the Vectary project: https://app.vectary.com/p/6HORZisjIedxbiflyvvOZV
All assets (Adobe After Effect files, Figma files, Iconscout assets and Lottie Animations): https://drive.google.com/file/d/12vKrHfpEKV-2Pjbz7ezChQ-ifFFJ-Ifm/view?usp=drivesdk
Timestamps:
00:00 How to create 3D mobile app mockups with Vectary and Iconscout
00:29 Create a Vectary token to connect to your Figma file
01:23 Copy your design link in Figma
01:49 Create a new project in Vectary
02:38 Import your Figma frame in Vectary
03:27 Edit the elements in Vectary
03:57 Add backdrop in Vectary
04:20 Get 3D illustrations from Iconscout
05:01 Import Iconscout’s 3D elements in Vectary (drag and drop)
05:47 Edit the 3D elements
06:42 Add color to the 3D elements
07:38 Add reflection and light to the 3D scene
08:43 Take a screenshot (download image) and import in Figma (drag and drop)
#3DGraphicDesign #3DDesign #Iconscout #3DTutorial #Vectary #3DIllustration #Figma #3DMockup #PerspectiveMockup #3DModels
Watch on YouTube ↗
(saves to browser)
Sign in to unlock AI tutor explanation · ⚡30
Playlist
Uploads from IconScout · IconScout · 11 of 43
1
2
3
4
5
6
7
8
9
10
▶
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
Best Sketch Plugins for UI/UX Designers in 2018 | iconscout.com
IconScout
Milestone: Celebrating 800,000+ Icons
IconScout
Icondrop for Adobe Xd
IconScout
Create stunning PowerPoint Presentation using Icondrop
IconScout
Free Illustrations - Indian Doodle library | Royalty-free | Vector | Figma | Adobe XD
IconScout
Iconscout API in Ludus
IconScout
Lottie Animations are now available on Iconscout 🎉
IconScout
Iconscout Plugins for Figma, PowerPoint
IconScout
Iconscout Premium
IconScout
10,000+ Lottie Animations available on Iconscout
IconScout
How to create 3D perspective mockups with Vectary and Iconscout
IconScout
Introducing IconScout’s new look | Rebrand video
IconScout
How to boost your design workflow with the IconScout plugin
IconScout
How to install the IconScout Desktop App for Windows and Mac
IconScout
IconScout plugin’s new features for Mac, Canva, Figma, Sketch, Adobe XD
IconScout
How to customize your settings in the IconScout plugin
IconScout
How to install the IconScout plugin for Canva, Figma, Sketch and Adobe XD
IconScout
How to Set 3-Point Lighting in a 3D Scene #shorts
IconScout
How to download 3D illustrations from IconScout
IconScout
How to modify 3D illustrations from IconScout - by changing colors and texture in Blender
IconScout
How to export IconScout’s 3D illustrations from different angles with Blender
IconScout
How to create 3D illustrations with Blender by combining multiple 3D assets
IconScout
How to use the IconScout Color Editor to edit icons, illustrations and Lottie animations!
IconScout
How to turn 3D illustrations into Lottie animations
IconScout
Create 3D design mockups to showcase your products | Blender tutorial
IconScout
IconScout desktop app Overview | Add icons, illustrations, 3D, & animation to your projects!
IconScout
A Complete Guide on how to use Unicons by IconScout
IconScout
IconScout plugin for Figma | Access icons, illustrations, 3D and Lottie animations within Figma
IconScout
All-in-one design assets plugin within Adobe XD | IconScout plugin for Adobe XD
IconScout
IconScout plugin for Adobe XD | Add icons, illustrations, 3D & Lottie animation to your projects
LottieFiles
Welcome to IconScout’s Ecosystem of Creativity
LottieFiles
IconScout app for Canva | Design like a pro with Icons, 3D Illustrations, Lottie animations & more
LottieFiles
Supercharge your presentations with IconScout for Google Slides
LottieFiles
Design like a pro with IconScout plugin for Figma | Icons, illustrations & animations made easy!
LottieFiles
Spark your creativity with Unicons | Unveiling 3D and animated icons
LottieFiles
Illustration Kit | Quick guide to creating endless visual combinations
LottieFiles
Illustration Kit | Mix, match and shuffle till it's yours
LottieFiles
Reverse Image Search | Discover design assets with the power of AI
LottieFiles
How to add IconScout design assets to your PowerPoint
LottieFiles
Illustration Kit | Mix, match and shuffle till it's yours
LottieFiles
IconScout for Figma: Create stunning designs in just a few clicks
IconScout
How to use IconScout for Figma
IconScout
My favorite websites ad a designer ‼️ #graphicdesign #graphicdesigner #freelancedesign #uidesign
IconScout
More on: UI Design
View skill →Related AI Lessons
⚡
⚡
⚡
⚡
Pony.ai Unveils NVIDIA-Powered Domain Controller for L4 Autonomy
Dev.to AI
Your LLM budget alerts won't save you if you can't map costs to users
Dev.to · John Medina
A System-Prompt Skeleton That Survives Claude/GPT/Gemini Swaps
Dev.to · Gabriel Anhaia
Wire OpenTelemetry Around Your Anthropic Python Calls
Dev.to · Gabriel Anhaia
Chapters (13)
How to create 3D mobile app mockups with Vectary and Iconscout
0:29
Create a Vectary token to connect to your Figma file
1:23
Copy your design link in Figma
1:49
Create a new project in Vectary
2:38
Import your Figma frame in Vectary
3:27
Edit the elements in Vectary
3:57
Add backdrop in Vectary
4:20
Get 3D illustrations from Iconscout
5:01
Import Iconscout’s 3D elements in Vectary (drag and drop)
5:47
Edit the 3D elements
6:42
Add color to the 3D elements
7:38
Add reflection and light to the 3D scene
8:43
Take a screenshot (download image) and import in Figma (drag and drop)
🎓
Tutor Explanation
DeepCamp AI