Design Article
Using capacitive sensor user interfaces in next generation mobile and embedded consumer devices
Mariel Van Tatenhove and Andrew Hsu, Synaptics, Inc.
12/5/2006 12:30 AM EST
A few years ago, these same systems were simple, well-defined, and required simple input devices such as keypads, buttons, or touch screens for handwriting and selection. However, today, cell phones are packed with sophisticated communications subsystems, while PDAs have evolved into full-fledged computers with Internet connectivity. Plus, there are newer mobile and portable products on the drawing board facing UI challenges as a result of their highly advanced, multi-functional designs.
As a result, designers are migrating toward the extra UI space resistive touch screens (RTS) offer. This particular sensor is a widely available commodity technology. However, even with the extra space RTS provide, embedded designers face new issues stemming from RTS limitations.
A resistive touch panel is a mechanical sensor with two layers of material, typically separated by air (Figure 1, below). The top layer is a thin, clear polyester film and the lower layer, glass. Pressing the top layer with your finger pushes the top layer and touches the lower layer. Voltage at the contact point is measured, and location is computed. After removing your finger, the top layer resumes its original configuration.
![]() |
| Fig. 1. A resistive touch panel is a mechanical sensor with two layers of material, typically separated by air. |
The two main challenges embedded designers face with RTS are: (1) optics of the underlying display are severely impaired and (2) poor durability. Devices using RTS often fail in the field when they're dropped or the user presses the screen too hard.
Once the RTS panel breaks, the device's main hardware input is eliminated, rendering the device useless. The designer is also offered limited options. For example, RTS require a top bezel to protect the edges of the screen. Cost of creating a bezel opening and the bezel, itself, can double the cost of assembly. Moreover, RTS must be mounted on a flat surface and not beneath plastics.
Further, RTS have poor electrostatic discharge (ESD) resistance. They are prone to condensing humidity damage, while temperature and humidity fluctuations can severely alter performance. RTS also expose fragile LCDs to greater risk. As for limited performance, RTS require a stylus for accuracy; they are inaccurate at the edges where most scrollbars and icons are located; and they require user calibration on a regular basis.
Rubbing Out RTS Limitations
A more efficient and reliable alternative is the use of a thin,
transparent, capacitive
sensor touch screen that embedded designers can place over any
viewable surface for input and navigation. One implementation of this
kind of capacitive sensor interface, called
ClearPad, offers designers a solution to overcome RTS limitations.
The capacitive sensor module consists of a clear, thin transparent finger sensing region bonded to a flex circuit tail which contains all of the sensing electronics. As shown in Figure 2, below, a finger on top of a grid of conductive traces changes the capacitance of the nearest traces.
This change in trace capacitance is measured and finger position computed. No pressure is needed to activate the capacitive sensor. A gentle stroke or glide along the surface of a capacitive pad is all that's required.
![]() |
| Figure 2. A capacitive sensor panel is solid state. A finger on top of a grid of conductive traces changes the capacitance of the nearest traces. Trace capacitance change is measured and the finger position is computed. |
Specifically, the capacitive sensor's surface receives touch information from contact with the user and sends this information to the controller board. The controller board processes touch signals and conveys the information to the host. The host then uses finger position and contact information for a wide variety of user interface features such as entering characters, data, and scrolling.
In this UI technology, capacitive sensing is combined with a transparent trace matrix (Figure 3, below). The same materials used in RTS are used in the capacitive sensor interface approach, specifically indium tin oxide (ITO) on polyethylene terephthalate (PET).
However, the capacitive sensor does not possess RTS's optical and durability issues because it is a single laminate with no air gaps to degrade optics and is solid state with no moving parts, thus contributing to its high reliability and durability. Resistive screens, on the other hand, are physical switches that must flex and require rub in use, decreasing their useful lifetime.
![]() |
| Figure 3. Capacitive sensing is combined with a transparent trace matrix. The same materials used in resistive screens are used in the capacitive sensor panel, indium tin oxide (ITO) on polyethylene terephthalate (PET). |
Also, embedded designers are not limited to pliable surface materials because capacitance is sensed through most non-conductive materials. Capacitive sensing operates even when the sensor is placed beneath a durable surface like polycarbonate or acrylic. In cases like these, the capacitive sensor has the environmental durability of its rigid overlay, which permits it to function in environments where other technologies fail.
Mechanical simplicity is another major reason for the improved reliability and optics. In the capacitive sensor module, each layer is optically matched to one another and laminated together. This eliminates any air gaps and internal reflections they cause. Light absorption is also minimized due to the very thin conductive layers used.
Since it is a solid-state sensor with no moving parts, optical quality remains consistent during sensor usage. In contrast, the resistive touch panel requires an air gap and spacer dots, both of which cause internal reflections and scatter light. Furthermore, steps must be taken to minimize optical distortion (such as Newton rings) when the top surface deforms during resistive touch panel operation.
Unlike RTS, capacitive sensors don't require critical spacing between sensor layers. Flexing or deforming a resistive sensor can affect spacing between layers. However, capacitive sensors can sense through curved surfaces without functionality loss. As a result of these major differences, designers can use capacitive sensors to add cost-effective and simple touch sensing in applications RTS cannot be used effectively.
Applications Custom Fit
Embedded designers working on such applications as mobile, portable
digital entertainment devices, remote controls, and digital cameras can
specify size and shape customization of the capacitive sensor and
supporting electronics module to meet their specific application
requirements. The assembly includes the sensor, controller board with
proprietary IC, and firmware.
Designs based on the capacitive sensor present superior optics and finger sensing capabilities to end users. Text and graphics displayed on and the underlying screen are crisp and clear, thanks to the sensor's matched optics that reduce internal reflections.
![]() |
| Figure 4. The capacitive sensor module comprises four regions, active and viewing areas, opaque PET inactive borders on three sides, and tail region housing the capacitive sensing electronics. |
Figure 4, above, shows the capacitive sensor module composed of four regions. A capacitive sensor panel designed for a four-inch diagonal TFT display, for example, has an active area of up to 60 x 80 mm with 0.68 mm sensor thickness (this includes a 0.075 mm adhesive for laminating to the lens or casing). The active area is the sensor's transparent region reporting presence and location of a user's finger.
The viewing area, also in the sensor's transparent region, is outside the active area and does not detect the user's finger. The opaque PET inactive, non-sensing borders on three sides of the sensor's viewing area allow for low resistance trace routing. These borders are designed to be shielded both electrically and optically from the user. Lastly, the L-shaped or tail region connects to the sensor and houses the capacitive sensing electronics.
Since the sensor's finger sensing region is transparent, it can ideally be used with contextual GUIs that change dynamically depending on the device's mode or application. Button arrays, sliders, soft-menus, cursor control and character recognition are possible. These interfaces deliver to embedded designers a remarkably high number of design possibilities. The UI no longer needs to be fixed in hardware, but can now be entirely constructed in software to match the specific requirements for a given task or application.
Ushering In New Design
Considerations
Capacitive sensor technology ushers in a vast number of newer and more
enriching design considerations than what embedded designers have
become accustomed to with RTS. In this instance, creating an intuitive
user interface involves more than optimizing the design of the
capacitive sensor, itself. In particular, designers must pay special
attention to making accommodations in the device UI for input
inaccuracies introduced by the user.
Since a capacitive sensor is optimized for finger usage, the UI designer must consider that typical users will not be able to reliably position and control their finger with great accuracy. Although designing for finger usage appears to be a limitation, such a constraint actually results in a more intuitive and simpler UI. Such an UI is more suitable for mass market devices and users who may not be as technology-savvy or lack the time for substantial device training.
There are other ways to optimize the user's interaction with this sensor. They fall into two categories. One is static design, which includes control discoverability, layout, and tactile definition. The other is dynamic control processing which includes button activation methods, hysteresis in gestures, and consistency in UI processing.
Control discoverability is an obvious, but commonly overlooked
design issue. The ClearPad sensor, for example, like other touch screen
interfaces, enables an embedded designer to implement the device's
controls completely in software. In such user interfaces, the display
shows objects that correspond to some device action when a user touches
a particular object.
However not all objects on the screen may be actionable.
Accordingly, perhaps the most important interaction rule for control
layout is to make the actionable objects or UI elements discoverable
and distinguish them from other on-screen graphics that are not meant
to be touched.
Although this interaction rule appears quite obvious, consider how
ambiguous most existing graphical user interfaces are in displaying UI
elements vs. non-actionable objects. It is no surprise that children
and other GUI novices often experience difficulties with touch screen
UIs simply based on this issue.
Another important interaction rule for control layout design is proper spacing and sizing of the UI elements. Although screen real estate is at a premium for most handheld devices, small control elements packed too closely will frustrate users.
It is important to determine the range of typical finger sizes of the device's target users. Buttons and UI elements smaller than the smallest anticipated finger contact area (typically 8-14 mm in diameter for an American adult index finger) will cause usability problems and should be avoided.
Furthermore, it is important to ensure that enough space is provided between UI elements. Ideally, control elements should have a pitch (the spacing between the centers of UI elements) of at least a finger width.
One aspect of UI element design often overlooked is that the drawn element size does not need to match its activation size. For buttons, this implies that the graphic for a button does not need to correspond to its activation region.
For example, in designs where it is necessary for aesthetic/ID reasons to draw large buttons with tight spacing, it is recommended that each button be made to activate only within the central area of the drawn button.
This increases the effective spacing of the button array and improves usability. Conversely, for UIs with very small buttons (that are spaced far apart), it may be necessary to increase each button's activation region.
For capacitive button layout, embedded designers should avoid capacitive button layouts that are difficult for the user to touch one button at a time. Equally sized buttons are not equally accessible. To improve button accessibility, while conserving space, some buttons can be made smaller and others larger, depending on their location and function in a product's overall design.
Corner buttons are the easiest to access for several reasons. They're approachable from more than one direction, have the fewest neighbors, and they offer the most tactile location cues about their position because the phone's edge helps guide the user's hand.
Upper buttons should be slightly larger than the lower corner buttons. Those lower corner buttons can be smaller because they have two edges nearby, which offer more tactile clues about their location.
A mobile phone keypad best illustrates an efficient manner to size capacitive buttons to improve accessibility (Figure 5, below). All buttons have similar accessibility because they are sized differently. The middle button is the largest because it is the least accessible.
Increasing the middle button's size improves its accessibility. Other button size considerations are the size and shape of the buttons near the edges of the mobile phone. Those buttons can be smaller because the phone edges provide a point of reference for the user's hand.
![]() |
| Figure 5. In this mobile phone keypad layout, with the capacitive approach, buttons can be resized to make each button equally accessible. |
Proximity of other capacitive controls is another consideration for button layouts. Designers should consider how button placement can complement the use of other controls used in the design such as scrolling sensors. For example, capacitive buttons should be arranged so that the user does not inadvertently activate scrolling or another function when using the capacitive buttons.
Finally, one must consider that approximately 10 percent of the population is left-handed. Designing controls on either the left or right side of a product can bias one hand over the other. Therefore, the most frequently accessed controls or those requiring the most dexterity should be centrally positioned.
Alternatives to Braille bumps
In the area of tactile definition, capacitive technologies respond to a
gentle touch; the user doesn't have to press down forcefully. But if
tactile feedback is desired, tactile definition like Braille bumps, a
bezel, or changes in surface texture can be used to help users locate
capacitive buttons or sensor regions by feel.
Braille bumps have traditionally been used in computer keyboards and telephone designs to indicate the middle "Home" button for a group of buttons or keys. Braille bumps may be useful if the capacitive sensor is designed in to simulate an array of buttons or to provide tactile landmarks for scrolling boundaries.
On the other hand, Braille bumps should not be considered if the user's finger will frequently slide over them during routine operations. For instance, if a capacitive sensor is primarily used for cursor control and navigation, a Braille bump should not be used. It would produce an unpleasant user experience and could even adversely affect pointing performance.
For applications requiring finger strokes or selection gestures, the surface over the capacitive sensor should not be perfectly smooth. Moist or sticky fingers will stick and skip across an extremely smooth surface, but a slightly textured surface helps the user's fingers to slide. Accordingly, the capacitive sensor's surface can be textured with a hard coated finish if the sensor is the top layer.
For under-plastic designs, the embedded designer should specify a different texture for the plastic surface over the sensing areas. The remainder of the plastic casing could have a smoother surface. When the user's finger moves outside the sensing area, the user would notice the change in texture.
An area of UI design unique to the capacitive sensor approach we have developed is the notion of control processing. Beyond the various methods for processing button input, a light touch enables UI elements that incorporate finger movement. Examples of such UI elements (gestures) include scrolling, dragging, inking (for drawing or character recognition), and panning/zooming. For such elements, it is important to consider the dynamic aspects of the UI design as well as the previously described static issues.
For button designs, there are two primary mechanisms for activating buttons, taps and presses. A tap is a short contact (typically < 250 msec), constrained to not contain significant finger motion. This mechanism prevents accidental activations since the user must contact and lift-off from a button within a narrow timing window. However, it can be challenging for novice or untrained users to execute effectively even on large buttons because the timing of this gesture for a given device is not particularly discoverable.
A press is a contact that appears in the button region and then lingers in the region (with minimal finger motion) for greater than a threshold amount of time (typically > 250 msec). This mechanism is easy to perform for most users and is recommended above taps.
It is also important to pay attention to what happens after a button is "activated". A button should be disabled for a brief period following activation to prevent "double activation." For scrolling and other movement based UI elements, hysteresis of the control processing is highly recommended. Hysteresis means that once a gesture is initiated by touching within a given UI element, active boundaries of the UI element should be relaxed beyond the original drawn active region to accommodate inaccuracies in a user's finger movement.
This relaxation of the active boundaries should continue until the gesture is completed or until the finger moves beyond the new active boundaries. For example, for a scroll bar, the user first touches within the scrolling region to initiate the scroll gesture. But once the finger begins movement, the UI should continue to scroll even if the finger moves somewhat outside of the drawn scroll region, until the gesture is terminated. The gesture is considered terminated usually by lifting off the sensor or moving significantly beyond the drawn scrolling region.
Incorporating hysteresis in the UI control processing, when
implemented properly, significantly improves device usability since it
minimizes the effects of user input inaccuracies. Additionally,
hysteresis can enable tighter spacing of drawn UI elements in designs
with space constraints.
A final aspect of UI control processing involves the consistency of the processing. Since the underlying processing is not obvious to the user and cannot easily be communicated visually, it is important that UI elements within a particular control layout act consistently. For example, a control layout that mixes buttons that activate on taps with buttons that active on press will certainly confuse users. Furthermore, UI elements should maintain a consistent implementation for activation regions and hysteresis.
While UI designers are typically familiar with maintaining consistency within a given control layout, it is equally important to maintain consistency between different control layouts on a device. Typically, UI designers will keep the visual aspects of the control layout similar for different applications to maintain a particular ID language.
However, designers must remain vigilante about ensuring that this
consistency is also maintained in the control processing. That is,
button processing, scroll bar functionality and other UI elements
should behave similarly as control layout changes from one application
to another on a device.
Since applications for a device may be written by different developers (or even different companies), consistency of UI processing can be quite a daunting task and, unlike the visual appearance, may be more difficult to enforce. Without consistency in the control processing, users will quickly become frustrated with the device operation, regardless of how well designed any one particular application or UI control layout may be.
Other Design Considerations
Embedded designers using RTS in their designs have typically relied on
a variety of supporting ASICs, ASSPs, or discrete analog/digital
components from different IC vendors. In most cases, designers are
supplied with separately sourced resistive screens, supporting ICs, and
host software and charged with cobbling a design together to make it
operate efficiently.
As a result, they've experienced varying levels of performance. If the RTS is not properly designed and implemented, its performance can lag, ranging from extremely poor to moderate since it is subjected to an array of environmental issues, as well as noise and filtering of finger data.
Conversely, this capacitive sensor interface design is precisely tuned to its supporting proprietary mixed signal VLSI IC. This system approach delivers to embedded designers circuits that are specifically tailored to their respective capacitive sensor functions. Computing of this high caliber converts analog capacitive measurements into robust behavior.
Moreover, the design process is simplified from a programmer's standpoint since he or she isn't burdened by a non-ideal input system. With the capacitive sensor, programmers receive clean and filtered data, whereas with RTS, they worry about filtering data and averaging it to make sure they don't get considerable noise in the finger position reporting.
A proprietary 16-bit RISC microcontroller core is at the heart of the electronics powering this capacitive sensor panel. Its job is to manage and collect analog measurements, compensate for environmental effects such as electrical noise and temperature drift, compute the finger's position and proximity, detect motion and tapping gestures, and communicate with the host system.
In the important area of electrostatic discharge (ESD) protection, embedded designers receive a significant bonus because the sensor is designed to be mounted underneath a lens or device casing. As a result, it is completely sealed off from ESD events, and its ESD rating extends beyond ±15 kilovolts (KV) when it is properly mounted. Resistive screens, on the other hand, are rated at up to ±8 KV, which makes them more prone to environmental problems.
As for the capacitive sensor's low-power operation, embedded designers are provided with several modes. The sensor can be powered down with finger data reported as early as 100 milliseconds from power-on. The modes include active, doze, sleep, and deep sleep.
At active, the sensor is fully operational at 1.5 milliamps (mA) and checking for the presence of a finger; it automatically reverts to doze at about 60 microamps (µA) when it doesn't detect a finger for a specified amount of time; it goes into sleep at about 40 µA when finger-presence checking frequency is further reduced; and finally, it enters deep sleep at 10 µA when finger-presence checking is eliminated, thus maximizing power consumption.
Mariel Van
Tatenhove is senior product line director, and Andrew Hsu is manager of
strategic and technical marketing at Synaptics,
Inc.








