赞助商
立即赞助

高级设计师:如何用科学的方法做出专业的原型图?

交互设计3年前 (2021)发布 流光
2.8K 0 0

Echo :本文将以酷狗K歌ios版(虚构)为载体举例说明,什么样原型图才能算上专业而细致?希望各位可以很晰感知这套法。

什么样的原型图才能算得上专业而细致?

在我看来至少要满足以下条件:

  • 明确主场和使用人群。
  • 信息结构合理化。
  • 流程设计简单合。
  • 计符大部用户认知模型。
  • 交互逻辑无缺失。
  • 异常场不遗漏。
  • 关键段有规则定义。
  • 极限情况有定义。
  • 是否涉及多种角色和权限。
  • 全局组件明。

如果是一个经验老道的产品经理或者交互计,上述情况出现的纰漏会比较少。如果是经验非丰的PM或者交互计,那容易出现各种情况的纰漏,如何避免呢?

1. 明确主场景和使用人群

移动互网的快速发展带来了传统业形的变革,足人不同需求的移动应用应运而生。K歌类移动应用以足用户的K歌需求为核心,准的K歌工属性赢得众多唱歌爱好者的追捧。凭借机K歌便利性以及丰的扩展功能,移动K歌应用的业形及商业模式已愈加成熟。

用户人群行K歌的时,也希望得到别人的认可pk。所以移动K歌应用已以K歌核的泛娱乐平台,集原K歌具性能的基础,移动K歌平台已拓出道具打赏、游戏联运、智能硬件以及线下KTV营多元变径。

从中国主流移动K歌应用的人均行为分析数据来看,唱吧、民K歌和爱唱三款应用的人均单使用次数均超6次,其中唱吧最,达到7.4次。人均单使用时长方面数据集中度高,民K歌、演唱汇、酷我K歌、移动练歌房四款应用均在30到40分钟之间。其中,爱唱和唱吧的人均单使用时长最为突出,分别高达53.84和50.77分钟。在富曲库、及时更新、注打造K歌工具的基础上,各移动K歌应用均通新增歌、视频直播、视频合唱等功能的方式提升用户粘,现阶段,K歌、直播、已成移动K歌平台标。

高级设计师:如何用科学的方法做出专业的原型图?

高级设计师:如何用科学的方法做出专业的原型图?

用人群:衷于唱歌/K歌的用户,以及渴望得到展示的舞台。

痛点:喜欢唱歌,但只在KTV有机唱。喜欢唱歌,但周边朋喜欢唱歌的不。KTV唱歌水平太差,但苦没地方没时间练习。唱的很优,但是找不到得到PK展示的舞台。

解决案:是从工具层切入。用户提供K歌练习和录制工具。也不单纯是工具,用户过工具录制作品时,过合唱等与其他用户互动。录制完成后上传分享作品,获其他用户赞赏和奖励。和K歌者场竞技从而提高唱歌平。最后高质量大量作品又用户提供内容。品也从工具层转社交层。从用户内容输入到输出形成个完美闭环。

定位:酷狗K歌可认为是一个垂直兴趣(唱歌)的UGC社区。户生产容,户进行容的消,获得更多的认可和赏。供更好的工具给户,户在平台玩的更愉快。

2. 信息结构合理化

通过明确场景和适人群、痛点、解决方案和定位。同时基于酷狗K歌现有务可形成一套整的产架构。

比赛、动、K歌、发现、的,五个大tab从K歌发现推社交形成一套完整的闭环。

高级设计师:如何用科学的方法做出专业的原型图?

3. 流程设计简单合理化

尽量最简单合的交互方式达到务需求。这样的话户更容易上手使升产的户体验。

流程计如果要简理化,通常有以下种方式:

  • 操作路径简,简必要的步骤或操作干扰。
  • 一个界面尽量只做一件事情。
  • 操作逻辑主流app一致或活中认知习惯保持一致。

高级设计师:如何用科学的方法做出专业的原型图?

例如做评委界面,一组赛,通过卡片左右滑的形式换组,这样的设计模拟了现实中的卡片的实际使场景,使得切换起来简单有趣。同时供字按钮进行切换,防止户知道此隐蔽操作。整个界面基本就做一件事,做评委。存在他功操作的干扰,操作路径简单,需要跳转页面。

4. 设计符合大部分用户认知模型

认知模又称3M认知模,是人类对真实世界进行认知的过程模。谓认知,通包括感知与注意、知识表示、记忆与习、语言、问题求解和推等方面,建立认知模的技术称为认知建模。

这说的认知模型,通常就是说对于计的认知。比如常见的是结构组,相同属性结构的在一起。操作逻辑遵从哪来哪去。息通过大颜色去重要度。

例如K歌模块第一模块导航入口的聚合,第二模块推荐歌曲排行榜单。导航入口的聚合符合主流APP的交互设(主流app已将用户的认知养起了)。同时将推荐歌曲排行榜单通过二级导航的的方式呈。「K歌」作按钮也比较符合用户的认知,点击就可以行K歌。同时界面所处的tab就K歌,整tab所的一件事就K歌了。由于整产品所义的K歌比赛社交,所以比赛动态分别于第一第二tab。

高级设计师:如何用科学的方法做出专业的原型图?

5. 交互逻辑无缺失

在计中容易出现交互逻辑的缺失。出现这种因是因为计首先做了最常见的计布局从而忽略了其情况,依旧以上一张交互稿为例。

高级设计师:如何用科学的方法做出专业的原型图?

推歌曲和排行榜的二导航,是否固定悬浮?

否可以左右滑动切换二级导航?如何可以左右滑动,一直朝一方向滑动,导航否可以循环切换?

推荐歌曲下的列表最出现少列?

唱过是用展示,如荐歌曲有5个唱过那么是用「0.0005唱过」,是是「5唱过」?

上的疑问在交互稿里面都没有体现,在设计过程中要尽量保证交互逻辑无缺失

6. 异常场景不遗漏

异场景遗漏,这个里面包含很多情况,依旧K歌的交互稿为例。

高级设计师:如何用科学的方法做出专业的原型图?

载过程中无络,如何示户?WiFi切换为2/3/4G,如何示户?

用户第一次进入,没有唱歌记录,没有味和风格的标签,如何推歌曲,这种情况下如何提示和引导用户?

下载失败的况下用户停留当界面如何提示,不当下次入时候否提示,如果提示,如何提示?

弱网情况下,页面何加载,屏加载?分步加载?

以上疑问在交互稿里都没有体现,所以在设计过程要尽量保证异常场景不遗漏。

7. 关键字段有规则定义

关键段有规则定义,这里指是,段需要连接数据库,于这样段需要明确定义。不然最后开发时候,开发要么找设计师沟,要么他们自己去按照自己理解去定义并做出来。

高级设计师:如何用科学的方法做出专业的原型图?

例如动态里,关于时定义,需要个明确定义,如不写话最后结可能千变化。交互稿里,天时显示时分,昨天显示昨天,昨天以前显示月日。定义明确。由于交互稿是动态主界,所以涉及到送礼、评价、转发交互没有体验出来。

8. 极限情况有定义

极限情况有定义这里有很多情况:

  • 常见的是字段的长度定义,例果用户名,标题,文内容超长的情况,打点表示还是折行显示?
  • 常多数据需要加载或展示时,应该如何处理?
  • 时间没有年份时,如果在跨年期间,时间如何展示等等。

9. 是否涉及到多种角色和权限

不同产品涉及到种角,不同角是否存在不同的权,不同的使用场?所以设计程要通角和场做设计。

10. 全局组件有说明

局组件,指的是整个产品通用的组件,例局断网,操成功、操失败、加载、空数据界面,404等。

高级设计师:如何用科学的方法做出专业的原型图?

  • 全局断网:一是在首页使用tips提示。用户在其界面点击操作,出现toast反馈提示用户。也有一些app在用户进入出现对话框提示
  • 户网络异常。相对于对话框,使用tips对用户的扰小。
  • 操成功:一般操成功是根据具的使用场做出对应的提示。
  • 操作失败:异常情况导致操作失败,这时需要统提示,常使用toast。
  • 载:涉及到全载和载。全载在设计中要统一说明,例如上一个界面点击进入一个界面,使的全载就需要说明。如果是一些小场景的载,那么需要特殊说明。例如上拉载,拉载,小区域载等。

空数据类型共有三类:

  • 初始状态的定义:初始化状态,没有任何内容,需要用户进行某种操才能产生内容的界面。
  • 空状态定义:过删除或其他用户操作,空前页内容,生了空界,这时候需要有明确提示,告知用户该如何处理。
  • 错状态的定义:由于络、务器或者没有到他结果等原因导致无法载容,产生了空界面,这时候需要有明确的示,且告知户该如何处。户操作反馈的无结果界面可这样的思路来设计。

欢迎关注作者微信公众号:「UEDC」

高级设计师:如何用科学的方法做出专业的原型图?

© 版权声明
您必须登录才能参与评论!
立即登录
暂无评论...

相关文章

@Fornever :上周日,我们以「哪些日常场景中,缺少一个易用的小程序」为命题,举办了光涧实验室第一场 Design Workshop「Do ...
工作坊
编者按:懒得试配色方案?不妨收藏这些配色网站,和常见搭配,让你的配色更加协调! 一. Adobe Color CC 二. Color Lovers ...
经验分享
随着技术的发展,我们常常会觉得,如果想要做好产品必须遵循新的规则。实际上,这并不是真的。人类本身并没有我们想象中变化...
Eugen Eşanu
下周就是春节了,想用这个春节长假做什么呢?不妨在回家的路上、旅行的途中,利用碎片化时间,给自己制定一个小小的充电计划...
书单推荐
和往年一样,今年 Google 依旧在 Material Design 上投注了不小的心力,来推动整个设计语言渗透到整个 Google 的产品体系当中...
Material Design
幽灵按钮和类似的空心元素,在诸多的设计趋势当中,还是显得颇为单薄的。它们的转化率看起来不够突出,和其他的固定形体相比...
幽灵按钮
本文主要从需求类型、表现形式、如何做正确设计来分析,设计师应如何洞察需求本质?如何做正确的设计? 前言:设计师的痛 有...
商业需求
此次项目所介绍的是一款儿童拼音启蒙AR产品,核心用户为3至6岁的学龄前儿童。整个设计团队在项目中结合儿童认知、家长诉求、...
AR设计