creating an electronic photo album presented by sarita yim (50147706), ken ma (50155522), vivian...
Post on 26-Mar-2015
212 Views
Preview:
TRANSCRIPT
Creating an Electronic Photo AlbumPresented bySarita Yim (50147706),Ken Ma (50155522),Vivian Cheung (50153147)
Run DownTotal 30-45 minutesIntroductionSteps to create electronic photo album Part 1: Inputting photo into
computer(Sarita) Part 2: Preparing file for a web site(Ken) Part 3: Setup personal web site(Vivian)
Q & A session
Introduction
Scenario – Taking lots of photos after traveling and gatherings.Problem – How to distribute and share photos in an efficient way?Solution – Creating an electronic photo album. Save your time and money.
Aim & Requirements
Aim – Provide basic concepts and idea on how to create a photo album.
Intended Audience – People with basic computer knowledge.
Hardware Requirement – Digital camera, scanner.
Software Requirement – Digital camera and scanner application program, Paint Shop Pro 7, FrontPage, Internet Explorer, FTP.
Three Main Parts
Part 1 – Inputting photo into computer
Part 2 – Preparing file for a web sitePart 3 – Setup personal web site
Part One: Inputting Photo into Computer
Inputting photo by digital camera.Scanning existing photo.Editing photo.
Inputting Photoby Digital Camera
Model : FujiFilm FinePix F601Setup and installationDownloading photo Switch the PC on. Connect the digital camera to the PC. Turn the camera. FinePixViewer(camera application
program) will start up automatically.
Layout of FinePixViewer
Photo are displayed in the right hand side
Digital camera are viewed as a storage drive
Download Photo
Select [Automatic Save] to download all photos
Inputting Photo by Scanner
Model: HP Scanjet 7400CSetup and installationScanning photo Switch on the scanner. Start “HP Precision Scan Pro”
(scanner application program). Place the photo on the scanner and
press [Scan] icon.
Layout of Precision Scan Pro
Press the icon to start scanning
Editing Photo
Modify the photo to suit what we need.Use Paint Shop Pro 7 (photo editor) to demonstrate the editing work. Basic function: resize, add title … Special effect: page curl, circle …
Example (Add Title)
Press [A] icon in toolbar
Add title here
Example (Circle)
Choose [Circle] to apply special effect from [Effect] menu
Saving Photo
File type Bitmap: Not vector graphic, cannot be
rescale immediately. JPEG: Vector graphic, rescale image
without losing the quality. PSP format: special for Paint Shop Pro,
can save the defined feature property. User can keep modifying the photo.
Compression
Compression
Reducing the photo size to save the storage space and transmission time.
File Size Quality Transmission Time
High Compression
Smaller size Worse quality
Shorter
Low Compression
Bigger size Better quality
Longer
Comparison on high and low compression
Part Two:Preparing file for a web site
Introduction to HTMLIntroduction to FrontpageCreate a new HTML page with photoFormatting the HTML Page LayoutDividing Each Page into Category
Introduction to HTML
HTML stands for the HyperText Markup Language Use to Construct HTML DocumentA HTML document should contain 3 parts: html, head and body which represent by <HTML>…</HTML>,<HEAD>…</HEAD>, <BODY>…</BODY>
Reference: http://www.cwru.edu/help/introHTML.TCh2.html
The first page of a website called index page.
Introduction to Frontpage (I)
Microsoft FrontPage is software which help you to build up web page without the knowledge of HTML
Frontpage
Introduction to Frontpage (II)
FrontPage provides many features which are are grouping in a toolbar. There are 3 types of toolbar: Standard Toolbar , Formatting Toolbar , Component Menu
Introduction to Frontpage (III)
Standard Toolbar – To perform basic functions new an html document, save, delete, copy, paste, etc.
Standard Toolbar
Introduction to Frontpage (IV)
Formatting Toolbar – To perform formatting on the html document
Formatting Toolbar
Introduction to Frontpage (V)
Component Menu – To select different components into the web page hyperlink, picture, button, etc.
Component Menu
Create a New HTML Page with Photo (I)
Step 2: Insert a picture into the blank page
Step 1
Step 2
Step 1: Create a new HTML page
Create a New HTML Page with Photo (II)
Step 4: Preview the HTML file in the web browser
Step 4Step 3
Step 3: Select the photo and add it into the web
page
Formatting the HTML Page Layout
Use “Table” to formatting the page Easy to organize information Have a better visualization on the page
Steps in Making Table Format (I)Step 1:
Insert a table into the HTML page Use mouse to highlight the no. of
rows and columns which the table should have
Step 1
Steps in Making Table Format (II)
Step 2:Set the border of the table to transparent:
Set the sizes of the borders property to 0 The table border will disappear in the HTML
editor
Step 2
Steps in Making Table Format (III)Step 3:
Insert picture into the left upper cell of the tableInsert another photo into the right lower cell of the tableMove the input cursor to the empty CellUse keyboard to type the words inside the empty cell
Step 3
Dividing Each Page into Category
You can group your photo album into different category, such as a page for showing pet, another page for showing daily photo, etc.
Steps in Dividing Category (I)
Step 1: Add a new frame page in FrontPage Select the style of the frame page
Steps in Dividing Category (II)
Step 1
Steps in Dividing Category (III)Step 2:
In the left hand column, click on the [New Page]button to add a new page in the frame
Insert a hyperlink (a link which link to another HTML Doc)
In the Create Hyperlink menu, select a file to associate with the hyperlink.
Steps in Dividing Category (IV)
Steps in Dividing Category (V)Step 2 (Continue):
Set the target frame which the html file will load after you click on the hyperlink
Steps in Dividing Category (VI)Step 2 (Continue):
Select the target frame by clicking on the right hand column with your mouse. And then Press “OK” button
Steps in Dividing Category (VII)Step 3:
Modify the text shown in the hyperlink by highlighting the originally text and re-type it
Preview the photo album in browser
Part Three:Setup a Personal Web Site
Choosing a web hosting serviceThe different types of web hosting services providers The differences between web hosting services providersA free web site account registrationPutting the files to the web siteSharing the photos at the web
Choosing a Web Hosting Service
Purposes Save storing photos spaceShare photos with our friends
Needs Enough storing spaceNo need email No need database
Budgets No money need to used
The Different Types of Web Hosting Services Providers
Free web hosting services providers
Paid web hosting services providers
The Differences between Web Hosting Services Providers (I)
Aspects Free web hosting services providers
Paid web hosting services providers
Payment No need to pay Monthly payment and set up fee (for the first time)
Domain name
Can only determine a part of your web address with your own name e.g. www.web-hosting.com/your-name or www.your-name.web-hosting.com
Can determine the web address with your own name e.g. www.your-name.com
Sub-domain Not support Can determine the services your web site provided with a easily way
The Differences between Web Hosting Services Providers (II)
Aspects Free web hosting services providers
Paid web hosting services providers
Disk spacing
Limited Unlimited, more your paid, more your get.
Bandwidth Less More
Email service
Email address with the web hosting company domain name
Email address with your own domain name
Supporting services
Limited, e.g. FTP More, but various in different web hosting company and web hosting plane.g. FTP, database, different computing language
The Differences between Web Hosting Services Providers (III)
Aspects Free web hosting services providers
Paid web hosting services providers
Limitation The size in each file,e.g. cannot larger than 170K / filethe type of each file, e.g. all the media file are not support, such as mp3, mpeg, etc.Unwanted advertisement banner
No limitation
Purpose For developing personal web site For developing company web site
A Free Web Site Account Registration
Basic features of Internet Explorer (IE) Steps of Registration a Free Web Site Account
Basic features of Internet Explorer (IE)
Back
Forward Stop Refresh Home
Address Bar
Steps of Registration a Free Web Site Account
Click [Start]>[Program]>[Internet Explorer]
Type “ www.angelfire.com” at address bar and click [Enter]
Click “Sign Up Now” button
Follow the instruction of the web site
Get username and password
Putting the Files to the Web Site
What is FTP?Download WS_FTPInstall WS_FTPBasic Features of WS_FTP Transferring Files to the Web Site
What is FTP?
File Transfer Protocol (FTP) For transfer file at InternetE.g WS_FTP
Downloading & Installation
Download from “www.download.com”
Installation Follow instruction form installation kit
Basic Features of WS_FTP (I)
Basic Features of WS_FTP (II)
Transferring Files to the Web Site
Check out host name, user name and password for uploading with WS_FTP
Make connection with WS_FTP
Transfer files from local side to server side
Sharing the Photos at the Web Site
Open IE
Type your web site address at the address bar and click [ENTER]
Now your photo album is displayed at the IE
Questions & Answer
top related