当前位置: 首页 > >

人机交互界面设计16148172《人机交互界面设计》课程实验教学大纲

发布时间:

《人机交互界面设计》课程实验教学大纲

课程名称:人机交互界面设计

英文名称:Human computer interaction interface design

课程编号: 48172

实验课性质:非独立设课

课程负责人:汪彩霞

开放实验项目数:1

大纲主撰人:汪彩霞

大纲审核人:王颖

一、学时、学分

课程总学时:32 课程总学分:2 二、适用专业及年级

实验学时:16 实验学分:1

软件工程专业

三、实验教学目的与基本要求

结合本学期所学知识,设计某部门网站首页,必须用响应式布局来做,能很好的适应

手机端和 PC 端,二级页面可以适当简单一些。通过本实验,主要达到以下目的: 1、加深对交互界面设计、软件工程、程序设计语言的理论知识的理解和应用水平。 2、掌握交互界面设计的基本方法,熟悉界面设计的步骤。 3、通过设计人机交互界面应用课题,进一步熟悉界面设计工具的操作技术,提高动手

能力,提高分析问题和解决问题的能力。

2、基本要求

1、布局合理且要有一定的技巧性。

2、界面美观,有相应的 CSS3 特效和 JS 特效。至少要有一种 CSS 特效和一种 JS 特效



3、内容和主题要协调,不可以设计与主题无关的内容。
四、主要仪器设备及消耗品

1、主要仪器设备
电脑、手机、HBuilder

2、消耗品


五、实验课程内容和学时分配

序号

实验项目名称

实验 实验 每组 实验 学分 时数 人数 类型

实验 要求

内容提要

移动端卖菜网界面设

1

2



基础

自行设计一个移动端的卖菜

2

1

移动端





移动端百度用户注册

2

2

页面设计

基础

2

1

移动端 设计手机端的百度登录界面



3

移动端界面设计

基础

设计一个碰壁反弹的界面效

2

2

1

移动端





4

响应式布局

基础 移动端+PC

2

2

1

设计一个响应式布局页面





5

照片墙的设计

基础 移动端+PC 设计一个照片墙,能使用各

2

2

1





种设备

基础 移动端+PC

6

Tab 切换效果制作

2

2

1

用 JS 设计 Tab 切换效果





7

放大镜效果设计

基础

2

2

1

PC 端



用 JS 设计放大镜效果

8

某网站界面设计

6

6 1-3 综合 完成界面 完成 PC 端和手机端的界面设

性 设计及实




六、考核方式

基础性实验占总成绩的 60%,设计性实验作为期末考核,整个实验占总成绩的 40%。 完成实验基本功能,该次实验得 20 分,能适应各种终端设备加 10 分,有创新性,并且刷新 速度快,消耗网络资源少等另加 10 分。
七、大纲使用说明:
要结合教材的实验资料和实验要求来进行。
八、实验指导书、参考书 1、指导书
Mooc 网教学视频 +课堂教学课件
2、推荐参考书: [1] 孟祥旭.李学庆主编.人机交互技术原理与应用.清华大学出版社[M],2004 年 9 月;
[2] 孙悦红.主编.面向用户的软件界面设计.清华大学出版社,2013 [3] 罗仕鉴.朱上上.孙守迁.人机界面设计.北京.机械出版社,2002 [4] (美)施奈德曼(Shneiderman,B.)等著.用户界面设计:有效的人机交互策略.电子工业出 版社,2006




友情链接: