<div dir="ltr"><div dir="ltr"><div class="gmail_default" style="font-size:small">Hi Tobias,</div><div class="gmail_default" style="font-size:small"><br></div><div class="gmail_default" style="font-size:small">I somehow missed that navigation gestures scheme. I would like to suggest also a forward swipe for accepting a dialog action, similar to swiping back. Its very well used on Sailfish and would fit with the other used gestures, as far as I can see.</div><div class="gmail_default" style="font-size:small"><br></div><div class="gmail_default" style="font-size:small">I agree with targeting main interaction pattern first and not worrying too much about very fine details when matching the platform. Thank you for the links, will look into it. But first, I'll focus on other aspects of interaction with the user.</div><div class="gmail_default" style="font-size:small"><br></div><div class="gmail_default" style="font-size:small">Cheers,</div><div class="gmail_default" style="font-size:small"><br></div><div class="gmail_default" style="font-size:small">Rinigus </div></div></div><br><div class="gmail_quote"><div dir="ltr">On Tue, Nov 20, 2018 at 2:29 AM Tobias Bernard <<a href="mailto:tobias.bernard@puri.sm">tobias.bernard@puri.sm</a>> wrote:<br></div><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">
  
    
  
  <div text="#000000" bgcolor="#FFFFFF">
    <p>Hi Rinigus,<br>
    </p>
    <p>We do want a swipe gesture for going back in pages stacks in
      addition to the button in the top left, it just hasn't been
      implemented on the GTK side yet. For a bit more detail see
<a class="m_7838537654899593198moz-txt-link-freetext" href="https://gitlab.gnome.org/Teams/Design/os-mockups/blob/master/mobile-shell/mobile-shell-gestures.png" target="_blank">https://gitlab.gnome.org/Teams/Design/os-mockups/blob/master/mobile-shell/mobile-shell-gestures.png</a></p>
    <p>As for general design guidance (patterns, visuals, spacing,
      typography, etc.), have a look at the GNOME HIG
      <a class="m_7838537654899593198moz-txt-link-freetext" href="https://developer.gnome.org/hig/stable/" target="_blank">https://developer.gnome.org/hig/stable/</a><br>
    </p>
    <p>In GTK you get a lot of this for free, probably similar to the
      Sailfish style classes you mention, but of course it's more work
      if you use a different toolkit. That said, I would not worry too
      much about making your app look exactly like a GNOME app at this
      point. If it works well and behaves in ways that are expected to
      someone who is used to GNOME patterns, it's not that important
      that the spacing or typography is a little bit different in some
      places.</p>
    <p>As for your concerns:</p>
    <p>- We have discussed patterns for hiding the top bar in certain
      situation, eg. when scrolling in a browser or in video players.
      IIRC it hasn't been done yet because it would require a lot of
      work in GTK to make it easily doable for app developers.<br>
    </p>
    <p>- Agreed, which is why we want a back gesture, it's just not
      implemented yet :)<br>
    </p>
    <p>Cheers,<br>
      Tobias<br>
    </p>
    <br>
    <div class="m_7838537654899593198moz-cite-prefix">On 11/16/2018 01:26 PM, rinigus via
      Librem-5-dev wrote:<br>
    </div>
    <blockquote type="cite">
      
      <div dir="ltr">
        <div dir="ltr">
          <div dir="ltr">
            <div dir="ltr">
              <div dir="ltr">
                <div dir="ltr">
                  <div dir="ltr">
                    <div dir="ltr">
                      <div class="gmail_default" style="font-size:small">Hi,</div>
                      <div class="gmail_default" style="font-size:small"><br>
                      </div>
                      <div class="gmail_default" style="font-size:small">I
                        would like to ask about main application design
                        principles that are envisioned for L5. In
                        particular, applications that are not using
                        Gtk/Gnome libs and if they wish to follow the
                        same or similar user interaction as the targeted
                        platform. My questions and understanding of
                        current design are based on </div>
                      <div class="gmail_default" style="font-size:small"><br>
                      </div>
                      <div class="gmail_default" style="font-size:small">* <a href="https://gitlab.gnome.org/Teams/Design/os-mockups/blob/master/app-menu/patterns.png" target="_blank">https://gitlab.gnome.org/Teams/Design/os-mockups/blob/master/app-menu/patterns.png</a></div>
                      <div class="gmail_default" style="font-size:small">* <a href="https://developer.puri.sm/Apps/GNOME/Gtk+.html" target="_blank">https://developer.puri.sm/Apps/GNOME/Gtk+.html</a></div>
                      <div class="gmail_default" style="font-size:small">* <a href="https://developer.puri.sm/Apps/Constraints.html" target="_blank">https://developer.puri.sm/Apps/Constraints.html</a></div>
                      <div class="gmail_default" style="font-size:small">* <a href="https://developer.puri.sm/Design/Design_guidelines/Touch.html" target="_blank">https://developer.puri.sm/Design/Design_guidelines/Touch.html</a></div>
                      <div class="gmail_default" style="font-size:small"><br>
                      </div>
                      <div class="gmail_default" style="font-size:small">It
                        looks to me that the current guidelines imply:</div>
                      <div class="gmail_default" style="font-size:small"><br>
                      </div>
                      <div class="gmail_default" style="font-size:small">[1]
                        user will be able to swipe up from the bottom to
                        get main menu with all applications</div>
                      <div class="gmail_default" style="font-size:small">[2]
                        application has some kind of a top bar with its
                        name and menu symbols</div>
                      <div class="gmail_default" style="font-size:small">[3]
                        to get back from the application sub-page, there
                        is an arrow that can be clicked on the left top</div>
                      <div class="gmail_default" style="font-size:small"><br>
                      </div>
                      <div class="gmail_default" style="font-size:small">There
                        are no indications regarding swipes as a part of
                        interaction within applications. Namely, is it
                        envisioned that we can make "page stacks" and,
                        instead of reaching top left corner to go back,
                        can swipe the page out of the stack? </div>
                      <div class="gmail_default" style="font-size:small"><br>
                      </div>
                      <div class="gmail_default" style="font-size:small">As
                        an application developer, I am looking for some
                        kind of guidelines or will be happy to help
                        through the discussion and other means in
                        formulating them. While not fully open-source, I
                        would suggest to look into design guidelines of
                        SailfishOS, which are quite clearly (for me)
                        defined at <a href="https://sailfishos.org/design/navigation/" target="_blank">https://sailfishos.org/design/navigation/</a>
                        . In addition, on SFOS, we have rather extensive
                        specification of used theme colors, distances
                        between labels, font sizes, and such. For that,
                        we use a dedicated QML class <a href="https://sailfishos.org/develop/docs/silica/qml-sailfishsilica-sailfish-silica-theme.html" target="_blank">https://sailfishos.org/develop/docs/silica/qml-sailfishsilica-sailfish-silica-theme.html</a>
                        . Would be great to get some kind of similar
                        resource that can be queued for application
                        design.</div>
                      <div class="gmail_default" style="font-size:small"><br>
                      </div>
                      <div class="gmail_default" style="font-size:small">(Assuming
                        that I understand the principles correctly) As
                        for implied design principles [2] and [3], I
                        have few concerns</div>
                      <div class="gmail_default" style="font-size:small"><br>
                      </div>
                      <div class="gmail_default" style="font-size:small">*
                        having a top bar with application name is a
                        large waste of space, at least for some of the
                        applications. For example, web browser would not
                        need it and its probably the best to have as
                        much screen for reading as possible. For maps,
                        same applies - the content speaks for itself in
                        many cases.</div>
                      <div class="gmail_default" style="font-size:small"><br>
                      </div>
                      <div class="gmail_default" style="font-size:small">*
                        having an arrow on top left as an only way to
                        move back from the sub-page back, contradicts
                        easily reachable thumb range (<a href="https://developer.puri.sm/_images/p2f1.png" target="_blank">https://developer.puri.sm/_images/p2f1.png</a>)</div>
                      <div class="gmail_default" style="font-size:small"><br>
                      </div>
                      <div class="gmail_default" style="font-size:small">Best
                        wishes,</div>
                      <div class="gmail_default" style="font-size:small"><br>
                      </div>
                      <div class="gmail_default" style="font-size:small">Rinigus</div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <br>
      <fieldset class="m_7838537654899593198mimeAttachmentHeader"></fieldset>
      <br>
      <pre>_______________________________________________
Librem-5-dev mailing list
<a class="m_7838537654899593198moz-txt-link-abbreviated" href="mailto:Librem-5-dev@lists.community.puri.sm" target="_blank">Librem-5-dev@lists.community.puri.sm</a>
<a class="m_7838537654899593198moz-txt-link-freetext" href="https://lists.community.puri.sm/listinfo/librem-5-dev" target="_blank">https://lists.community.puri.sm/listinfo/librem-5-dev</a>
</pre>
    </blockquote>
    <br>
  </div>

</blockquote></div>