4

So I've noticed this type of view appearing across a variety of popular apps recently, including Music (iOS), Google Maps, and recently also Twitter:

Twitter

It extends only partially from the bottom of the screen over the current view and can be swiped up to reveal more of it, or swiped down to dismiss it.

The notch at the top also seems to be a standard element for such views and can be dragged up or down to gradually show or hide the view rather than just strictly performing a swipe gesture.

Google hasn't been much help, so I was hoping someone here might be able to help me answer these questions:

  1. What is this type of view called? Does it have a name in the UI/UX lexicon?
  2. Is there some reason these views are suddenly so commonplace? (Or are they only common in iOS apps?)

Here's another example from the Google Maps app, with the leftmost screenshot being the default, starting state for the view and the rightmost being the fully exposed state that occurs after grabbing the notch and dragging or swiping the view up:

Maps

2

They are common in iOS apps because they are part of the iOS system interface.

The official documentation is a good starting point: https://developer.apple.com/design/human-interface-guidelines/ios/views/action-sheets/

There are also examples in Material design: https://material.io/design/components/sheets-bottom.html

So I believe to your question "how are they called" the answer is: "Sheets", in your case specifically "Sheets bottom".

I hope this helps :)

  • These aren't action sheets. Action sheets in iOS are limited to a number of buttons that represent specific options and behave differently. These swipeable views contain all sorts of differently formatted elements. They're essentially holistic views being presented and manipulated specifically through vertical swipes and using the notch at the top for dynamic dragging. – Foefirelord Nov 2 '18 at 0:31
  • Can you please provide a full-screen screenshot? (if you are concerned about privacy, understandably, try to blurry the details) – Adriano Nov 2 '18 at 0:36
  • 1
    Added another example. These views don't always have the exact same implementation, but they do share many elements, such as the notch and the ability to grab the notch to drag the view, which appears to be a pattern, as they behave very similarly across many popular apps. – Foefirelord Nov 2 '18 at 0:54
  • I've integrated another bit of info in the answer. – Adriano Nov 2 '18 at 1:20

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.