以web端为例:我的交互设计细节手册(下)

阅读: 1118

本文是“以网络为例:我的交互设计细节手册”的后半部分。内容继续关注网络交互设计的细节。本文引用的所有例子都来源于作者在实际工作中遇到或思考的互动问题,具有实际的参考意义。

对于一些操作后状态变化明显的简单操作,不需要提示来防止用户中断,如开关的打开和关闭、表扬等。这些操作显然是通过页面上元素的状态变化将操作结果反馈给用户的,不需要提示(如下图所示)。

全局提示一般是对操作结果的反馈,但不需要用户对下一步进行二次判断或指导,操作结果在页面上比较弱,因此需要全局提示用户操作结果。

例如,联系人已成功分配,因为分配后联系人卡片上的更改很少,只有所有者的字段发生了更改,用户不容易察觉分配是否成功,因此此时需要全局提示。

弹出提示主要用于以下三种情况:

(1)对于部分破坏性或不可逆的操作,用户需要进行二次确认(下图1)。

(2)一些需要引导的反馈需要由弹出窗口提示。

例如,下图2这里的消息接收设置,如果没有完美的商店信息,就不会收到消息,所以点击消息开关需要提示用户先完善商店信息,这里需要使用弹出提示来指导用户完善商店信息。

(3)重要信息需要用户确认,或者信息内容太多,需要用户花一定的时间阅读(下图3)。

固定导航提示主要分为两种类型:

侧面系统提示通常是系统类提示或跨功能提示。

例如,当新邮件到达或系统程序出现某种故障时,需要通知用户,这通常是及时反馈的被动提示(不是主动及时操作反馈的概念)。此类通知通常出现在页面右侧,必须自动消失或手动关闭。

对于社交媒体平台,图片由个人上传,各种图片的大小和质量参差不齐。为了优化体验并保持美观,图片通常以上下、左右、中间截距的方式显示(规则是上下、左右、中间截距和小图片自动放大并适应截距的长度和宽度,如新浪微博)。

对于工具平台,整体图片轮廓将根据长度和宽度缩写显示(图片将按年缩放显示),因为工具平台主要满足图片使用的场景,如在淘宝店铺上传产品详细地图。此时,用户需要更多地了解图片的基本概况。

在实际的设计工作中,我们经常会遇到这样的问题,比如是点击一个按钮打开一个新的页面还是跳转到这个页面。当然,这其中有很多原因。例如,阿里·牛倩在后台,点击每一个1级和2级标签将打开一个新的页面。这是因为根深蒂固的商业原因。现在我们只从设计的角度来分析这个问题。

在后台系统中,在导航切换过程中不需要创建新页面,并且一级、二级和三级导航都在原始页面上跳转。

如果您点击外联网链接,建议创建一个新页面进行显示。

查看细节是常见的操作场景。目前,大多数平台创建新页面来查看详细信息。然而,我建议细节可以在后台系统中以模态形式显示。这种方法的主要优点是它可以在查看细节的同时比较其他类似的数据。当然,也可以打开新页面查看详细信息。但是,请记住不要在详细信息页面中放置删除该单元的按钮,因为这将导致数据同步错误。

当设计一种信息块时,通常有两种常见的信息显示形式,卡片和列表。设计师们也倾向于纠结于使用哪种表现形式。这里有一个分享的技巧——如果有大量的信息,并且所有的信息字段显示相同数量的卡片,其余的将被列出。

下图是一个典型的例子。由于显示字段的数量不一致和字段的扩展较多,卡片上的操作不一致,查看卡片的详细信息非常尴尬——因为有些卡片字段已经完全显示,此时查看详细信息是没有意义的,但是有些卡片字段是隐藏的,所以您需要点击详细信息来查看或扩展卡片视图,这使得页面交互非常复杂。

另一方面,左手列表法具有良好的扩展性。无论需要显示多少字段,都可以向下扩展。即使在相同高度显示的块的数量没有右卡大,信息完整性也要好得多。

以上是“以网络为例:我的交互设计细节手册(第二部分)”的全部内容。如果你没有读过前一篇文章,你可以点击阅读。同时,您可以预测本文作者正在撰写一篇与服务设计和全链接设计相关的文章,该文章将于月底发布。感兴趣的学生可以注意我。

结论:本文案例指的是“新浪微博”、“营店平台”和“大搜索srp”的部分页面和控件。如果涉及侵权,请联系作者删除。

作者:李萧声,公开号码:快餐设计

这篇文章最初是由@李·萧声发表的。每个人都是产品经理。未经允许禁止复制。

主题地图来自unsplash,基于cc0协议。

极速飞艇下注

相关新闻
官方:尼克斯签约阿米尔-欣顿和肯尼-伍滕等4人

虎扑9月17日讯 尼克斯官方今日宣布,他们已经签下了阿米尔-欣顿、vj-金、拉马尔-彼得斯和肯尼-伍滕,目前尼克斯阵容已经有20名球员。22岁的金身高1.98米,体重98公斤,来自弗吉尼亚大学,他是今...

节前青岛各大渔港码头、市场热闹非凡 梭子蟹畅销

国庆日益临近,岛城各大渔港码头、海鲜市场都很热闹,眼下正是螃蟹最肥美的季节,梭子蟹也成为市民争相选购的畅销海货。梭子蟹、蛎虾、比管、刀鱼、虾虎,本地海货琳琅满目。得益于伏季休渔政策,近几年,黄渤海区域...

90后美女放弃外企高薪回乡务农,结果……

19日下午,在湖北武汉市黄陂区李集街驻程岗村,贫困户王贻金对正在田间巡查苗木生长情况的女孩竖起了大拇指。王贻金口中的这位女孩名叫易心慧,今年29岁,是中国人民大学农业与农村发展学院的研究生。易心慧在苗...

当龙舟遭遇风浪,中华龙舟大赛交出这样的答卷

供图 南京9月21日电 2019年中华龙舟大赛南京·六合站的比赛,21日结束了首日争夺。经过了将近3个月的休整,作为2019中华龙舟大赛下半年的首场比赛,南京·六合站发生了不少变化。长江大学女子龙舟队...

© Copyright 2018-2019 nigellow.com 鼓浪门户网站 Inc. All Rights Reserved.