Data Processing Third Term Note PT 2
Data Processing Third Term Note PT 2
DESIGN PACKAGE
Objective
At the end of this lesson, students understand the following:
a. Introduction to Web Design Packages
b. Types of Web Design
c. Examples of Web Design Package
d. Using Web Design
e. Advantages and Disadvantages of Web Design
f. Characteristics of Web Design Package
g. Component of Web Design
h. Designing a Website
1
Understanding a Web Page
The first step to setting up a web application is to understand its component. The main
component and only component of a web application is setting up a web page. A web
page is a text file containing Hypertext Markup Language (HTML) formatting tags and
links to graphic files and other web pages through a web server. In other word, it's an
interactive form of communication that uses a computer network. Web pages are unique
in such a way that they can be interactive and use multimedia.
Example is when a test is taken on the web and result can be forwarded to individual.
The main to remember when creating a web page is to establish a goal by setting many
links
2
Expression Web can design and develop web pages using HTML5, CSS 3,
ASP.NET, PHP, JavaScript, XML+XSLT and XHTML. Expression Web 4 requires
.NET Framework 4.0 and Silverlight 4.0 to install and run. Expression Web uses
its own standards-based rendering engine which is different from Internet
Explorer's Trident engine.
5. WebPlus X6 (Now owned by Microsoft): WebPlus X6 is the quick and easy way
for businesses for anyone who wants to create and publish eye-catching desktop
and mobile sites, without having to use any code. Whether using stylish
templates or designing from scratch, WebPlus X6 allows regular computer users
add advance features to unique sites with drag-and-drop simplicity.
6. NetObjects Fusion which are commercial programs: It has a graphical user
interface and generates HTML or XHTML through its own proprietary database.
The user interface of NetObjects Fusion has been praised as elegant and
user-friendly by users and observers.
7. Amaya: Amaya (formerly Amaya World) is a discontinued free and open source
WYSIWYG web authoring tool with browsing abilities.
Amaya is a Web editor, i.e. a tool used to create and update documents directly
on the Web. Browsing features are seamlessly integrated with the editing and
remote access features in a uniform environment. This follows the original vision
of the Web as a space for collaboration and not just a one-way publishing
medium.
Amaya started as an HTML + CSS style sheets editor. Since that time, it was
extended to support XML and an increasing number of XML applications such as
the XHTML family, MathML, and SVG. It allows all those vocabularies to be edited
simultaneously in compound documents.
3
4. Appropriate Design Elements:This is where you can have a lot of fun with a design.
Your creativity can go wild here with texture, icons, patterns, etc. However, keep in mind
that design elements also play a big role in setting the mood of the design. So keep things
consistent with the goals of website and its audience. Also keep the design elements
consistent with the other three components I've already mention.
4
GRAPHICS PACKAGES
Learning objective
At the end of this chapter, students understand the following:
Introduction of graphics package
Types of graphics package
Examples of graphics package
Uses of graphic package
Components of graphics
Corel draw
Features of Corel draw
Working with Corel draw
Painting packages
A painting package produces images by changing the color of pixels on the screen. These
are coded as a pattern of bits to create a bitmapped graphics file. Bitmapped graphics
are used for images such as scanned photographs or pictures taken with a digital
camera.
5
Drawing packages
A drawing packages produces images that are made up from coloured lines and shapes
such as circles, squares and rectangles. When an image is saved it is stored in a vector
graphics file as a series of instructions which can be used to recreate it.
Microsoft paint
Using Microsoft paint, or MS Paint, is the first experience with graphics software for
most home experience with graphics software for most home users. Originally
known as paint brush for windows, this simple paint program has been included as a
standard feature of every version of windows. It is typically found in the accessories
folder by clicking the “paint” icon. The program is considered basic by graphics
professionals, but it does allow users to make standard modifications to images and
to save changes in a variety of file format. Several artists have made a name for
themselves by using Microsoft paint to make stunning recreations of the Mona Lisa
6
and other famous works of art.
Adobe photoshop
The standard graphics software product on the market is undoubtedly Adobe
photoshop. This software is used to design almost any style of graphics that can be
imagined. Advanced features built right into the core of the software have made
photoshop the flagship product of adobe. The software is further strengthened by a
large variety of third party plug ins that add endless potential of the effects that can
be generated with photoshop. The only element missing from photoshop is the
ability to create animated GIF images; however, the product is accompanied by
Adobe image ready, which can be used to animate your photoshop images.
Corel draw
Corel draw is one of the original software programs for computer graphics. Although
it has been on the market longer than most competitors, it is not advertised as
vigorously and can sometimes be overlooked by those who are new to computer
graphics. Corel draw provided a designer with one of the most powerful graphics
software packages money can buy. Not only does it create standard graphics, but
many people use Corel draw for basic 3-D rendering as well. Corel also features suite
of graphics editing programs designed for video DVD use.
The Gimp
The Gimp or GNU image manipulation program is a free, open source image editing
application for photo retouching, painting, compositing, and image creation. The
GIMP originated as a program for UNIX and X, but has been ported to many other
platforms including Linux, Macintosh and windows. Often lauded as the “free
photoshop,” GIMP does have an interface and features similar to photoshop. Here
you can find links to tutorials and other resources for the GIMP user community.
Adobe fireworks
The adobe firework (formerly macromedia fireworks is a bitmap and vector
graphics editor. It was originally developed for web designers to rapidly create
website prototypes and application interfaces. Its features include slices and the
ability to add hotspots. It is designed to integrate with other Adobe products such as
Adobe Dreamweaver and Adobe Flash.
7
Components of graphic packages
A paint pallet from which different colors and patterns can be chosen
A fill option for coloring in shape or area on the screen with a color or pattern
from the paint palette
Most graphics packages have a built-in library or clipart pictures.
Zoomed or magnify is a feature that allows an area of the screen to be seen
close up for detailed work.
Special brushed such as an airbrush can be used to achieve different paint
effects on the screen.
Corel draw
Corel draw is an integrated vector-based design tool (program) that makes it easy to
create professional artwork like logos (a symbol that represent a company or
organization) complimentary cards, wedding cards, invitation cards, certificates,
greeting cards, calendars, letter headed paper and any design you can think of.
Corel draw provides tools and special effects that will enable you as the user efficiently
to produce beautiful graphics of high quality. It was designed by Corel corporation.
8
Menu bar
There are 11 pull down menus. All menu commands are found in these pull-down
menus.
Rulers
Rulers serve as a positioning and sizing aid. They can be turned off optionally. In
addition, you can drag guidelines off the rulers to serve as drawing aids.
Drawing window.
The large whit portion of the screen is the drawing window. The rectangle with the drop
shadow is the printable page. Use the entire side of the page as pasteboard or a test
area.
Roll-up window
The transformation(position) roll-up shown on the left. Although they are not
permanent part of the interface (they can be if you want, roll-up windows are nicely
packed persistent dialog boxes that remain on the screen as long as you want them. You
can use them to control many Corel draw’s operations their beauty lies in the fact that
they can remain active for playing quick “what-ifs” without going through the longer
process of invoking a standard menu dialog.
Much of the functionality of the roll-up has been replaced by the more convenient
property bar. Our criteria for teaching are always based on ease of learning. Sometimes
it is easier to learn from a roll-up. Other times the property bar may offer the better
method.
Dockers
New to Corel Draw 8 is a screen feature called “Dockers”. Dockers are a variation of
roll-up but differ in that they can be docked to the interface shell. In general, Dockers
are document managers. For example, there is a view manager Dockers which is very
helpful when your images become more complex. Although we will show you how they
work a little later, you won’t have use for them until advanced training.
Status bar
Status bar shows the file pattern, outline, location, movement and absolute coordinates
of selected objects. The status bar changes dynamically depending on the action. You
can customize the status bar to show different kinds of information.
9
can place custom palette can be turned off optionally. You can also specify how rows of
colors you want showing.
Page counter
Corel draw allows you to create drawings constituting of multiple pages. The total
number of pages is displayed in the page counter box along with arrows that allow you
to page forward or back in your document.
The toolbox
The toolbox provides you with (surprises) operational tools. They are briefly
summarized in the graphics on the following pages. We will explore each tool in much
greater detail later in the training.
to facilitate your learning, we have divided these tools into a few basic categories:
1. Utility tools
2. Diagramming objects
3. Interactive tools
4. Painting tools
10
Utility tools
The pick tool
1. For selecting objects
2. For moving, rotating and skewing objects.
Diagramming objects
All the following tools are uses of place objects on the page. We call these “diagramming
objects”.
Four tools for creating basic drawing primitives
The freehand (curve) Tool
1. For drawing straight lines, curves
2. For auto-tracing a bitmap image.
3. The freehand fly out gives you access to the Bezier (curve) tool; the natural pen
tool; dimension line tool and connector line tool.
The rectangle tool
It is used for drawing rectangles and squares.
11
Interactive blend tool
The interactive blend flies out give you access to the new distortion; interactive envelop,
extrude and drop shadow tools. Two tools to paint the diagramming objects.
12
WORKING WITH COREL DRAW
Loading the Corel draw application
To access to Corel draw application takes the following steps:
1. Click on the start button.
2. Point to all programs
3. Point to Corel draw graphic suite 12
4. Select Corel draw
Setting up the drawing page
To set the page orientation, take the following stapes.
1. Click layout, page set up
2. On the page set up dialogue box, choose landscapes or portrait.
To set paper paper type or size
1. Click layout, page set up on the dialogue select paper type and size that is A4,
legal, etc.
To insert a page
1. Click layout, insert page
2. Type the number of pages you want to add in the insert pages box
3. Click before or after to specify where you want to add the page relative to the
active page.
To rename a drawing page.
1. Click layout, rename page
2. Type the name of page in the page name box
3. Click ok
13
2. Click the browse button
3. Choose the file format of the bitmap you want to import from the files of type
box.
4. Choose the drive and folder were the file is stored from the look in list box.
5. Double click the folder and the filename
To break a path
1. Select the curve object with the shape tool
2. Using the shape tool, click where you want to break the path
3. Click the break curve button on the property bar
14
2. Choose a drive and folder where you want to save your drawing from the save in
list box. If necessary
3. Type a name in the file name box in the case MY FIRST COREL DRAW FILE.
4. Click ok
15
MAINTENANCE, ETHICS AND HUMAN ISSUES
Maintenance of Computer 1
Objectives
At the end of this topic, you are expected to have known:
Explain and carry out basic computer maintenance procedures
16
may drip inside the monitor and damage it.
Step 6: For dusty or dirty manufacturing environments, use a computer monitor dust
cover to protect the monitor.
17
recharging.
18