Bài giảng Nhập môn Công nghệ phần mềm: Chương 5 - Đỗ Thị Thanh Tuyền

NHẬP MÔN
CÔNG NGHỆ PHẦN MỀM

Giảng viên: Đỗ Thị Thanh Tuyền
Email:


Nội dung môn học
n Tổng quan về Công nghệ phần mềm
n Xác định và mơ hình hóa u cầu phần mềm
n Thiết kế phần mềm: - Thiết kế GIAO DIỆN
n Cài đặt phần mềm
n Kiểm thử và bảo trì
n Đồ án mơn học

Nhập mơn Cơng nghệ Phần mềm

2

January 15


Thiết kế giao diện người dùng
n Nội dung và hình thức trình bày các màn hình giao tiếp
của phần mềm.
n Hệ thống các thao tác mà người dùng thực hiện trên
màn hình giao tiếp và xử lý tương ứng của phần mềm.

Nhập môn Công nghệ Phần mềm

3

January 15


Kết quả đạt được
n Danh sách các màn hình
n Sơ đồ liên kết các màn hình
n Mơ tả từng màn hình:
Ø  Mơ tả các đối tượng trên màn hình;
Ø  Danh sách biến cố và xử lý tương ứng.

Nhập môn Công nghệ Phần mềm

4

January 15


Danh sách các màn hình

STT

Màn hình

Loại màn hình

1

Màn hình Tiếp
Màn hình nhập liệu

nhận bảo trì xe

2

Màn hình Lập
Màn hình nhập liệu
phiếu sửa chữa

3

Màn hình Tra
Màn hình tra cứu
cứu xe

4
5

Màn hình Lập
Màn hình nhập liệu
phiếu thu tiền
Màn hình Báo
Báo biểu
cáo tháng

Nhập môn Công nghệ Phần mềm

5

January 15

Chức năng
Cho phép nhập và lưu trữ
thông tin về các xe sửa chữa.
Cho phép nhập và lưu trữ
thông tin về các phiếu sửa
chữa.
Cho phép nhập các tiêu chuẩn
tra cứu và trình bày các kết
quả tra cứu được.
Cho phép nhập và lưu trữ
thông tin về các phiếu thu tiền.
Trình bày kết quả báo cáo.


Sơ đồ liên kết các màn hình
n Hệ thống các màn hình cùng với quan hệ về việc chuyển
điều khiển giữa chúng.
n Hệ thống các màn hình = Màn hình chính + Các màn hình
thực hiện các cơng việc của phần mềm.
n Ký hiệu:

Tên màn hình

Nhập mơn Cơng nghệ Phần mềm

6

January 15

Mơ tả chi tiết từng màn hình
n Mơ tả các đối tượng trên màn hình
STT
1

Tên

Kiểu

txtSĐT

TextBox

Ràng buộc
Nhập ký số 0-9

Chức năng
Nhập số điện thoại
của chủ xe

n Danh sách biến cố và xử lý tương ứng trên màn hình
STT
1

Biến cố
Chọn button Cập nhật

Nhập mơn Công nghệ Phần mềm

7

Xử lý
Lưu thông tin về xe sẽ sửa chữa
xuống CSDL

January 15


Phân loại màn hình
n Màn hình chính: cho phép người sử dụng chọn các công
việc sẽ thực hiện với phần mềm.
n Màn hình nhập liệu: cho phép người sử dụng nhập vào
các thơng tin để lưu trữ hoặc tính tốn.
n Màn hình tra cứu: cho phép tìm kiếm thơng tin đã được
lưu trữ với các tiêu chuẩn tìm kiếm.
n Màn hình thơng báo: hiển thị các thông báo, nhắc nhở.
n Báo biểu: các báo cáo thống kê theo một mốc thời gian
định sẵn.
Nhập môn Công nghệ Phần mềm

8

January 15


Kiến trúc màn hình

Thành phần nhập liệu
Các nút xử lý
Thơng tin kết quả

Nhập môn Công nghệ Phần mềm

9

January 15


Thành phần nhập liệu
n Cho phép người sử dụng nhập dữ liệu dưới nhiều hình
thức khác nhau:
Ø  Text Box
Ø  Combo Box
Ø  List Box
Ø  Radio Button/Option Button
Ø  Check Box/Tick Box

Nhập môn Công nghệ Phần mềm

10

January 15


Các nút xử lý
n Các nút xử lý cho phép người sử dụng yêu cầu phần
mềm thực hiện một xử lý nào đó.
n Tên các nút xử lý:
Ø  Khơng q dài
Ø  Gợi nhớ

Ø  Nhất qn trong tồn hệ thống

Nhập mơn Cơng nghệ Phần mềm

11

January 15


Thông tin kết quả
n Cho phép người sử dụng xem thông tin kết quả dưới
nhiều hình thức khác nhau:
Ø  Label
Ø  Text Box
Ø  List Box

Nhập môn Công nghệ Phần mềm

12

January 15


Các bước thực hiện
Sơ đồ luồng dữ liệu

Thiết kế màn hình với tính đúng đắn
Màn hình đúng đắn

Thiết kế màn hình với tính tiện dụng

Màn hình hiệu quả

Màn hình tiện dụng

Thiết kế màn hình với tính hiệu quả
Màn hình kết quả
Nhập môn Công nghệ Phần mềm

13

January 15


Thiết kế màn hình với tính Tiện dụng
n Giao diện quen thuộc (dựa trên biểu mẫu tương ứng).
n Bố trí hợp lý.
n Cung cấp thêm thông tin cho người dùng.
n Cho phép nhập nhiều giá trị đồng thời (trên List Box).

Nhập môn Công nghệ Phần mềm

14

January 15


Thiết kế màn hình với tính Hiệu quả
n Chọn control thích hợp (Text Box/Combo Box...).
n Cung cấp giá trị mặc định cho ô nhập liệu.
n Hiển thị kết quả một cách trực quan (dùng màu sắc,

hình vẽ, chú thích...).

Nhập mơn Cơng nghệ Phần mềm

15

January 15


Thiết kế màn hình chính
n Từ danh sách các u cầu phần mềm (nghiệp vụ, chất
lượng và hệ thống), tiến hành phân nhóm các cơng việc:
Ø  Theo chức năng Tin học:
•  Hệ thống
•  Lưu trữ
•  Tra cứu
•  Báo biểu

Nhập mơn Cơng nghệ Phần mềm

16

January 15


Thiết kế màn hình chính (tt)
Ø  Theo đối tượng: danh sách các đối tượng và các công
việc sẽ thực hiện trên từng đối tượng.
Ø  Theo nghiệp vụ, qui trình: trình bày các cơng việc
theo trình tự của cơng việc trong qui trình.

Nhập mơn Cơng nghệ Phần mềm

17

January 15


Thiết kế màn hình chính (tt)
n Lựa chọn hình thức trình bày:
Ø  Thực đơn (kết hợp sử dụng phím nóng)
Ø  Biểu tượng
Ø  Sơ đồ

Nhập môn Công nghệ Phần mềm

18

January 15


Thiết kế màn hình Tra cứu
n Cho phép tra cứu theo nhiều tiêu chuẩn khác nhau, ưu
tiên chọn các tiêu chuẩn tra cứu quen thuộc và dễ dàng
cho người sử dụng.
n Cho phép tìm và cập nhật lại thơng tin đã lưu trữ.
n Kết quả tra cứu = Thông tin của đối tượng và quá trình hoạt
động của đối tượng.
n Hỗ trợ xem kết quả tra cứu dưới nhiều hình thức khác nhau
(danh sách, biểu đồ, hình ảnh…).

n Bổ sung các nút điều khiển cho nhu cầu kết xuất ra máy in,
tập tin...
Nhập môn Công nghệ Phần mềm

19

January 15


Thiết kế màn hình Nhập liệu
n  Thành phần nhập liệu: kiểm tra tất cả dữ liệu nhập dựa vào ràng
buộc tự nhiên và ràng buộc nghiệp vụ (qui định liên quan).
Thông thường mã số được phát sinh tự động.
n  Các nút xử lý:
Ø  Thêm mới, Lưu…
Ø  Bổ sung các nút chuyển điều khiển đến màn hình có liên quan.
n  Thơng tin kết quả: trình bày kết quả nhập liệu.
Nên bổ sung thơng tin tính tốn (số sách đã mượn, tổng số tiền
hiện tại của hóa đơn…).

Nhập mơn Cơng nghệ Phần mềm

20

January 15


Thiết kế màn hình thơng báo
n Thơng báo về kết quả thực hiện yêu cầu (thành công/thất
bại + nguyên nhân).

n Thông báo đúng lúc.
n Cung cấp phản hồi của hệ thống khi cần thiết (progress bar,
thông báo chờ khi hệ thống đang thực hiện một xử lý mất
nhiều thời gian…).
n Thiết kế đơn giản, gồm thông tin cần thông báo (cô đọng
nhưng dễ hiểu) và các nút chọn.
Chú ý không thiết kế quá nhiều nút chọn, chọn nút mặc
định theo cách xử lý thông thường.
Nhập môn Công nghệ Phần mềm

21

January 15


Thiết kế Báo biểu
n Giữ lại tiêu đề báo cáo khi qua trang khác hoặc khi kéo
thanh trượt lên xuống.
n Lưu ý kích thước khác nhau về khơng gian hiển thị giữa
báo biểu in ra giấy và báo biểu xuất ra màn hình.
n Chỉ hiển thị những thơng tin thật sự cần thiết, tránh làm rối
báo biểu.

Nhập môn Công nghệ Phần mềm

22

January 15

Một số nguyên tắc trong thiết kế giao diện
n Tất cả màn hình phải có tên.
n Thiết kế phù hợp với đối tượng sử dụng.
n Dễ học, dễ nhớ, phù hợp với người mới sử dụng, đồng thời
hỗ trợ các cách làm nhanh, làm tắt cho người sử dụng có
kinh nghiệm.
n Chú ý mơi trường triển khai ứng dụng cũng đòi hỏi những
nguyên tắc thiết kế khác nhau do có sự khác nhau về tốc độ
thực hiện các xử lý (web form, win form…).
n Thứ tự trình bày trên màn hình phải phù hợp với văn hóa,
thói quen của người sử dụng.
Nhập mơn Cơng nghệ Phần mềm

23

January 15


Một số nguyên tắc trong thiết kế giao diện (tt)
n Chỉ trình bày những nội dung thật sự cần thiết, khơng
trình bày q nhiều thơng tin trên một màn hình.
n Chọn font chữ rõ ràng, cỡ chữ phù hợp, dùng chữ in hoa
đúng trường hợp.
n Màu sắc hài hòa, nên dùng màu lạnh, chỉ dùng màu nóng
khi cần gây chú ý (hoặc có thể dùng chớp, nháy).
n Kết hợp màu nền và màu chữ hợp lý.
n Không dùng quá nhiều màu sắc trên một màn hình.

Nhập mơn Cơng nghệ Phần mềm

24

January 15


Một số nguyên tắc trong thiết kế giao diện (tt)
n Nhất qn trong tồn bộ hệ thống về:
Ø  Cách trình bày: font chữ, màu sắc, vị trí các mục
Ø  Tên các nút điều khiển
Ø  Ý nghĩa biểu tượng
n Số bước để đi đến một màn hình cơng việc chính phải
<=3

Nhập mơn Cơng nghệ Phần mềm

25

January 15