The many frames of product UI

SaaS products largely look the same irrespective of functionality. They serve a functional purpose, so familiarity drives this. That’s not a dig — it’s just where I’m spending time design wise lately. However, there are little moments outside of that where you can add your own choice of detail without degrading user experience. Sidebar with content variation You’re likely to be familiar with the sidebar layout and a large content area. And depending on the challenges your product faces, be it multiple workspaces, projects, notifications or profiles it is the effective route. Sidebar and content area divided by contrasting background colour This is the most common approach. It keeps things easy to manage from a code point of view as well. Rounded content frame with padding to define the edge When I say from a code point of view, this is the variation that trips you up. You have to make the content area scroll, then think about where to undo that for smaller screens. Less defined border…