Symbian3/SDK/Source/GUID-F3CB6985-A9AA-4E01-B157-5AB8DDC7951B.dita
author Dominic Pinkman <dominic.pinkman@nokia.com>
Tue, 20 Jul 2010 12:00:49 +0100
changeset 13 48780e181b38
parent 7 51a74ef9ed63
permissions -rw-r--r--
Week 28 contribution of SDK documentation content. See release notes for details. Fixes bugs Bug 1897 and Bug 1522.

<?xml version="1.0" encoding="utf-8"?>
<!-- Copyright (c) 2007-2010 Nokia Corporation and/or its subsidiary(-ies) All rights reserved. -->
<!-- This component and the accompanying materials are made available under the terms of the License 
"Eclipse Public License v1.0" which accompanies this distribution, 
and is available at the URL "http://www.eclipse.org/legal/epl-v10.html". -->
<!-- Initial Contributors:
    Nokia Corporation - initial contribution.
Contributors: 
-->
<!DOCTYPE concept
  PUBLIC "-//OASIS//DTD DITA Concept//EN" "concept.dtd">
<concept id="GUID-F3CB6985-A9AA-4E01-B157-5AB8DDC7951B" xml:lang="en"><title>Finger
usable UI</title><prolog><metadata><keywords/></metadata></prolog><conbody>
<p>This document describes stylus as the input method with touch UI, but events
apply to finger use also. However, in some cases the components may not be
finger optimized due to the size of objects, for example, virtual keyboard
or text field.</p>
<p>In Symbian, UI style defines the target minimum sizes for a UI element
considered as finger usable:</p>
<ul>
<li><p>7 x 7 mm with 1 mm gaps for index finger usage </p></li>
<li><p>8 x 8 mm with 2 mm gaps for thumb usage </p></li>
<li><p>List type of components should have minimum of 5 mm line spacing</p></li>
</ul>
<p>Targets are general as in practice sizes can be use case dependent, for
example, due to frequency of use, efficiency vs. error criticality or ease
of error correction, location of the button (edge of screen vs. center).</p>
<p>The visible area of the component and the component's active area should
be identical. There are exception cases to this rule though:</p>
<ul>
<li><p>When components are located near the edge of the display, the touchable
area should extend fully to the edge of the display (beyond the
components visible graphics). </p></li>
<li><p>Visible area is smaller than the active area in order to keep the balance
in look and feel of the UI. For example, scrollbar has wider touch area than
visible area. </p></li>
<li><p>Active area is smaller than the visible area in order to avoid unwanted
presses to contiguous active areas. In this case, there it should be graphically
indicated where the user should tap. Example: fixed toolbar buttons in landscape
layout.</p></li>
</ul>
</conbody></concept>