金融电商
印度电商Flipkart在B2B设计环节中对原型设计的思考
Flipkart是印度最大的电子商务公司,现在是沃尔玛集团的一部分。他们致力于构建美观且具有影响力的企业级应用程序。

ProtoPie
August 21, 2023

Flipkart是印度最大的电子商务公司,现在是沃尔玛集团的一部分。他们致力于构建美观且具有影响力的企业级应用程序。

Prateek在演讲中分享了他在Flipkart的B2B部门是如何工作的,以及他们如何为品牌与合作方量身定制产品。”我们必须同时考虑当下和未来,为走向未来做好准备”,是这次分享的主题。
面向当下的设计和面向未来的设计
产品生命周期是无止境的,需要考虑现在和未来。现在包括定义、创意、原型等,而未来则需要考虑产品的设计愿景和创新,包括新技术和长期价值。在涉及产品时,需要说服整个公司,这就是原型设计的作用。
面向当下的设计:
了解当前用户的痛点和生态系统中的增量变化,使用用户反馈和研究等方法来收集信息,以及如何为用户提供最佳体验。
面向未来的设计:
让用户能够轻松完成任务,不需要使用问题管理系统。通过提供足够的信息来减少对帮助的需求,我们能够实现这一目标。ProtoPie帮助我们推动原型创新,让我们的态度从“不可能”变成“让我们开始吧”。下一步是进行逆向工程,制定一份能够引领我们走向未来创新的路线图。
案例展示
以问题管理系统为例

当下的设计目标是为用户构建世界上最好的问题管理系统,帮助他们完成每天的任务。用户在这里的需求是他们能够提出工单,如果他们遇到问题,任何与产品相关的问题,他们都可以提问。

而未来产品的目标是让用户能够轻松完成任务,不需要使用问题管理系统。通过提供足够的信息来减少对帮助的需求。
工具使用

工具使用:Flipkart设计团队通常使用figma做设计,使用ProtoPie制作原型。ProtoPie帮助他们推动原型创新,完成了从“不可能”到“让我们开始吧”的态度转变。

为什么喜欢使用ProtoPie:
- 可以从任何地方、用任何设备进行访问
- ProtoPie Studio 是一个神奇的工作室,可以在 Mac 上运行,并提供许多功能和特性
- 无缝对接其他软件,每当我们考虑使用新产品时,总是需要与我们现有的设计、共享和协作工具匹配
- 当你为未来设计时,你需要一款可以为你真正构建未来原型的产品
Picsart:原型展示实现无障碍沟通
这次分享第二部分,来自Picsart的设计团队展示了他们是如何利用原型制作提升沟通效率的,以及使用ProtoPie的心得体会。Picsart是一个照片和视频编辑的创意平台,用户可以在分享他们的作品。
沟通效果对比


Picsart团队通过生动的对比展示了,相较于只用语言进行沟通,通过ProtoPie制作原型可以节省时间、减少错误空间、促进沟通和获得反馈,同时激发创意。
ProtoPie使用心得

ProtoPie可以通过高保真度的原型使复杂的交互和流程成为真实的体验,包括详细的交互控制台和组件之间的连接方式。学习曲线是使用ProtoPie的主要挑战,但如果你已经熟悉其他设计工具,你可以从一个较高的水平开始。ProtoPie还有其特点和专业功能,但有大量的信息和教程可供学习,一旦掌握了所有这些工具并熟练运用,你将能够更快地制作原型,并使原型设计变得更加轻松。
案例展示

这是一个Picsart项目,主要包括了颜色选择工具——色轮,可以帮助改变界面颜色。使用了一些基本原型和其他工具,但遇到了一些问题。开始使用ProtoPie后,解了决这个问题,并得到了非常接近预期产品效果的结果。现在实现了一个交互式的色轮色谱,它可以与滑块进行交互。还创建了可交互的颜色预设,使用户能够真实地体验。所有的一切都是可交互的,当改变颜色时,所有相关的元素也在变化。

在Picsart中使用的所有幻灯片都是在ProtoPie中制作的,在ProtoPie中选择它们并将它们拖放到屏幕上。并且开发人员可以使用ProtoPie的“配方”来记录操作,例如滑块的移动和相关的交互效果。Interaction Recipe可以记录用户的操作并生成一个交互操作列表,包括缩放、曲线、动画和持续时间等,这对开发人员非常有用。

实际的ProtoPie界面是这样子的,可以使用变量和公式来链接各种元素,实现非常灵活的功能。可以在原型中创建复杂的交互和动画,而不需要编写任何代码。
ProtoPie提供了四种不同的方式来创建色谱组件,这可以提高创造力,并快速测试不同的版本。这些色谱组件的结构被设计为四种不同的方式,以便在制作整个原型的过程中,可以不断更新和改进。这意味着,用户可以使用原型中的任何工具和功能以不同的方式完成任何操作。
总之,ProtoPie是一个非常强大的工具,可以帮助用户创建高保真度的原型,同时提供了丰富的功能和工具。如果你是一名设计师或开发人员,并且正在寻找一种易于学习和使用的原型设计工具,那么ProtoPie可能是一个不错的选择。
问答环节
1、你们是否使用交互录制功能?或者你们使用其他工具来进行交付规格说明等?
Prateek:我们会使用两种方式。如果是复杂的交互,我们会使用ProtoPie的分享选项直接与他们共享链接,他们可以自己查看。他们可以播放、重播等。有时我们甚至会使用类似我们今天所做的录制方式,但通常在向利益相关者演示时,我们会使用视频。因为开发人员对所有工具都非常熟悉,所以一切都很顺利。
2、如果开发人员无法在目标平台上实现交互,你们有备用计划吗?
Prateek:即使我们向支持部门寻求帮助,我们也会在进入迭代或开发之前使用ProtoPie来进行验证。我们在任务进入迭代之前就可以看到某些交互是否可行。在任何开发人员参与迭代之前,我们会先制作这些原型和交互。
3、使用ProtoPie可以节省多少时间?
Prateek:这取决于具体的项目,有些项目非常容易构建,非常容易。通常我们先使用figma,直接从figma导入,并在ProtoPie中使用触发动作。这不会消耗很多时间。主要取决于动画的复杂性和我们需要构建的逻辑的复杂度。这不是每天都要做的事情,但每周可能需要几个小时。这就是所需的全部时间。
4、我一直想在我的设计团队中引入ProtoPie,你和你的团队是如何开始的?你们是如何学会使用ProtoPie的?
Prateek:我们在使用ProtoPie之前,使用figma进行设计。但是ProtoPie使我们能够实现许多之前无法实现的功能。当我们需要设计复杂的交互、过渡和逻辑时,ProtoPie让这一切变得容易。我们发现它超越了figma在某些方面,两者各有优劣。ProtoPie的用户界面非常简单,易于上手,并提供了许多学习资源,包括研讨会、课程和视频。我们有一个专门的团队创建相关内容,并发布在我们的产品学院链接上。这是一个免费的平台,可以提高你的水平并加深对ProtoPie的了解。我们会不断完善这些资源。
5、团队中的每个设计师是否都参与了原型设计的实践,还是有一个专门的交互设计师角色?
LIlit:设计团队规模很大,每个人都会制作原型,原型设计帮助在产品的整个生命周期中进行设计。没有专门负责原型设计的人,但很多人喜欢原型设计,也是用 ProtoPie。交互设计本身没有负责原型设计的交互设计师,但负责组件本身的设计系统团队,他们已经包含了这些组件的交互。