Join Jason Osder for an in-depth discussion in this video Adding pixel dimensions, part of OmniGraffle 5: Creating Web Sitemaps and Wireframes.
There is one important place where the work of wireframing meets right up with…the work of designing and the work of coding in a really tangible way, and it's…the actual pixel dimensions of the elements on the page.…Now, different shops have different systems for this,…but in a lot of places one of the last things you do on a wireframe is denote…all of the important measurements that the designer will use later.…These are measurements of what is on the screen, and they must be expressed in…pixels, so they become pixel dimensions.…
Don't try to do them in inches or centimeters, because that's just simply not relevant.…I am starting with a finished wireframe of a homepage.…It's all done, and all the elements should be locked. Let's just check.…Yup, the little Xs tell us that they are locked.…That's important, because we might have to do some work over top of them, and we…don't want to interfere with anything.…The idea of pixel dimensions is that important aspects in the layout will…actually get denoted with dimensions right on the document.…
- Developing for interactive media
- Using shapes and lines for information architecture
- Working with text
- Using and customizing stencils
- Aligning, grouping, and locking objects
- Using automatic layouts for sitemaps
- Positioning content elements
- Iterating wireframes based on feedback
- Wireframing for mobile devices
Skill Level Beginner
1. Using OmniGraffle for Wireframes and Sitemaps
2. Common Techniques for Wireframes and Sitemaps
3. Building a Sitemap
4. Building a Homepage Wireframe
5. Completing the Wireframing Process
6. Advanced Techniques
- 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.