需求 项目 原型 随着羊群人数的不断增加,使得大部分同事改成居家办公和线上会议。线上会议的特点不用提前抢会议,不用担心会议时长,顶着 40℃的高烧,听者需求评审会,也不知道烧了多久,睡了多久,会议开了多久....需求评审会经常被大家吐槽时间久,最终问题得不到解决似乎是无法破解的问题。我记录了最近几次 PM 组织的评审会过程,发现一些问题,并想到一些可以改变的方法。需求评审干货:需求太多怎么评审?来看京东内部的实战案例!面对功能优化类项目,如何做好需求分析?阅读文章 > 问题 1:开场一句话背景和模糊的收益介绍背景和收益必不可少,这是团队成员在初期达成目标一致的必要过程,并且通过说明相关成员能够认同该项目的价值和意义,通常一句话轻描淡写是不够的。建议:充分做好会前功课和线下沟通,保证会上快速达成一致老项目要介绍上一个版本历史数据分析结论或者用户反馈问题分析结论。新项要使用SWOT等分析方法,明确自身的竞争优势,市场规模等核心问题。竞品分析讲结论。不要挨个讲竞品,也不要讲字号和颜色等细枝末节问题(可以在需求文档中给予参考建议),注重战略层面和功能层面的差异介绍,以及那些适合自身与竞品之间的差异。本次要解决的问题,也就是具体我们要做什么。不需要复杂的论述,简单列出本次需求点,一目了然。清晰表述项目价值。讲明白本次优化能给项目带来多大的价值,以及是如何推导出来的,让团队成员信服。价值一定是可以衡量的,我们常听到项目的价值是提升用户体验,但实际既没有用户满意度等用户指标,也没有具体收益等业务指标,那这就是不可衡量,全靠感觉,项目后期对于方案的讨论分歧点会很多。不要一开始就甩锅给老板。很多PM在开会时功课做得不够,被问到一些无法回答的问题时直接说这是老板让做的,如果觉得需求有问题可以去找老板,这样的结果大家以后对于项目态度都会变成应付了事,PM自己的工作后续也很难推进。问题 2:上来就讲原型,陷入细节纷争PM 喜欢画原型喜欢讲原型应该是不争的事实,还有一些 PM 对原型的精美度要求还很高,于是需求确认前就找交互设计师按照自己设想完成交互设计,很多不完善、不合理的地方也很强硬的要按照自己的来。需求评审会上来讲原型很容易让团队成员陷入界面的细节争论不休,开发又会追问每个逻辑,评审会你一句我一句就乱套了,同这时通常设计也会与开发一边,表示出不满。建议:清晰且详细文字的描述产品逻辑及字段清晰表述产品中所有的字段、数据格式以及相应的逻辑。让开发能看懂所有功能逻辑、操作逻辑、展示逻辑,设计能看懂产品需要用户如何操作以及限制条件,通过文字能明白整体需求逻辑关系。尽量使用文字描述。我们发现当图和文字同时出现在文档中时,设计师和前端更偏向于看图,后端会细看文字描述的逻辑,这样到了打法阶段容易形成分歧,导致新的问题产生。产品画的原型会影响设计师的思考,造成设计师被带跑偏,甚至一些强硬的PM要求设计师按照原型来,这样一来设计师不想给自己找不痛快,就按照美工的标准应付完工,并没有发挥真正的价值。问题 3:需求评审开成技术评审很多时候在评审会上,开发人员会从能不能实现聊到怎么实现,然后聊到各服务端如何来配合,一聊起来就没完没了,线上会还可能随时就拉个新成员进入参与讨论,需求背景又要被重复。此时的需求还没有定论,占用大量会议时间讨论技术实现明显是不合适的,浪费大家宝贵的时间。建议:做好会议把控,控制问题讨论边界PM在会议中要起到把控的作用,会上不讨论技术实现方案,只讨论需求是否合理,技术可否实现,如果当时不能确定能否实现的,需要记录todo在规定的时间内反馈。对于一些不确定的技术问题,或可能存在争议的难点,最好在开会前就能和技术负责人了解清楚技术背景,做好功课,防止在评审会上被牵着鼻子走。问题 4:跑题跑题通常是不知不觉的,甚至全体参会人都享受其中,越聊越嗨,忘记了开会真正的目的。印象比较深的是一个方案要主管确认,主管从这个方案聊到了另一个项目,开发顺着另个项目聊到了项目进度和遇到的问题。整个评审会成为了另一个项目的汇报会,到最后也没确认当前方案。建议:明确会议目标,时刻关注会议方向PM会前要和主管确认好方案,以保证内部一致性,会上主管只要回复确认没问题即可。放下面子敢于说话。很多时候PM不太好意思打断大家的对话,这样就不能把跑题扼杀在摇篮里。总结一下,就是立足本职做好自己职责范围内的工作,承担好项目角色。如何组织一场高效的设计评审会?高手总结了这份模板!编者按:设计评审的目的和意义是什么?阅读文章 > 如何顺利通过设计评审会?我总结了3个注意事项!编者按:如何通过设计评审?阅读文章 > 本篇来源:优设网原文地址:https://www.uisdc.com/review-meeting-efficiency
原型 屏幕 界面 如今 App 和网页可交互原型的制作方法和设计流程早已普及,但 HMI 可交互原型制作方法和设计流程还处在探索阶段,比起只需考虑屏幕内交互的 App 和网页,HMI 还要考虑屏幕在汽车内的位置。这次带来一篇相关译文,文章的作者 Casper Kessels(德国 Snapp 汽车软件公司设计总监),使用 VR 来探索 HMI 可交互原型的设计制作。本文译自:https://www.theturnsignalblog.com/blog/behind-touch-concept原文作者:Casper Kessels(德国 Snapp 汽车软件公司设计总监)往期HMI干货:HMI的点击区域应该多大?总监上路帮你实测!设计师都知道根据《苹果 iPhone 人机界面设计指南》,手机 UI 的最小点击区域是 44px。阅读文章 > 在过去的几周里,我设计了一个新的概念原型,用于测试在汽车中触摸屏的交互。在这篇文章中,我想聊聊我遵循的设计流程和迭代过程。一、行动和目标下图是我遵循的简略设计流程。现在汽车 HMI 界面复杂的主要原因之一是功能太多。所以在开始时,我退一步评估了人们在汽车中真正需求是什么,并以此为基础进行了设计。我首先列出了一辆典型汽车的所有功能,并研究了这些功能实现的潜在目标。例如,提高风扇速度的潜在目标是更快地降温。最终得出一个包含 20 个目标的列表,我将其作为设计界面的基础。但在将这些目标转化为具体界面的过程中,我很难走出第一步。在大多数项目都存在一些限制,如屏幕大小、图像性能、时间、预算等。如果没有这些限制你可以自由地做出完美的设计,可有限制就很难起步了。最困难的问题是没有真实屏幕硬件。为根本没造出来的汽车屏幕设计界面是很困难的。所以我希望至少有一个真实屏幕硬件让我能做实验。我画了不同的屏幕布局,但仅凭一张糟糕的草图很难判断出哪个设计方向更好。所以我更进一步打算在 VR 中探索。我的草图二、在 VR 中探索屏幕布局我很想在真车或模拟器上测试屏幕布局,但新冠病毒危机让这变得相当困难。我不得已退而求其次用 VR。我没有 VR 眼镜,但感谢谷歌 Cardboard,我可以用手机加纸壳当 VR 眼镜。我们的目标是探索屏幕布局可能性的大致概念原型,而不是创造一个精确的内部布局模型。我不想花几个小时搭建精确模型。谷歌 Cardboard(译者配图)首先,我找到一个包含内饰的免费汽车 3D 模型。我把 3D 模型拆开,创建了三种不同的屏幕布局方案,用于后续探索。车内屏幕示例在 Unity 中,我导入谷歌 Cardboard SDK,并修改了默认场景。我又导入汽车模型并下载了一个免费的道路素材。我的 Unity 屏幕不到一个小时,我就配置好了一切,开始在 VR 中探索场景。Unity 中 三种屏幕布局之一这三种不同的屏幕布局是根据目前汽车公司的发展方向而选择的。我发现把屏幕放在司机的视线附近最不会让人分心。因此,小屏幕横放是最佳选择。三种屏幕布局三、草图和线框图在确定了屏幕大小的方向后,我将目标转化为界面就没那么困难了。我很早就明白必须对功能进行分组才能开展设计。我按多媒体、环境控制和导航功能进行分组。另一个核心理念是,我希望用户尽可能少点击来实现他们的目标。我基于可调整大小的窗口做了一些简单的布局。我的想法是,在一个平面上呈现所有东西会尽可能简单,并能最大限度地减少点击次数。我画的窗口布局的简略线框图然后,我为每个功能分组设计草图和线框图。同时对屏幕布局做一些小的调整。四、快速原型想要找到像调节音量一样直接控制的交互方式是很难的。我在之前探索汽车手势交互的概念原型的基础上提出了一个新想法。为了更具体地了解它的工作原理,我使用 Axure 制作了一个非常简单的可交互原型。点击并按住屏幕边缘会显示一个覆盖层。通过滚动到喜欢的位置并释放,选项就会被选中。我认为这个方案有潜力,所以我把它整合到概念原型的第一个版本中。五、第一次迭代第一个概念原型很简单。它在屏幕底部有一个菜单栏,上面有导航、媒体、环境控制和摄像头功能。导航总是覆盖屏幕的左半部分,其他功能总是覆盖屏幕的右半部分。每个菜单项都可以进入全屏模式。我还做了一点简单的视觉设计,使原型变得栩栩如生。我在 Figma 中设计了所有界面,并使用 After Effects 创建了两个手势交互的动画。一个用来控制音量,一个用来调整温度。反馈我联系了有汽车设计经验的设计师,寻求他们对这个概念原型的反馈。从他们的反馈中,我们可以清楚地看到有三点要改进。使用可调整大小的窗口非常受限。如果使用多层级界面而不是窗口,那么界面就有更多的自由和空间。第二点是这个概念原型系统功能过于宽泛。相反,当你开车时,你只需要导航和多媒体功能。这些功能应该是基本功能,其余都是额外功能。在这个概念原型中,所有功能都同等重要。最后一个建议是,这个概念原型相当保守。这是为现在市场上的汽车设计的。而在汽车行业,由于开发周期较长,设计师需要提前设计 3-4 年之后的汽车。所以我不应该害怕创造新的概念原型,应该同时使用不同的屏幕,并着眼于 3-4 年后的用户体验。六、第二次迭代我把上一个原型中反馈的问题在这次迭代中改进了,并更多关注导航和多媒体功能。我还想看看是否可以围绕菜单栏进行设计,创造更自然的交互。所以我尝试将菜单栏转换为一个 3D 多层界面,每一层都对应一个驾驶模式。第二个原型使用分层系统而不是菜单栏最高一层是”通勤模式“,展示多媒体、环境控制和导航功能。其次是“导航模式”,以导航为中心。最后,还有一个“专注模式”,界面菜单占用空间最小。每个模式都对应一个类似的仪表盘界面。用户可以通过方向盘上的按钮或与中央屏幕交互来循环切换这些模式。我遇到的问题是没有控制环境的地方了。我想了一个办法,把控制器分开,放在不同的屏幕上。这样中央屏幕界面更加简单,有助于整个系统的可用性。反馈我已经注意到,在设计这个概念原型时,我引入了许多不必要的复杂性。其他设计师和我交谈也得出了同样的结论。使用层和驾驶模式相结合的想法很有趣,但太复杂了。理想的解决方案是将第一个概念原型和第二个概念原型结合一下。另一个观点说,这些多层级界面看起来相当混乱。所以在最后的概念原型中,我需要找到一种视觉风格,最大限度地减少混乱,使它看起来更简洁。七、最终版本在最终版本中,我删除了在不同驾驶模式中切换的交互。我想保持专注模式的理念。因此,我没有使用 3D 多层界面在驾驶模式中循环切换,而是将两个主要控件放在屏幕的角落,让用户决定他想要显示什么。最后,我在 VR 中测试了这个概念原型,看看控制的可达性如何。我曾担心多媒体按钮会被放置得离司机太远而不舒服。在用谷歌 Cardboard 在 VR 中观察后,我注意到情况并非如此。然而,我使用的车辆 3D 模型的车内空间不大。在大型 SUV 中,这仍然是一个问题。所以这将是下一个版本概念原型需要改进的地方。我还为准备了一个更沉着的视觉设计风格,这有助于减少界面层级的混乱样式。最终的概念原型其结果就是我在上一篇文章中提到的概念原型。像本文提到的这种的项目没有终点,我将继续改进和迭代。我已经收到很多读者的评论和反馈,这将有助于改善概念原型!因此,如果你有任何意见,我会很乐意接受!本篇来源:优设网原文地址:https://www.uisdc.com/hmi-prototype-design-process
原型 区域 驾驶员 设计师都知道根据《苹果 iPhone 人机界面设计指南》,手机 UI 的最小点击区域是 44px。但汽车 HMI 的最小点击区域业内却没有定论。考虑到汽车驾驶关系交通安全,点击区域大小与反应时间极为重要。文章的作者 Casper Kessels(德国 Snapp 汽车软件公司设计总监)通过 Figma 制作原型在实车上进行测试,得出了汽车 HMI 最小点击区域的结论。本文译自:https://medium.com/snapp-automotive原文作者:Casper Kessels(德国 Snapp 汽车软件公司设计总监)往期HMI干货:总监出品!车载语音助手设计指南现在的汽车就像智能手机一样有丰富的功能,我们可以在车上导航、听音乐、看视频甚至订酒店。阅读文章 > 我们相信汽车消费软件可以做得更好。因此,我们一直在开发基于 Android Automotive 的信息娱乐系统。期望看到可用性的改进。与物理控制器相比,触摸屏没有材质和位置变化之类的反馈触感。驾驶员必须将视线从路面上转移到屏幕上,以便用手指对准屏幕。而且必须在没有错误的情况下,在尽可能短的时间内完成,避免分心造成交通事故。触控区域的大小是优化这一点的关键。这就是为什么我们进行实验来确定最小触摸区域,这将成为我们设计的基础。一、测试环境我们在 Figma 里创建了 4 个原型,按钮大小分别为 60px、80px、100px 和 120px。物理尺寸分别对应 11 毫米、15 毫米、20 毫米和 23 毫米。4 个原型为了确保结果准确,我们决定在真实道路驾驶来进行测试。汽车的车速等情况对按钮大小也有影响。我们决定把 iPad 放在真车的 HMI 上。当然,在繁忙的城市驾驶时,让驾驶员与原型机进行交互可能会产生交通事故。所以我们把 iPad 放在中间,副驾驶和驾驶员与 iPad 距离一样。然后,注:驾驶员专注于开车,由副驾驶代替驾驶员,与 iPad 上原型进行交互实验。由副驾驶与原型交互,请注意安全驾驶,遵守交通规则。二、测试结果在柏林的不同路面上驾驶之后,我们得出了以下结论:在一定程度上,增加触控区域会产生更好的效果。60px 和 80px 的原型有明显的区别,可以看看 60px 原型的效果:60px 的原型。由副驾驶与原型交互,请注意安全驾驶,遵守交通规则。与 80px 的原型相比,60px 的表现要差得多:80px 的原型,由副驾驶与原型交互,请注意安全驾驶,遵守交通规则。80px 和 100px 之间的差异较小,但并非微不足道。100px 的原型,由副驾驶与原型交互,请注意安全驾驶,遵守交通规则。然而,最大的触控区域并没有产生比 100px 更好的效果。如果一个 100px 的按钮很难点击,那么在 120px 也同样困难。请看下面的极端例子。120px 的原型,由副驾驶与原型交互,请注意安全驾驶,遵守交通规则。我们开车在城市里转了一圈,亲自感受了一下不同之处,最后得出了这样的结果。在理想的情况下,我们应该测量驾驶员的注意力分散指标,比如离开道路的时间等等。幸运的是,已经有许多相关科学实验得出对应结论了。有趣的是,我们的研究结果与汽车界面和其他相关应用领域的学术研究结果也相符。这些结论也表明,随着触摸区域的增大,改善程度也会减弱。结论在实验之后,我们将最小触控区域设置为 80px。HMI 中的每个可交互元素都至少为 80px。对于更高频的交互,我们将最小触控区域定义为 100px。比如,跳过一首歌,或改变空调温度。我们目前正在开发一个高保真的 Android Automotive 原型,来验证这些设计决策。此外,我们正在测试其他使汽车触摸界面更安全的手势,比如滑块和其他可交互元素。我们将继续在这个博客分享我们学到的新知识,敬请期待!本篇来源:优设网原文地址:https://www.uisdc.com/hmi-touch-areas
技术 原型 设计师 继续话题,“你好,沉浸式体验设计师”的第二与第三部分。曾在第一篇当中提到后两部分不做全译,因对我个人而言稍稍涉及敏感,相关部分跳过(上下文中有做注明)。一如既往,个人学习之用,独享翻译之过程而共享其结果,全部内容仅代表原文作者 Bruno Everling 之观点。为何 3D 将成为 UI 的未来!如何成为沉浸式体验设计师(上)疫情四起,仿佛回到两年前,而又觉甚于两年前。阅读文章 > AR 行业的过去、现在及未来在第一部分当中,我谈到了为什么沉浸式技术将成为 UI/UX 设计师新的前沿阵地,解释了 3D 界面相比于如今我们所习惯的 2D 模式来说为何更加贴近于人类的天性,以及这场即将到来的变革可能对设计师产生怎样的影响。那么 AR 技术何时才能足够成熟到可以被主流市场所接纳呢?如此复杂的技术并不易于预测,因为其中仍有一些严峻的技术挑战尚未得到解决。不过,如果你在关注行业中那些大玩家们近些年来取得的进展,那么你至少能大致预估到技术整体的走向。在第二部分中,我将和各位一起对当前 AR 行业的发展状况进行纵览,包括那些最大的参与者,以及他们各自的技术发展策略。1. 炒作周期结束如果你在过去十年当中关注过关于沉浸式技术的新闻,那么你也许会注意到,近些年里相关话题在公众当中的热度,相比于五年之前已经有所下降。伴随着成千上万科技博主与记者所宣扬的未来潜力,VR 最先跑完了一个炒作周期,而 AR 则紧随其后。在 Gartner 公司于 2018 年发布的新技术炒作周期曲线图当中,AR 正处于谷底的位置,而 VR 已经从曲线中消失了。从 2020 年起,这两项技术则不再出现在图表当中。https://www.gartner.com/smarterwithgartner那么这是否意味着沉浸式技术的失败呢?实际上恰恰相反,这个图表仅意味着炒作周期已经结束,人们开始将他们的希望、梦想或恐惧投射到下一个新技术上。有这样一句引言完美地概括了这一现象,虽然这句话的原始出处已无法考证,但人们通常认为它来自于未来学家 Roy Amara,因此它也被称作“阿玛拉定律”:“我们倾向于高估一项技术的短期效益,而低估其长期影响。”人类并不那么善于进行长远预测。任何开创性的新技术通常都能在公众当中形成两方面的剧烈反应:一部分人会过度兴奋并产生不切实际的幻想,而另一部分人则抱有轻视或恐惧的态度,并主张禁止该技术的发展。这两类反应都有问题。根据 Gartner 的炒作周期曲线图,沉浸式技术会缓慢地进入到所谓“生产力稳定期”。在这个时期,技术已经度过最猛烈的炒作阶段,并且在短期内无法再满足大众媒体的渴求,进而难以令他们继续保持兴趣。一些风投开始退身,很多受炒作的怂恿而立项的团队要么关张,要么转向其他领域。但仍会有一些人在坚持 100% 的投入;这些人在持续地创建和改进,因为他们理解这会是一场马拉松而非短跑冲刺。这些公司将成为大浪淘沙之后的胜利者。时间快进几年甚至几十年,这项技术将会成熟到超越曾经所有人的想象。下面,就让我们一起了解这样一些马拉松跑者,看看我们可以从他们身上学到些什么。英文原文在此处对多家公司的相关技术进行介绍与分析。如第一篇文章所预告,此类内容对于译者涉及敏感,因而不做翻译。有兴趣的朋友请根据文末链接阅读原文。—— C7210如何开启沉浸式体验设计师的职业之路当沉浸式技术成熟到能够被大众市场所接受时,势必有大量人员一拥而入;而从行业当前的发展状况来看,我们还有大约一到两年时间可以提前着手准备,例如熟悉 3D 相关技术,主动参与到全新设计范式的塑造当中。在后文中,我将谈及关于如何开始沉浸式体验设计师职业道路的潜在策略。我会分享一些我在过去五年里所收集的优质学习资源及工具,希望能帮助大家快速上手,并一起加入到这场变革的最前线。1. 关于移动 AR基于移动设备的 AR 可能难以代表 AR 技术的未来,但它仍是我们的最佳起点。听起来有些自相矛盾,我们来详细解释。正如我们在第一部分当中所说,数字化界面势必会向着与现实世界紧密结合的方向发展,而交互方式更贴近于我们自然天性的 AR 技术正是发展路径上的下一站。从很多方面来讲,AR 都是虚拟与现实得以真正融合的最后一块拼图。当然,我们距离那个阶段仍然很远;要实现其潜力的完全释放,以下这些先决条件必须得到满足:硬件方面:界面的输出方式需要离人眼更近,使得内容可以从手机屏幕的局限当中解放出来,并能呈现在我们的自然视野所能覆盖到的任何地方。此外,设备中的诸多传感元件也必须能持续扫描我们周边的环境,从而实现高度精准的环境感知能力。软件方面:数字化内容需要转换为 3D 形式,并能与现实世界无缝整合。取决于用户的输入,以及周围物理环境的状态,包括其他物体的相互作用、光照条件、物理定律、天气状况等方面的要素,3D 化内容应该能够动态地改变自身的外观、属性、及位置。虽然当前的移动 AR 在某些方面的表现还算像样,但它在体验上似乎很难全面达到上述这样理想的程度。要实现真正沉浸式的体验,类似 AR 眼镜这样的设备将成为必需。2. 为何设计师应该拥抱移动 AR来自 Patrick Schneider on Unsplash既然如此,为什么我仍推荐首先学习面向移动 AR 进行设计?因为我相信,作为一种过渡技术,移动 AR 在增强现实的发展史上仍有自己的一席之地;作为垫脚石,它能帮我们为了更加沉浸式的未来进行准备。正如现今的科技公司正在基于移动设备开发和验证 AR 所需的技术组件,作为设计师,我们同样可以将移动 AR 作为学习场地,从可用性的角度对新的界面范式进行试验。我能想到至少五个具体的理由来说明为什么移动 AR 可以完美地引导我们去学习“沉浸式体验设计师”所需掌握的必要技术:移动端界面是我们的主场。这方面我们早已掌握了来龙去脉。我们理解所有的规则及可能性,也包括局限。虽然关于移动 AR 我们还有一些新东西要学,但整体体验依然依附于移动设备的场景,遵从于通用的设计原则及交互模式。面向移动 AR,你确实需要以 3D 的方式进行设计,但又不完全是——因为界面的输入方式仍然发生在二维触屏上。入门门槛较低。任何拥有移动设备的人都可以创造出移动 AR 体验,无需昂贵的硬件便能生成原型进行测试。而对于真正意义上的 AR 体验(譬如以眼镜作为载体),你可能会需要非常昂贵的软硬件,包括相关的专业知识,来处理早期普遍存在的技术问题。设计工具足够成熟。在近几年里,我尝试过诸多 app 和工具,但发现要针对 AR 眼镜相关体验去设计原型几乎是不可能的事,特别是在对 3D 和游戏设计缺乏深入理解的情况下。相比于毫无经验而上手 Unity,面向移动 AR 的设计工具则相对容易学习很多。移动 AR 更容易融入人们的生活。手机 7 天 24 小时陪伴着我们,不离左右。当前社会对于手机的接纳度很高,而 AR 眼镜的情况则相反。这使得我们有机会可以去探索一些 AR 眼镜尚难覆盖到的用例,特别是在户外公共空间当中。测试更容易。任何拥有智能手机的人都可以帮你测试原型。相比之下,通过最新的 AR 设备进行测试的成本则过于高昂。希望以上这些可以使大家明白,目前而言,移动 AR 可能是设计师试水“沉浸式体验设计师”的最佳途径了。至于具体如何起步,我创建了一份“移动 AR 新手包”供大家参考,其中包括了近些年里令我感到有所收获的一系列优质资源。3. 移动 AR 新手包App先来看一些具有启发性的 app。熟悉移动 AR 的方式之一自然是尝试现有的 app,充分把玩。下面列出一些比较典型的,其中也包括一些不那么知名,但很具实验性质的 app。Ikea Place:第一批移动 AR app 的代表,也是具有真实用例场景的产品,提供了上乘的解决方案。Wanna Kicks:同样提供预览类的功能,具体用例聚焦于鞋类试穿和购买,实际体验非常惊艳。纽约时报 app:最早一批拥抱 AR 技术的新闻类产品。他们会为新闻故事提供相关 AR 功能,从而实现更深层的沉浸体验。无线电波的构造:非常早期的实验性 AR app,出自荷兰设计师 Richard Vijgen 之手。是付费 app,但非常值得尝试。Meisai:作者 Takayuki Watanabe 在其中探索着各种不同的 AR 滤镜与视觉效果,非常有趣。Qlone:也可以被看作是 3D 设计与原型工具,用来对现实物体进行 3D 扫描进而生成模型。阅读与学习资源此处内容对于译者涉及敏感,因而不做翻译。有兴趣的朋友请根据文末链接阅读原文。—— C72103D 设计与原型工具来自 Mehdi MeSSrro on Unsplash既要说,也要练,学新工具势在必行。也许最初令人生畏,但当你熟练之后,便会发现其中的乐趣。以下是一系列对于初学者来说较为友好的 3D 与原型工具供参考。Spline:对于初次体验 3D 是不错的选择,开发团队比较年轻,致力于让 3D 设计变得更简单。产品免费,易于使用,没有铺天盖地的复杂功能,输出快捷,恰到好处。Vectary:定位类似于 Spline,大体上在尝试打造 3D 设计领域的 Figma,聚焦于简单易用且易于协作的功能,既能引领你步入新领域,也能帮你在入门之后产出令人印象深刻的作品。Blender:当 Spline 和 Vectary 已经难以满足进一步的需求时,你可以继续进阶到 Blender。我甚至不大理解这款软件之所以免费的理由,因为它切实提供了创建专业 3D 模型及动画所需的一切功能。最初上手的难度相对较高,但他们提供的学习资源质量很棒,有助于你快速提升水平。Spark AR:最初由 Meta(Facebook)面向内部团队开发使用,而后面向公众发布。任何人都可以通过它来创建并发布他们自己的 AR 面具和滤镜。大体上讲,是这个产品开启了 Instagram 上全脸滤镜的热潮。虽然你可以通过这个软件制作非常复杂的东西,但他们在官网提供的教程还是可以帮助你非常便捷的创建自己的虚拟面具。Adobe Aero:你可以轻松地将预制或自制的 3D 模型拖放到书桌或房间地板上,并添加相应的交互行为,创建出简单的 AR 原型。Apple Reality Composer:Apple 自家的 AR 设计工具,定位类似于 Adobe Aero,如果你希望把玩一些 3D 内容,添加一些交互,创建一些简单的原型,那么这绝对是正确的工具。纸和笔:若干年前 WWDC 的这部视频罕见地展示了 Apple 的设计师制作 AR 原型的幕后故事。我非常惊讶于他们仅通过纸、笔、胶水等工具就能实现大量原型设计工作。你可以远离屏幕几个小时,通过制作实体化原型来演示和验证数字化体验,太棒了不是么。如何获取 3D 模型来自 Bradley Pelish on Unsplash有时候,基于他人创造并提供的 3D 模型来设计体验确实会令事情简单一些。前面提到的很多 3D 工具都会通过他们自己的库和平台为用户提供模型。如果这些仍然难以满足你的所需,那么不妨试试以下平台:Thangs:免费 3D 模型平台。质量水准不一,但你或许恰好能找到比较适合的。Sketchfab:付费平台,但整体水准明显更高。如果你需要质量过硬、细节出色的模型,不妨到这里一试。大致就是这样。希望这份清单,包括整个文章系列,都能为大家带来价值。英文原文:https://bruno-everling.medium.com原文作者:Bruno Everling译者:C7210AR|也许AR增强现实技术才是距离设计师最近的未来从科幻小说到电影,从动漫到现实世界,虚拟现实技术历经几十年的光阴,从一个构想,变成了现实世界中到处可以体验到的民用技术。阅读文章 > 欢迎关注作者的微信公众号:「Beforweb」本篇来源:优设网原文地址:https://www.uisdc.com/immersive-experience-designer-3
界面 需求 原型 之前接到一个需求,在客户跟进系统中,销售根据客户手机号码生成的串码,复制到企业微信添加好友后,可以将 useID 自动关联绑定客户编号。有位设计师直接就对着原型把界面做了出来。对于做好这个界面,他也非常努力,比如让元素更好看,信息排列更整齐。我遇到过几位设计师都是这么做需求,但是最终出来的界面不尽人意。因为他们把目光都聚焦在局部,缺乏对整体的思考。今天用这个界面来说一下思路吧。这张是产品的原型,为了体现真实情况,文档说明基本是原话(已对信息进行脱敏)。原型的意思是在客户的主页点击「生成串码」就会来到这个页面,默认将客户的置顶手机号码显示在第一位,复制这个号码生成的串码,去企业微信添加好友就会自动关联绑定。就像以前要分享淘宝的商品给微信用户时,需要点击分享,将出现的那串文字复制到微信发给朋友一样。利用路径拆分原则,分析这个用户在当前页面要通过什么方式才能达到目的,可以分为以下两种情况:复制置顶号码即可满足需求;需要将其它号码生成串码才能满足需求。通过这张图,结合原型,我们可以发现这两点:1、这个页面的目的非常明确,是复制串码;2、置顶号码默认生成串码,其它号码需要点击生成才会有串码,因此重新获取这个按钮,在两种号码卡片上出现的节点不一样。理清思路之后再来看原型,会发现原型的低保真图与说明是两种意思,也就是低保真图没有体现应有的状态和正确的意思。如果拿着这张低保真图直接对着做,将「重新获取」作为页面的主按钮样式,这个界面的可用性就很低了,用户会认为点击「重新获取」是对应所有的号码。根据正确的思路,做界面之前我们应该做一张低保真设计稿。下图是对于原型进行优化后的低保真设计稿。我们还可以用墨刀制作一个小型 demo,找相关用户或同事进行测试。这样做可以提前验证界面是否达到用户的预期。小型 demo 如果验证不成功,用户依然有困惑,可以继续调整,直至验证成功后,才进行界面高保真设计。这个概念也叫 MVP,即最小可行性方案设计。方法有很多,简单的纸面原型、线框图都可以实现,视情况使用。通过验证后做出来的界面,返工率会更低,因此不要忽视这一步。接下来才是找参考界面,不用局限在相同类型的界面中,可以泛浏览界面,从中找到灵感。(所以平时收集界面很重要)成图如下经过这个事例,我们可以大致描绘归纳出步骤:识别需求-重塑需求-梳理流程-设计界面1. 识别需求识别需求不是读原型说明文字,而是要基于了解用户和产品的前提下:在什么场景,用户需要通过什么方式,解决什么问题。不然原型文字就只是文字规则,没有发挥最大作用。其次,需求是否合理,是否能真正解决用户问题。2. 重塑需求理解产品的意思后,利用路径拆分原则进行需求的重塑,了解用户通过什么方式到达目的地。需求拆分方法的原则可以看乔梁的《持续交付 2.0》,其中 INVEST 原则、需求拆分的五大技法能够帮助我们设计时以产品角度进行思考。3. 梳理流程梳理流程,查缺补漏后,进行界面的低保真设计。在这过程中用到 INVEST 原则中的 Testable(即可验证原则),不断验证直至成功再进行界面设计,可以让我们的返工率降低。4. 设计界面经过前面一系列的思考和验证,再去进行界面设计的时候,我们才是带着正确的任务:哪个才是当前的任务重点、什么元素应该强调或弱化、在设计规范的范围内怎么让界面更舒适好用…等。总结这个思路框架可以帮助我们快速而准确地完成界面设计,特别在小型需求上。别小看小的需求,每个界面都有其任务,可以推动流程的完成。面对大型的需求时,则需要拆分得更细致,用更全面的方法去做。老板说界面不好用怎么改?从这5个方面入手!有次接到个需求:“我们系统不太好用,视觉升级的时候也麻烦帮着改改。阅读文章 > 欢迎关注作者微信公众号:「牙线y2x」本篇来源:优设网原文地址:https://www.uisdc.com/interface-design