 |
Description  |
|
|
TECHNICAL FIELD OF THE INVENTION
This invention relates to the field of graphics computer programs, and more
particularly to a system and method for creating graphics.
BACKGROUND OF THE INVENTION
Graphics are the easiest way to communicate information. The creation of
graphic layouts or charts has progressed from manual pen and paper
generation techniques to computer aided techniques. Previously developed
computer graphics programs or applications generally provide clean,
professional graphics in a fraction of the time required for hand drawn
graphics. Unfortunately, these computer programs can be complicated and
may require high-end computer systems in order to run the software
program.
Additionally, previously developed computer graphics programs are generally
not user friendly. Computer users of these systems may have to spend hours
or days practicing with the system before becoming proficient in
generating acceptable graphics. Also, many previously developed computer
graphics programs may require the user to have artistic abilities in order
to generate professional, clean graphics. Persons lacking artistic
abilities may find using previously developed computer graphics systems
intimidating.
These factors may prevent using graphics to present information when a
graphical presentation would be the best way to communicate the
information.
SUMMARY OF THE INVENTION
In accordance with the present invention, a user friendly computer graphics
system and method are provided that substantially eliminate or reduce
disadvantages and problems associated with previously developed graphics
systems and methods.
One aspect of the present invention provides a computer graphics program
executed by a processor for generating a plurality of types of graphics
charts on a computer display. The program includes instructions for
generating an adjustable grid associated with each type of graphics chart.
Each grid provides placements for text and shapes for each type of
graphics chart. The present invention further includes instructions for
generating snap zones associated with each grid for controlling the
orientation of the shapes and text placed within the grid.
The present graphics system and method provides numerous technical
advantages. One technical advantage of the present invention is that is
provides a user friendly computer graphics system. The present invention
uses intelligent templates and pre-drawn shapes that make creating
graphics much simpler and quicker. This can increase the productivity of a
person or persons using the present invention.
Another technical advantage of the present invention is that it can be used
without extensive training or practice. This allows a user to nearly
immediately begin creating professional, clean graphics.
Yet another technical advantage of present invention is that it comprises a
computer program that runs on standard or commercially available computer
equipment and does not require high-end workstations as may be required
for some previously developed computer graphics programs. This maintains
the computer platform costs for practicing the present invention
relatively low.
BRIEF DESCRIPTION OF THE DRAWINGS
For a more complete understanding of the present invention and advantages
thereof, reference is now made to the following description taking in
conjunction with the accompanying drawings in which like reference numbers
indicate like features and wherein:
FIG. 1 illustrates a schematic block diagram for a computer system that may
be employed in practice of the present invention;
FIG. 2 shows the template gallery dialog box generated in accordance with
the present invention;
FIG. 3 depicts an exemplary computer screen and graphics chart in
accordance with the present invention;
FIG. 4 illustrates a pyramid graphic generated in accordance with the
present invention;
FIG. 5 illustrates a target graphic generated in accordance with the
present invention;
FIG. 6 illustrates in process the pyramid graphic from FIG. 4 in accordance
with the present invention;
FIG. 7 depicts a Venn diagram graphic in accordance with the present
invention;
FIG. 8 shows an exemplary organization chart graphic that may be generated
in accordance with the present invention;
FIG. 9 illustrates a flow chart graphic generated in accordance with the
present invention;
FIG. 10 illustrates a dialog box for controlling the shadows and
three-dimensional outline of a shape in accordance with the present
invention;
FIG. 11 depicts a time line graphic generated in accordance with the
present invention;
FIG. 12 shows a checklist graphic in accordance with the present invention;
FIG. 13 shows a direction graphic generated in accordance with the present
invention;
FIG. 14 shows a netmap graphic generated in accordance with the present
invention; and
FIG. 15 illustrates a circle/spoke graphic generated in accordance with the
present invention.
DETAILED DESCRIPTION OF THE INVENTION
Preferred embodiments of the present invention are illustrated in the
FIGURES, like numerals being used to refer to like and corresponding parts
of the various drawings.
FIG. 1 illustrates computer system 10 for implementing the present
invention. Computer system 10 is adapted to execute any of the well-known,
MS-DOS, PC-DOS, OS2, MAC-OS.TM., or Windows.TM. operating systems.
Computer system 10 includes microprocessor 12, random access memory (RAM)
14, read-only memory (ROM) 16, mouse 18, keyboard 20, and output devices,
such as printer 22, disc drive 24, and display 26. The present invention
provides a software computer program that may be stored in RAM 14, ROM 16,
or disk drives 24, that is executed by microprocessor 12. The present
invention is adapted for implementation in a computer language such as,
for example, C or C.sup.++ that may be compiled based on the instructions
of the desired computer operating system.
Operation of the present invention is described hereinafter, and where
appropriate, in connection with pseudo-code listings. Those of ordinary
skill in the art can readily convert the concepts described and
represented by the pseudo-code listings into executable computer
instructions for implementing the present invention. Computer system 10
can be any computer running, for example, Windows.TM. 3.1 operating system
or higher. Microprocessor 12, in the preferred embodiment, is an 80386.TM.
microprocessor or higher, e.g., 80486.TM. or Pentium.TM. microprocessor.
Disc drives 24 should have storage capacity on the order of at least 8
megabytes (MB) and RAM 14 should have storage capacity on the order of at
least 2 MB, while 4 MB are generally preferred. Display 26 should be a
video graphics array (VGA) or have a Windows.TM. compatible graphics card.
The embodiments described above for computer system 10 are provided by way
of an example only. Those skilled in the art will appreciate that the
implementation of the present invention is not limited to the
configuration described.
The present invention provides a computer graphics program that utilizes
intelligent templates and pre-drawn shapes to allow a user to quickly and
easily create clean and professional looking graphics. The present system
anticipates the types of graphics that may be required by the user and
provides a number of templates for different graphic layouts or charts so
that customized graphics can be created quickly and efficiently. The
present invention is currently available as the software package known as
ABC SnapGraphics.TM. available from Micrografx, Inc., of Richardson, Tex.
FIG. 2 illustrates dialog box 28 showing template gallery 30 in accordance
with the present invention. When implementing the present invention on
computer system 10, system 10 presents template gallery 30 on display 26
for the user to view. Template gallery 30 presents the user of the present
invention with a selection of graphics templates that can be used to
create graphic layouts or charts. Selection of any one template presents
the user with a template chart that includes preset tabs, shapes or a
shape palette, tool bars, grids, and snap zones and other elements. Each
of these elements will be described in more detail hereinafter.
Template gallery 30 in FIG. 2 includes: freestyle template 32,
organizational chart template 34, checklist template 36, target template
40, flow chart template 42, timeline template 44, component template 46,
drawform template 48, comparison template 50, tree template 52, drawbar
template 54, connection template 56, cascade template 58, pyramid template
60, direction template 62, block template 64, netmap template 66, Venn
diagram template 68, circle/spoke template 70, and custom template 72. By
using the well known point and click methodology associated with the
Windows.TM. operating system and other graphically based interfaces, the
user of the present invention running on computer system 10 can select a
template from template gallery 30 on display 26 with mouse 18 to initiate
the generation of a graphics chart.
FIG. 3 illustrates example screen 74 on display 26 of computer system 10
when comparison template 50 on template gallery 30 in FIG. 2 is selected
by the user. Comparison chart 76 is displayed on display 26 by computer
system 10. Comparison chart 76 is bounded by top tool bar 78, left tool
bar 80, bottom tool bar 82, and vertical scroll bar 84. Computer system 10
may employ common Windows.TM. interface techniques in generating screen 74
and to allow the user to select different features and operations for
manipulating the information on screen 74. The tool bars and scroll bars
aid the user of the present graphics program in preparing a graphics
chart.
Top tool bar 78 provides the user with point-and-click access to a number
of functions available with the present system. Line draw buttons 86 allow
the user to draw various line shapes on screen 74. Each intelligent
template, as represented by template gallery 30, has a unique line drawing
capability, so line draw buttons 86 for each template may be different.
Insert/delete buttons 88 allow the user to insert and delete shapes, rows,
or columns into a chart.
Shape border button 90 presents the user with choices for the border of the
shapes within chart 76. Shape fill pattern button 92 allows the user to
define the pattern that will be used to fill a given shape within chart
76. Three-dimensional and shadow button 94 may be selected to allow the
user to define the shadowing and configuration of three-dimensional shapes
in comparison chart 76. Line 96 and arrow 98 buttons may be selected to
allow the user to select the type of line and arrow to be generated on
chart 76, respectively.
Text style button 100 may be selected to present to the user options
available for adding text to chart 76. Bold button 102 is selected when
the text in chart 76 should be bold. Font size indicator 104 and font
select button 106 may be used to select the size and type of the font used
in chart 76.
Alignment indicator/select 108 is used to define the alignment of text
within a place holder or snap zone. Template indicator 110 corresponds to
the icon presented in template gallery 30 for the template selected.
Therefore, template select indicator 110 in FIG. 3 corresponds to
comparison template 50 in FIG. 2.
Left tool bar 80 also presents the user of the present invention with
several settings for chart 76. Left tool bar 80 includes template gallery
select button 112 that may be used to return to template gallery 30 at any
time while working in the chart shown on display 26. Select button 114 is
selected by the user so that shapes or text within chart 76 can be
selected and moved or edited. Pencil icon button 116 is selected when the
user wishes to draw shapes or lines within chart 76.
Text select button 118 is selected in order to add text to chart 76. View
select button 120 is selected to zoom-in or zoom-out within the view of
chart 76 presented on display 26.
Eyedropper button 122 is selected to copy style attributes between shapes
in chart 76. In order to add color to shapes within chart 76, the user may
also click in the lower part of color palette 124. Color palette 124
provides the user with selections for different colors that may be used in
chart 76. It is noted that the present system allows numerous colors to be
used in generating chart 76 on display 26.
Bottom tool bar 82 of screen 74 includes help hints section 126 that
prompts the user of the present invention to a likely next action. Snap
off and on button 128 turns the snap feature of the present invention off
and on. The snap feature or snap zones will be described in more detail
hereinafter. Show or hide template gridlines button 130 is selected by the
user in order to display or hide the gridlines within chart 76. Page and
grid colors button 132 may be selected by the user in order to present
options for the colors displayed on screen 74. Show or hide shape palette
button 134 is selected by the user to set whether shape palette 136 is
shown on screen 74. Browse buttons 138 allow the user to cycle through the
number of charts currently opened at a given time. Located above bottom
tool bar 82 is horizontal scroll bar 137 that allows the user to move
horizontally in chart 76 while displayed in screen 74.
Horizontal tab ribbon 139 includes a plurality of tabs including inward
tabs 140 and ribbon tabs 142. Inward tabs 140 define the size of columns
144, while ribbon tabs 142 define the margins for grid 146 of chart 76.
Similarly, vertical tab ribbon 148 includes inward tabs 150 and ribbon
tabs 152. Inward tabs 150 define the spacing of rows 151 of grid 146 while
ribbon tabs 152 define the margins of grid 146 of chart 76.
The tab settings in either horizontal tab ribbon 139 or vertical tab ribbon
148 can be changed by clicking and dragging any one of the tabs. The
present invention also provides slider lock or tab lock button 154 that
can be used to lock and unlock the tabs of chart 76. When tab lock 154 is
engaged, then moving a single tab, e.g., tab 140 in horizontal tab ribbon
138, causes all of the tabs to be changed by a like amount. The same holds
true when tab lock 154 is engaged and a single tab within vertical tab
ribbon 148 is moved. Unlocking tab lock 154 allows for individual tabs
with a tab ribbon to be moved with respect to the other tabs in the tab
ribbon.
Grid 146 presents to the user of chart 76 with a template for the graphics
being generated. When the user wishes to generate, for example, a
comparison chart, then selecting comparison chart template 50 from
template gallery 30 in FIG. 2 results in comparison chart 76 being
displayed on display 26. In comparison chart 76, the items being compared
can be presented in column 156 with various features presented in rows 158
and 160. Grid 146 has horizontal lines 162 and vertical lines 164 that
define grid 146. When chart 76 is first created, grid 146 is presented on
screen 76 to aid the user in generating a comparison graphics chart. Grid
146 also includes text insert placeholders 166 that highlight to the user
where to insert text into chart 76. Chart 74 also has shapes 168 placed on
grid 146.
FIG. 3 has been used to describe a number of the tools and features that
may be used in generating a chart or graphics with the present systems.
While these tools and features have been described in connection with
comparison chart 76, it is understood that the function of these tools and
features is not limited to chart 76. One of the advantages of the present
system is that it can use the same set of tools or features to generate
many different types of graphics.
SLIDEABLE GRIDS
FIG. 3 illustrates the concept of slideable grids that facilitates
generating graphics with the present system. Slideable grids allows the
user to adjust the grid for a selected template for generating graphics.
The grids for each type of chart may be modified by moving the tab
controls for the chart. The tab controls are located in two ribbon tabs
outside the chart area. To change the grid spacing, a user may click down
on one of the tabs and drag it to a new position. For rectangular grids,
like grid 146 in FIG. 3, the default mode is to maintain the tab spacing
uniform so that when one tab is moved, all the tabs are moved. Tab lock
button 154 is provided to change modes so that the spacing of individual
rows or columns within grid 146 can be modified. There are also special
tabs to change the margins, such as tabs 142 and 152 in FIG. 3.
An example of how the grids of a chart can be changed is shown in FIG. 3.
FIG. 3 illustrates tab 170 that is being moved. When tab 170 is selected
and dragged upwards or downwards, indication line 172 appears on screen
74. Indication line 172 allows the user to visualize how grid 146 will be
changed by the proposed movement of tab 170. Once tab 170 is released by
the user, the spacing of grid 146 will change to where 170 is released.
FIG. 4 illustrates pyramid chart 174. Pyramid chart 174 displays pyramid
176 including pyramid sections 178. Horizontal tab ribbon 139 of chart 174
includes centering tab 180 and angle tab 182. Moving center tab 180
changes the orientation of triangle 176 within chart 174. Moving angle tab
182 modifies the angle of the sides of pyramid 176. When angle tab 182 is
selected and moved, indication line 184 appears so that the user can
visualize how the movement of angle tab 182 will affect pyramid 176.
Vertical tab ribbon 148 for pyramid chart 174 includes ribbon tab 186 that
defines the top of pyramid 176. Inward tabs 188 and 190 define the spacing
between pyramid sections 178. Therefore, increasing the separation between
tabs 188 and 190 increases the spacing between pyramid sections 178 of
pyramid 176.
Pyramid chart 174 also illustrates an additional tool not previously
described in discussions related to FIG. 3. Flip button 191 in top tool
bar 78 can be toggled to flip pyramid 76 in FIG. 4. Some of the other
templates provided with the present system also provide flip button 191.
Another type of slideable grid available with the present invention is
shown in FIG. 5. FIG. 5 illustrates target chart 192 that may be generated
in accordance with the present invention. Target chart 192 may be
displayed on display 26 of computer system 10 by selecting target template
40 from template gallery 30 of FIG. 2. Selecting target template 40
presents the user with target chart 192 having a grid with a plurality of
concentric circles 194. Concentric circles 194 may be filled by selecting
shapes from shape palette 136 and placing the shapes in concentric circles
194.
The size of concentric circles 194 in the grid of target chart 192 are
controlled by inward tabs 198 in horizontal tab ribbon 138. Moving, for
example, inward tab 198 can increase or decrease the diameter of
concentric circles 194. The position of target 200 within chart 192 is
controlled by horizontal tab 202 and vertical tab 204. By moving the tabs
of chart 152 the grid of chart 192 can be easily modified to the desired
shape for the target chart being created.
The slidable grid function integrates the concept of an adjustable grid
with graphics. By making the grids for each template adjustable, the
templates available with the present invention can be easily tailored by
the user to generate custom graphics charts. Pseudo-code for implementing
slidable grids may be found under Table I below.
TABLE I
______________________________________
Slidable Grids
______________________________________
If user clicks down on tab in tab ribbon
BEGIN
if Slider Lock button is pressed
Select all tabs
Else
Select single tab that was clicked
While mouse is dragged (pressed down
and moved)
Give feedback how grid would change
by displaying auxiliary lines or
curves in chart
When mouse is released
BEGIN
if Slider Lock button is pressed
Update all grid lines
Else
Update single grid line spacing
from previous tab to current tab
Loop through all lines and
shapes to update their current
positions
Repaint entire chart to display
new grid and new shape and line
positions
END
END
______________________________________
SNAP ZONES
Snap zones or place holders are areas on a chart pre-designated for placing
shapes on the chart. Snap zones ensure that a shape is placed on the chart
in a location and orientation with the other shapes on the chart that
gives the chart a professional, clean look. When mouse 18 is used to
select a shape to be placed in a snap zone on a chart, the position of the
shape in the snap zone is automatically adjusted to the preset position in
the snap zone depending on the shape snap type. The preset positions for a
snap zone may be, for example, centered, left justified, top aligned, or
button aligned. Shapes may have independent horizontal and vertical
snapping attributes. The shape of a snap zone may be modified by changing
the slidable grid for the chart. Shapes previously placed in a snap zone
are automatically adjusted to the new grid spacing and snap zones.
Additionally, for some snap zones, shapes placed in the snap zone will be
automatically sized to fill the entire snap zone. Different templates have
different shapes and positioning snap zones depending on the anticipated
placement of shapes within the chart.
Returning to FIG. 3, comparison chart 76 uses snap zones to help in
creating chart 76. Each block in grid 146 of chart 76 represents a snap
zone. For example, snap zone 210 in chart 76 has been highlighted to
illustrate a typical snap zone defined by grid 146 in chart 76. Square
shape 212 has been placed within snap zone 210 and is perfectly centered
within snap zone 210. Comparison template 50 automatically sets the
positioning of shapes within the snap zones of grid 146 to the center of
each snap zone. This default positioning within snap zones is preset
because shapes placed within a comparison chart, like chart 76, are
generally centered in the blocks of grid 146 in order to prepare a
professional looking chart.
It is noted that if the user desires to override the preset snap zones, for
example, place a shape in chart 76 off-center a block in grid 146, then
snap zone off and on button 128 can be toggled turning off the snap zones
within grid 146. This allows a user of the present system to place a shape
anywhere on grid 146 without automatically snapping the shape to the
center of one of the blocks in grid 146.
FIG. 6 illustrates pyramid chart 174 of FIG. 4 prior to placement of all
pyramid sections 178 of pyramid 176. Pyramid sections 178 are chosen from
shape palette 136 and placed on pyramid 176. As shown in FIG. 6, second
section 214 of pyramid 176 has still not been filled with an appropriate
shape. Chart 174 does show snap zone 216 outlined by a dark line
indicating where second section 214 should be placed to complete pyramid
176. Returning to FIG. 4, second section 214 has now been completed by
selecting the appropriate shape from shape template 136 and placing the
shape in snap zone 216. Pyramid chart 174 in FIG. 6, therefore,
illustrates another use for snap zones so that graphics may be quickly and
cleanly created in accordance with the present invention.
FIG. 5 also illustrates the use of snap zones in accordance with the
present invention to quickly and clearly generate graphics. Concentric
circles 194 in target chart 192 represent the snap zones for chart 192.
Shapes selected from shape palette 136 automatically snap to concentric
circles 194 thereby creating a neat clean target chart. FIGS. 1 through 6
illustrate that snap zones can have many sizes, shapes, and positionings,
and that the type of chart dictates the configuration of the snap zones.
CYCLE SELECT
Cycle select is a feature that allows the user to select multiple shapes
from a shape palette and to switch easily between the shapes when placing
the shapes on a chart. An example of cycle select will be described in
referring to comparison chart 76 of FIG. 3. When creating comparison chart
76 the user has many shape choices available on shape palette 136. By
simultaneously selecting a number of these shapes, e.g., hexagon 218,
octagon 220, and star 222, for placement in chart 76, and using cycle
select, these shapes can be quickly and easily placed on chart 76.
Shapes are placed on chart 76 without cycle select by selecting the first
shape in shape palette 136 and placing the shape on grid 146. To place the
second shape on grid 146 the user must return to shape palette 136 and
select the second shape, and so on for the third shape. With cycle select
the user can select multiple shapes in shape palette 136 by depressing the
"control" (CTRL) key while selecting a shape or range of shapes by holding
down the "shift" key. Once cycle select has been activated, the first
mouse click in chart 716 will draw one of the selected shapes in the same
way shapes are usually drawn. What is different is that when the cursor is
over that shape, e.g., hexagon 226 on grid 146, it will change to cycle
select indicator 224. Clicking down within shape 226 again will replace
that shape by the next selected shape, octagon 220, so that the user can
repeatedly click down in the shape until the desired shape appears.
Cycle select provides the advantage of eliminating the need to go back to
shape palette 136 every time a different shape is desired.
An example of the pseudo-code that may be used to implement cycle select
may be found in Table II below.
TABLE II
______________________________________
Cycle Select
______________________________________
Part I: Shape Palette
When mouse clicked in shape palette over shape icon
If neither Control key nor Shift key pressed
BEGIN
Select shape in palette, deselect all
others
END
Else if Control key pressed
BEGIN
If shape already selected then
deselect, unless it is the only
selected shape
Else
select shape in addition to already
selected shapes
END
Else if Shift key pressed
BEGIN
Select range of shapes
END
Display shape icons that are selected as
pressed down, all others up
Designate shape that was clicked on as the next
to be drawn
Switch to shape draw mode
Part II: Shape Draw Mode
While moving mouse
BEGIN
If not over shape
Display shape draw cursor
Else if over shape
BEGIN
If shape under cursor is one
that is selected in the shape
palette display cycle select
cursor
Else
Display other cursor,
depending on chart type and
draw mode
END
END
When mouse is clicked down
BEGIN
If not over shape
Draw the next shape from the
palette that is designated to be
drawn
Else if over shape
BEGIN
If shape selected in the shape
palette
BEGIN
Replace shape with next
shape from palette that is
selected, or by first shape
when shape was last
selected shape
Designate the new shape as
the one that will be drawn
next
END
ELSE
Other action
END
END
______________________________________
INSERT/DELETE BUTTONS
Referring to FIG. 3, insert/delete buttons 88 allow for deleting or adding
rows, columns, or snap zones to a chart. To use buttons 88 the user must
first select one or more snap zones or place holders in a chart.
Alternatively, a shape previously placed on a chart may be selected.
Selecting a shape automatically selects the snap zone underneath the
selected shape. When the insert button (+) is selected, the user is
presented with a dialogue box asking whether to insert rows, columns, or
snap zones. When snap zones are to be inserted the user has the choice of
moving existing shapes in the chart down or to the left. Deleting shapes
or zones by selecting the delete button (-) works in a similar way.
Insert/delete button 88, therefore, works similarly to the insert/delete
row and column commands available with commercially available spreadsheet
programs.
Referring to FIG. 3, in order to insert a row before hexagonal shape 226,
shape 226 would first be selected with mouse 18 as shown. Then by
selecting one of insert/delete buttons 88, grid 146 is appropriately
modified so that a row, column, or shape is inserted into or deleted from
grid 146 at hexagonal shape 226.
FIG. 4 also illustrates how insert/delete butto | | |
