目录
- 一、界面总体设计
- 二、详细界面说明
- 1.登录注册
- 2.日历
- 3.智能推荐
- 4.我的
- 5.衣橱
- 6.时尚
- 三、附录
一、界面总体设计
《衣橱管家》有五大核心模块:衣橱管理、智能穿搭推荐、智能购买推荐、时尚社区、日常穿搭记录;界面设计将围绕这五大核心模块与登录注册功能展开,分为以下六个页面文件夹。
图 1 界面汇总
(1)登录注册页实现登录页、注册页、忘记密码与修改密码界面设计;
图 2 登录注册界面汇总
(2)日历界面文件夹实现穿搭日记的功能,包含日历主页与添加穿搭日记;
图 3 日历界面汇总
(3)智能推荐实现智能穿搭推荐与智能购买推荐,包含推荐主页与推荐结果页;
图 4 智能推荐界面汇总
(4)时尚文件夹实现时尚社区分享功能,包含主页与详情页;
图 5 时尚社区界面汇总
(5)“我的”文件夹实现个人主页与个人信息修改功能;
图 6 我的界面汇总
(6)衣橱文件夹实现衣橱管理和穿搭管理功能,包括衣橱与穿搭主页、添加页、搜索页、修改标签页等。
图 7 衣橱界面汇总
二、详细界面说明
1.登录注册
(1)登录页:该软件开屏页,用户可以输入手机号和密码登录,也可以选择第三方直接登录;如果用户无账号,可以点击注册进入注册页;若用户忘记密码可以点击忘记密码进入忘记密码页;用户必须阅读并同意使用协议才可以登录成功。
(2)注册页:用户可以使用手机号和验证码设置密码完成注册;点击返回箭头即可返回登录页,点击登录即可登录成功;
(3)忘记密码——验证码:用户输入手机号获取验证码,然后点击修改密码按钮修改密码;
(4)忘记密码——修改密码:用户验证手机号后可以设置密码进行密码修改。
图 8 登录页
图 9 注册页
图 10 忘记密码
图11 修改密码
2.日历
(1)日历主页:以日历+照片的形式展示每日穿搭记录;以照片+文本的形式展示本日穿搭;点击加号添加穿搭日记,进入添加穿搭日记页;
(2)添加穿搭日记:以博客的形式添加每日穿搭记录,可以选择是否分享至时尚社区。
图12 日历主页
图13 添加穿搭日记
3.智能推荐
(1)智能推荐主页:用户可以设置穿搭条件:天气、身材信息、风格选择;然后可以使用智能管家进行购买推荐和衣橱衣物的穿搭推荐;
(2)推荐结果:展示智能推荐结果(应该还有一张购买推荐结果,与之类似,因为页面数量限制未设计)。
图 14 智能推荐主页
图15 智能推荐详情页
4.我的
(1)我的主页:展示个人信息、个人通知与关于软件等基本信息;点击个人信息进入信息修改界面;
(2)个人信息:展示有关穿搭的个人信息,可以进行修改。
图 16 我的主页
图17 个人信息页
5.衣橱
(1)衣橱主页:展示衣橱信息;点击我的衣橱可以选择展示季节衣橱或我的穿搭;点击加号可以添加衣物单品信息;点击编辑按钮修改衣物标签;点击搜索按钮搜索衣物单品;点击加号添加衣物单品;
(2)修改衣物标签页:修改、添加、移动衣物标签;
(3)搜索页:可以根据关键字、衣物信息搜索筛选衣物单品;
(4)添加单品:添加单品输入单品信息;
(5)穿搭主页:展示穿搭信息;
(6)修改穿搭标签:修改、添加、移动穿搭标签;
(7)添加穿搭:输入穿搭信息添加穿搭。
图 18 我的衣橱主页
图19 切换衣橱与穿搭
图 20 修改衣物标签
图21 添加衣物标签
图 22 添加单品
图 23 单品信息展示与修改
图24 搜索单品及条件筛选
图 25 排序方式
图26 分类条件筛选
图 27 衣物信息筛选
图 28 添加穿搭
图 29 我的穿搭主页
图 30 切换穿搭与衣橱
图 31 修改穿搭标签
图32 添加穿搭标签
6.时尚
(1)时尚主页:展示时尚社区信息,可以分类查看;
(2)详情页:点击主页的一条记录进入详情页,可以查看内容详情和评论。
图 33 时尚社区主页
图 34 时尚社区详情页
三、附录
1.链接访问:https://modao.cc/app/BQHt8c4r8voa1jzu4gRnq 《衣橱管家》
2.使用视频:https://www.bilibili.com/video/BV1e3411s7vy/