结对成员
031702301 王瑞卿
031702345 关文涛
原型分析
1.原型开发工具
- Adobe Photoshop
- 墨刀
2.需求分析
根据题目要求,老刘希望开发一套自动化的出牌系统,系统需要包括对战、自动匹配出牌、排行榜、历史记录为主要功能,以及对战模式区分、查看历史记录详情等功能进行完善。
根据题目需求分析规划需求流程图:
3.视觉设计说明
结合需求和自身喜好,我们选择了网页端。在对众多优秀网页及界面进行参考和学习之后,我们对网页界面规范进行了学习和应用。
01 界面彩色规范
- 界面以深灰色作为背景色,旨在展现扑克的竞技风格,渲染紧张刺激氛围。
- 界面以深蓝、暖粉为主色调,以及少量橙粉、蓝灰等颜色作为辅助色。
- 主色调渐变及少量多种辅助色,使内容鲜明,使用户感到简洁不失活泼,提高用户视觉舒适度。
- 界面以部分亮色与深灰作对比,提高主要内容聚焦度,不仅使内容鲜明,更使界面深浅有度不单薄。
02 界面字体规范
- 字体选用 Adobe 黑体 Std。
- 字号先以使用量最多的为基准,定义为中号字,其次再定大号字、小号字,再进一步划分为中号字、特小号字。
- 字色,内容字色即正文字色,采用#333333,;次级文字采用#8e8e8e;按钮文字采用反色以突出。
03 其他规范
- 间距上,不同组内容之间划分40px,同一组内容间隔30px,同一组次级内容20px,根据亲密度再进行细分。
- 图标上,底栏图标切图大小6060份量大小4646,工具栏图标切图大小4848份量大小3838。并保证图标风格统一与点击前后、悬停等状态下的不同形态。
4.原型界面
- 根据需求分析,结合视觉设定,先初步完成低保真预设,再在低保真确立后的基础上对原型界面进行修改完善完成高保真界面。以下是部分高保真原型图展示。
登陆界面
- 用户输入账号密码即可登陆,未注册也可快速注册。
排行榜
- 可查询按积分顺序给出的排行榜。
历史记录
- 用户可查询自己历史记录,并查看历史战局详细战况和积分变换。
对战
- 可选择对战模式,有积分排名的排位赛、娱乐的匹配赛、练习的人机模式,根据不同需求用户可选择不同模式。
出牌界面
- 系统公平公正随机自动发牌。
- 根据用户发到的牌自动匹配出出牌方案建议,用户可在此基础上进行自主调整。
对战界面
- 系统根据各玩家出牌结果进行自动判定,最后给出结果,并进行积分奖励与扣减。
5.工作流
- 对功能需求流程图进行进一步完善与形象化,完成工作流展示。
6.结对过程
- 对题目进行分析,总结需求做出需求分析。
- 确定方向和风格。
- 进行分工,以及技能学习规划。
- 讨论并合作完成。
PSP表格
PSP2.1 | Personal Software Process Stages | 预估耗时(分钟) |
Planning | 计划 | 30 |
· Estimate | · 估计这个任务需要多少时间 | 20 |
Development | 开发 | 300 |
· Analysis | · 需求分析 (包括学习新技术) | 60 |
· Design Spec | · 生成设计文档 | 120 |
· Design Review | · 设计复审 | 120 |
· Coding Standard | · 代码规范 (为目前的开发制定合适的规范) | 0 |
· Design | · 具体设计 | 300 |
· Coding | · 具体编码 | 0 |
· Code Review | · 代码复审 | 0 |
· Test | · 测试(自我测试,修改代码,提交修改) | 60 |
Reporting | 报告 | 60 |
· Test Repor | · 测试报告 | 60 |
· Size Measurement | · 计算工作量 | 10 |
· Postmortem & Process Improvement Plan | · 事后总结, 并提出过程改进计划 | 30 |
总计 | 1170 |
设计说明
- 此次设计针对“福建十三水”这一游戏,目的在于制作出自动出牌系统的界面的扑克游戏界面。
- 采用扑克竞技的常用色为主色调采用扑克元素加以修饰,以深灰为底色,以蓝灰、暖粉以及其渐变色相搭配。希望用这种色调和风格带来扑克竞技的氛围和用户愉快体验。
- 保证对战、自动匹配出牌、、排行榜、历史记录等主要功能的同时,加以对战模式区分、查看历史记录详情等特色功能。
困难及解决方法
01 困难描述
- 两个人都不会打福建十三水【两个福建人甚至都没听过这种打法
- 风格迟迟难以确定,又怕花哨又怕单调,又担心大众没特点又担心不符合大众用户审美。
- 开发语言和平台的懵逼。
02 解决尝试
了解完题目就马上根据规则上手尝试,从打牌开始。
在微博、千图网看了大量网页设计,参考了许多优秀网页界面,同时也参考了一些游戏界面。
03 是否解决
打牌很快就解决了,上手就会。
风格参考扑克元素也很快定下来了。
开发语言、平台还在讨论与学习中。
04 有何收获
学会了心的打牌方法hhhhhh
熟悉了原型设计的工具,并对原型设计流程加以了解与实践。
学会了讨论与合作。
心得
王瑞卿:嗯原型设计使国庆无比忙碌又充实【我好想出去耍】无论规范还是流程都有新的收获与体验,也感受到规范重要性和学会站在用户角度思考的重要性,在这次过程中对原型设计相关软件photoship、Illustrator、Experience Design、 After Effects、墨刀、Axure Rp都深入学习和了解,并学会根据自身需求与喜好进行对比和选择,更加了解了每个软件在原型设计中的优势与特色。个人很喜欢AE视频特效方式展示的交互效果,又菜又想学【穷狗真实地想拥有一台跑AE不卡的笔记本】
关文涛:作为一个审美==Null,画画又不大行的人,让我设计Ui和画图我估计各种违和。。。加上国庆的放(上)假(工),也没什么时间相互合作写UI。。。总之我躺了,非常感谢我的队友的辛勤劳动,直接搞出来一套原型了,我没什么参与度,就讨论了下哪几张图要画。。。下一次作业要开始搞起来了。。。
学习进度条
第N周 | 新增代码(行) | 本周学习耗时(小时) | 累计学习耗时(小时) |
1 | 0 | 15 | 15 |