Omnigraffle has powerful tools for aligning and distributing shapes evenly. Some alignment and distribution tools can be accessed right on the canvas when dynamic alignment and distribution guides appear. Blue lines align and distribute in relationship to other shapes. Pink lines indicate alignment with the canvas. More detailed and powerful alignment and distribution tools are found in the alignment inspector.
- [Voiceover] OmniGraffle has some really powerful tools…for aligning and distributing objects.…And they're really important for this type of UX work…because the documents need to look neat.…I mean, you're representing things before they're built…and there's a real benefit to these documents being clean.…Meaning, that the spaces between things are even,…and things are generally well aligned.…So, these alignment tools come up in a number of ways…and there's a number of ways to do it that are useful.…
So the first thing I really want you to pay attention to…when you use this program are the dynamic alignment lines.…So you see, as I move this box called Home,…you see these blue lines pop up and that blue line…is telling me that those edges are aligned with each other.…Or if I do over here, again we get the blue line…and they're all lined up.…But we'll also from time to time see a pink line.…You see that pink line come up?…And that's telling me I'm aligned with the canvas.…So it's really easy and this would be something important,…
Join Jason Osder as he demonstrates how to use OmniGraffle 6. He shows you how to use basic features, like adding lines, shapes, and text, to create diagrams of page layouts, or wireframes, in addition to advanced features, like working with stencils and templates. He lets you know when he is showing a pro-version feature, like presentation mode and subgraphs, so you can adjust accordingly. Along the way, you'll learn how to improve your documentation by eliminating unnecessary elements to help readers visualize all of a site on one page. As an object-based diagramming program, OmniGraffle has features for executing UX and IA documents. Creating other documents, like use case scenarios, content maps, and models, is also covered.
- Setting up document files
- Aligning and distributing lines, shapes, and text
- Using canvases, templates, layers, and stencils
- Making sitemaps to organize information
- Creating wireframes to diagram page layouts
- Designing for mobile
- Building content maps and conceptual models
Skill Level Intermediate
1. Commonly Used UX Techniques
2. Create a Sitemap
3. Advanced Sitemap Techniques
4. Wireframe the Homepage
5. Complete the Wireframe Process
6. Additional UX Documents
7. Presentation and Export
- 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.