Thiết kế giao diện web xem phim online

BỘ GIÁO DỤC VÀ ĐÀO TẠO
TRƯỜNG ĐẠI HỌC HÙNG VƯƠNG THÀNH PHỚ HỜ CHÍ MINH

Báo Cáo Kết Thúc Mơn

Thiết kế đờ họa 1
(Photoshop)
Ngành: CƠNG NGHỆ THƠNG TIN

Đề tài :
Thiết kế giao diện Web xem phim online.

Giảng Viên: Võ Thị Lắm
Sinh viên thực hiện: Huỳnh Thanh Thiên + Nguyễn Thành Chiến


MỤC LỤC
PHẦN 1: TÌM HIỂU VỀ PHẦN MỀM ADOBE PHOTOSHOP
1.1

Lịch sử hình thành và phát triển.

1.2

Sản phẩm và bài tập minh họa.

PHẦN 2: THỰC HÀNH
2.1 Lý do chọn đề tài.
2.2 Màu chủ đạo trang Web.
2.3 Đối tượng xem Web.
2.4 Các bước tạo Web.

PHẦN 3: NHẬN XÉT CHUNG VỀ MÔN HỌC


Phần 1 :
Lịch sử hình thành và phát triển Adobe Photoshop.
-Từ thuở niên thiếu, hai anh em Thomas Knoll và John Knoll đã thành thạo
kỹ thuật xử lý ảnh trong buồng tối, do ảnh hưởng bởi niềm đam mê nhiếp
ảnh của người cha - Glenn Knoll, giáo sư Đại học Michigan. Hai cậu
Thomas và John cũng yêu thích việc lập trình trên máy tính Apple II.
-Xúc cảm từ nghệ tḥt nhiếp ảnh tác động đến việc chọn nghề của
Thomas và John. Thomas theo ngành khoa học máy tính tại Đại học
Michigan, luôn quan tâm đến những giải thuật xử lý ảnh (thu nhận từ máy
quét). Khác với người anh, John tìm đến Đại học Southern California, theo
ngành điện ảnh.
-Năm 1987, trong khi Thomas đang thực hiện luận án tiến sĩ về xử lý ảnh,
John tớt nghiệp đại học và tìm được việc làm "trong mơ" tại Công ty ILM
(Industrial Light and Magic), nơi chuyên thực hiện kỹ xảo hình ảnh cho các
xưởng phim ở Hollywood.
-Khi thực hiện luận án, Thomas thử nghiệm nhiều giải thuật xử lý ảnh trên
máy tính Mac (Macintosh). Máy Mac vào lúc đó dùng màn hình đơn sắc,
khiến anh phải nghiên cứu giải thuật giả lập sắc độ xám để hiển thị được
ảnh "đen trắng" trên màn hình. Thomas đặt tên cho tập hợp các chương
trình nhỏ của mình là Display.
-Trong một lần về thăm nhà ở Michigan, John nhận thấy Display có nhiều
nét giớng với phần mềm xử lý ảnh mà anh thường dùng trên máy tính
Pixar đắt tiền tại ILM. Khơng thể đứng ngoài "cuộc chơi", John tham gia
vào việc phát triển phần mềm Display, tự tạo thêm hoặc đề nghị Thomas
tạo thêm các chức năng mới cho Display giúp ích cho việc làm phim ở ILM.
-John đề nghị Thomas đổi tên Display đơn giản thành tên khác, hấp dẫn

hơn. Lúc đầu cả hai chọn tên ImagePro, sau đổi thành PhotoLab, cuối


cùng nhất trí chọn tên PhotoShop, một tên chưa ai dùng. Tuy nhiên, khi
John đề nghị thương mại hóa PhotoShop, Thomas lại e ngại vì khơng
ḿn nhảy vào cuộc kinh doanh trong lúc luận án còn dở dang.
-Tin chắc vào triển vọng của PhotoShop, khi trở lại làm việc tại California,
John tìm cách liên lạc với nhiều cơng ty ở vùng Silicon Valley để tìm kênh
phân phới chun nghiệp cho sản phẩm "cây nhà lá vườn" của mình. Vừa
thúc giục Thomas tiếp tục bổ sung chức năng cho PhotoShop, John vừa
biên soạn tài liệu hướng dẫn sử dụng. Sau khi gửi lại tài liệu cùng đĩa mềm
PhotoShop tại nhiều công ty, chờ thẩm định và nhận được nhiều lời từ
chối, cuối cùng John cũng đạt được ý nguyện. Công ty Adobe chấp thuận
phân phối PhotoShop với tên gọi Adobe Photoshop (Shop được sửa thành
shop).
-Để hoàn thiện Photoshop trước khi phát hành, hai chuyên viên của Adobe
- Steve Guttman và Russell Brown - đề nghị với John nhiều sửa đổi về cấu
trúc và giao diện của phần mềm. John truyền đạt lại cho Thomas ở
Michigan qua điện thoại. Cứ vài ngày, Thomas lại ra bưu điện, gửi cấp tốc
đĩa mềm chứa chương trình vừa chỉnh sửa cho Adobe (lúc đó chưa phải là
thời đại Internet).


Một số sản phẩm minh họa :



Phần 2 :
Thiết kế Banner Trường :

-

Sử dụng đa phần là Text và Shape.

-

Hình cơ gái chúng ta cắt ra bằng Magic Wand Tool (đổ bóng cho ảnh cơ
gái ta dùng Bevel & Emboss.


Thiết kế giao diện Web xem phim.

 Lý do chọn đề tài :
-

Xã hội hiện nay có rất nhiều thứ diễn ra xung quanh mình, do đó cũng gây
ra áp lực công việc, áp lực học tập, về kinh tế , chính trị. Tất cả mọi người
ai cũng có một nỡi lo của riêng mình, chính vì lúc đó mọi người cần có
những giây phút thư giãn, xã stress. Đây cũng là mục đích mà em chọn đề
tài này. Nhằm mục đích để mọi người có nơi thư giãn, xem phim, giải trí
sau những khung giờ mệt mỏi, áp lực.

 Màu chủ đạo của trang Web :
+ Màu phụ : Xám.
+ Màu chính : Đen.
-

Đới với trang này, có thể thấy là màu nền đen sẽ là màu dễ nhìn nhất cho
dù là trong tối thiếu sáng, hay bên ngoài ánh sáng cao độ. Phù hợp với
nhiều lứa tuổi từ trẻ em đến người già.

-

 Đối tượng xem Web :

-

Như đã đề cập thì Web được xây dựng nhằm mục đích thư giãn và giải trí
cho nên hầu như mọi lứa tuổi, mọi người đều có thể truy cập và xem phim.
Xem phim hiện tại có thể cũng là một thói quen đới với người người nhà
nhà.

 Các bước tạo Web :
-

Dùng Adobe Photoshop để thiết kế giao diện trang Web.
Thiết kế Logo cho trang Web, Bố cục trang Web phải đầy đủ và hợp lí
( bao gồm Header, Banner, Menu, Nội Dung..., Footer).
Quản lí layer thật tớt đưa vào 1 Group để dễ dàng chỉnh sửa.


Tạo banner :

- Sử dụng lệnh Transform để Scale 2 bức ảnh của 2 nhân vật.


- Để tạo đường cong cho Text thì ta dùng Create warped text.

Tạo Footer :

-

Dùng Elipese tạo những ô và tô màu cam, chèn text vào.


-

Dán những icon liên hệ vào và chèn thông tin liên hệ.

Thiết kế nợi dung :
-

Chọn những hình ảnh Poster từ những bộ phim hay gắn vào phần nội
dung.


-

Giới thiệu sơ lược về bộ phim

-

Chia bố cục rõ ràng cho từng mục. Đa phần ta dùng Shape và Text, rồi ta
chèn ảnh vào.



Cắt và Xuất HTML
- Sử dụng Slice Tool để cắt:

- Xuất File Html :

-

Chọn file > export > Save for web > lưu với định dạng HTML and IMAGE.

Những hình ảnh sau khi cắt :


Trang Web HTML chính thức sau khi Export:

Hình ảnh 2 trang đã thiết kế ->>




Hình ảnh động (GIF) :

-

Vào window bật Timeline và thiết kế từng frame ảnh theo ý muốn.


- Xuất file định dạng GIF.

Nhận xét chung về môn học :
-

Photoshop là phần mềm chỉnh sửa đồ họa được tạo ra bởi hãng Adobe

Systems vào năm 1988 trên hệ máy Macintosh. Photoshop được đánh giá
là phần mềm dẫn đầu thị trường về sửa ảnh bitmap và được coi là chuẩn
cho các ngành liên quan tới chỉnh sửa ảnh.

-

Từ khi ra đời, phần mềm đồ họa photoshop đã thể hiện được sự vượt trội
so với các đới thủ khác. Nó giúp cho bạn hịa mình vào với thế giới đồ họa
hùn bí, nơi bạn có thể sáng tạo ra các tác phẩm mang phong cách cá
nhân và tạo ra sự đột phá mạnh mẽ nhất có thể. Nó giúp bạn chuyển hình
ảnh thành kiệt tác.
Tính linh hoạt của nó đã làm cho nhu cầu trong thế giới sáng tạo cho nó là
phần mềm chỉnh sửa ảnh tớt nhất. Chương trình cung cấp cho bạn các
tính năng tuyệt vời cho một thiết kế hoàn toàn tuyệt vời. Hơn nữa,
Photoshop thân thiện với người dùng và nó cung cấp cơng cụ sẽ giúp bạn
trong việc chỉnh sửa ảnh. Bạn cũng có thể làm vài lay-out và thiết kế từ
một cái tài liệu trớng, với mọi kích cỡ mà bạn ḿn

-


-

Photoshop là phần mềm chỉnh sửa ảnh do đó nó cho phép chúng ta chỉnh
sửa ảnh cho các ấn phẩm.
Photoshop còn được sử dụng phổ biến trong các hoạt động như:
– Thiết kế trang web
– Thiết kế trong lĩnh vực thời trang
– Vẽ các loại tranh (matte painting và nhiều thể loại khác),
– Vẽ texture cho các chương trình 3D…