body modules: business rules & design definition
DESCRIPTION
Template Definition Documentation - Business rules, design treatment, function, placement, expected behavior and interaction.TRANSCRIPT
Public ‐ Body Modules‐Business Rules & Design Treatment (v1.6)
Body Module Definitions
The purpose of this document is to define the business rules and design treatments for all of
the various body modules for both two and three column templates.
This includes: function, placement, design and expected behavior. The AOC is responsible for
defining the business rules around function, placement, expected behavior and interaction,
while Extractable will define the design treatment and design elements such as size,
background color and text color.
Two Column Body Module Call‐Outs
The right column can optionally contain the following modules:
Overview – Image Left
Overview – Image Top
Overview – No Image
Body – Contextual Links/No‐Description
Body – Contextual Links/Description
Body – Contextual Links/Description/Image
Body – Descriptive Links
Body – Descriptive Links/Image
Body – Accordion HR‐Treatment
Body – Accordion No‐Treatment
Body – Tabs
Body – Dynamic Container/Links
Body – Dynamic Container/Dropdown
“Search” Court Locations Module
Function: The “Search Locations” module allows a user to perform a search functionality
specific to court locations
Treatment (TM)
Background color (#)
Title text color (#)
Body text color (#)
Border color(#)
Elements
Module title
Instructions
Text field entry box
“Find” Button
Placement
On all Overview pages except Self‐Help
On various landing and content pages where appropriate
Ordering
Prominent module (1)
“Contact Info” Module
Function: The “Contact Info” module provides users with contact information such as physical
address, phone numbers and e‐mail.
Treatment (TM)
Background color (#)
Title text color (#)
Module title background color (#FFFFFF)
Text color (#)
“More” link no‐Underline static state
“More” link blue‐underline hover state
Visited link color (#)
Border color(#)
Elements
Module title
Line Limit (#)
Character Limit (#)
“More” Hyper link (optional)
Carrots after more link (>>)
Placement
On home page, overview pages, landing pages and content pages where appropriate
Ordering
Prominent module (2)
“Quick Links” Module
Function: The “Quick Links” module provides a list of frequently used shortcuts to documents,
web pages within the same tab, and applications that otherwise could not be reached in one or
two clicks using the navigation structure available on the page. Typically for deep content areas,
usually found on the home page, overview and landing pages.
Treatment (TM)
Background color (#)
Title text color (#)
Module title background color (#FFFFFF)
Link text color (#)
No‐Underline static state
Blue‐underline hover state
Visited link color (#)
Border color(#)
Elements
Module title
Hyper links (5‐7 max)
Link character Limit (#)
Carrots in front of links (>>)
Placement
On home page, overview pages, landing pages and content pages
Ordering
Prominent module (3)
“What’s New” Module
Function: The “What’s New” module provides a list of shortcuts to “Featured” content or
applications that have recently been introduced. Typically for deep content areas, usually found
on the home, overview and landing pages generally within context.
Treatment (TM)
Background color (#)
Title text color (#)
Module title background color (#FFFFFF)
Link text color (#)
No‐Underline static state
Blue‐underline hover state
Visited link color (#)
Border color(#)
Elements
Module title
Hyper links (5‐7 max)
Link character Limit (#)
Carrots in front of links (>>)
“More” Link?
Placement
On overview pages, landing pages and content pages
Ordering
Prominent module (4)
“News” Module
Function: The “News” module provides a brief description, imagery and access to a “Featured”
story or news item. The block can also contain a series of shortcuts to other “Featured” story or
news items. Usually found on the home, overview, landing pages and content pages.
Treatment (TM)
Background color (#)
Module title text color (#)
Module title background color (#FFFFFF)
News title text color (#)
Description text color (#)
Link text color (#)
No‐Underline static state
Blue‐underline hover state
Visited link color (#)
Border color(#)
Elements
Module title
News title
Hyper links (3 max)
Link character Limit (#)
Carrots in front of links (>>)
“More News” Link?
Placement
On home page, overview pages, landing pages and content pages
Ordering
Prominent module (5)
“Video A” Module
Function: The “Video A” module provides a brief description, imagery and access to a
“Featured” video. Usually found on the home, overview, landing and content pages.
Treatment (TM)
Background color (#)
Module title text color (#)
Module title background color (#FFFFFF)
Video title text color (#)
Description text color (#)
Link text color (#)
No‐Underline static state
Blue‐underline hover state
Visited link color (#)
Border color(#)
Elements
Module title
Video title
Hyper links (1 max)
Link character Limit (#)
Carrots (>>)
“Read More” Link?
Placement
On home page, overview pages, landing pages
and content pages
Ordering
Prominent module (6)
“Video B” Module
Function: The “Video B” module provides a brief caption, imagery and access to a “Featured”
video. Usually found on the home, overview, landing and content pages.
Treatment (TM)
Background color (#FFFFFF)
Module title text color (#)
Module title background color (#FFFFFF)
Video title text color (#)
Description text color (#)
No‐Underline static state
Blue‐underline hover state
Visited link color (#)
Border color(#)
Elements
Module Title
Video Title
Hyper links (1 max)
Character Limit (#)
Placement
On home page, overview pages, landing pages
and content pages
Ordering
Prominent module (6)
Left Column Modules
The left column can optionally contain the following
modules:
Related Links
How Do I’s
Special Notice
“Related Links”/“How Do I” Combined Module
Function: The “Related Links/How Do I” module provides a list of frequently used shortcuts
combined into one single module that provides access to other web pages/content that may be
related to the topic and/or subject. Typically for deep content areas, usually found on the
overview, landing and content pages. Related links can point to web pages that are in different
sections of the web site.
Treatment (TM)
Background color (#FFFFFF)
Module title text color (#)
Link text color (#)
No‐Underline static state
Blue‐underline hover state
Visited link color (#)
Horizontal rule color (#)
Border color(#)
Elements
Module Title(s)
Hyper links (5‐7 max)
Character Limit (#)
Horizontal Rule
Placement
On overview pages, landing pages and content
pages
Ordering
Prominent module (1)
“Related Links”/“How Do I” Individual Modules
Function: The “Related links/How Do I” individual modules provides a list of frequently used
shortcuts broken out into individual modules that provide access to other web pages/content
that may be related to the topic and/or subject. Typically for deep content areas, usually found
on the overview, landing pages and content pages. Related links can point to web pages that
are in different sections of the web site.
Treatment (TM)
Background color (#FFFFFF)
Module title text color (#)
Link text color (#)
No‐Underline static state
Blue‐underline hover state
Visited link color (#)
Border color(#)
Elements
Module Title(s)
Hyper links (5‐7 max)
Character Limit (#)
Placement
On overview pages, landing pages and content
pages
Ordering
Prominent module (1)
“Special Notice” Module
Function: The “Special Notice” module emphasizes a particular event or message that needs
high visibility. Typically found on overview, landing and content pages. This notice should be
used sparingly, and for timely information.
Treatment (TM)
Background color (#)
Module title text color (#)
Body text color (#)
Link text color (#)
Underline static state
Underline hover state
Visited link color (#)
Border color(#)
Elements
Module Title
Hyper link (1 max)
Character Limit (#)
Image
Placement
On overview pages, landing pages and content
pages
Ordering
Prominent module (2)