团队作业2

目录


一、代码规范及编码原则

  1.代码风格规范

    (1)缩进

    (2)行宽

    (3)括号

    (4)代码采用格式

    (5)空白行

    (6)分行

    (7)命名

    (8)大小写

    (9)注释

    (10)代码采用编码格式

  2.代码设计规范

    (1)友好礼貌

    (2)清晰明确

    (3)便捷优雅

    (4)统一稳定

    (5)视觉规范

    (6)代码设计规范

二、数据库设计
三、项目ER图
四、团队项目主要功能流程描述
五、小组分工及贡献分

一、代码规范及编写原则

  • 代码风格规范:主要在文字上的规范,看似表面文章,实际上非常重要。
  • 代码设计规范:牵涉到程序设计、模块之间的关系、设计模式等方方面面的通用规则。

代码风格规范(编码原则)

遵循代码风格的基本原则:简明、易读、无二义性。

1、缩进:Tab键或者4个空格。

例如:

2、行宽:限定为100个字符。

3、括号:括号清楚不仅仅可以表示执行逻辑的优先级,还可以是代码看起来比较易懂。

例如:

 

4、代码采用格式:

 

5、空白行:为了使代码看得更加的清楚明白,使用空白行将每个功能的部分分隔开。例如:

6、分行:不把多条语句放在一行上,不把多个变量定义到一行上。例如:

var s= [],s1=[];

应该改为:

var s=[];

var s1=[];

7、命名:根据函数、变量在代码中起的作用进行命名。

例如:

 

 

8、大小写:变量名(有时使用小写)、类采用首字母大写的格式。函数名采用的是全部是小写。

例如:

var Data=[];

9、注释:

①我们会在每个变量、类、函数定义的时候写上注释标其作用;

例如:

 

②我们会在认为比较重要的语句中进行注释;

③我们会在代码集中处写上注释。

 

10、代码采用UTF-8编码格式

代码设计规范

一 、友好礼貌

为了避免用户在微信中使用小程序服务时,注意力被周围复杂环境干扰,小程序在设计时应该注意减少无关的设计元素对用户目标干扰,礼貌地向用户展示程序侧提供的服务,友好地引导用户进行操作。

1. 重点突出

每个页面都应有明确的重点,以便于用户每进入一个新页面的时候都能快速地理解页面内容,在确定了重点的前提下,应尽量避免页面上出现其他干扰项影响用户的决策和操作。

 

2. 流程明确

为了让用户顺畅地使用页面,在用户进行某一个操作流程时,应避免出现用户目标流程之外的内容而打断用户。

  • 明确主次关系

首先要避免并列过多操作让用户选择,在不得不并列多个操作时,需区分操作主次,减轻用户的选择难度。

 

 

 

  • 明确主题

去掉任何与用户目标不相关的内容,明确页面主题,在技术和页面控件允许的前提下提供有助于用户目标的帮助内容,比如最近搜索词等。

二、清晰明确

一旦用户进入我们的小程序页面,就有责任和义务清晰明确告知用户身在何处、又可以往何处去,确保用户在页面中游刃有余地穿梭而不迷路,这样才能为用户提供安全的愉悦的使用体验。

1. 导航明确,来去自如

导航是确保用户在网页中浏览跳转时不迷路的最关键因素。导航需要告诉用户,当前在哪,可以去哪,如何回去等问题。首先在微信系统内的所有小程序的全部页面,均会自带微信提供的导航栏,统一解决当前在哪,如何回去的问题。在微信层级导航保持体验一致,有助于用户在微信内形成统一的体验和交互认知,无需在各小程序和其他微信页面的切换中新增学习成本或改变使用习惯。

2. 减少等待,反馈及时

页面的过长时间的等待会引起用户的不良情绪,使用微信小程序项目提供的技术已能很大程度缩短等待时间。即便如此,当不可避免的出现了加载和等待的时候,需要予以及时的反馈以舒缓用户等待的不良情绪。

3. 异常可控,有路可退

在设计任何的任务和流程时,异常状态和流程往往容易被忽略,而这些异常场景往往是用户最为沮丧和需要帮助的时候,因此需要格外注意异常状态的设计,在出现异常时予以用户必要的状态提示,并告知解决方案,使其有路可退。

要杜绝异常状态下,用户莫名其妙又无处可去,停滞在某一个页面的情况。上文中所提到的模态对话框和结果页面都可作为异常状态的提醒方式。除此之外,在表单页面中尤其是表单项较多的页面中,还应明确指出出错项目,以便用户修改。

三、便捷优雅

从PC时代的物理键盘鼠标到移动端时代手指,虽然输入设备极大精简,但是手指操作的准确性却大大不如键盘鼠标精确。为了适应这个变化,需要开发者在设计过程中充分利用手机特性,让用户便捷优雅的操控界面。

1. 减少输入

由于手机键盘区域小且密集,输入困难的同时还易引起输入错误,因此在设计小程序页面时因尽量减少用户输入,利用现有接口或其他一些易于操作的选择控件来改善用户输入的体验。

2. 避免误操作

因为在手机上我们通过手指触摸屏幕来操控界面,手指的点击精确度远不如鼠标,因此在设计页面上需点击的控件时,需要充分考虑到其热区面积,避免由于可点击区域过小或过于密集而造成误操作。当简单的将原本在电脑屏幕上使用的界面不做任何适配直接移植到手机上时,往往就容易出现这样的问题。由于手机屏幕分辨率各不相同,因此最适宜点击像素尺寸也不完全一致,但换算成物理尺寸后大致是在7mm-9mm之间。在微信提供的标准组件库中,各种控件元素均已考虑到了页面点击效果以及不同屏幕的适配,因此再次推荐使用或模仿标准控件尺寸进行设计。

四、统一稳定

除了以上所提到的种种原则,建议接入微信的小程序还应该时刻注意不同页面间的统一性和延续性,在不同的页面尽量使用一致的控件和交互方式。

统一的页面体验和有延续性的界面元素都将帮助用最少的学习成本达成使用目标,减轻页面跳动所造成的不适感。正因如此,小程序可根据需要使用微信提供的标准控件,以达到统一稳定的目的。

 

五、视觉规范

1. 字体规范

微信内字体的使用与所运行的系统字体保持一致,常用字号为20,18,17,16,14,13,11(pt),使用场景具体如下:

2. 按钮使用原则

 

3. 图标使用原则

六、代码设计规范

1、函数:为了让代码更加的清楚,我们采用了将绝大多数的功能部分定义在函数中,特别是功能调用多次的部分代码。

2、错误处理:①采用断言的方式,即就是将认为有错误代码的地方与下面的程序断开联系,进行写上检测错误的代码;②采用异常处理。

3、对于要输出的文字比较多的信息,可以采用:

WXSS部分(css类似)

1、url规范

例如:

https://github.com/wangjeaf/ckstyle-node

2、属性书写顺序

属性的书写顺序对于浏览器来说没有区别,除了优先级覆盖之外。但是如果顺序保持一致的话,扫一眼可以很快地知道这个选择器有什么类型的属性影响了它,所以一般要把比较重要的属性放前面。

例如:

3、不要使用样式特点命名

例如:

4、选择器的性能

选择器一般不要写超过3个

 

5、避免选择器误选

有时候会出现自己的样式受到其他人样式的影响,或者自己的样式不小心影响了别人,有可能是因为类的命名和别人一样,还有可能是选择器写的范围太广。

* {

    box-sizing: border-box;

}

结果导致在他个页面的公用弹框样式挂了。一方面不要写*全局匹配选择器,不管从性能还是影响范围来说都太大了。例如在一个有3个子选择器的选择器:

.house-info .key-detail .location{}

在三个容器里面,*都是适用的,并且有些属性是会继承的,像font-size,会导致这三个容器都有font-size,然后一层层地覆盖。

 

6. 减少覆盖:覆盖是一种常用的策略,也是一种不太优雅的方式,

7、多写注释

8、色值用十六进制,少用rgb

例如:

9、不要设置太大的z-index

例如:

 

WXML部分(html类似)

1、对于wxml代码中的样式比较多的代码,应该单独写在wxss中,这样使界面看的清楚,便于维护。

例如:

2、单标签不要写闭合标签

3、类的命名使用小写字母

 

二、数据库设计

序列号:    car_id                varchar(255)

车主姓名:     car_host            varchar(255)

账号:          car_host_number   varchar(255)

密码:          car_host_mys         varchar(255)

手机号:         car_host_tel           varchar(255)

车牌号:         car_card                varchar(255)

三、项目ER图

四、团队项目主要功能流程描述

注册:

扫码:

汽车旅店:

五、小组分工及贡献分

成员 本次作业分工 贡献比重及分数
邓旺 团队代码规范和编码原则总结 17%——10.5分
李凯 数据库的设计与实现 17%——10.5分
贺超群 ER图的设计与绘制 17%——10.5分
季轩石 ER图的设计与绘制 17%——10.5分
汤文涛 团队项目的主要功能流程描述 17%——9分
温广琪 分工并对所有内容进行整合 15%——9分
posted @ 2018-06-18 13:55  Mr_Kun  阅读(164)  评论(0编辑  收藏  举报