7

Floating Action Buttons - invented by the Google Material Design Team - are rather popular on Android. Apple's closest equivalent are perhaps an action icon at top-right or the bottom Tool Bar pattern - which won't play nicely with a persistent Tab Bar.

I'm working on an iOS app that has a very strong, prominent 'hallmark action' that needs to stand out and be accessible from the app's main screen. Should I use a Floating Action Button in iOS?

10

TL;DR: I consider the Floating Action Button (FAB) to be the most polarizing element of Material Design, and generally wouldn't recommend a floating action button for use in an iOS application.

The principle is still sound: provide a strong call-to-action element (CTA) to guide your users. Apple tends to favor the top-right interaction, but I consider the play/shuffle button in Spotify to be a good example of a non-toolbar interaction (see below). It helps that it has high discoverability (easily understood wording rather than abstract icons). Other apps (Instagram, Tumblr) use the central icon of the Tab Bar to focus the user on a primary action (which might be relevant for your use).

The FAB is probably the least generic component in the language and tends to make all implementations look like they were made by Google (which works great on Android). It's an abstract concept with low discoverability, which works fine for Android since it's part of the OS. You're taught to use it as part of the onboarding for the device.

If your target audience is iOS, where it isn't commonly understood, then you're increasing the complexity for new users. Ultimately there is nothing stopping you from using a FAB, but you should probably expect users to not know what it is, or how to use it.

Spotify Shuffle button Instagram post button on Tab Bar

8

If you compare GMAIL user interface itself on the Apple and Android mobiles, the UI is a bit different (user pics and checkboxes - on the left-hand side, etc.).

For the IOS, the GMAIL takes a different design pattern for FAB or button compared to the Android Design, but it still stands out. You may want to consider this design for your app. Frankly speaking, I am not sure why GMAIL avoided FAB on the IOS.

I got an Apple mobile 6S with me and I have compared with another android mobile to cross check and confirm the UI, which is exactly same as the screenshots provided below.

enter image description here

Source of the images: https://www.google.com/url?sa=i&rct=j&q=&esrc=s&source=images&cd=&cad=rja&uact=8&ved=&url=http%3A%2F%2Fpttrns.com%2Fapplications%2F370&psig=AFQjCNFIfKmNmucdvJpli_i9xgtqO1zpgg&ust=1476535412516119

http://www.lifehack.org/articles/technology/finally-20-productivity-apps-that-will-ensure-efficiency.html

8

New in iOS 11 you can find the Floating Action Button within the Notes App. If Apple uses them, you could definitely use them too.

FAB in iOS 11 Notes

  • 2
    Hi and welcome to UX.SE cornr! Unfortunately, this does not provide an answer to the question. To critique or request clarification from an author, leave a comment below their post - you can always comment on your own posts, and once you have sufficient reputation you will be able to comment on any post. – Benny Skogberg Oct 5 '17 at 12:29
  • 9
    Why is it not providing an answer to the question? If Apple uses FAB it is at least an Example for "you could use a FAB" – cornr Oct 6 '17 at 11:33
  • You’re not explaining why... – Benny Skogberg Oct 6 '17 at 12:21
  • Well I am grateful for it! – Lisa Tweedie Feb 19 '18 at 15:40
  • 2
    By the way, I for one dislike the new floating (+) button in iOS Notes app. It's always in my way. – jtheletter Feb 24 '18 at 19:09

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.