Get an introduction to components and their relation to Framer X.
- [Instructor] You may have heard…me talking about components many times…since the beginning of the course,…so let's explore them together.…In its simplest definition, a component…is a building block for your design.…It can be anything such as a button,…a text, or a section of your design.…There can be components inside of components.…So for example, if we look at our prototype…in the splash screen, the logo is a component.…So is the branding text below.…
The splash screen is also a component,…so you can make them as small or big as you want.…So most people will wonder, but how…do I define what makes up a component?…Or what determines what should be a component?…For example, why would you consider the shape…inside the logo a component?…My suggestion to you and what I've been…following in my own work is if I need…to interact with an item in my prototype,…then it is a component.…
For example, most likely the logo…in a splash screen would be animated,…or we might tap or click on it.…Then it is a component.…The shape inside the logo, not so much.…
- What is Framer X?
- Define your layout
- Creating more layouts
- Using frames and text in frames
- Drawing with a path
- Creating interactions
- Working with React components
Skill Level Beginner
Building and Maintaining Your UX Design Portfoliowith Diane Cronenwett15m 54s Appropriate for all
Learning Framer X1m 8s
1. Introduction to Framer X
2. Design in Framer X
3. Prototype in Framer X
4. Introduction to Components
Next steps1m 19s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.