[gnome-devel-docs/wip/aday/gnome-devel-docs-add-adaptive: 1/2] Add adaptive design page



commit 3c77b5672ab29cb278b4e4401f8b1c344b057229
Author: Tobias Bernard <tbernard gnome org>
Date:   Fri Jan 11 18:11:01 2019 +0100

    Add adaptive design page
    
    - revamp the display compatibility page and broaden it to cover the
    basics of adaptive design
    - add a minimum target size to the pointer & touch page

 hig/C/adaptive-design.page         | 48 ++++++++++++++++++++++++++++++++++++++
 hig/C/index.page                   |  2 +-
 hig/C/pointer-and-touch-input.page |  4 +++-
 3 files changed, 52 insertions(+), 2 deletions(-)
---
diff --git a/hig/C/adaptive-design.page b/hig/C/adaptive-design.page
new file mode 100644
index 00000000..52ba1c4a
--- /dev/null
+++ b/hig/C/adaptive-design.page
@@ -0,0 +1,48 @@
+<page xmlns="http://projectmallard.org/1.0/";
+      type="topic"
+      id="adaptive-design">
+
+  <info>
+    <credit type="author">
+      <name>Allan Day</name>
+      <email>aday gnome org</email>
+    </credit>
+    <include href="legal.xml" xmlns="http://www.w3.org/2001/XInclude"/>
+    <desc></desc>
+  </info>
+
+<title>Adaptive Design</title>
+
+<p>GNOME 3 supports a variety of device types, including desktops, laptops, and phones. This requires that 
applications be compatible with displays that have different sizes and orientations, different input methods, 
and other external constraints. Adaptive design is our approach to supporting all these scenarios this in a 
seamless way.</p>
+
+<p>Adaptive design means that applications dynamically adapt to the environment they run in. There are no 
separate modes, and the functionality does not change, but individual parts of the interface change to make 
the application usable in different contexts. This allows applications to support a wide range of form 
factors and constraints with relatively little effort.</p>
+
+<p>The size requirements stated on this page should be doubled for high-resolution displays (those with 
greater than 96 PPI).</p>
+
+<section id="display-compatibility">
+<title>Display compatibility</title>
+
+<list>
+<item><p>It should be possible for all application windows to fit on the smallest recommended displays for 
GNOME 3 desktops. Currently, this is 1024×600 pixels.</p></item>
+<item><p>For desktop screens in portait mode, the minimum recommended width for portrait mode is 768 
pixels.</p></item>
+<item><p>Applications intended to support phone form factors should fit onto 360×600 pixels for portrait, 
and 720×290 pixels for landscape.</p></item>
+<item><p>If an application requires keyboard input on touch devices, it should be prepared to be vertically 
resized when the on-screen keyboard is opened.</p></item>
+<item><p>All primary windows should be resizable. This ensures that transitions between landscape and 
portrait mode can be automatically handled by the window manager.</p></item>
+<item><p>Test to make sure that your interface works well on large displays. Where possible, scale content 
to make the best use of available space, or use fixed width layouts to ensure that interface elements 
maintain effective grouping and alignment.</p></item>
+</list>
+
+</section>
+
+
+<section id="input-devices">
+<title>Input devices</title>
+
+<list>
+<item><p>In general, features that depend on a specific type of input device should be hidden in the UI when 
the input device is not present.</p></item>
+<item><p>Most applications should assume that they will be used on devices with and without keyboard or 
mouse.</p></item>
+<item><p>Since displays of any size can be touch-enabled, click target sizes should always be large enough 
to be usable on touch.</p></item>
+</list>
+
+</section>
+
+</page>
\ No newline at end of file
diff --git a/hig/C/index.page b/hig/C/index.page
index 6f83252f..5c051357 100644
--- a/hig/C/index.page
+++ b/hig/C/index.page
@@ -79,7 +79,7 @@
 <td><p>Keyboard navigation, access and shortcut keys.</p></td>
 </tr>
 <tr>
-<td><p><link xref="display-compatibility"><em style="strong">Display compatibility</em></link></p></td>
+<td><p><link xref="adaptive-design"><em style="strong">Adaptive design</em></link></p></td>
 <td><p>How to support different device and display types.</p></td>
 </tr>
 </table>
diff --git a/hig/C/pointer-and-touch-input.page b/hig/C/pointer-and-touch-input.page
index 4b3e4c33..7394af97 100644
--- a/hig/C/pointer-and-touch-input.page
+++ b/hig/C/pointer-and-touch-input.page
@@ -105,7 +105,9 @@
 <section id="touch-input">
 <title>Touch input</title>
 
-<p>Touch screens are also an increasingly common part of modern computer hardware, and applications created 
with GTK+ are likely to be used with hardware that incorporates a touch screen. To make the most of this 
hardware, and to conform to users’ expectations, it is therefore important to consider touch input as a part 
of application design.</p>
+<p>Touch screens are a common part of modern computer hardware, and applications created with GTK+ are 
likely to be used with hardware that incorporates a touch screen. To make the most of this hardware, and to 
conform to users’ expectations, it is therefore important to consider touch input as a part of application 
design.</p>
+
+<p>One important aspect of this is ensuring that the touch target sizes of UI elements are big enough to be 
usable by most people. The minimum recommended target size is 9 millimeters. This translates to about 34 
pixels on regular DPI screens.</p>
 
 <section id="application-touch-conventions">
 <title>Application touch conventions</title>


[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]