【原型规范】

本文详细介绍了产品原型的设计规范,包括尺寸、颜色、页面命名等,并探讨了注册页面的用户体验设计,如手机号+验证码的注册流程。此外,还讨论了页面设计、交互说明、PRD文档编写、网站设计原则以及用户端/自媒体端后台管理功能。

前言

低保真原型绘制规范


尺寸规范

iPhone 6 低保真原型尺寸规范

颜色规范

通过背景、引导字体深浅,突出要输入内容、操作项较高权重
颜色规范
一级标题 18px #333 加粗
二级标题 16px #666
正文 12px #666
说明性文字 10px #ccc

页面命名规范

  1. 页面分开展示,父子页面区分清楚;
  2. 页面命名一般采用页面标题,便于快速定位

注册页面设计

  1. 用户体验与产品折中方案
    例如:注册流程
    a:手机号+验证码
    b:手机号 + 验证码 + 密码
    c:手机号 + 验证码 + 密码 + 确认密码
    a、b比较,a没有密码输入操作步骤,用户体验较好;b中可实现使用密码登录用户分流,减少产品短信服务成本(较理想)
    ,c中强化密码记忆,用户体验较差
  2. 用类似”登录即表示您同意产品条例“,替代让用户勾选同意
    避免用户不太关心操作

页面设计规范

  1. 操作能让用户选择,不让用户填
  2. “我的”个人菜单页面尽量展示多的初始功能,用户反馈、客服等具体功能实现跳转登录时,考虑产品改进、用户转化等问题
  3. 内容型列表:内容基本信息、内容作者信息、内容互动信息
    图文列表关注产品定位图片、文字权重,排列规则等
    文字标题高权重
    视频列表横向模式一般定位较大制作成本(一般为知识传播性),纵向模式常见随手拍短视频
    4. 互动行为
    点赞是最简单的互动行为,分享是最想让用户做的事,这两个功能一般突出显示,如页面右下角位置易于操作;
    对于不常用的功能,如删除、举报等可以选择收纳在右上角多功能键中。

交互说明规范

在这里插入图片描述

以下是图书管理系统原型规范的详细内容: 1. 页面结构 - 登录页面:包括用户名、密码输入框、登录按钮,以及忘记密码、注册等链接。 - 主页:包括图书分类、搜索框、图书列表、借阅、归还、预约、个人信息等功能区域。 - 图书详情页:包括图书封面、图书信息、借阅、归还、预约等功能按钮。 - 个人中心:包括个人信息、借阅记录、预约记录、罚款记录等功能区域。 2. 功能模块 - 图书分类:按照图书的类别(如小说、教育、历史等)展示对应的图书列表。 - 搜索框:支持关键词搜索,搜索结果实时展示。 - 图书列表:展示图书的封面、书名、作者、出版社、ISBN 等基本信息。 - 借阅:点击借阅按钮,弹出借阅确认弹窗,确认借阅后,图书状态变为已借出。 - 归还:点击归还按钮,弹出归还确认弹窗,确认归还后,图书状态变为可借阅。 - 预约:点击预约按钮,弹出预约确认弹窗,确认预约后,系统自动将该书籍预约给读者。 - 个人信息:展示读者的基本信息,如姓名、联系方式等。 - 借阅记录:展示读者的借阅记录,包括借阅日期、归还日期等信息。 - 预约记录:展示读者的预约记录,包括预约日期、预计到货日期等信息。 - 罚款记录:展示读者的罚款记录,包括罚款原因、罚款金额等信息。 3. 交互设计 - 点击图书分类,图书列表实时刷新展示对应的图书。 - 点击搜索框,输入关键词后,搜索结果实时展示。 - 点击借阅、归还、预约按钮,弹出确认弹窗,确认后执行相应操作。 - 点击图书封面、书名等链接,跳转到对应的图书详情页。 - 在个人中心页面,点击借阅记录、预约记录、罚款记录等链接,展示相应的记录信息。 4. 表单设计 - 登录页面:包括用户名、密码输入框,输入框具有格式验证功能。 - 注册页面:包括用户名、密码、确认密码、邮箱等输入框,输入框具有格式验证功能。 - 借阅、归还、预约确认弹窗:包括图书信息、读者信息等表单,输入框具有格式验证功能。 5. 弹窗设计 - 借阅确认弹窗:展示图书信息、读者信息等,包括确认和取消按钮。 - 归还确认弹窗:展示图书信息、读者信息等,包括确认和取消按钮。 - 预约确认弹窗:展示图书信息、读者信息等,包括确认和取消按钮。 - 提示信息弹窗:包括成功提示、错误提示、加载提示等。 6. 其他细节设计 - 搜索框支持自动补全、搜索历史记录等功能。 - 点击图书封面、书名等链接,会出现鼠标悬浮效果。 - 各种提示信息具有动态效果,如弹出、淡入淡出等效果。 以上是图书管理系统原型规范的一些常见内容,不同的产品原型规范内容可能会有所不同,但总体上都是为了更好地呈现产品的界面和功能,以便设计师和开发人员更好地理解并实现产品的设计。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值