Learn how to use a container and a device library item to create a photo carousel.
- [Instructor] We have spent a lot of time…working with smartphones.…Let's switch it up and create something for a tablet.…And what we're going to create…is a scrollable image carousel.…You know those things where it's in the hero unit…and you can swipe through it…and see a whole bunch of pictures.…And that's what we're going to create here.…So, to get yourself started open up a new project…and the first thing we want to do of course…is name it Carousel.…We're going to choose tablet…and we're going to choose the small iPad here (1024 x 768).…Click create…and when the editor opens…the first thing we want to do is…I want to change the orientation.…
So, if you want to change the orientation of any screen…right click on it,…open the screen properties,…going to make this landscape,…and let's give it a background color while we're here.…And we'll choose this dark gray here, 555555,…click Save,…click Save,…and we're good to go.…Now all we need is the content…and the images are in your chapter download.…So, let's go get them.…
- Using design patterns
- Using grids and columns
- Using the Proto.io player
- Using the Proto.io smartphone app
- Working with screens
- Using components
- Creating artwork
- Creating and using containers
- Creating animation
- Publishing your prototype
Skill Level Intermediate
Building and Maintaining Your UX Design Portfoliowith Diane Cronenwett15m 54s Appropriate for all
Sketch: Creating Vector Graphicswith John-Paul Ballard1h 30m Intermediate
1. Getting Started with Proto.io
2. Working with Screens
3. Using Components
4. Creating Artwork from Proto.io
5. Creating and Using Containers in Proto.io
6. Creating Animation in Proto.io
7. Publishing Your Prototype
Next steps1m 22s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
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.