恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
界面设计中的不完美之美(上篇)
0.0°
2017-05-31 自译外文 经验/观点 原作者: Javier Cuello 举报 1367 1 3 0

    APP界面设计,用户体验,交互


今天,很多网站仍然无法访问。在我们的新书包容性的设计模式中,我们将探讨如何在无需额外的努力的情况下制定灵活的前端设计模式,使面向未来的访问接口。精装书,312页(现在获得书籍

Image

有时,我们倾向于将我们的设计看作是艺术品。如果我们这么想,也就意味着我们的设计并没有准备好面对“现实世界”的未知状况。无论如何,设计一个应对变化的界面是美丽的,让我们承认,界面在改变,一直在变。


smashingmag进一步阅读
对话界面:我们今天在哪里?我们要去哪里?
响应式网页设计中的原型内容
VR界面设计入门
如何像一个APP设计师那样思考


设计移动端APP,我最喜欢的一件事就是,从最初的概念到微调再到雕琢界面各种细节,这是一个步骤繁多的过程。而这个过程中,作为一个设计师和团队的其他几名成员(从研究人员到插画家到开发人员)是密切相关的。但是,这也就意味着每一个阶段都要做出很多的决定 – 其中一些决定并不总是像其他一样有趣。


作为UX专家,我们拥有各种各样的背景,但相同的是,我们同样花费大部分时间在视觉界面上(最常见的归功于我们)。我们是视觉思想家,有训练有素的眼睛。这就是为什么在开始一个新项目时,有时候可以直接跳转到可视化UI设计阶段,这也是为什么我们可能会因为一些任务而感到无聊的原因之一。


但同时这也意味着我们通常会推迟(或流程和更糟糕的,忽略)工作流程中的其他重要部分:界定用户需求和目标,绘制流程图,处理信息和交互设计的所有细节等,这些也都是至关重要的,同时,对于许多人而言,这些工作更具抽象性,更难以成为最终产品的有形部分。

Image 设计界面细节不应该分散你最初设计界面的初衷。(图片:Weather app by Webshocker)(查看大图


当我们开展视觉设计时,所谓的像素完美哲学可能是一个陷阱,使我们花费过多的时间来关注细节,直到界面中最小的细节都“完美” 。这导致了使用Dribbble 和Behance的一代设计师,更注重去表现   app和网站的优美的界面外观,而不是界面实际上的用户体验怎么样。而在现实世界中,事情往往不会像我们所期望的那样顺利。


或者,正如 Paul Adams所说:

我看到一位又一位设计师专注于第四层,而没有真正考虑到其他层面。自下而上的工作而不是自上而下的工作。如果其他三个层次尚未得到解决,网格,字体,颜色和审美风格都是无关紧要的。许多设计师说他们这样做,但并没有付诸于行动,因为有时候,画漂亮的图片,把自己埋在像素里比处理复杂的商业决策和有不同意见的人更有趣。当然没关系,留在第四层,但这是艺术设计。但你是设计师,而不是数字艺术家。


就个人而言,我认为最好的设计(当说到用户界面设计时)不仅仅是外观和感觉良好,而且还能对可变条件甚至是不可预知的情况做出了优雅的回应。


在构建产品的漫长的道路上,有一些阶段,设计师需要更多的合作,而不是专注于视觉设计。看在文章这么长的份上,我将要要着重说的问题(我不想你在键盘上睡着了)!在接下来的几段中,我将给出一些提示和技巧,告诉你如何将正在进行的APP设计进行测试,看看它是否已经准备好发布到应用市场。


发现不完美之美


当我在大学学习平面设计时,他们教导了我们关于平衡,对齐,比例和张力的美,以及如何在空间中定位元素,能够看起来和谐令人愉悦。有了这个知识,我的生活发生了改变,我开始以另一种眼光看世界。后来,我开始设计界面,我试图把这些原理付诸行动 - 屏幕上的所有信息都应该形成一个非常满意的视觉效果。


如果您将这些原理应用于移动APP设计,然后我们会发现我们必须显示恰当的信息量。例如,如果屏幕必须列出人物名称,设计师通常会选择一些简短且常见的人名,并将它们完美地排列在一起——对于会破坏设计,或者会使设计以后崩溃的,可能意外出现的长名字并不留出空间。


这种做法是基于这样一种假设:在混乱和不完美中没有美 - 即使这两个方面在现实世界中经常出现。但是视觉界面并不是被欣赏的静态艺术作品; 它们是动态的、功能性的空间,可以改变和适应每个人的使用。我们不应该屈服于纯粹为了美学而设计的诱惑,因为我们永远无法控制界面可以向用户呈现的所有东西或做所有的事情。


 相反,我们必须为变化而设计!这就是日本人称之为wabi -sabi,“以接受短暂和不完美为中心的世界观”。


因此,不同的思考和设计是很重要的:


1、在设计中尝试以多种方式呈现数据;

2、尽可能使用真实数据


当您尝试以几种方式提供数据时,包括一些不可预测的数据,您将能够测试界面是否准备好处理超出设计“舒适区域”的这些情况。此外,为极端情况(例如,没有或有大量的信息),并尝试避免“中心”(当一切看起来都很好,平衡的时候)。


如果您已经发布了该产品,这将更容易,因为您可以注意真实的数据并将其作为正在进行的设计的参考。但是,如果你正在开发一些新的东西,那么你将不得不深入挖掘,做一些研究,并尝试了解以后(以及什么样的)信息如何呈现。您还可以和开发人员谈论这一点,他们能够更好地向您解释存储和呈现的数据类型。


Image

如果使用得当,一个scrim(一个浅影层)将使文本在不同类型的图像上看起来更好。这种技术确保了无论使用哪种图像(一个具有很多亮度区域或相反,较暗),其顶部的文字将始终容易辨认。(查看大图



我将给出最后一个更生动的例子,我的一个开发者朋友称之为“漂亮的朋友综合症”。当我们设计一个包含人物照片(如用户个人资料)的界面时,我们倾向于使用那些看起来好看的人的照片,并且适合设计中使用的照片。然而,当我的朋友看到这样的设计,他会说:“我希望我的朋友这么帅。”


因此,“完美”图像的替代方案是使用不同颜色的人们的随机照片。这样,您可以看到在不同背景下元素看起来如何,从而看到对比度和易读性是否仍然完整。


Image

TinyFaces是一个免费的群众头像来源,可以用于您的个人和商业项目。(查看大图


不要太乐观


我们对于应用程序的工作方式是乐观主义者。我们假设一切都会快速顺利,不会中断,因为...为什么不呢?这就是为什么我们有时会忘记如何设计和处理用户以后会遇到的一些潜在的不太好的情况。


就举几个例子,如果突然断网,会发生什么?或者如果在执行任务时浏览器出现Bug?如果网速太慢,会有一个加载指示器(如转轮或进度条),或者在实际数据加载时,是否有一些占位符(临时)填补显示数据的区域?而刷新APP某些界面的可能呈现的内容呢?什么时候(在哪种情况下)是可能的?


Image

Facebook显示信息的加载界面。这种方式,您的感觉信息的加载速度比实际的要快。(查看大图


正如你所看到的,我并不是在讨论用户犯的错误(例如,在填写表单时犯了错误),而是关于那些超出他们控制范围的错误。在这种情况下,更重要的是与开发人员沟通,了解不同屏幕上可能出现的问题,然后设计一种可以轻松使用户摆脱困难的方案,让他们可以选择稍后再尝试,或者采取不同的行动。


在任何情况下,总是一个好方法来识别触发每个错误的具体情况,并为每个案例设计一个有用的错误提示信息。这些有用的信息帮助用户在每种情况下做出适当的回应,并了解接下来如何解决问题。但是尽可能的不惜一切代价避免常见的错误。


了解流程


一个界面包括许多元素,它们一起形成应用程序的整个布局。然而,当我们把整个用户界面作为一个整体的时候,我们经常忘记一些元素也有一些较小的任务需要执行,这有助于实现总体目标。


说到目标,这就像足球。你看,就像阿根廷的大多数人一样,我来自那里。为了使整个团队能够赢得胜利,教练需要知道每个球员的预期任务,以及他们在不同时刻要做的事情- 即使是其中一些人的不可预知性(我正在考虑梅西的魔力))可以使这更难。

Image

Google地图的保存按钮使用不同的状态:(1)初始状态,(2)正在执行操作时加载;(3)显示成功结果的最终状态。(查看大图


继续(希望)请忘记我的运动类比,让我们把它转换到我们的设计案例。如果有一个触发某种交互的按钮或部件,然后展望下一步:在执行操作时,加载状态是否会显示?它会因为某种原因而被禁用吗?如果用户按住按钮一会儿怎么办?会有什么反馈吗?就像整个屏幕有不同的状态,同样的情况也适用于个别元素。





更新:2017-05-31

收藏

1人已收藏

  • 5

    作品

  • 1

    粉丝

  • 4

    关注

  • 界面交互
  • 幻彩波尔卡圆点
  • glitch
  • 复古徽章
相关标签
用户体验ui设计

    猜你喜欢

      2017-05-31 自译外文 经验/观点 原作者: Javier Cuello 举报 1367 1 3 0

      界面设计中的不完美之美(上篇)

      0.0°

      你确定要举报界面设计中的不完美之美(上篇)

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2017年05月31日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      3
      1
      0

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录