Apple News+ magazines on a 12.9-inch iPad Pro should look and feel amazing, but sadly that’s not the case today. In this post I’ll show what is frustrating about the experience and how things could be improved.
Here's a current A-list magazine and my iPad side-by-side. We can see they're similar enough in size:
Now here’s what it looks like when you open this magazine on the iPad:
The frustration begins and the reading experience is interrupted as soon as you notice you’re not able to see the whole cover without scrolling.
The frustration continues a few seconds after starting to read the cover: it’s not sharp and in Retina-resolution, but blurry and noticeably pixelated. You’d be forgiven for thinking we're waiting for a progressive JPEG to load, but this is it.
You see this with all sorts of other top magazines on the 12.9-inch iPad. Here are screenshots of blurry covers from Wired, The Atlantic, Sports Illustrated, and The New Yorker.
This is strange to me. How could this be? What part of the pipeline could be limiting the magazine covers from looking sharp?
The covers should be sharp, Retina-resolution images. They would be a lot more fun to view too if they were "fit" instead of "filled" on the screen. Here's a quick mockup of how that could look:
Here's the table of contents from that same issue of Vogue:
Now here's what it looks like when you open the table of contents on the iPad:
Again the reading experience is hindered by this design decision to make exploring magazines devoid of any of the visual richness of, well, magazines.
On a print magazine, you can flip through with your fingers and get a quick sense of the photographs within. On the iPad, you have to tap in and out of the table of contents going only off of these text titles that all look the same.
The table of contents should be visually rich and hint at the photographs within. There could be interactivity here too, perhaps allowing you to preview a story without opening it, see estimated reading times, or save a story for later directly from the table of contents.
Here's a quick mockup of how it could look simply to add thumbnails to the existing design with no other changes:
I love Apple, I love magazines, I love the HI design teams at Apple... I love all of it. That's why I'm writing this post. All I want is for these things to be improved.
I admire the people who worked on this to get it this far. I know it must be difficult to be innovating in the magazine industry, where there have been nothing but headwinds for who knows how long. It's amazing to have this breadth of choice, rolled into Apple One, at my fingertips.
But, that doesn't mean that what this app offers today isn't frustrating. I'm someone who wants to use Apple News+, who wants to tell my friends about it, share stories, and keep paying for it for the foreseeable future. And yet, I can't because many small frustrations add up to an experience that I don't look forward to repeating.
I'll be waiting patiently for that silent update someday when Apple News+ suddenly gets a whole lot better, and rooting for them all the way.
I'm currently working on the next version of DetailsPro which is going to be a major update and I'm planning on having it out in the fall. There haven't been any minor updates to DetailsPro over the last couple of months because I've been taking some time off.
I can also tell you right now that your subscription or one-time purchase will still be good. I don't anticipate anything changing there.
DetailsPro will still be DetailsPro, but we're going to be moving into new territory with... prototyping. Can't wait to share more with you soon. 🎉
In many ways, designing for the Apple Watch can feel easier: the screen is smaller, its always in Dark Mode, there are fewer controls to choose from...
Yet, to me, to design for the Apple Watch (or to design watchOS itself as our friends at Apple do) is to join a design practice steeped in challenge. Everywhere the iPhone can show you the largest form of an element, like a Navigation Bar, the Watch must do it many times smaller. Everywhere the iPhone can show you beautiful content, the Watch must do it by showing you less.
Thinking about how much effort has gone into figuring out the design of watchOS, I'm reminded of those streets, ones you may have in your own neighborhood, where there is a sign that says "NOT A THROUGH STREET" or "DEAD END" at the entrance. It's true, you can't always know whether a street is a through street by looking at its entrance, but for some funny reason I feel like there should be a way for us to know—like we shouldn't need a sign for it.
People who use our designs feel this way turned up to a hundred. They can't know where tapping a button will take them, whether they'll go to a dead end or to another intersection of paths. The Apple Watch is taking on this challenge, making apps easy to navigate so that people don't end up getting stuck, and it's doing it all on a tiny screen. It's incredible to me and a huge triumph of design.
This week, we're taking a look at the wonderful new strides in Apple Watch design that Apple debuted at WWDC23. I hope you find something here that you can mix into your own design work. Thank you for reading UI Designer Weekly. —S
The new Smart Stack on watchOS 10 lets you turn the Digital Crown on any watch face to reveal widgets. Before watchOS 10, you'd have to select a certain watch face if you wanted room for a large widget. Now, you can use any watch face you like and have quick access to gorgeous full-color widgets. This is a great example of improving on a design to lift restrictions that people might have wondered about and never fully understood.
A new design language in watchOS 10 emphasizes the corners of the Watch's display, recommending new styles that include corner buttons like this view of Weather. Many apps in the watchOS section of the Keynote and on the new watchOS 10 web page take advantage of this new style to enable faster switching between sections and simpler navigation back from detail pages.
Maps on watchOS 10 with a gorgeous new interface. Buttons in the corners follow the new style and a ring illustrates walking distance and time without getting in the way. I'm struck by the edge-to-edge map and the perfect vibrancy and feel of the corner buttons. There are a lot of contrast tricks at play here. "East Rim Trailhead" has a thick dark border about it to keep it legible and the 10:09 time has a subtle blur under it that's hardly noticeable until you zoom.
Maps on watchOS 10 shows a navigation bar title for the first time on an English-language device on the right side of the screen under the time. This helps the new watchOS 10 style work, creating room for a corner button in the top left. I think this is a great reminder that we can rethink even the most basic elements of our designs to allow new ideas to come through.
A wonderful demonstration of color, contrast, and size. The vertical and horizontal arrangement of "East Mesa Trail", "Trail", and "Kane County, Utah" give us a great reference for displaying information with three elements.
Thank you for reading UI Designer Weekly. See you next week!
I've previously written about the challenge of designing for iPadOS. Ideas, though they may fill a small portrait rectangle with ease, are much harder to persuade to fill a larger multi-column landscape rectangle. The iPad has space for your design, your content, and your controls, and more.
Apple's announcement of iPadOS 17 gives us our annual info packet filled with design samples, updated references, new rules, and new recommendations. An iPad is a MacBook without a keyboard. An iPad is a large iPhone. An iPad is a tablet.
The design of iPadOS follows its multitalented adventurous home in being many different things. Let's take a look at a few details that stood out to me in the announcement of iPadOS 17 to see what we can learn.
I hope you find something here that you can mix into your own design work. Thank you for reading UI Designer Weekly. —S
Notes on iPadOS 17 gains the peculiarly-delightful ability to show a horizontal drawer of page thumbnails for a PDF you've added to your note. If you zoom in to the corner, you'll see there's a button to hide the thumbnails. This positioning on the top and as a horizontal scroll is nice in itself and it supports the edge-to-edge PDF page swipes that are happening below (by staying out of their way).
A lot of things on iPadOS appear in the form of popovers and this popover in the new Lock Screen customization area is a wonderful new example. There are no section titles, only a combined "Font & Color" title at the top. One of the hardest-working interface elements we live with has to be that little point on the presenting side of the popover. There's something to the center justification of the color swatches. I think this is a great example of the role "small" interfaces play on the iPad's larger display.
iPadOS 17 has brought a new dimension to the home screen with interactive widgets and their tappable, actionable buttons. Widgets now display constant reminders of what makes something look tappable and what makes something look not. This feature may just be a fantastic reminder for us about the "loop" of interactivity, where people see things change when they take an action, because each of these interactive widgets update live when their buttons are pressed. This is a wonderful update for the once-static home screen and a confident extension of the Widgets design language.
Lock Screens on iPadOS 17 give us a wonderful reminder to use the same shapes in our designs, even at different parts of the experience. If Lock Screens look a certain way, why not let them be edited while they look that same way? If you can see your changes live, you can be confident in each change. I'm aware this may feel like a basic observation, but applied to our own designs, there may be plenty of places where designs show something one way and edit them another. iPadOS 17 here gives us a wonderful reference of ways to navigate that.
I was struck by the simplicity of AutoFill's presentation on iPadOS 17. Where intended-but-not-digitized fields are detected, a light blue lightly-rounded rectangle is placed. This feels to me like the right balance of easy to see but also easy to ignore. And again, as we discuss so often, that is all it takes. There aren't more decorations or more embellishments—just the shape. Makes me want to look at my designs to find places where I'm doing too much and a simpler shape would do the job.
Thank you for reading UI Designer Weekly. See you next week.
This week, we're looking at the coolest new designs that were announced with macOS Sonoma at WWDC23. macOS Sonoma may seem lighter on the scale when it comes to design changes, but there's actually quite a few additions that are on some big-name spots: the Lock Screen, the desktop, and something that I haven't mentioned in this issue but aerial screen savers (finally!). Did you see that they actually move slowly and then come to a stop when you unlock on your Mac, and wherever they stop, that's where your desktop is?
I hope you find something here that you can mix into your own design work. Thank you for reading UI Designer Weekly. —S
The new Lock Screen on macOS Sonoma continues the transfer process we saw last year with System Preferences becoming System Settings. This is perhaps a great reminder for us to look at our designs and ask ourselves if any parts look a certain way not because they should, but because they have in the past. I can imagine people opening their MacBook for the first time and instantly feeling comfortable, knowing well where they are.
Widgets placed onto the desktop in macOS Sonoma play a wonderful trick to become less distracting when desired. When you start working with an application, widgets on the desktop fade and blend into your desktop wallpaper. I think this is a great example of how we can think hard about what our designs need and get creative. It's an advanced thought that maybe if the widgets were to fade and blend, they'd be easier to ignore and yet still easy to see. Color, depth, interactivity, affordances, all at play. We can put this kind of thinking into our own complex situations.
Widgets on macOS Sonoma are added to the desktop from a drawer of widgets that looks like the one on iOS and iPadOS. This strikes me as interesting because the macOS design language has plenty of possible ways to represent this sort of design, whether you'd call it a "temporary window" or a "picker panel" or a "drag-and-drop zone". But, even though those options exist, we see this drawer designed in a way that more closely mirrors widgets where they are at home: on iOS and iPadOS. I think this is a great reminder that it's okay for us to use something other than what the defaults are on a given platform when we may see great familiarity and usability benefits as a result. Maybe the fact that this design is so uncommon on macOS to this point actually helps it feel even more transient.
Screen Sharing on macOS Sonoma has a new feature called Presenter Overlay that lets you put yourself over your shared window picture-in-picture style. There's a great example in here of designing for an "off" state: the first button on the left permanently says "Off" and is highlighted when there is no overlay. We might not always have room in our designs to have a special button or toggle just for the "Off" state, but with activities and actions that are more complex, perhaps we can provide that extra bit of clarification.
As much as good design is about “taking things away”, it can also be about adding things in. To me, this is what iOS 17 and before it iOS 15 and 16 embody most.
Apple Design has not needed a “big redesign” to keep iOS looking and feeling modern. It feels to me like it’s been more a story of enrichment and refinement.
The vibrancies of color, the arrangements of typography. Spacing, shadows, sizes, and pairings. Year by year, the new version of iOS has debuted new tricks, new solutions to old problems.
This week, I’ll share with you the details that caught my eye in the design of iOS 17. Seventeen is a big number and designs were made to match.
I hope you find something here that you can mix into your own design work. Thank you for reading UI Designer Weekly. —S
Contact Posters on iOS 17 extend the use of the easy font choices, color palettes, and photo styles that people might be familiar with if they've customized their Lock Screen. I'm struck by how Apple Design has been able to expand this set of different pieces people can use while keeping it looking like Apple. This might be a sign that designs throughout our apps should have customization built-in by default. If the system itself allows it in more places, our designs within apps can find ways to join the fun.
I love this screenshot of Check In, a new feature on iOS 17, for its bountiful usage of yellow. By using yellow throughout, as opposed to having a Check In icon be the only spot of color for example, the entire element says Check In and associates itself with the app. I think this is a great reminder that we can look for places within our own designs to bring color up and out. We can start with concepts that have colors associated with them today, like success for green and warning for yellow, and go beyond to concepts that might be specific to our own designs, like scheduled or processing.
Messages on iOS 17 had a small detail that stuck out to me in the highlight of the emoji icon in the toolbar for picking an iMessage app. The highlight is so calm, so quiet, a gray. I like it a lot and it feels like a choice that allows the toolbar to stay out of competing with the content below. iOS 17 felt quieter and vibrant, spaced out and light.
Continuing that feeling of space and light is Journal, new to iOS 17. It's fascinating seeing how Apple would design a journal and immediately we see a fluency in design with various types of things. To me, one of the strengths of Apple software and design is how good it is at representing different things together. Here, we see a photo, a podcast, a Maps location, and more all grouped together beautifully into an element showing your day. There isn't much fanfare telling us this thing is different from that thing, because we can just tell by looking. But there's still a bravery, confidence, and grace to how this is done.
Talking about representing different "things" together, we can't miss talking about StandBy, also new to iOS 17. The design of StandBy is stunning to me in the way that it reuses the design of Widgets and allows many other design elements to breathe. The time is represented in large, bold type. Colors adapt to let you sleep by dimming to polite reds. Swipes up and down on either side allow you to move through your StandBy widgets (like you would with Widget Stacks on the Home Screen). This is that fluency again and, powered by the design decision to allow the iPhone to go into a Dark Mode-only, landscape-only bedside mode, allows these designs to go further.
I love this clock shown in StandBy on iOS 17. It looks like SF Expanded, with the familiar clock hands but with the classic dial. Seeing the Apple Design language express the form of a classic clock like this inspires me to look for new forms of skeuomorphism and ties to the things people are most familiar with in life. This is a great reminder to think about what our designs do at a higher level and think about whether there's something out there we can bring in to make things easier or more enjoyable for people.
There are always things we can't do that we wish we could. Life teaches this lesson and makes sure to review it with us (too often, if you'd ask me.)
Great art, great songs, and great inventions though, these tell us we can do what we never dreamed we could.
As I'm writing this newsletter, I'm sitting in my bedroom typing on my MacBook Pro. If I hadn't seen visionOS, I probably wouldn't be thinking right now about how I could be looking up and working with life-size floating windows, rather than looking down at my finite-feeling MacBook screen.
Everything I think of visionOS can be boiled down to "Wow, that thing looks like a normal window. That's a normal app." Apple has gone and made it look easy, but we all know it must have been anything but.
I hope you find something here that you can mix into your own design work. And I hope this gets you excited for what we'll be doing when this releases. Thank you for reading UI Designer Weekly. —S
Windows in visionOS float in your space. They use a glass-like material to let you get a sense of what's behind. (I can't believe there's more) You can use the window bar, the longer line below the window, to move the window around your space and guess what? Windows will always subtly rotate to be facing you directly. Sounds to me like an excellent example of making something hard to mess up, because you can't leave a window in a "wrong" position. The Principles of Spatial Design session further states that windows adapt to the lighting conditions of your space. I'm struck not only by how beautiful these windows look, but by how functional they appear to be. For example, you can scale windows manually using a small corner control that appears and closely resembles a similar control found in Stage Manager on iPadOS. Wow.
That isn't even the half of it. Windows and familiar design elements like Tab Bars and Toolbars situate together in this amazing layered setup, where the bars always float on a layer above the window. Apple says this makes them easier to access. I'm stunned by how good tabs look arranged vertically on the side, and the fact that these tabs are cognitively the same tabs and the same SF Symbols as you can use on the other platforms.
Windows in visionOS adapt to the lighting condition of your space. Safari on visionOS highlights these lighting effects all in the search bar area. I can count at least five separate enhancements to the search bar and the surrounding elements that are purely to establish realistic lighting. The highlights on the tops, the shadows on the bottom, the three-dimensional lighting reflecting off the curved edges between layers. Again, I'm stunned.
I can best describe Keynote on visionOS as "this looks too good to be true" or "there is no way there is a full version of Keynote that works so well and appears so beautifully". I think there are a couple of points to focus on here. First is the fact that Keynote on visionOS looks like Keynote on anythingElseOS. Maybe that is not surprising to you, dear reader, but I didn't know we could expect it to be wonderfully 1:1 like this. Second, the visionOS design language can support full-on apps like Keynote. The way things translate, all of it is there such that you can use Keynote in a way that, from these screenshots, appears like you'd be missing exactly zero of the features.
Safari on visionOS features a separation between interface elements where the search bar is in a separate section above the content section, extending the behavior we saw earlier with Tab Bars and Toolbars. A familiar design, encapsulating all the complexity that comes with interacting with the web page content. A great version of Safari being available at launch reminds me of the iPhone and what that did for the web back then.
A principle of spatial design Apple shared for visionOS is scale and how scale and depth should be used in tandem. In the TV app using an immersive cinema as your environment, the play controls appear much smaller than the screen and much closer. I'm excited and inspired by the idea of designing with depth so literally. We're going to have new things to think about left and right (and back and forth.)
It's the Friday of WWDC23; I'm amazed and elated; Apple announced the Apple Vision Pro and visionOS.
I'm impressed because it looks like the Vision Pro does everything. It runs apps, apps that look beautiful and familiar to what we know today. It uses your eyes how is that even possible to let you do things by looking from here to there. And you can watch movies in the Cinema Environment. And the apps are made with SwiftUI. And windows in visionOS can cast shadows on your living room table. And, and, and. That's how I would sum up Apple Vision Pro: an invention that came out the gate living the definition of and.
I think Apple Design did an incredible job this year with everything from StandBy to visionOS to macOS widgets and the watchOS 10 revamp.
On this newsletter, we love to look at the design details that Apple places into its products. We get inspired by the work of Apple Design, and after this week of announcements, we have plenty to talk about for the summer.
This week, we'll look at an overview of designs that featured in WWDC23 and enjoy the beautiful big picture. After this week, the next issues will go through each platform.
I hope you find something here that you can mix into your own design work. Thank you for reading UI Designer Weekly. —S
Here it is, the Home Screen of the visionOS operating system. Apps as they look on this futuristic platform. Each icon is 3D with multiple layers that lift and fall as your eyes move from one icon to the other. Check out the beautiful switcher on the left side. I think it looks wonderfully familiar but also different. Cues might have been taken from the early watchOS honeycomb Home Screen. We're going to dive in to a lot more about visionOS in next week's issue.
StandBy on iOS 17 lets you turn your phone into landscape to display big, beautiful clocks, widgets, and Live Activities. This is playful design at its best. If you watch this section, take a look at how obvious it looks now, after the fact, that the Dynamic Island's Live Activities would show up here... because what is an iPhone turned landscape but a big Dynamic Island? In the coming weeks, we'll take a look at the different StandBy designs and more from iOS 17.
Smart Stack on watchOS 10 reminds me of the best parts of the original Apple Watch launch. Seeing interfaces shrunken down into these small, personal, glanceable pieces was eye-opening. Now, on the 10th iteration of watchOS software, the design has put glanceability at the top of the list. In the coming weeks, we'll take a deeper look at the new corner-to-corner watchOS 10 app designs.
Widgets on macOS Sonoma can now live on the desktop. Now your Mac desktop can be a much more informative dashboard 😉. I think this is a clever design idea that balances out a want with a need: we want to be able to use widgets more easily on the Mac, but we need to be able to focus on the current window even if widgets are going to be always visible. We'll take a look at this and a lot more in the upcoming macOS issue.
Widgets on iPadOS 17 and iOS 17 can now be interactive, letting you tap to play songs, check off reminders, and more. This change might seem simple, but it's going to open the doors for widget design way open now that you'll be able to do something with an open without even opening it up. Plus, widgets now animate between states. We'll take a deeper look at this and updates to Stage Manager in an upcoming issue.
Wow, FaceTime is on tvOS 17 and you can SharePlay side-by-side with your FaceTime call. It's going to be fascinating to look at the ways FaceTime is designed differently and the same on the big screen. tvOS 17 gets a new Control Center design and more that we'll look at in our tvOS issue.
No new issue this week, because it’s the week before WWDC and a great moment to rest up! It’s gonna be a big week.
I’ll see you next week to talk about everything new! I’m looking forward to seeing how iOS and macOS will look different and sharing the best details with you in this newsletter.
Have a great weekend, I hope you can get some much-needed rest. -S
