Figma (User Interface Design - UI)
In this class, you’ll thoroughly learn Figma from beginning to advanced features for UI (user interface) and UX (user experience) design. Figma is a vector graphics editor and prototyping software tool which is primarily web-based, with additional offline features enabled by desktop applications for macOS and MS Windows OS. The Figma mobile app for Android and iOS allow viewing and interacting with Figma prototypes in real-time mobile devices. The feature set of Figma focuses on use in user interface (UI) and user experience (UX) design, with an emphasis on real-time collaboration.
About this Course
Figma is a modern design app that was built with the specific needs of a modern web designer, UX designer, or app designer in mind. Unlike image editing programs such as Photoshop—which were originally created for print, photo retouching, or illustration—the entire focus of Figma is on designing user interfaces and user experiences. You can craft the visuals and turn them into working prototypes all in a single app!
Figma uses frames (which other apps call artboards), to efficiently design web layouts for mobile, tablet, and desktop (or screens for apps). It’s vector-based, so you can scale for a variety of screen sizes with ease, as well as export hi-res (Retina) graphics for the web or apps. You’ll find tools and features specifically relevant to UI (User Interface) design and UX (User Experience) design, such as components, built-in prototyping tools, and much more.
Learn to design complex and realistic prototypes with advanced functionality. You’ll add interactions such as hovers, add animations to your designs using smart animate, make specific areas within a screen scrollable, and much more.
Figma is a web app and 100% cloud-based, so collaboration and easy file sharing is built-in. While you can install the Figma desktop app, you can also just log into Figma in any web browser and start designing without installing anything.
What You’ll Learn:
- Create UI (user interface) and UX (user experience) designs for websites and apps
- Design finished layouts that are optimized for mobile, tablet, and desktop screens
- Design on grids, extract image assets, share designs with clients/developers, and more
- Create more complex & realistic prototypes
- Add interactions, such as hovers
- Make animations using smart animateUse components (including variants) to make updating your designs easier
- Work with Team libraries to share style & design components
- Define scrollable areas within a screenScroll up & down within a page
Outline
Section 1:
- Introduction: Web app versus Native App
- Creating New Files & Designing on a Grid
- Importing & Cropping Photos
- Vector Graphics, Colors, Shadows, & More
- Text Styles
Section 2:
- Components (Reusable Elements)
- Turning a Design into a Clickable Prototype
- Exporting Assets for Web: SVG, JPEG, & PNG
- Sharing Figma Files: Commenting, Testing, Developers, etc.
Section 3:
- Auto Layout
- Linking Up/Down a Page, Scrollable Areas, & Hyperlinks
- Intro to Smart Animate
- Parallax Animation
Section 4:
- Variants
- Hovers & Overlays
- Adding Interactions to a Slideshow: Tap, Drag, & Keys
- Team Libraries (Shared Libraries)
Exam Pass Guarantee
At Microtrain we are committed to your success! Let us show you the return you get from great tech training. We will personally guarantee that if you take our class and follow our program you will be successfully certified!
Raves & Praise
Ron Cwik
PMP Certification Training, 2008
Great training facility. Great instructors. Great experience.
Karine Bucci
Project Management
Great class, loved the interaction and team-building exercises. Plenty of materials and learning tools supplied. Although it was a full week's class, never boring. Donna [Russell] was awesome and gave many supporting examples for better understanding.
Kaycee Ekufu
MCSA
The instructor [Al Khalfan] was very knowledgeable in the field. He presented the materials and concepts with a professional touch. He also frequently adds humor to his teachings, which made it easier for me to understand. The support staff was all nice, gentle, caring, and very helpful. The materials, rooms and amenities were excellent and exceeded expected standards.
David
A Cisco Success Story
I attended a resume writing seminar & conducted mock phone interviews with a Microtrain career counselor. These two activities gave me a leg up on distinguishing myself from all the other people looking for work. Since the career counselor's at Microtrain had a track record of getting people hired, their insight and positive past experiences helped me tremendously in getting hired with a Cisco Voice Systems Integrator in the Chicago area. I was hired as a Cisco Voice Tech Engineer with a starting salary of $65,000 / year with a Cisco voice systems reseller located in the Chicagoland area. Microtrain was very instramental in making this a reality. From expediting my WIA grant, to providing excellent hands-on training from knowledgable instructors I was able to achieve becoming certified with my CCNP. Microtrain's career services was the final catalyst in connecting me with this company by communicating with them on my behalf and with me in setting up the interview. One week later and I was hired. No joke. Thanks Microtrain!
Jean S.
PMP Certification Training, Lombard, 2008
I was laid off for many months and not really getting many callbacks for my resume and no job offers. After I put the letters PMP on it, not only did I see an increase in quantity, but also quality of interviews. I had been spinning my wheels for 5 months, and after the PMP went on, I had 2 job offers in 6 weeks. It really was the "golden ticket"
Connect with MicroTrain
Begin building a successful long-term career pathway.