How to Create Crisp and Modern HMI Graphics using Figma (In-Depth Tutorial) NEW

►► Grab My FREE GUIDE Featuring 5 easy steps to Drastically Improve the Structure of your TIA PLC Applications:
www.plcskilltree.com/free-gui...
►► Learn Advanced TIA Portal PLC and HMI Programming functions and features in the PREMIUM edition of my TIA Portal - All Basics Pack:
www.plcskilltree.com/bundles/...
►► Get 15% discount on all courses and bundles by using coupon code TIAPORTAL15OFF at checkout.
Getting started with TIA Portal has never been so easy.
Let me help you become a confident and structured TIA programmer TODAY.
VIDEO CONTENT
00:00 - Intro
02:23 - What is Figma?
04:11 - First Steps
06:36 - User Interface
08:49 - Button Design Example 1
24:34 - Button Design Example 2
37:49 - Exporting Designs
39:34 - Wrapping it Up
In this video tutorial, you'll learn all about the amazing possibilities with Figma for creating crisp and modern HMI graphics - You can go and check out Figma at www.figma.com.
My students favourite 'TIA Portal - All Basics Pack' training bundle features:
► 8+ hours of PLC and HMI training videos
► 40+ supporting documents
► 1 downloadable TIA Portal sample project (PLC+HMI application)
► 1 Certificate of completion (with unique ID) for each course
► 21-day free trial of TIA Portal
► 30-day money back guarantee
► Lifetime access
► Instructor support
And if you go for the Premium Edition, you get these extras:
► 1 downloadable Premium TIA sample project (PLC+HMI application)
► 91-page premium guide
► All Premium application graphics in .SVG format
-------------------------------------------------------------------------
► Thanks for watching!
► Got a comment, suggestion or a request🤔? ⬇️ Use the space below! ⬇️
► Subscribe to my channel 🙏to hear about new videos first! Don't forget to hit that notification 🔔!
► I am a freelance system integrator - check out my services at www.rsautomation.eu
#tiaportal #plc #hmi #s7 #tutorial

[@PLCskilltree]

►► Grab My FREE GUIDE Featuring 5 easy steps to Drastically Improve the Structure of your TIA PLC Applications:
www.plcskilltree.com/free-guide-optin

[@fabriciodepaula8025]

Muito obrigado por dividir seu conhecimento.

[@imsayinthetruth4942]

Another informative video from your chanel.I also learned to creat these icon from figma and yes,it really makes my HMIs interface look professional

[@_Iokanaan_Marusidze_]

Thanks 👍

[@fabianomoreiraamaro9920]

Excellent once again Hans! Much appreciated!

[@PLCskilltree]

Glad you enjoyed it!

[@VideoBite]

Hello. Easy to folow tutorial. Would be great to have a tutorial about TRENDS.

[@PLCskilltree]

Thanks for your feedback and suggestion, someday I might cover HMI trends 👍🏻

[@rebinshw]

well done

[@PLCskilltree]

Thanks!

[@PitisakN]

SUPER THANKS {{HANS}}

[@CapalOnLive]

Hello, why you don't use SVG format to don't effect image quality ?
why you don't set image color in the SVG as a TIA portal parameter ?

[@PLCskilltree]

As far as I know, svg images are converted to a rasterized image in Runtime (for comfort panels anyway).
You can export as svg if you prefer that. Not sure about the filesize, transparency possibilities etc… I am used to png images due to the small filesize and transparency features.
Good remark, thanks!

[@ugljessa]

Looks great but when I try to import them in Tia Portal and use them in graphic list they don't look so nice. When I import just graphic button that I have created like you showed us in video above loosk unbelievable.

[@PLCskilltree]

Make sure your graphic list in TIA Portal has exactly the same size (x times y pixels) as your Figma button design.
I use my exported Figma images all the time with graphic lists in TIA Portal and they look perfect.
Please let me know what your exact problem is with Figma graphics and TIA graphic lists. You can send me some screenshots to [e-mail], makes it easier for me 😃

[@ugljessa]

@@PLCskilltree I already tried that and looks amazing. Thanks for sharing.

[@PLCskilltree]

@@ugljessa so no more problems with using Figma exports in TIA graphic lists?

[@ugljessa]

@@PLCskilltree that's right.

[@abdelrahmansaad9525]

could you please share with us your graphics?

[@PLCskilltree]

It’s available in my premium course bundle, check out the description below the video

[@HectorRodriguez-si3yr]

what about the process graphics ? :(

[@PLCskilltree]

You create them using the same tools to create the buttons in my examples. Google them first to get an idea of what they look like (e.g. pump, solenoid valve, heat exchanger) and then make your own version of it in Figma.

[@RushabhPatelS]

Can you do a tutorial on TIA Portal's f(x) trend view? I'm struggling with it, and your simple teaching style would be a huge help. Looking forward to more amazing content from you! 🚀 Thanks for being a constant source of inspiration and knowledge.

[@PLCskilltree]

Maybe I’ll do a video some day about PID control which could include a trend view, thanks for your suggestion and support 👍🏻