Pattern hunt: Full-width mobile buttons
I recently found myself on a hunt for a screen pattern I know I had seen before but couldn’t think of off the top of my head: full-width buttons that go acrossthe bottom of a screen on mobile. It sounds super specific, but I was working with my team on some pattern validation exercises and we wanted to make sure we weren’t going down a path that would cause unnecessary confusion for our users.
I decided to compile the examples I found into a post to share with both my team and with anyone else who might be looking for similar patterns. And — here’s the part where I keep myself honest but declaring it publicly — I’m going to try to share patterns at least once a month in an attempt to write/create/share more.
I’ve split the examples up into three categories: Dual actions (one span with two separate buttons), single actions and flow progressions (this emerged as a very common theme; using full-width buttons to move the user to the next screen in a flow, typically within an onboarding exercise).
Category1 : Dual actions
Category 2: Single Actions
Category 3: Flow Progressions
Do you have any suggestions for future patterns you’d like to see? Share your ideas with me on Twitter @hollymariegibbs