Brand is everything when it comes to marketing and selling products that customers will
buy and more importantly continue to buy. Anything with a display screen is expected to
have a polished look and feel and be easy-to-use. Now, especially with the rise of the
Internet of Things (IoT), more and more simple devices are featuring interactive display
screens causing design challenges for engineers. Many microcontrollers (MCUs) do not
have the advanced features needed to run these applications and switching to a more
advanced microprocessor (MPU) comes with added costs and design complexity. A clear
transition is happening with hardware manufacturers recognizing the need to have more
advanced graphic capabilities for MCUs.
Importance of Brand Recognition
The inclusion of a graphical user interface (GUI) in an embedded design serves purposes
that are both functional and aesthetic. Often one of the most overlooked and valuable func-
tions of a graphical interface is the communication of brand identity.
According to Rachel Remington atshuksanweb.com
, a brand identity is a set of visual
characteristics that represent a brand or company, such as the logo, color usage and fonts.
Brand identity is important because it uses graphic elements to convey the personality,
mood and/or values of a company.
Not prioritizing a positive user experience with your company's brand identity by using
static, cluttered or antiquated GUI designs causes a disruption that prevents users from
being drawn to seek out a repeat positive experience via your product. This persistent
search for an expected experience is called preference, and end users that have preferenc-
es for specific brands will generally be willing to pay a premium for access to that brand,
which in turn increases profit for the sought-after brand. Brand recognition combined with
positive user experience drives profit.
Chances are your company's marketing department spends considerable resources edu-
cating your customers about their products and the type of experience that they should
expect from them. There are several different methods that they would use for this: adver-
tisements in trade publications both in print and online, social media, emails, radio, televi-
sion commercials and more. Companies who get the most benefit from excellent brand
identity pay special attention to how the brand is communicated in product design, especial-
ly in the human-machine interface. In the extreme, creative and accurate branding on your
User Interface (UI) can be like a billboard for your company located on every product your
MCUs forAdvanced Graphics
Traditionally, MCU applications that needed to include graphical user interfaces used
either external graphics controllers or a static direct-drive DMA-based graphics scheme to
push full frames out to displays up to WVGA (800x480). External graphics controllers are an
additional component in the embedded design leading to undesirable additional cost, board
size and design complexity.
Graphics needs such as large color depth, color format conversion, alpha blending and
animation can drive embedded designers toward a microprocessor (MPU). MPUs generally
come with higher performance than MCUs in addition to a higher level of complexity. Switch-
ing from an MCU design to an MPU design also entails knowledge of new software and
hardware paradigms that might not be readily available within your design team.
Fortunately, recent advancements in graphics technology have enabled graphics designs
to gain some of the sophistication that would have otherwise only been supplied by MPUs
without having to invest in new hardware and software design methodologies. While certain
applications absolutely require the use of an MPU, many design engineers can benefit
greatly from new advancements in graphics capabilities now available with MCUs. The rest
of this article will discuss how some of these advancements can be used to drive brand
identification into your next GUI-based embedded design.
Integrated Graphics Controllers
Perhaps the most central component of a graphics-enabled microcontroller is the integrat-
ed graphics controller peripheral. In its basic form it is the peripheral responsible for taking
image data from memory and putting it out on the display.This function would be assigned to
a Direct Memory Access, or DMA unit inside of the microcontroller.
In truly enabled MCUs, however, an integrated graphics controller will do this job more
efficiently and effectively with more features and options to help make the application look
as attractive as possible. There are three main parameters used to describe the capabilities
of a graphics controller in an MCU: Color depth, image size and frame rate. We will dive into
color depth below, as choices surrounding this aspect have major implications into brand
recognition. Image size is simply the height times the length of the display in pixels. Note
that inches is a relatively rough way to describe image size, as the same resolution could be
fit into many different physical display dimensions. Frame rate is the rate at which the whole
picture on the display is redrawn. The higher the framerate, the smoother the transitions of
the image appear to the end user. Smoother transitions driven by choices in frame rate at or
above 15 frames per second make the product appear to be of higher quality adding to the
user experience portion of our profit equation above.
Limitations of typical MCUs such as pixel clock and memory availability will often
cause trade-offs in the choices among these three elements. For example a rich, vi-
brant color depth may require the choice of a smaller than desired display in order to fit
the application into the memory space available to the MCU. Recent advancements in
design and manufacturing technology have driven a major increase in available in-
package memory which has significantly increased the capabilities of graphics MCUs.
In order to appreciate the importance of large amounts of integrated memory, we need
to discuss color depth.
Driving Brand Recognition with MCUs
Kurt Parker, Microchip Technology
Color depth is defined as the number of bits used to indicate the color of a single pixel in a
bitmapped image. The more bits used to describe a color, the more subtle the differences in
the colors from one value to the next. New advancements in the amount of memory avail-
able in MCUs are enabling regular usage of 32 bits of color depth. This translates to approx-
imately 16.7 million different colors. Deep color is important to customer experience and
branding in two very significant ways.
The first reason rich colors are important correlates with how you want your end user to inter-
pret the image that is being presented. If your application relies upon realistic representations of
photographs or art, then your end users will judge the quality of your device based on how closely
the image being presented matches the object being represented visually or in memory.
The second reason has to do with brand recognition. Colors play an extremely important
role in helping customers identify a brand. Not only are they very specific (Pantone® color
and others have built an entire industry on this concept), but they also help end customers
identify whether a product is real of fake. Also, not being able to accurately represent a
brand through color representation could also have a damaging effect on the user's percep-
tion of the quality of the device they are using.
Using 32-bits of color (which includes 24-bits of actual color description and 8-bits of transpar-
ency level, also known as alpha channel) carries a heavy price on memory usage in an applica-
tion. For a WVGA (800x480) display, 32-bits of color translates to approximately 1.5 MB of
memory needed just for one buffer, or representing what is being displayed stored in memory.
As mentioned above, there are very reasonable cases where this amount of color depth is
important. This includes representation of photographs or artwork and applications that
provide web access where color presentation from a third party is unpredictable and varied
(think maps, images and video). Because microcontrollers typically contain no more than
512KB of on-chip memory to hold image buffers, external memory would be required for
As mentioned previously, new advancements in die design, packaging and manufactur-
ing have led to huge gains in on-chip memory. The PIC32MZ DA from Microchip, for exam-
plehas 32MB of DDR2 DRAM in a single package with a fully-enabled graphics MCU. There
is no need for external buffer memory to be added to the application. This reduces cost,
complexity and the overall size of the design. When combined with a 3-layer graphics con-
troller and a fully featured 2-D graphics processor, the PIC32MZ DA is one example of the
advancements in highly integrated graphics controllers available to embedded designers
for GUI-based applications.
Graphics Development Tool Basics
Finally, the importance of a good set of design tools tightly integrating automation with
flexibility should not be overlooked. In order to hit the proper tone while creating user inter-
faces that delight and drive preference, it is important to be able to have tools that enable the
designer to spend their time on content creation instead of mundane code debug and need-
lessly iterative programming. One approach to GUI design that can propel embedded cod-
ers to UX experts is called "What-You-See-Is-What-You-Get", or WYSIWYG for short. The
intent of this approach is for the tool to enable the designer to create an image in the design
space within their tool that will look exactly like it will when pushed to the hardware platform.
When combined with other tools that automate the creation of drivers for non-standard
graphics panels, they truly enable a high-end design experience while eliminating time spent
on coding and debugging for the user interface. These tools are available today, with one
such free example being the MPLAB Harmony v2 Software Framework from Microchip.
MPLAB harmony brings industry leading capabilities, including design entry, memory man-
agement, events and display drivers that are tightly coupled to existing tools including code
generation, debugger, MPLAB X and MPLAB Harmony Configurator.
Special attention to the way that embedded user interfaces drive positive experiences and
draw users to return again and again will reap profitable rewards. Fortunately, recent ad-
vancements in MCU graphics and memory technologies are enabling embedded designers
to up their GUI development game without having to learn new and complex software and
hardware design paradigms often associated with MPUs. Making the right choices in archi-
tecture and tool set can make driving brand preference and positive user impressions easi-
er than it has ever been before.