Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Mac OSX UI toolkit and design guidelines

Mac OSX UI toolkit and design guidelines

An assignment I made for a user interfaces course on which I talked about Apple's official design guidelines.

Javier Honduvilla Coto

March 23, 2015
Tweet

More Decks by Javier Honduvilla Coto

Other Decks in Design

Transcript

  1. OS X 10.10 Windows UI and interaction framework for the

    apps’ content • Types - document window - app window - panel - dialog - alert
  2. OS X 10.10 Windows - When a window is opened,

    it should preserve its previous state (Resume. UI Preservation) - If the selected element is a subset of all possible actions, show them all. - Automatic title on new documents
  3. OS X 10.10 Windows scrollbar - Avoid old school scroll.

    Wastes valuable space - Don’t displace windows content on scrollbar appearance. It’s pretty annoying - Scrollbar color has to be coherent - Automatic scroll - Increases affordance
  4. OS X 10.10 Windows search - Sometimes hidden/less bright and

    shown when clicked/ pointed on the menu. - Result - Contextual - Source list - Refine searches - Previous searches are saved
  5. OS X 10.10 Windows full screen - Not only to

    use space in a better way, but also to focus on user’s content. - Don’t take away from the user... - the freedom to interact with other elements. - the way they have of interacting with the system - the freedom of quitting the app or restore it to a smaller size
  6. OS X 10.10 Windows toolbar - Most popular items -

    Use separators - Let the user hide it - Allow customization - ... - ∞
  7. OS X 10.10 Icons - An icon should invite to

    use the app - Should show the app’s purpose - Can be like smaller versions, but more detailed - May use textures, but not too many - Should remind already known stuff - Different ones depending on the context
  8. OS X 10.10 Menu Anatomy & behaviour click, alert, switch

    & kill, select moving mouse to another menu title
  9. Credits and where to learn more Images, content, etc: ©

    of Apple official design guidelines: https://developer.apple.com/library/content/documentation/UserExperience/Conceptual/OSXHIGuidelines/