Saffron renders clear, easy-to-read text across
an unlimited range of sizes.
Distance-Based Antialiasing with Adaptively Sampled
Distance Fields
Saffron performs antialiasing by first computing an adaptively sampled
distance field (ADF) and then mapping distance values to
densities.
This unique distance-based antialiasing
approach renders beautiful curves, captures small
details, and preserves the nuances of the original font
design. No special mechanisms are needed to avoid dropout.
Although only one distance sample is needed per pixel to achieve
high-quality results, Saffron can use up to 3 samples
per pixel to optimize image quality for LCD displays.
The computation of a distance sample
requires only linear interpolation and can be updated
incrementally from pixel to pixel, thereby making the rendering process simple and efficient.
Saffron easily handles different alphabets, such as Arabic,
Chinese, Devanagari, Latin, Hebrew, and Thai.
Appearance Styles
Saffron's Continuous Stroke Modulation (CSM) feature allows users
to tune the appearance of text to suit their individual tastes.
Illustrated above are four
examples (sharper, softer, thinner, thicker from top to bottom) of the same
typeface rendered with different CSM parameters.
Zero-Footprint Light & Bold
Saffron's Continuous Stroke Modulation (CSM) feature can also be used to
produce light and bold variations of a single typeface. These
variations require no additional storage and are useful
for embedded systems and mobile applications where storage is at a premium.
Display Type
Saffron easily renders fun and unusual typefaces, including snowflakes!
Effects and Applications
Saffron integrates seamlessly into applications that
require traditional text effects, including composited
text with different foreground and background colors, as
well as scaled and
rotated text.
Saffron Around the World
Saffron has been licensed to Adobe and is shipping
in all Flash-based products, including Adobe Flash CS3.
The Adobe Flash Player is the world's most pervasive
software platform and reaches 99% of Internet-enabled desktops.
Virtual Ubiquity's Buzzword (recently acquired by Adobe) is a web-based
Flash word processor that uses Saffron to render text
Buzzword is a stunning achievement in design. Of all the
PC-compatible word processors available — including the
desktop juggernaut Microsoft Word — Buzzword is the
easiest on the eyes and has the most elegant user
interface. It displays beautiful type. Its interface
elements, from the cursor to menu items, make excellent
use of colour, and they slide and fade instead of popping
and blinking.
— Rafe Needleman, CNET
Light and Portable
The Saffron library offers both floating-point and fixed-point
implementations of the renderer with identical image quality.
The fixed-point implementation is ideal for embedded systems and mobile devices,
which often lack floating-point
hardware. Porting Saffron from
an Intel desktop machine to a
Windows Mobile 5.0 device (see above) required only a simple recompile.
Outlines and Strokes
Saffron supports both traditional outline-based fonts
(left) and
uniform-width stroke-based fonts (right). Stroke-based
fonts are useful for memory-constrained applications
(e.g., embedded systems) because they occupy a much
smaller footprint than outline-based fonts and are also
faster to render. For example,
outline-based fonts containing the GB2312 character set
often require well over 3 MB of storage, whereas the same
character set can be represented compactly in a stroke-based
font with only 250 KB.
Without Grid Fitting
With Automatic Grid Fitting (SAZ)
Automatic Grid Fitting with Standard Alignment Zones
Saffron features an automatic grid fitting system that
aligns strong vertical and horizontal edges of glyphs to
the pixel grid or to the sub-pixel grid. This grid fitting
system provides better contrast, uniform stroke weights,
and consistent characteristic distances. Standard
Alignment Zones (SAZ) currently support several alphabets,
including Arabic, Devanagari, Hebrew, Latin, and Thai.
The SAZ grid fitting system requires no changes to existing
typefaces and is particularly advantageous when hints are unavailable or
have been removed to save space. Unhinted fonts typically occupy
significantly less space than their hinted counterparts.
Without Grid Fitting
With Automatic Grid Fitting (MAZ)
Automatic Grid Fitting with Multiple Alignment Zones
Saffron also features an automatic Multiple Alignment Zone
(MAZ) grid fitting system,
which is optimized specifically for Asian character sets such as
Chinese, Japanese, and Korean. MAZ grid fitting
leads to dramatic improvements in
rendering quality.
The MAZ grid fitting system requires no changes to existing
typefaces and is particularly advantageous when hints are unavailable or
have been removed to save space. Unhinted fonts typically occupy
significantly less space than their hinted counterparts.
Furthermore, manually hinting a typeface is labor-intensive and expensive,
especially for Asian character sets.
Multiple Alignment Zones
The Multiple Alignment Zones (MAZ) grid fitting system
detects strong horizontal and vertical edges and aligns
them to the pixel grid. The MAZ algorithms are optimized
for Asian character sets,
work with both outline-based
fonts and stroke-based fonts, run dynamically during
rendering, and operate fully automatically with no user
parameters required. This powerful combination of features
makes it easy to integrate MAZ into
existing applications — just turn on MAZ and watch the
rendered glyphs improve dramatically in quality.
Character Simplification
Chinese, Japanese, and Korean characters often contain many strokes
which are difficult to render distinctly at small sizes (left column). Simply
aligning horizontal and
vertical strokes to the pixel grid (e.g., by rounding each stroke to
the nearest grid point) is not sufficient to produce a clear
image and can often lead to disastrous results (middle column).
Saffron's fully automatic Multiple
Alignment Zone (MAZ) grid fitting system performs character
simplification (as needed) to ensure that each character remains clear and
legible, even at small sizes (right column).
Actual-size renderings at 14 pixels/em are shown
to the bottom-right of each diagram.
Saffron's character simplification works for both
outline-based fonts and stroke-based fonts.
Without Hints
With Hints (Application-Hinted Glyphs)
Application-Hinted Glyphs
Saffron fully
supports application-hinted glyphs. This feature allows applications
to override Saffron's automatic grid fitting algorithms by using
their own hints (e.g.,
TrueType hints) to perform grid fitting.
Sub-Pixel Rendering, Color Reduction, and Alternative Pixel Patterns
Saffron supports sub-pixel rendering to optimize image quality for
LCD displays. Although RGB vertical striped arrays (top-left) are
common, Saffron can also render to alternative pixel
patterns such as RGB delta arrays
(top row, 2nd image from left), which are often used on digital camera
LCDs. In addition, prototype implementations
of Saffron are optimized for Clairvoyante's
PenTile patterns (top row, rightmost two images). Click
here
and here to
learn more about the PenTile system.
During sub-pixel rendering, Saffron reduces color fringing
artifacts that would otherwise be visible and distracting at small
sizes (see bottom row).
Saffron's computationally clean rendering pipeline can be
implemented in graphics processing units (GPUs)
via vertex and fragment
shaders. As illustrated above, the points and contours of an
outline-based glyph (left) are processed on a GPU (middle)
to produce a final antialiased rendering of the glyph
(right). This example was rendered on an ATI Radeon X1300
GPU.
Saffron In Hardware
The Saffron engine has been
implemented directly in a custom ASIC, which can be
deployed in numerous applications. This hardware
implementation achieves a 60X increase in performance
over an optimized software implementation.
Stylized Stroke Fonts
Outline-based Asian fonts often require
5 to 10 MB of storage, which is problematic for
memory-constrained devices such as cell phones.
In contrast, uniform-width stroke-based fonts (USFs) require significantly less
storage — for example, the GB2312 character set can be represented compactly
with only 250 KB. However, since each stroke has a uniform width
(top-left image), USFs lack the expressiveness and
the cultural acceptance of
their outline-based counterparts. We are currently developing an
improved representation for stroke-based fonts called Stylized Stroke Fonts (SSFs)
which will provide the best of both worlds: the expressiveness of
traditional outline-based fonts and the small memory
footprint of USFs. A primary goal of this research project is to develop
algorithms that can automatically convert outline-based fonts to
SSFs.
SSFs can also save memory by representing
multiple fonts using a single set of stroke skeletons, as
illustrated above.
The top-left image shows a USF;
the other three images were produced by our
prototype SSF renderer and
demonstrate the ability to create interesting and
different stylistic renderings from the same
stroke skeletons. These additional font styles require minimal storage overhead.
Automatic CSM Parameters
In a continuing effort to make Saffron even easier to use,
we are currently investigating fully automatic methods for
determining high-quality
CSM values for a given typeface. This can be done by applying
our Multiple Alignment Zones (MAZ) algorithms to analyze
characteristic distances (see two examples above). This
research will enable applications to determine
good CSM values, even with previously unencountered typefaces.
Additional Applications of Distance Fields
Adaptively sampled distance fields have many other
applications besides rendering type. Two examples are
shown above. The left image shows a single frame from an
animated vignette where ADFs are used to model real-time
soft body deformation. On the right, three frames from
an animated vignette show the use of ADFs to attract and
repel particles and use the implicit nature of the
distance field to create offset surfaces from the
glyphs. The distance field permits complex topological
changes that would be difficult to model with
outline-based shapes.
Distance Fields in 3D
Distance fields can also be used to represent shapes in
3D. This makes it possible, for example, to render
three-dimensional text.
Last modified: Thu Nov 15 16:27:54 Eastern Standard Time 2007