Hi everyone. I'm working on an onboarding flow for a new app and I'm struggling with how to deal with a Liquid Glass issue.
I have glass buttons with "next" and "back" chevron symbols that let the user go through the pages. When you get to the last page the "next" button is disabled.
Since the glass buttons are partially transparent they interact with the background colors. Depending on the colors of the background in use the button clearly looks disabled some times but other times it's barely dimmed and still would look active at a glance.
To deal with this I was just going to hide the next button on the last page by making the opacity zero. Back in the day VoiceOver would have still seen the disabled button, but now setting the opacity to zero also hides it from VoiceOver. Usually that's helpful but here it's not.
My real question is for a VoiceOver user would it be confusing to have the "next" button just disappear on the last page?
Comments
A Thought
If I understand your question correctly, which full disclosure I may not:
I definitely think there should be a clear way to dismiss the onboarding flow on that last page, be it a "next" or "done" button. Otherwise, there is no clear way to know how to get out of that screen or what to do next. I would guess that the VoiceOver Scrub gesture could probably dismiss it, but IMHO a button is better.
Done button
Oh yes, there's always going to be a done button present. The onboarding is basically a sheet that launches that you can swipe down to dismiss or hit the done button. This is several pages you can either swipe through or press the "next" and "back" chevron buttons to navigate. The big issue is the on the last page the "next" button sometimes visually still looks like it's active when it's not thanks to Liquid Glass.
Another idea I'm toying with is making the button barely visible when it's disabled instead of hiding it. That way VoiceOver would still make interactive.
In That Case
If there is a done button and it is the last screen in the onboarding flow, IMHO there isn't a need for a dedicated "next" button as the "done" button accomplishes the same thing.