Appliance Design - November 2008 - (Page 32)

DISPLAYS ifications or a previous UI design (pushbuttons, 7-segment LEDs, etc). To visualize this, take a refrigerator example. The traditional UI has three main functions: dispensing ice, water, and a safety light. Fig. 1 shows an example of a UI that was assembled pixel by pixel. It is flat and boring. By taking this general concept design and giving the reins to a graphic designer, one can generate something much more visually appealing, as observed in Fig. 2. Whether one already has concept art or hires an artist to create it, one common question is how to take an ordinary image, such as a refrigerator control panel, and make it come alive. Often Fig. 2 becomes Fig. 1 in the final product, because the advanced look was too difficult to recreate using traditional GUI development tools. This is where Amulet’s widget-based API becomes so powerful, making it easier to improve visual appeal. First, the layered image file is separated into its individual components, such as the background, up-button and down-button states. Next, these components are saved individually in a popular format such as JPEG, GIF, or PNG. The files are then ready to be directly imported into widgets. Using drag-and-drop HTML tools such as Dreamweaver, one can see exactly what the UI will look like before even programming the embedded device. Depending on the complexity, the whole process, from layered image to HTML, consumes just a few hours instead of days. And the result is an interactive GUI ready to hand off to engineering. Creating different designs for popular stainless steel, sleek black, or traditional white refrigerators can now be done without adding time to the design cycle. At this stage, one can virtually push buttons, slide sliders, play animations, or perform any of the other functions, but next the programmers are needed to add the functionality that makes it a real application. There are two sides to this — the HTML side and the embedded processor side. The communication between the two is simple. Most applications will only need bytes, 16-bit word, or ASCII character string variables passed back and forth. Going back to the refrigerator example, the traditional door has a few UI elements: buttons for crushed or cubed ice and light on or off, then one or two switches to activate the dispensing of water and ice. Using Amulet’s method, all of the settings can be done on the LCD, and just a few bytes are communicated to the central processor to control the flow of ice and water, and control the light. Fig. 3 shows a sample communication. The other side of this functionality is on the central processor. In this scenario, the communication between the controller chip and the central processor consists simply of passing back and forth variables, not graphical elements, for display or control. Variables consist of bytes, words, or strings and represent control parameters such as ice type or temperature. The low overhead of this method allows for a robustness of design. The LCD can be placed far apart from the main CPU and only run UART or USB lines plus pow- 32 applianceDESIGN AD11084Dymax.indd 1 November 2008 10/13/08 11:14:01 AM www.applianceDESIGN.com http://www.dymax.com http://www.dymax.com http://www.appliancedesign.com

Table of Contents Feed for the Digital Edition of Appliance Design - November 2008

Appliance Design - November 2008 Contents Editorial Shipments/Forecasts News Watch Metals & Metal Parts Gas Technology Displays Quality & Standards New Products Design Marts Association Report: AHAM Advertiser's Index

Appliance Design - November 2008

For optimal viewing of this digital publication, please enable JavaScript and then refresh the page. If you would like to try to load the digital publication without using Flash Player detection, please click here.