While the columns overlap where blue flows under red, it's important to note that the safeArea of the blue view is just the area not obscured by the red column. By positioning the content of the blue view within the safe area, the content will be next to the red column while the background can flow under it for visual effect. In a storyboard, this can be done by anchoring to constraints the safe area of the view instead of the bounds of the view. Or in code using the safe area layout guide.
Topic:
UIKit
SubTopic:
UIKit Q&A