Use the hamburger icon to to trigger a slide in side menu.
- [Instructor] A very common UX pattern is a sliding menu,…y'know you tap an icon and a menu slides in…from the side or drops down or whatever.…And that's what we're going to do in this exercise,…we're going to create a sliding menu for a smart phone…and I'm going to include a rather slick little technique…that I picked up from Todd Siegel…who is the Proto.io evangelist…and it's pretty neat so let's get started.…And to get yourself started, open up a new project,…we're going to choose a smart phone,…and we're going to go with a 6s Plus this time, 414 by 736,…and click create, and we're going to be…coming over to the editor.…
All right, so the first thing we want to do is…bring in the content and that is in your chapter downloads…so just pop over to it.…And we're going to bring in the splash and the menu,…drag them into the assets area, and we're ready to go.…So the first thing of course we want to do is…just get that splash screen in there, so there we go.…And we really should add a iOS 9 menu,…so we're going to add a status bar, and let's add . . .…
- 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.