A Mobile App Success Starter Pack

When you’re pitching a mobile app to a prospective client, it’s easy to focus on the app’s raison d’être. A pizza-ordering app should order pizza, a messaging app should send messages, and a game should be fun. For an app to succeed, there are countless other hidden tasks to consider: does your app respond well to poor network connectivity? Is it always clear when it’s waiting on network communication? What happens when you ship the app but need to prevent users from using a broken version? In this talk we’ll look at common examples of the unspoken assumptions made when creating apps—assumptions that clients may have, assumptions users definitely have, and the things no app should leave an App Store without. Using these critical features as a guide, you’ll be better prepared to estimate project length and deliver amazing (and successful) apps.

Transcript

1. A Mobile App Success Starter Pack Jeff Kelley (@SlaunchaMan) Abstractions II , August 22nd, 2019
2. Your App’s Raison D’Être The thing your app does should be where you spend most of your time… at first. Jeff Kelley |
3. Image by Henrik Kniberg
4. Your MVP • Only the features you need to launch • Differentiate your app vs. others • Position your app in the market Jeff Kelley |
5. Your MVP • Only the features you need to launch • Differentiate your app vs. others • Position your app in the market This is what you’re worried about during the MVP. But what do your users notice when it launches? Jeff Kelley |
6. User Experience Polish Take a minute and think about all of the apps that have frustrated you over the years. Why did they frustrate you? Jeff Kelley |
7. User Experience Polish Networking What happens between the screens of your comps? Jeff Kelley |
8. User Experience Polish Networking When a network request is happening, inform the user using an activity indicator. Jeff Kelley |
9. User Experience Polish Networking While your app is loading, be careful to avoid double-taps on UI elements that initiate these requests. Jeff Kelley |
10. User Experience Polish Networking One way to handle double-taps is to obscure the user interface while the network request occurs. This is useful for situations where the app should be unusable during the request. Jeff Kelley |
11. User Experience Polish Networking If the rest of the interface should still allow user interaction, consider disabling or removing just the buttons that would start a second request. Jeff Kelley |
12. User Experience Polish Networking Another approach is to immediately display the other view, then load in data when it arrives. Jeff Kelley |
13. User Experience Polish Failure States All of those cases apply to successful results. But as we all know, network requests can fail. How are you going to handle that? Jeff Kelley |
14. User Experience Polish Failure States All of those cases apply to successful results. But as we all know, network requests can fail. How are you going to handle that? Jeff Kelley |
15. User Experience Polish Text Entry If your app supports login, how does your login form behave? Jeff Kelley |
16. User Experience Polish Common Text Entry Pitfalls How many issues can you find with this login form? • Incorrect keyboard type • Return doesn’t advance to “Password” field • Autocorrect enabled for username/e-mail field • Missing text input traits to fill username and password Jeff Kelley |
17. User Experience Polish Common Text Entry Pitfalls When implementing UITextFieldDelegate, consider these edge cases: • Hardware keyboards (iPhone too!) • Emoji • Pasting into the field • Pasting War and Peace into the field Jeff Kelley |
18. User Experience Polish Common UITextFieldDelegate Pitfalls // Prevent pasting by preventing multi-length characters func textField(_ textField: UITextField, shouldChangeCharactersIn range: NSRange, replacementString string: String) -> Bool { guard range.length == 1 else { return false } return true } Jeff Kelley |
19. User Experience Polish Common UITextFieldDelegate Pitfalls // Prevent emoji by inspecting the replacement string func textField(_ textField: UITextField, shouldChangeCharactersIn range: NSRange, replacementString string: String) -> Bool { guard string.unicodeScalars .filter({ $0.properties.isEmoji }) .isEmpty else { return false } return true } Jeff Kelley |
20. User Experience Polish Common UITextFieldDelegate Pitfalls // Prevent emoji by stripping them from the replacement string func textField(_ textField: UITextField, shouldChangeCharactersIn range: NSRange, replacementString string: String) -> Bool { if string.unicodeScalars .filter({ $0.properties.isEmoji }) .isEmpty { return true } else { let newReplacementString = String(string.unicodeScalars .filter { !$0.properties.isEmoji}) let newText = (textField.text as NSString?)? .replacingCharacters(in: range, with: newReplacementString) textField.text = newText return false } } Jeff Kelley |
21. User Experience Polish Persistence Have you ever opened the new version of an app, only to have this happen? Jeff Kelley |
22. User Experience Polish Accessibility It doesn’t matter how nice your app is if your users can’t use it. Jeff Kelley |
23. User Experience Polish Accessibility It doesn’t matter how nice your app is if your users can’t use it. Jeff Kelley |
24. User Experience Polish Accessibility It doesn’t matter how nice your app is if your users can’t use it. Jeff Kelley |
25. User Experience Polish Accessibility It doesn’t matter how nice your app is if your users can’t use it. Jeff Kelley |
26. Photo by Andrew Guan on Unsplash
27. User Experience Polish Dark Mode Present your app in a manner that matches the environment it’s in. Jeff Kelley |
28. User Experience Polish Dark Mode Present your app in a manner that matches the environment it’s in. Jeff Kelley |
29. Why Do These Matter? • Ubuntu’s “One Hundred Papercuts” Initiative • Users notice, even if they can’t articulate • Users have built-in expectations for how apps behave • Driven by the platform • They increase friction, make it less likely that people use your app Photo by Rohit Tandon on Unsplash
30. Your Job as a Developer • Learn what the best practices are for your platform • Speak Up when these things are missing from plans • Include these details in estimates, story cards, etc. • Promote a culture where these little things are a given Photo by You X Ventures on Unsplash
31. How to Learn • Use apps! • Apple Design Awards and other points of recognition • Read app reviews • Look at built-in applications Photo by Wes Hicks on Unsplash
32. Thank You! Contact info: Jeff Kelley Slides: https://speakerdeck.com/SlaunchaMan Twitter: @SlaunchaMan E-Mail: jeff@detroitlabs.com