浅析网页和安卓界面设计异同点——以高校电力能源管理系统为例

摘  要：随着现代移动互联网的迅猛发展，智能手机以迅雷不及掩耳之势普及到了寻常手机用户的手中，与此相应而言的各类手机应用也应运而生，越来越多的开发者放弃网页开发，投身到手机应用开发上来。本次毕业设计选题,旨在研究手机界面和网页界面的设计差异、两者不同的用户体验为主要研究内容,并通过高校电力能源管理系统的界面设计方法, 以Web页面设计与Android手机界面设计进行对比研究，阐述了手机界面和网页界面各自的特点及差异，从中获得了一些不同效果的设计成果和成功的经验。

关键词：Web界面设计 Android界面开发 设计差异 电力能源管理系统

目 录

1 引言 1

1.1 课题的研究背景及意义 1

1.2 研究现状与发展趋势 1

2 课题的研究目标和内容 2

2.1 课题的研究目标和内容 2

2.2 我完成的相关任务 2

3 开发环境以及项目中应用到的关键技术 4

3.1 界面设计开发环境 4

3.2 界面设计开发工具 4

3.2.1 Photoshop 4

3.2.2 Coreldraw 5

3.2.3 Visual studio 5

3.2.4 Flash 6

3.2.5 Eclipse 6

3.2.6 IETester 6

3.3 技术 7

3.3.1 XML 7

3.3.2 DIV+CSS 7

3.4 关键技术的研究 8

3.4.1 手机界面分辨率规格 8

3.4.2 手机界面字号 9

3.4.3 网页的设计与技术 12

4 系统需求分析 13

4.1 系统需求分析 13

4.1.1 系统概述 13

4.1.2 系统基本目标 13

4.1.3 系统性能需求 14

4.1.4 用户群体分析 14

4.2 系统总体结构设计 15

4.2.1 总体结构图 15

4.3 项目进度计划 15

5 Web页面设计 16

5.1 了解客户需求 16

5.2 收集整理相关资料 17

5.3 规划网站结构、书写页面设计文档 18

5.4 实现设计思想、出页面效果图 18

5.5 用户确认 22

5.6 切割成静态页面（HTML页） 23

5.7 添加页面特效（JS，Flash等） 23

5.8 交付程序员嵌入代码 23

5.9 Web页面兼容性测试 23

6 Android手机端界面设计 23

6.1 了解客户需求 23

6.2 收集整理相关资料 23

6.3 规划手机界面结构、书写页面设计文档 24

6.4 实现设计思想、出页面效果图 24

6.5 用户确认 27

6.6 界面切割成PNG格式 27

6.7 交付程序员嵌入代码 27

7 Web页面和Android手机界面设计比较 28

7.1 Web页面和Android手机界面设计的不同点 28

7.1.1 界面数据的展现 28

7.1.2 整体结构 29

7.1.3 界面颜色 30

7.1.4 运行速度 30

7.1.5 兼容性 30

7.1.6 字号 31

7.1.7 图标 31

7.2 Web页面和Android手机界面设计的相同点 31

7.2.1 用户体验 31

7.2.2 界面基调 31

8 总结与展望 32

致谢 33

参考文献 35