← Back to team overview

ubuntu-phone team mailing list archive

Re: [Design] Page stack back gesture

 

Personally I have been thinking about how it would be to rework the right
edge swipe. If it first backed out to the topp level and then start
circulating apps, a bit like Androids back button. For me that's the most
natural behavior I think.
On Jun 14, 2013 10:41 PM, "Oren Horev" <oren.horev@xxxxxxxxxxxxx> wrote:

> Hi Guys,
>
> Thanks for the great ideas on this thread. The design team is
> following it intently.
> We are currently looking at the overall interactions available in the
> bottom region - Toolbar, OSK ,HUD. There are a lot edge cases and conflicts
> we we are planning to address.
> Discoverability of the toolbar and fast access the back button is on the
> list of issues.
> In the meantime please continue sharing with us your thoughts and ideas.
>
> Cheers,
> Oren
>
>
>
> On 14 June 2013 17:44, Michael Zanetti <michael.zanetti@xxxxxxxxxxxxx>wrote:
>
>> Hi,
>>
>> In case of a deep stack app, or where the toolbar is really an important
>> piece
>> of the UI and must be present, I guess the developer could always do this
>>
>> tools: ToolbarActions {
>>   opened: true
>>   locked: true
>>   ...
>> }
>>
>> Only caveat is that the toolbar can hide content and in this case the user
>> won't be able to reach it but that can be fixed by using appropriate
>> margins.
>>
>> After playing around with this a bit I start to like the combination...
>> Its
>> pretty cool how the toolbar pops in automatically in the deep page stack,
>> while it hides itself automatically on tabs where it's more of an optional
>> element.
>>
>> Way better than on my previous phones where the toolbar was either there
>> or
>> not, even if used just once per year.
>>
>> I agree that on deep page stacks pulling up the toolbar manually on each
>> step
>> is not really nice.
>>
>> Hope this helps,
>> Michael
>>
>> On Friday 14 June 2013 16:55:42 Alex Tyler wrote:
>> > I've read most of these mails, but not all so may have missed one or
>> two.
>> >
>> > There absolutely needs to be a better method of approach. There are
>> > applications made that will be 4-5 pages deep that the user will want
>> > to back out of. Swiping from the bottom and pressing back when 8 pages
>> > deep is not an acceptable solution.
>> >
>> > Swiping the page away (ala Blackberry 10/iOS7) would likely be fine
>> > and not interfere with the OS level swipes. I have created
>> > applications that utilize these two paradigms together, and don't
>> > recall confusing myself or my users (one of them being my significant
>> > other, and she's the perfect test case).
>> >
>> > If however, this solution is deemed unacceptable, I do have another:
>> >
>> > If the application is x amount of levels deep and the user has pressed
>> > back and reverted to a previous page that is still not the root, then
>> > the toolbar stays open until the user interacts with content or backs
>> > out enough to be on the root page. I'm not a massive fan of this
>> > approach, but it is an alternative.
>> >
>> > I can get a demo of this up either today or tomorrow, depending on time.
>> >
>> > Thanks,
>> > Alex
>> >
>> > On Fri, Jun 14, 2013 at 1:19 AM, Josh Leverette <coder543@xxxxxxxxx>
>> wrote:
>> > > I'm not going to comment on everything in your post, but watch the
>> first
>> > > 20
>> > > seconds of this video: http://www.youtube.com/watch?v=Dx2nMaBOHek
>> > >
>> > > Notice how the settings are not on a different level in the page
>> stack?
>> > > They're in a separate tab. The back button is not used here. This is
>> how
>> > > many of the apps are being designed, and this is why the back button
>> is
>> > > not
>> > > of supreme importance. I'm also very surprised that you consider the
>> iPad
>> > > to have been a mistake to give your dad. I know many grandparents who
>> > > love their iPads for the very reason that there is nothing they can do
>> > > wrong there, and settings virtually never need to be changed because
>> > > there are so few of them. It's far, far easier for the ones I know to
>> use
>> > > it than Windows. I'm not saying your statement about your dad is
>> > > incorrect, I just find it very interesting. Is he most comfortable
>> with
>> > > Windows then? I'm curious, but of course, this is a little off topic.
>> > >
>> > > On Thu, Jun 13, 2013 at 7:11 PM, Daniel Clem <clem11388@xxxxxxxxx>
>> wrote:
>> > >> First sorry if i misunderstand somethings as i'm not a dev, but wish
>> to
>> > >> give my feedback and opinions as best i can.
>> > >>
>> > >> I looked at the wiki just now, so now I understand the difference of
>> the
>> > >> intended flat UI vs page stack UI. So perhaps Ubuntu Touch apps will
>> be
>> > >> developed differently than Android apos. But the FTP I mentioned
>> about I
>> > >> was just saying about how to reveal the bottom menu. Like I have 4
>> > >> buttons on my Droid, menu, home, back, then search. And the menu was
>> > >> what I was referring to on FTP and games. I did watch the Evernote
>> video
>> > >> you shared. If an app can not scroll up or sideways (any app that is
>> > >> simple and small or is a game), then reveal menu on scroll wouldn't
>> work
>> > >> (in my opinion). And since almost every app would probably need a
>> menu
>> > >> of some kind then you need the revealing to always be the same.
>> Whereas
>> > >> the Evernote menu works differently than the rest of iOS creating
>> > >> inconsistency on the device.
>> > >>
>> > >> As for Back button perhaps I am not visualizing how apps will be
>> laid out
>> > >> in this Flat, Deep, and Page Stack style of UI's, so please excuse my
>> > >> assumptions coming from Android. But I don't think its a good idea to
>> > >> have
>> > >> the "Back” action only available in the menu tool bar on the bottom.
>> 2
>> > >> reasons being.
>> > >> -being hidden by default, it slows the UI flow because I go into
>> settings
>> > >> of some apps a lot to change things, try it, then go back change
>> again,
>> > >> try
>> > >> it again, ect over and over when playing with new apps. And having to
>> > >> reveal the hidden menu just to get to a back button seems really
>> > >> cumbersome and slow. The Back action (in my opinion) should be done
>> with
>> > >> a gesture. So backing out of settings or other places (SMS, Emails,
>> > >> Contacts Info, Music Library, ect ) is just as fact as pressing the
>> back
>> > >> button on my Droid.
>> > >>
>> > >> Backing out of iOS settings, menus and other things has always been
>> very
>> > >> unintuitive for me. My dad has a ipad (Present for him, big mistake
>> :-/ )
>> > >> and he always has trouble and asks me for help. So please don't take
>> iOS
>> > >> as
>> > >> a great example as its my least enjoyable OS.
>> > >>
>> > >> God Bless
>> > >>
>> > >> Clem
>> > >>
>> > >> Lou Greenwood <lougreenwood@xxxxxx> wrote:
>> > >>> Excuse me if I'm misunderstadning you, but an FTP app wouldn't
>> require a
>> > >>> back button as it isn't a page stack, same goes for (most) games,
>> they
>> > >>> use
>> > >>> custom UI's (think Angry Birds etc).
>> > >>>
>> > >>> http://design.ubuntu.com/apps/global-patterns/navigation
>> > >>>
>> > >>> From what I understand, Back is used in a very specific set of
>> > >>> circumstances, these are _only_ page stack views beyond the 1st
>> page. As
>> > >>> an
>> > >>> example, opening the settings app for the first time wouldn't have a
>> > >>> back
>> > >>> button, but navigating to 'settings > general > option 3 > bla'
>> would
>> > >>> require a back button for each layer of the hierarchy.
>> > >>>
>> > >>> To my eyes, the issue just isn't one of discoverability, or
>> familiarity,
>> > >>> but also one of adding un-necessary gestures, movements and actions
>> to
>> > >>> reveal a tool bar _every time_ a user needs to go navigate back. The
>> > >>> issue
>> > >>> is form over function in an attempt at creating a chromeless
>> fullscreen
>> > >>> layout. Hiding the back button in all instances only serves to add
>> > >>> complexity in an attempt to create a superficial minimalism.
>> > >>>
>> > >>> Don't get me wrong, I'm vocal about this because I think the OS is a
>> > >>> beautiful piece of design, not because I want to pick holes. I don't
>> > >>> think
>> > >>> that hiding a critical navigation device serves the purpose of the
>> > >>> vision -
>> > >>> "...give a
>> > >>> very natural feel to touch screen interactions and require minimal
>> > >>> effort
>> > >>> from the use."
>> > >>>
>> > >>> http://design.ubuntu.com/apps/get-started/design-vision
>> > >>>
>> > >>>
>> > >>> Again, take a look at this video example Evernote I uploaded, it's a
>> > >>> beautiful method for dealing with toolbars, but I suggest it _only_
>> in
>> > >>> the
>> > >>> areas in deep page stack views -
>> > >>> http://www.youtube.com/watch?v=HX1xelZhkEU
>> > >>>
>> > >>>
>> > >>> Warmest regards
>> > >>>
>> > >>> Lou
>> > >>>
>> > >>>
>> > >>>
>> > >>>
>> > >>> On 13 Jun 2013, at 22:33, Daniel Clem <clem11388@xxxxxxxxx> wrote:
>> > >>>
>> > >>> Non-dev comment:
>> > >>> Revealing controls on scroll up would work if you want it to be
>> same for
>> > >>> all apps, as not all apps scroll. Such as the FTP server app I use
>> for
>> > >>> my
>> > >>> Droid. Or video games that need a.menu for settings and saving
>> games,
>> > >>> but no scrolling at all.
>> > >>>
>> > >>> My personal opinion is this menu should hide by default but leave a
>> very
>> > >>> visible shadow over the bottom of the screen (ontop the app all the
>> > >>> time)
>> > >>> done in such a way to hint that something in hidden there.
>> > >>>
>> > >>> The whole system here is based on short and long swipes. If the user
>> > >>> doesn't know to short swipe up for the menu, then they most likely
>> don't
>> > >>> yet know any of the other swipe actions either. A tutorial to teach
>> the
>> > >>> first user is all that is needed, then that user would teach their
>> > >>> friends/family that use it. That.is the only ways ANYone learns
>> > >>> Android, WebOS or any new system.
>> > >>>
>> > >>> Sidenote on back button actions. Short swipe up shows the menu, what
>> > >>> does
>> > >>> a long swipe up do? Could a long swipe up be use for "Back” action?
>> I
>> > >>> use
>> > >>> the back button ALLLLL the time in every app, including the apps
>> someone
>> > >>> else mentioned weren't common for back actions. As a user I bounce
>> from
>> > >>> one
>> > >>> part of an app to another using "back” because few if any apps are
>> > >>> designed
>> > >>> in such a way that any feature or area can quickly be reached by any
>> > >>> other
>> > >>> part. So backing out to a common are is what's needed most the time
>> even
>> > >>> if
>> > >>> its only one level deep.
>> > >>>
>> > >>> What do you all think?
>> > >>> Thank you and God Bless,
>> > >>> Clem
>> > >>>
>> > >>> Lou Greenwood <lougreenwood@xxxxxx> wrote:
>> > >>>> My personal opinion is that it's possible to find a solution which
>> > >>>> works
>> > >>>> for all situations, rather than creating fragmentation in the UI by
>> > >>>> letting
>> > >>>> individual dev's make too many choices.
>> > >>>>
>> > >>>> 1. Use the developer’s toolkit
>> > >>>>
>> > >>>>
>> > >>>> Here is our handy developer’s toolkit which contains all the
>> essential
>> > >>>> building blocks to
>> > >>>>
>> > >>>> help you get started! We use our building blocks to keep our apps
>> > >>>> consistent, and so we
>> > >>>>
>> > >>>> don’t carry other platform’s UI elements or behaviours.
>> > >>>>
>> > >>>>
>> > >>>> /\ http://design.ubuntu.com/apps/get-started/make-it-ubuntu
>> > >>>>
>> > >>>>
>> > >>>> I've just uploaded a short clip of the Evernote app on iOS, the
>> way it
>> > >>>> handles the toolbar is beautifully intuitive and invisible.
>> > >>>>
>> > >>>> http://www.youtube.com/watch?v=HX1xelZhkEU
>> > >>>>
>> > >>>>
>> > >>>> Something like this Evernote example (default visible, hides on
>> > >>>> scroll/interaction, reveals on scroll up), which is  _only_
>> implemented
>> > >>>> on
>> > >>>> deep page stack pages would be my suggestion. As far as I can see
>> from
>> > >>>> the
>> > >>>> design spec, no other page types have this 'back' problem. See this
>> > >>>> link for the various page types >
>> > >>>> http://design.ubuntu.com/apps/global-patterns/navigation.
>> > >>>>
>> > >>>> Lou
>> > >>>>
>> > >>>>
>> > >>>>
>> > >>>>
>> > >>>>
>> > >>>>
>> > >>>>
>> > >>>>
>> > >>>> On 13 Jun 2013, at 18:18, Omar B. <estelar57@xxxxxxxxxxx> wrote:
>> > >>>>
>> > >>>> Some apps don't have a problem with users going "back". For
>> example the
>> > >>>> *Friends* app shows both its Breadcrumbs and the bottom toolbar by
>> > >>>> default:
>> > >>>>
>> > >>>> http://youtu.be/Q566IGyVB0o?t=8m36s
>> > >>>>
>> > >>>> Apps should probably decide if they want to show these toolbars by
>> > >>>> default (or when one goes deeper in the stack like others
>> mentioned) if
>> > >>>> its
>> > >>>> better for their users (and allow users to hide them if they want
>> more
>> > >>>> screen). I think this approach might be better than trying a "one
>> fits
>> > >>>> all".
>> > >>>>
>> > >>>> Regards.
>> > >>>>
>> > >>>> > Date: Thu, 13 Jun 2013 17:02:58 +0100
>> > >>>> > From: mpt@xxxxxxxxxxxxx
>> > >>>> > To: ubuntu-phone@xxxxxxxxxxxxxxxxxxx
>> > >>>> > Subject: Re: [Ubuntu-phone] [Design] Page stack back gesture
>> > >>>> >
>> > >>>> > -----BEGIN PGP SIGNED MESSAGE-----
>> > >>>> > Hash: SHA1
>> > >>>> >
>> > >>>> > Scott May wrote on 12/06/13 12:33:
>> > >>>> > > Yeah I'm a "me too" on the concern that the "back" button is
>> too
>> > >>>> > > hidden given it's frequent use. Perhaps we won't need "back" so
>> > >>>> > > much in this new environment?
>> > >>>> >
>> > >>>> > The System Settings design uses deep page stacks -- for example,
>> five
>> > >>>> > levels deep when setting a background picture.
>> > >>>> > <https://wiki.ubuntu.com/Appearance#Phone>
>> > >>>> >
>> > >>>> > Discoverability of "Back" is my biggest concern with System
>> Settings
>> > >>>> > right now. In a couple of cases I've specified that the toolbar
>> > >>>> > should
>> > >>>> > be visible all the time: for example, the screen for choosing an
>> area
>> > >>>> > of the background picture. But that's only because the toolbar
>> > >>>> > contains other buttons on those particular screens.
>> > >>>> >
>> > >>>> > > In any case, with gestures we need to be very mindful of how
>> apps
>> > >>>> > > are going to operate. We don't want to offer a gesture that
>> might
>> > >>>> > > look anything like something you might do in reasonable use of
>> some
>> > >>>> > > app that doesn't exist on this platform yet. Think about about
>> > >>>> > > what you do on the screen when say, using a map, drawing a
>> picture,
>> > >>>> > > moving a piece in a game etc, etc. I think gestures coming in
>> from
>> > >>>> > > the edge are fairly safe, but the main screen area is for the
>> > >>>> > > app...
>> > >>>> > >
>> > >>>> > > ...
>> > >>>> >
>> > >>>> > A gesture might be more efficient than revealing the toolbar then
>> > >>>> > tapping Back. But I doubt it would be more discoverable.
>> > >>>> >
>> > >>>> > - --
>> > >>>> > mpt
>> > >>>> >
>> > >>>> > -----BEGIN PGP SIGNATURE-----
>> > >>>> > Version: GnuPG v1.4.12 (GNU/Linux)
>> > >>>> > Comment: Using GnuPG with undefined - http://www.enigmail.net/
>> > >>>> >
>> > >>>> > iEYEARECAAYFAlG57TEACgkQ6PUxNfU6ecoGzwCgo4vTTmdYlcLHYGnl0LQz71HC
>> > >>>> > eckAoI1i56T817vHSEfYS/WGBaHTkfV5
>> > >>>> > =s1ad
>> > >>>> > -----END PGP SIGNATURE-----
>> > >>>> >
>> > >>>> > --
>> > >>>> > Mailing list: https://launchpad.net/~ubuntu-phone
>> > >>>> > Post to : ubuntu-phone@xxxxxxxxxxxxxxxxxxx
>> > >>>> > Unsubscribe : https://launchpad.net/~ubuntu-phone
>> > >>>> > More help : https://help.launchpad.net/ListHelp
>> > >>>>
>> > >>>> --
>> > >>>> Mailing list: https://launchpad.net/~ubuntu-phone
>> > >>>> Post to     : ubuntu-phone@xxxxxxxxxxxxxxxxxxx
>> > >>>> Unsubscribe : https://launchpad.net/~ubuntu-phone
>> > >>>> More help   : https://help.launchpad.net/ListHelp
>> > >>>>
>> > >>>>
>> > >>>>
>> > >>>> --
>> > >>>> Mailing list: https://launchpad.net/~ubuntu-phone
>> > >>>>
>> > >>>>
>> > >>>> Post to     : ubuntu-phone@xxxxxxxxxxxxxxxxxxx
>> > >>>> Unsubscribe : https://launchpad.net/~ubuntu-phone
>> > >>>>
>> > >>>>
>> > >>>> More help   : https://help.launchpad.net/ListHelp
>> > >>>
>> > >>> --
>> > >>>
>> > >>>
>> > >>> Mailing list: https://launchpad.net/~ubuntu-phone
>> > >>> Post to     : ubuntu-phone@xxxxxxxxxxxxxxxxxxx
>> > >>>
>> > >>>
>> > >>> Unsubscribe : https://launchpad.net/~ubuntu-phone
>> > >>> More help   : https://help.launchpad.net/ListHelp
>> > >>
>> > >> --
>> > >> Mailing list: https://launchpad.net/~ubuntu-phone
>> > >> Post to     : ubuntu-phone@xxxxxxxxxxxxxxxxxxx
>> > >> Unsubscribe : https://launchpad.net/~ubuntu-phone
>> > >> More help   : https://help.launchpad.net/ListHelp
>> > >
>> > > --
>> > > Sincerely,
>> > >
>> > >     Josh
>> > >
>> > > --
>> > > Mailing list: https://launchpad.net/~ubuntu-phone
>> > > Post to     : ubuntu-phone@xxxxxxxxxxxxxxxxxxx
>> > > Unsubscribe : https://launchpad.net/~ubuntu-phone
>> > > More help   : https://help.launchpad.net/ListHelp
>>
>> --
>> Mailing list: https://launchpad.net/~ubuntu-phone
>> Post to     : ubuntu-phone@xxxxxxxxxxxxxxxxxxx
>> Unsubscribe : https://launchpad.net/~ubuntu-phone
>> More help   : https://help.launchpad.net/ListHelp
>>
>
>
>
> --
> --
> Oren Horev
> Lead User Experience Designer
>
> Canonical Design Team
> +44 (0) 77 3430 8009
> oren.horev@xxxxxxxxxxxxx
> http://www.ubuntu.com/
>
> --
> Mailing list: https://launchpad.net/~ubuntu-phone
> Post to     : ubuntu-phone@xxxxxxxxxxxxxxxxxxx
> Unsubscribe : https://launchpad.net/~ubuntu-phone
> More help   : https://help.launchpad.net/ListHelp
>
>

Follow ups

References