赞助商
立即赞助

从零开始设计产品的 10 个 UI/UX 启示

产品经验4年前 (2020)更新 流光
12.7K 0 0

从零开始设计产品的 10 个 UI/UX 启示

2016 的时候,我意识到一很重的问题:我一直都实自己的目标:学习新技能、结识新朋友、保持身健康,。这并不因我意愿动力,因我坚持下去。

Peter Drucker 说过:「量才管。」这个格言后来成为了我的信条。我决定将我的目标量,将它分解成为最基础的习惯来执行,并且每天一定量的执行,来实现最终的目标。

从零开始设计产品的 10 个 UI/UX 启示

最开始,我会使一张格纸来跟踪我每天的习进,健身及心健康状况。然后这个习惯持续了好几年,生逐渐有改观,并且养成了将每个同的目标进行分解、逐步成的习惯。

种行为模式和方法在我自己身上得到验证。不我在纸上坚持追踪行为习惯年,我决定和 Wilson 一创建一个程序,来升级种「习惯追踪」的工具,我们先构建一个免费的 Chrome 插件 Confetti ,是一个能够帮你追踪常习惯的工具,每次完成一个任务,有彩缤纷的纸屑效果出现,祝贺你守住习惯,达成目标。

从零开始设计产品的 10 个 UI/UX 启示

在四年的产品设计生涯当中,这是我从头到尾全是自己成的产,这个过程中,我有了很多启发。在这篇章当中,我将会分享我的见解,希望对你有帮助。

1、一开始就要界定好产品特性

从零开始设计产品的 10 个 UI/UX 启示

一始,我 Wilson 就决使用3屏的主功能,并构建了一粗糙的原型。但,我们足够的远见,无法设我们的产品终的方向,也对全部的法行深入的打磨。

最终,我们向后退了一步。我们过头来,确定了最小可执行原的发布日期,及真正的核心功。我们在 Notion 上创建了一个档,并且开始梳和管哪些功是「必需」,哪些功「如果有了会更好」。如,登录、注册、户引导是必可的功。但是,我们认为「重列习惯」是一个升体验但是并亟需的功。

我们基一点,我们开始抓住核心功能,尽能让它们够易用,强化核心特。通确定核心功能的优先级,并且确定期,借此缓我们的精神压力,确定我们不被成堆的功能所淹没。也似地我们有够的动力决核心功能。

2、有很多流程和状态需要搞定

从零开始设计产品的 10 个 UI/UX 启示

在设计产的时候,我经被醒要处好每一个边缘情况,填好每一个坑,确保体验的顺畅。从零开始构建产是一把双刃剑:基于自己的构想来创产是令人兴奋的,但是相应的,我需要经在舒适区外处问题。

我一直在 Skookum 从产品设计的工,而工通常是在一定的约束条件下进行的,但是现在所要处理的产品则不同。之前的产品以借助现成的设计系统,有早已搭建的设计语言,有完整的组件,有明确的 UI 状态,有非常明确的基础架构,但是次是我自己的产品,所有的没有。而且,个产品还能存在几种极端的情况、流程和状态。

比如,在注册流程中,按钮会有默认、禁用、激活、填充、错误、悬停等种状,但是除了这些之外,还需要考虑诸如密码重置的流程和体验,这可能会涉及 6 个高度相似的 UI 界面状:

  1. 输 Email
  2. 重新发送 Email
  3. Email 知设计
  4. 输入新的密码
  5. 错误界面
  6. 成功界面

这个过程中,有很多东西都令我一感到迷惑,这引发我一个要说的要点……

3、创建用户流程

从零开始设计产品的 10 个 UI/UX 启示

项目始之后,我很就遭遇了组织架构问题。因我作之余创建这产品,这导致我犯了一非常严重的错误:我按照传统的产品流程创建产品,这随后导致了一系列的问题。

按照标准的产设计流程,我需要从户流程开始创建,定义户可会执行的流程,并且针对要的流程界面进行必要的总结说明。因为这个项目和之前的工作一样,我一开始就忘记了遵循流程这件事情,我错误地将它视作为一个包含几个简单界面的简单项目(是是听着特别耳熟?很多谓的小项目翻车都是从这里开始的)。这样一来,当我开始处诸多按钮的同状态和界面变的时候,整个户流程变得混乱堪,并且我很难确定中的体验漏洞有哪些。

最终我停止种随的设计方式,并且在 Whimsical 当中创建完整的用户流程。是我很快清楚节有所缺失,以及整个界面流程的走向。

按照用户流程来梳理界面的候,可以对于整个产品的屏幕状有所了解,并且随着产品的发展膨胀,用户流程的重要性会随之增长,成为至关重要的部。

4、交互应该反馈到UI中

从零开始设计产品的 10 个 UI/UX 启示

的确,在完成整个 UI 之前,不应该开始向着项目当中添加动画。但是,不添加并不意味着你无需考虑。际上,不同的微互和动画对际的验影响是巨大的。你在思考 UI 设计的时,就应该考虑到微互和动画的使用,避免在续动效和互落地的时,进行不必要的修改。

比如,当在计「达成成就」这一体验的候,就考虑了需要用的交互的效果,所以在计 UI 的候可以顺着的喜好来进行计,并且将可能会用的动效拖某个角落暂记下来,避免在计 UI 的阶段,响了整体的流程和效果。而后续加入动效的候,就会方便多。

我认为,将 UI 和交互结合起来考虑是常要,为两者共塑造了体验。如在设计 UI 环节接加动效,会让个设计过程变复杂臃肿。

5、尽早获得反馈

从零开始设计产品的 10 个 UI/UX 启示

其实这也是在这个项目中犯的一个大错:等了长间才获得反馈。

我常是在晚上回家和末才有空进这个项目,在很长段时内,我没有真正告诉任何。

当我终于同我的家人、朋友、用户以及网乐于鲜的用户公布了这一产品之后,他们使用过程中,始注意到了很多细节显易见、但我并发的问题。我意识到我作产品的设者,很易陷入并沉迷用户体验当中比较孤立的一部分,反会忽略很多显著的问题。

想一,如果我尽早向户和友展示设计和原,那么我会在更早的时候发现问题,并且在获得反馈之后才进入开发阶,弥补大量的损失。

6、在别处获得启发很重要

从零开始设计产品的 10 个 UI/UX 启示

很多设师会认,所的法都必须原创的行,否则就欺诈。但稍微,其实彻底的原创其实很少的。当看到一优秀的产品,它优秀的配色恰到好处的交互可能会让觉得:「已人出了,我的法它面完全法比拟。」

这种思维方式实有着极大的缺陷,并且抑制了你的创。

当我现我的设计有缺陷的时,我竭尽力去搜索和更网上已有的设计。我观察和思考别的司和产品是何设计新用户引导流程的,何管理用户个人信息的。我从来没有复被人的验,但是隔三差去钻研别人所创造出来的优细节,将细节借鉴到我的设计当中。

最喜欢的一个范例,是从模状下,旋转退出的效果。这是偶然在一个网站上的效果,因此决定将它添加 Confetti 当中,还在着陆页的按钮中加入了类似的效。

事实上,切设计都是混搭创造出来。你借鉴细节并不意味着抄袭,不要害怕去发掘和学习优势和亮,你要学会有地拆解和借鉴,灵活地运用到自己设计,它像调制鸡尾酒样有趣。

7、勇敢面对身份的变换

从零开始设计产品的 10 个 UI/UX 启示

当开始计的产品的候,和 Wilson 头顶上的身就一直在变。是 UI计,要负责UX,要做交互,也制作动效,要进行面计,还要考虑市营销,要管理产品,也要扮演其的角色。

职责如此多,以至于我们不可避免地遇到我们能力范围各新问题。我们必须承认自己陷入了困境,寻求部帮助成了必要选择。

专注于自己专业的领域,其他不专业的方面寻求外部帮非常合理的。比如一项目当中,一家负责了绝多数的风景插画,另一家则完了肖画的部分,这很常。

我希望产的外观和功够保持的一致性,并且我确实做到了。但是要误会我的意思,我并非是敢走舒适区习代码开发,而是在这样的项目当中,我并适合从UI和UX领域延伸,毕竟成项目的开发优先级习代码更。

8、保持简单更重要

从零开始设计产品的 10 个 UI/UX 启示

尽给 MVP 安排好了发布时间,可以防止这项目被无限膨胀的功能特性作所淹,但这样依然无法防止我们基于已的功能行改。

很多人都 Reid Hoffman 的一句话:「如果你对于产的第一版感觉尴尬,那你一定是发布晚了。」过,我们正式发布的第一版的产,并会显得太尴尬,但是目前来看,当时那种简单直观的状态,起再好几个月时间反复打磨之后再发布,来得更好。

在新产品之前,我们必须考虑2个问题:

  1. 我们是否相信我们构建的产,够为户带来值?
  2. 我们是否竭尽力?

这些问题我们最终够达成目标,且按时发布,避免分心。专注交付最核心的功,而是被一堆冗余的次要特性压倒。

9、良好的交接更加省事省时

从零开始设计产品的 10 个 UI/UX 启示

从项目一始我就一直项目的理组织设素,以便后面行发。不过,由于我一始就使用了 Zeplin 这样的协同具,确保了我可以轻松将所的素都顺畅交给负责发的 Wilson。作一款设系统具,Zeplin 让我无需浪费时间对素行分类,非常便捷。

在交接的过程中,我还做了一些优:

  1. 将所的界面都组织到了 Zeplin 当中,并且行了处理
  2. 我给有的画进行了针对性的命名,方检索
  3. 我在 XD 中标注需要导出的素材
  4. 保留了旧有的界面存档,并且确保交付的新版界面是最新的

10、一次写明所有的UX文案

从零开始设计产品的 10 个 UI/UX 启示

设 UI 的时候,界面中的文案部分临时编写的,这促使了一次设完之后,整体的文案不一致、不协调的。

我很希望一开始就创建了一个单独的档,一次性将案分全重写,包括醒、注释、标签、弹框醒等等。而实际上,我的案都是在设计 UI 的时候附带着写来的,导致整体的一致性严重缺乏。

种文案身在上的缺乏,导致整个产品在语气和用词上是混搭式的,一致很差。

所以,在产品上线发布之后,一直在对文案进行修修补补。

结语

相,如果多错误不能一开始就解决或者尽早修改,最终产品的潜力是无法完全发挥出来的。正如同 Giacomo Casanova 说过的那:「一个不会犯错的人同也无法成事」。

所以我们要在误结经验,希望你不要在设计项目,陷入与我相困境。

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

相关文章

针对设计师评审时常见的情况,我整理了一下关于评审的方法,希望对大家有用,可以帮大家早一点下班~ 欢迎关注作者...
ui设计
编者按:本文高达一万字,从图标的起源、定义到基础的设计方法总结无一不包,还有大量的案例帮你理解布尔运算,是新人设计师...
图标设计
什么时候该用线型图标,什么时候该用面型图标,不知道大家平时有没有去思考过?我自己也曾经纠结过,但却没有深究,这篇文章...
图标设计
前不久我在讲标签栏专题的时候,有聊到过一次图标。(前文已提及到部分规范,本文将直接引用,为防止新读者理解脱节,建议先...
UI
或许很多人对「韡」这个字感到陌生,甚至会以为它是一个繁体字,其实它是简体字,读第三声「wěi」。 廖韡,1983年生,平面设...
书籍设计
下半年,往往是电商设计师最繁忙的季节,双11、双12、双旦节等重量级节日接踵而来。 不过,有意思的是,与双11、双12活动...
中国风
有趣的灵魂万里挑一,人们对正面情绪的向往使“有趣”成为沟通交流中不可或缺的情感特征。随着越来越多的品牌涌入市场,用户对...
ui设计
编者按:本文高达一万字,从图标的起源、定义到基础的设计方法总结无一不包,还有大量的案例帮你理解布尔运算,是新人设计师...
图标设计