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.

D7d3f3dd5063d56c96151d433c303c1a?s=128

Javier Honduvilla Coto

March 23, 2015
Tweet

Transcript

  1. Mac OS X UI toolkit and design guidelines Fco. Javier

    Honduvilla Coto 100303609@alumnos.uc3m.es Carlos III University
  2. OS X 10.10 Yosemite

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

    apps’ content • Types - document window - app window - panel - dialog - alert
  4. OS X 10.10 Windows search dock toolbar menu bar actions

    more options
  5. OS X 10.10 Windows

  6. OS X 10.10 Windows

  7. 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
  8. OS X 10.10 Windows titles

  9. 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
  10. OS X 10.10 Windows scrollbar evol.

  11. 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
  12. OS X 10.10 Windows search

  13. 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
  14. OS X 10.10 Windows toolbar - Most popular items -

    Use separators - Let the user hide it - Allow customization - ... - ∞
  15. OS X 10.10 Windows toolbar

  16. 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
  17. OS X 10.10 Icons

  18. OS X 10.10 Menu Commands, attributes & states menu bar

    contextual menu dock menu
  19. OS X 10.10 Menu Anatomy & behaviour click, alert, switch

    & kill, select moving mouse to another menu title
  20. OS X 10.10 Pointer pointer, busy...

  21. Credits and where to learn more Images, content, etc: ©

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