17 ms·
Modern iOS Navigation Patterns
- pryelluw 3y agoThis is such a good resource for folks like me who struggle with the visual aspect of software. The diagrams and clear explanations are just excellent.
- deleted 3y ago[deleted]
- wannacboatmovie 3y agoNext, try addressing why they change all the time, and seemingly for no reason. It's infuriating. The latest inexplicable, surprise change happened when my Apple Watch updated overnight, I went to open control center the next morning to locate my phone which I had misplaced, and .... it wouldn't open. For 10 minutes I fiddled with this fucking thing, thinking I was going senile at one point, only to find out that Apple moved the control center trigger to the side (power) button, and swipe from below now does something completely different. No warning, no announcement, no nothing, and no way to revert to the old behavior which existed for years. Imagine walking into your car one morning and the operation of the pedals was suddenly reversed due to an automatic software update because some geekaroid at the car manufacturer thought it was a good idea. At this point I'm convinced they are making changes as a means to justify their existence. If I ran that company the project managers responsible for these breaking changes - and yes, unannounced UI changes are breaking changes - would all be fired.
- deleted 3y ago[deleted]
- shutupnerd0000 3y agoImagine buying a wearable computer with automatic remote updates and thinking it will behave like an analog watch.
- wannacboatmovie 3y agoActually, if one buys an appliance (which this is), I would expect and be fully okay with security updates only, and not for the basic means of operation/controls to change monthly.
- deleted 3y ago[deleted]
- n8cpdx 3y agoOverall I thought the watchOS changes were a huge upgrade to the visual design and power of the platform and its apps. But I still end up opening the wrong view (control center or app drawer) at least once a day. And it’s been months! If the choice is so unintuitive a reasonably fanboyish user doesn’t learn it after months, it’s probably the wrong choice.
- wannacboatmovie 3y agoAnd you just know it's configurable (just like the original iPad allowed you to change the behavior of the slide switch), but they simply chose not to.
- anamexis 3y agoInterestingly, they did backtrack on removing the "swipe to change watch faces" functionality, and added back a configuration option for it today.
- wlesieutre 3y agoAlthough I’m noticing that mine now brings up every watch face with the time set to 10:09 and then takes a moment to animate changing to the correct time. It looks really stupid with the solar face. And it doesn’t do it just once when a face first loads, it does it every time you switch faces. Hopefully a bug but I’m wondering if someone said “we made it so you can’t switch watch faces quickly, now we can reclaim that RAM and save it for widgets that you didn’t want.”
- n8cpdx 3y agoI’ve also noticed issues with the time on the watch face being out of date. I’ve also seen the date be wrong. It’s a pretty serious flaw that doesn’t get talked about enough. Been around for months at least, I got burned in September and ~May of this year.
- spike021 3y agoI hate how they changed complication buttons in the last major update. It used to be if I raised my Watch I could immediately tap my timer complication and it'd open my timer app. Now it's like the screen is constantly partially transparent and tapping the complication doesn't do anything unless the watch is at exactly the right angle. So confusing.
- xpe 3y ago> Next, try addressing why they change all the time, and seemingly for no reason. It's infuriating. No, the "Modern iOS Navigation Patterns" (the title of this article) don't change all the time. Not even close. What you are talking about has to do with _buttons_ on watchOS. I strive to leave a wide wide berth for what people consider on-topic, but to me, this comment is an unrelated rant that will empirically crowd out discussion around the topic at hand: iOS navigation patterns. I'm here on this thread to learn about how to make better iOS apps.
- xpe 3y agoAnd then ... > At this point I'm convinced they are making changes as a means to justify their existence. I really hope this is humor and that you aren't convinced of this; that would a faulty generalization. There are plausible other interpretations. > If I ran that company the project managers responsible for these breaking changes - and yes, unannounced UI changes are breaking changes - would all be fired. 1. Apple regularly breaks expectations. What is a breaking change to some is often the expectation at Apple. 2. I challenge your assumption that this decision was a mistake. I would expect the pros and cons were calculated. 3. How do you know the decision didn't get approved by higher up the chain? 4. Even if it was a mistake, I challenge your claim that the appropriate response is to fire the managers. I would point you to a vast literature on effective modern management. My remaining points elaborate on this... 5. I disagree with what appears to be angry, impulsive decision to fire them. 6. These are people. I'm not seeing any indication that you value them. 7. Emotions and empathy aside, it would be in your interest to build a healthy culture where risk-taking is encouraged and one mistake doesn't get you fired. Everyone makes mistakes. And we can learn from them. (Yes, dishonesty and negligence gets you fired. And poor performance gets you fired, but this is not evaluated on the basis of only one mistake.) 8. I disagree with what appears to be a "I have everything I need to know about this" attitude. At the very least gather more information before you fire people. If you disagreed with the pro/con assessment, look into how that decision was made. What process(es) could be improved?
- saagarjha 3y agoYou've created a very long list over what looks to be hyperbole until 'wannacboatmovie actually does end up in a position at Apple where they handle staffing.
- xpe 3y agoI consider you lucky if you think the attitude about 'just fire the people that made mistakes' is hyperbole. It a common attitude, so when ^^ says it, I believe that is what they mean. Also, there is nothing wrong with a long list. And I'm not here for hyperbole.
- lacrimacida 3y agoI hate these updates that change things around and break muscle memory. And most likely by coincidence it happens at the most unappropriate times.
- n8cpdx 3y agoI’m not sure if this is related enough or not, but here goes: On Mac and now iPadOS (https://useyourloaf.com/blog/ipad-customizable-toolbars/ https://useyourloaf.com/blog/ipad-customizable-toolbars/), the built-in toolbar control supports a high degree of customization. You can try this in Finder, among many other native apps. Powerful built-in widgets are an underappreciated aspect of the Mac desktop, and something I worry about with SwiftUI taking over. They’re also a huge win for iOS, but less so because it is so common for apps to want to put their own spin on the design. Anyway, am I crazy, or did iOS apps used to support customizing tab bars out of the box? While clearly different from toolbars, supporting editing the order (and which are actually displayed) of tabs felt like the spiritual equivalent of built-in toolbar customization. And I haven’t seen it in years. According to doc it is still there, but does anyone know of apps still using this pattern? https://developer.apple.com/documentation/uikit/uitabbarcontroller#1653016 https://developer.apple.com/documentation/uikit/uitabbarcont... Anyway, tab bars are cool also because that is what is used by Apple TV in most apps I’ve used, and the consistent experience is wonderful.
- spike021 3y agoYep back in the early days it was very common to be able to mix around tabs and take out out in the ones you wanted. Back when FB was still decent in the... iOS7? says it let you do this with chat, feed, notifications, groups, etc. as an example.
- saagarjha 3y agoiTunes Store?
- jwells89 3y agoOn Mac I wish more apps used the standard toolbar. The customizability is nice and rarely found in bespoke implementations.
- crooked-v 3y agoVarious Apple apps like Apple Store and Music use a tab bar at the bottom, but they're not customizable. Everything I can think of outside of Apple switched over to completely undiscoverable hamburger menus a long time ago.
- happytoexplain 3y agoThis sets off my alarm bells big time: >High-Friction Modal >A decision is required to dismiss them: A decision whether to save state, whether to confirm (by tapping Done) or to destroy (by tapping Cancel) the data you’ve entered on a form. >Low-Friction Modal >They are easy to dismiss: “Low friction” means not having to think about how to get back. 'CANCEL' ON A PROMPT IS NEVER, EVER DESTRUCTIVE. This is a huge red flag for the author's understanding of UI conventions. "Cancel" must always be safe. "Cancel" is the low-friction no-thinking way to dismiss a prompt. It should dismiss the prompt, and do nothing else. Corollary to this is that you should avoid putting a "Cancel" button on a full-blown input interface that will throw away user data if dismissed (regardless of whether you have decided to embed said interface in a modal). If you do, you at least need a "are you sure" prompt with a cancel button (hence why you avoid using the word 'cancel' redundantly on the original form).
- alain94040 3y agoNot 100% sure about cancel vs. stop. Say I'm creating a new calendar entry. I type a lot of information, then I get to save or cancel. Technically, cancel is safe because I'm not messing up my existing calendar. But all the typing I did (especially on mobile) would be lost. So is cancel really safe? But Stop wouldn't the right choice either... What do you suggest?
- happytoexplain 3y ago> Technically, cancel is safe No, it's not safe in that scenario. "Destructive" means throwing away anything, even one word the user typed. Do not use the word "cancel" for that operation - use the word "Discard" or an X button, with an are-you-sure prompt that has a cancel button that safely brings you back to the editing interface. Edit: OK, maybe "one word" is an exaggeration. Certainly for the case of a form of input fields a no-prompt cancel button is inappropriate. However, if you have a simple OK/Cancel dialogue that contains a single one-line input field, it is usually acceptable to have a Cancel button that throws away your input without prompting.
- 3y ago
- robertoandred 3y agoNot to beat a dead horse, but the use of these patterns is one of the many reasons Apollo was so much better than Reddit's official app. Consistent navigation, consistent gestures, consistent behaviors. And it's not like these concepts are hard, you just have to care enough to follow them. It's really disheartening to see how many apps don't.
- jwells89 3y agoThat’s the difference between an app that optimizes for being a good app and an app that optimizes for engagement and selling you things. It’s similar to how supermarkets periodically shuffle around their shelving. Consistency in navigation, gestures, and behaviors allow the user to get what they want and get back out too efficiently.
- pacificmint 3y agoCase in Point: I really like Costco, but if I ever cancel my membership then it is because of how they seem to reshuffle significant parts of the store every few weeks. I don't know if they think I will buy more if I run around for fifteen minutes looking for something, but man it's annoying. They probably think of it as 'increasing engagement'. To me it's just wasting my time.
- killjoywashere 3y agoDo you mean the app or the physical store? Maybe I'm a luddite for going to the physical store but I go to 4 different Costcos in the Bay area with some frequency and a couple others in SOCAL and I find their interstore layouts different but their intra-store layouts extremely consistent over years. One in San Diego I can confidently say is consistent over a decade. I barely use the app except for the card and an occasional lookup for something not available in store.
- rtpg 3y agoThat might be for other reasons, because according to a study I've seen, Costco basically runs their stores "at cost" and wants to just make money off of the memberships (https://minesafetydisclosures.com/blog/2018/6/18/costco https://minesafetydisclosures.com/blog/2018/6/18/costco, though it's from 5 years ago so things might have changed)
- rTX5CMRXIfFG 3y agoThe entire article can be summarized into one word: trees. Anyway, this is the sort of information that you must absolutely consume from a direct source, i.e. Apple documentation and Human Interface Guidelines, because they change a lot and secondary sources can be outdated or flat out wrong at any given point in time. Additionally, your mental model of the UI must correspond with Apple’s implementations of its UI frameworks (if this is targeted at designers, well the problem of design that is detached from engineering is a separate and long discussion, though very real and so widespread as to be the norm).
- deleted 3y ago[deleted]
- wodenokoto 3y agoMy impression of this article is that it is not an interpretation of apples guide lines (ie a secondary source) but a write up of observations (ie a primary source) This can be of interest for a few reasons, but particularly because such investigations might reveal “true” design philosophies over espoused philosophies.
- rTX5CMRXIfFG 3y agoWhat do you mean by true versus espoused? iOS’s modals, tab bars, navigation bars, and everything mentioned in the article are exactly the objects or value types that you deal with when you go to the code level and actually use the APIs.
- wodenokoto 3y agoIt’s in response to a complaint that we shouldn’t be reading secondary sources on design, not a comment on the results of this particular article.
- eviks 3y agoThe official docs can also be wrong and outdated, so there is no difference here. Besides they can also be poorly written, so there is nothing absolute here
- wodenokoto 3y agoThe Home Screen actually uses the pyramid pattern and not the hub and spoke. You can swipe between apps using the black bar at the bottom.
- b0b10101 3y agoexcept that the stack you're swiping between is not represented in the layout of the icons - it's on how recently you've used the app. ie: if i have photos, calender and safari all on the same row of the home screen, and i open photos, go back to the home screen and then open safari, if i swiped left to right (to go backwards) on the bar at the bottom i'd go directly back to photos, not to calender
- Dig1t 3y agoThis site itself is really nice to read and easy to understand. I wish Apple's docs looked as nice and were as easy to read as this.
- Groxx 3y agoOn the first entry: >Drill-down navigation is stateless I've been encountering this a lot lately, but: this seems the opposite to me, it's deeply stateful as screen N depends on what you did before, and you can go back to it. It literally keeps track of some internal state in order to be useful at all, i.e. the list contents depend on state N-1, because if it didn't it would be awful. A stateless UI would be, like, a one-step modal. It exists or it doesn't. Particularly strongly "stateless" if it's transient and you have no way to "resume" it. I've been in and around quite a few discussions using the term "stateful" to mean WILDLY different things through the years, and in a giant burst lately, and it has largely led me to conclude that almost nobody agrees with anyone else what it means and few are aware of this. What does "stateful UI" mean to you all? I find the variation fascinating.
- deleted 3y ago[deleted]
- bruce343434 3y agoTo me, stateful UI means that the front end is using variables to manage its behaviour.
- Groxx 3y agoThis would mean it's strictly an implementation detail then? Since any state can be turned into configuration / construction / just make infinite views, each one customized to show one state.
- asoneth 3y agoImplementation differences are certainly a part, but people do interpret them differently. For example, I'm working on an application that is transitioning some of our stateful navigation to be more stateless to hopefully address some end-user confusion. We have an overlapping hierarchy where many objects have multiple parents, and the same object would display different breadcrumbs depending on which path someone took to the object. This made people confused about whether they were looking at the same object.
- jurip 3y agoOne inexact wording here I noticed: "Swiping right from the left edge of the screen does the same as pressing the Back button." If you're implementing that yourself, it's important it's not a swipe gesture, it's an edge pan gesture. It has to be an interactive, cancellable pan that follows your finger, or it just feels wrong.
- insomagent 3y agoI think the X/Twitter iOS app and the reddit app are guilty of this. I find myself way too often typing something out, then barely touching the edge of my phone, and my entire comment is gone.
- anileated 3y agoPro tip: Twitter works as PWA.
- hbn 3y agoOn Twitter you can't swipe out of the tweet compose screen. You have to explicitly click the "Cancel" button in the top left, and if you have anything written it'll pop a dialogue to either delete the contents, save as a draft, or cancel (go back to composing) I'm not sure how you'd swipe out of this screen.
- fractallyte 3y agoSailfish OS does this properly and consistently - in all apps. https://sailfishos.org/ https://sailfishos.org/ I've found it overall simpler and better than both iOS and Android.
- jurip 3y agoI'm sure Sailfish, too, allows you to prevent the gesture if you want. On iOS if you use the standard navigation controller, you get it automatically. If you're swimming against the tide and want to do something unusual, you have to implement it yourself, but it's easy enough with a readily available gesture recognizer.
- tavavex 3y agoI like the presentation, it's understandable and well-structured. From what I can see, Apple's guidelines look really similar to what Google suggests for Android apps - the only really big difference is visual presentation.
- deleted 3y ago[deleted]
- rplnt 3y agoWhen I see "iOS Navigation Patterns" I cringe. There are no patterns and it's one of the worst things (there are many) when comparing to Android. Going back on Android is easy, and back can mean multiple things. On iOS that I've been using over a year I just blindly try one of the two back "patterns", then look for buttons in an unreachable places. And even that sometimes doesn't work. Don't let developers use patterns, fix it on OS level. Developers don't want you to leave parts of their app - try doing back action on Instagram reels for example.
- rezonant 3y agoThe activity stack experience in Android is probably my favorite part of the system design. It produces a deep consistency that makes navigation effortless. I really wish this had been built in to iOS in the same way. The activity stack works across applications, which means a back gesture always brings you back to the screen before it, even when several applications work together on a task.
- wiradikusuma 3y agoDon't iOS apps have that small black back icon on the top left that sometimes appears when you open another app?
- malermeister 3y agosometimes is the problem. It's not consistent.
- emsy 3y agoThat's just not true.
- immanentize 3y agoI had to Google it and I think I've seen this thing in the status bar sometimes on iOS but it's definitely not consistent. I wasn't even aware it was supposed to be a button
- eviks 3y ago> Swiping right from the left edge of the screen does the same as pressing the Back button. Wish you could disable that, so common horizontal scrolling in web pages that don't fit activates the Back function
- Morgan8 3y ago[dead]
- Morgan8 3y ago[dead]
- Unfrozen0688 3y agoI always turn the button navigation on for Android phones on setup. Only gestures are terrible navigation.
- MaxikCZ 3y agoDepends on the gestures, I guess. I have all gestrues by swiping from right side and cant be happier (back, home, swap last used app, list of last used apps, splitscreen, power button). All the same swipe, forked by the swipe direction (upwards, sidways, downwards) and whether I hold the finger down after finishing gesture. Its amazing, and one of the main reasons I wont be switching to apple. Who thought that the back gesture should be swiping right from left edge? Why not left from right edge? Doesnt make any sense for right-handed people..
- jakey_bakey 3y agoI'm dead excited for 2040 when SwiftUI can handle all of these patterns natively. And, maybe for 2043 when our n-3 OS target will let us support them in our app.
- geniium 3y agoI love the design of that page. Very clean and informative. Very visual. Well done!
- hackernewds 3y agoiOS does this reasonably well > A typical iOS application has a fixed architecture-often a hierarchical tree with multiple levels. This rigid struc- ture makes navigation options pre- dictable. Structural navigation pat- terns give users confidence about where they came from, where they are in the hierarchy, and how to navi- gate back to where they came from. whereas on Android, sometimes the 'Back' gesture lands you on the previous page and sometimes it completely closes the app. it's so inconsistent that I dropped 12 years of using Android and switched to iOS.
- haint_ 3y agoIt has been like that right from the start. It amazes me that you put up with it for a whooping 12 years before deciding you've had enough.
- iamflimflam1 3y agoWhen I first started developing for the iPhone (back when they first released the official SDKs) Apple were really hot on their Human Interface Guidelines and had really good documentation on what made a good UI along with standard patterns to follow. That seemed to completely vanish when they went with the "flat" design - mainly I think because none of it made sense anymore. They went from very clear: - make sure the user interaction is obvious to - this might be clickable, or it might be some text or maybe it's a long press...
- Charlie_32 3y agoAre there any good app examples of what Frank says here? "A step-by-step sequence should be contained in a modal overlay for presentation to emphasize that the Back button in this context serves a different purpose than in a hierarchical drill-down. The step-by-step process is usually completed with a Done or Close button, which also closes the containing modal. The sequence can have a variable number of steps and different paths depending on the options selected."
- leokennis 3y agoFrank Rausch created the best Wikipedia app ever, "V for Wiki"* So when he speaks about iOS design and UX, I'm inclined to listen. ----- * https://web.archive.org/web/20211223231349/https://v-for-wiki.com/ https://web.archive.org/web/20211223231349/https://v-for-wik...
- russelldjimmy 3y agoOn a side note, what ever happened to V For Wiki?! I used to use it every day and one day it just stopped working. Looked it up on the App Store and found that it was missing. I was heartbroken :(
- leokennis 3y agoI believe development stopped at some point, but the app of course remained working frozen in time. But then earlier this year Wikipedia changed their API and the app stopped working definitively.
- jeffybefffy519 3y agoI recently moved from iphone se to a later iphone without a home button, the user experience is so much worse. I accidentally take screenshots all the time and find it slower to navigate back to the home screen.
- pcurve 3y agoI agree. You also get 'trapped' on some screens because all of a sudden you've lost all navigation cues, even the swipe up bottom nav.
- hbn 3y agoIf you ever lose the bottom home bar it just means you're in a full-screen view where they want to prevent accidentally swiping to go home, like a full-screen video or a game. In those cases you just have to swipe up once to re-enable the home bar, and then again to actually go to the home screen.
- Aerbil313 3y agoBtw, does anybody know the proper way to quit home screen “Search” in iOS? Currently I swipe up to close the keyboard and then tap the empty space at the bottom of the search screen. Seemed like a bug the first time.
- hbn 3y agoAre you talking about the Spotlight search you get when you swipe down on the home screen? Doing the typical home swipe up from the bottom should get you out of it. Same for the app library search.