My name is Jake Marsh.
I'm a developer, designer, and writer.

Subscribed via Push Notifications. You can also subscribe via RSS or Twitter.

Subscribe via RSS or Twitter.

Subscribe via Push Notifications, RSS or Twitter.

Holding it Wrong: A Landscape Lock Screen

 •  9 minutes to read

I've been a proud owner of the new iPhone 6 Plus for over month now.

I love it. It's easily my favorite device I've ever owned. 1 One of my favorite parts about the 6 Plus is the improved landscape support. Apple has even enabled landscape support for Springboard (the home screen) on the iPhone for the first time:

Landscape Home Screen

Interestingly, this is the only (that I know of) screen in iOS where the right-side elements of the status bar do not appear in the far right corner of the screen. The 'dock' pushes them over slightly. This makes sense, as there are obvious readability issues with displaying the white status bar over the light-background dock. Also, if you were to be in a state where you had many status bar items displayed, it could appear visually very noisy for some of the items to be displayed over your wallpaper, and some over the light-gray (blurred) background of the dock.

Pulling down notification center is an arguably more common practice with iOS 8's new Today view widgets functionality. Thankfully, Apple has also added support for landscape orientation here as well.

Landscape Today View

Please ignore the embarrassingly low step count for this morning.

Where things begin to break down is when you're holding the device in landscape, and you're in an app that has added landscape support. You finish your tasks and press the home button. You're then shown the home screen, again in landscape, like the screenshot above. So far so good. If you then press the lock button (or the 'sleep/wake' button as Apple likes to call it), you're suddenly looking at everything (at this point most likely just the time and date) sitting there on it's side.

Portrait Lock Screen on It's Side

With all of the recent improvements to landscape support, I find it curious that the lock screen wasn't included in the upgrades.

The obvious (and most likely) reason may simply be that time constraints forced Apple to push this particular feature down on the road map a little. Totally understandable, and I hope that's it.

On the other hand, I could see an argument that users don't usually interact with the lock screen for long periods of time, and it's purpose is to provide glance-able information, not a full-fledge user interface. This isn't an unreasonable position, but there could be many upsides to supporting it, and I believe it could be done without degrading the overall user experience.

My phone is usually in landscape orientation on my desk (I often listen to podcasts this way while working), and it also rests in this position in my car. In these and many other situations, if a notification or a phone call comes in, I'd love to be able to glance at it, quickly evaluate it's importance and either act on it or return to whatever I was doing.

As things stand now, this type of interaction isn't really achievable. Today one of a few things happens:

All of these are less than ideal, and could be easily addressed with even the most rudimentary landscape support on the lock screen.

The iPad has had landscape support for it's home and lock screens since it's original launch, so it wouldn't be unprecedented. The iPhone form factor (and it's wide-screen aspect ratio) would demand a few special considerations.

While writing this post, I found it a fun exercise to think about what such a feature might look like.

Here are my results:

Landscape Lock Screen

As you can see it's a fairly predictable design. The time is simply centered and positioned in a similar way to it's portrait-oriented siblings.

Where things begin to get interesting is when notifications are displayed. Here we can see a couple of notifications have been delivered. When this happens the time could slide out of place to create a sort of side-by-side layout.

Landscape Lock Screen With Notifications

All the slide-to-action interactions are still present and work as expected. Also, since the Camera app already does a great job of supporting landscape orientation, the slide-to-open straight to Camera interaction still works great. Any Handoff or app-suggestion interactions (where an app icon appears on the bottom-left corner the lock screen, and allows you to slide up to open it) also work as expected.

The iOS lock screen may appear simple and almost featureless at first glance, but it actually serves quite a few different functions, and adding landscape support for all of them is certainly a non-trivial task. Again, it strikes me this is likely the reason for not supporting this yet, given the almost certainly enormous complexity of this part of iOS's codebase.

One of the many features the lock screen must provide is the ability to enter your device's passcode (should you choose not to, or be unable to use Touch ID to unlock your device). Here's one way this could be implemented:

Landscape Lock Screen While Entering Passcode

As you can see, we again take a side-by-side approach given the user very large circular buttons with very large tap areas, perfect for quickly tapping out the 4 digits while likely trying to quickly unlock their device.

Lastly, I wanted to explore what it might be like to receive a phone call with your device in landscape.

These days many of us aren't holding our phones up to our ears to speak (if we're even still making phone calls at all that is). It's becoming increasingly common for someone to be performing a task on their device while wearing earbuds with a built in microphone, and then to receive a phone call.

Ideally the user wouldn't need to rotate their phone (or their head) to react to the incoming call. They could respond how they wish (answer, decline, send a text, or set a reminder) and then continue on with their original task.

Here's what it might look like:

Landscape Lock Screen With an Incoming Phone Call

Here we go with a more "traditional" landscape interface implementation. The various elements are allowed a bit more room to breathe, and the most important elements (the name and photo of the person calling) are enlarged for easier viewing.

I had fun exploring what a landscape lock screen might be like. These improvements represent a few sensible ways to support landscape on the lock screen without needing to introduce any radical new interface conventions.

If you'd like to experiment or play around with any of these ideas, you can download the Sketch source file for these mockups and do whatever you'd like with it. It is available right here.

  1. My Retina Macbook Pro is a very close second. 

Vote on Hacker News