赞助商
立即赞助

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

交互设计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」

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

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

相关文章

今天要跟大家分享的是banner的设计思路。 banner的设计过程可以分为五步: 了解需求 根据需求确定设计风格 根据素材...
Banner设计
设计师必须具备丰富的知识储备,在各个行业中找寻相通的规律和事物的本源。经过多年的沉淀,前辈们留下了大量的通用设计法则...
新用户引导
9月4日,Google 终于发布了Android 10的正式版本。此前的内测阶段它一直以 Android Q 的名字示人,无论是交互、使用体验的优...
Android 10
上一篇文章为设计师们拨云见雾,分析了模态弹窗与非模态弹窗,受到了挺多读者的喜爱,详文《春节专题!App 设计系列之模态弹...
交互控件
设计冲刺最早由谷歌提出针对带领团队快速做创新设计并验证设计的基本流程。下面通过这篇文章,带着大家来感受我们这次设计冲...
世界杯
设计指南是最大程度提升设计团队输出效率和确保品牌一致性的核心工具,成功的设计规范并非一蹴而就,需要注意的问题并不少。 ...
经验分享
如何为创意插上理性的翅膀,滴滴设计师和你一起回顾春节地图小车 icon 换装的设计全过程。 前言 新年刚过,元宵即临,开工...
交互设计
进入2018年之后,再来审视今年的整个 LOGO 设计趋势,会比之前的预测要清晰了不少。通过对过去几个月的新 LOGO 设计的观察,...
ogo设计