使登录页面变得正确


使登录页面变得正确

事先声明,这篇文章讨论的是目前登录页上已采用的设计,而不是讨论关于如何设计的新见解。常言道:「普天之下,莫非旧闻」,但如果我们连历史都不曾了解,又如何能知道它会去向何方呢?好啦,这个理由已经足以支撑我写下这篇文章了。

因此,一般结论是:创建登录/注册页的艺术(没错,它是一门艺术)不是随意的!或者至少不应该只是为了获得最佳结果。App 的整体体验是一个非常重要的因素,应该符合整个 App 的当前目标。

接下来,我将就决定登陆页的布局因素进行讨论。


1 ) 访问的平台:网站还是 App ?

访问平台的影响基于一个相当显然的事实:大部分访问桌面端版本的用户是新用户。这些人希望在决定使用他们时间(和带宽)来下载本机 App 之前,先了解一下你是做什么的。App 是一种忠诚工具,这是一条经验法则:当人们欣赏你的服务,并希望享受 App 提供的所有优点,如即时通知和其他功能时,人们会下载它。也就是说,大多数访问 App 的用户都是老用户,而大多数访问网站都是新手,这个假设是有意义的。那么这个经验是如何告诉我们,当这两个群体访问各自的平台时,该怎么构建第一页呢?为了具有深刻的印象,我另起一个段落:

为本地 App 创造一个以登录为中心的页面,为桌面版本构建一个以注册为中心的页面!

这样做的目的仅仅是为了分别迎合两种群体中的大多数人。

举几个在工作中运用这个规则的例子,以免你错过它。

红色框是用于登录的空间,紫色是用于注册的空间。
正如你能够从图片中看到的那样,就在每个页面上各自分配的空间方面,相对于登录来说,页面对注册有明显的偏好。

与以上的图像相同,相同的颜色约定在这里被运用。
在相同网络下,移动 App 的情况却是恰恰相反的!


2 ) 网络规模

有一种情况,通常在网站中,你会有两组访问者,包括老用户和新用户,他们平等地聚集到相同目的地。但是,你应该不会同时拥有两个群体相同程度的涌入。这意味着当你刚刚推出你的服务时,你肯定会(希望)拥有很多新用户,而不是那些现有的用户( beta 测试人员和开发团队)。那么,你认为谁才会让你的准备更有意义呢?当然是新用户,那么怎么办?下面是另一个教学时间,且听我慢慢道来:

在你的平台的早期阶段,应该创建一个以注册为中心的页面!

很明显,很多设计师(大部分是开发人员)只是提供了用于登陆页面的常见模板,即登录页面。但问题是,为什么你看到这个给你灵感,决定你的 App 也应该如此的 App 界面的唯一原因,是因为该 App 已经有一个成熟的社交网络!这就是为什么你首先就想要使用它!所以当我们喜欢的网络刚刚成长和需要数字时,我们大多数时候看不到它们,就像我们现在一样。所以你不是从错误的人那里得到建议,只是在错误的时间运用它。也许如果我们回到这些平台最初的样子,看看他们在你现在所处的位置,那么你会有想法去做什么。

你真幸运,我碰巧拥有一个哆啦A梦(对于那些不幸的没有看过这部电影的人,我正在谈论一台时间机器),并会帮助你及时回到那些最好的网络最初的样子。

1 — 2008, 2 — 2009, 3 — 2012.
是的,它就是 Twitter .

1–2008 — 这是他们第一次的登陆页面,刚刚推出了新的想法,登录形式几乎没有装饰和边框(字面上)。但是,通过一个鲜艳的召唤点击的按钮告诉你注册,另一个红色 CTA 按钮告诉您观看演示视频,你会看到它们正聚焦在告诉你新平台是做什么的,不是太注重登录,是因为他们知道现在的焦点是吸引他们的第一批成员。对于少数已经加入的人呢?他们可以弄清楚登录表单的位置。

2–2009 — 好的,他们得到了一些关注和可观的成员数量,几乎立即(推出一年后)为现有用户进行了更多的考虑,现在已经有合理的数量来关注 UI 功能了。但是注册按钮仍然在中间至高无上的位置,在充满活力的柠檬绿色中。

3–2012 — 从按钮开始,我们在这里!所以他们现在有稳定的新来者和更多的现有用户。这在登陆页面上如何反映?通过对新老用户给予同等的关注。为什么?因为新用户必须始终照顾,而现在的用户群体太多,以至于无法忽视和不能悉心照顾,这样可以确保所有用户都能继续使用并爱上这个平台!

所以你会发现一个问题可能会发生,当一个设计师四处寻找新网络登录页的好概念时,当他发现了 Twitter 并对自己说:“天才!把登录和注册页面放在一起!让我们也这样做把“。但是,呃...不行!由于你不能细致的了解 Twitter 用户的新旧用户比例,因此你不能采用他们的方法。在这个故事得到教训了吗?好吧,又到教学时间了!所以通常的方法是:

观察学习对比过去和当前的设计,有时会更加明智。

3) 特殊情况

当然,总是有那些不符合你发现的模式的人,让你看起来像是破解了所有 UI/UX 的代码。不,他们必须冲在前面,打破规则,做自己的事情。这些包括像 Facebook 这样的登录页面,尽管用户数量庞大,但仍然倾向于新的注册用户。就像我们自己的 Medium ,由于处于用户群体增长的早期阶段,甚至他们的本地 App 都是以注册为中心。但是我们可以理解他们的方法思想。所以我猜这是符合用户基数大小的规则 (#2).

好的,那么最后的消息是,不要像不值得思考的登记页面一样对待登录/注册页面,因为每个设计决策,无论多么平凡,都值得你去深思熟虑。最后的话...与团队的其他成员交谈,听整个产品的策略,看看你的设计决策如何帮助他们从一开始实现所有这一切,从我们的第一个但通常被忽视的朋友开始 - 登录页面。或注册页面,作为戏剧性的结尾,我必须只使用它们中的一个。 :-)


掘金翻译计划 是一个翻译优质互联网技术文章的社区,文章来源为 掘金 上的英文分享文章。内容覆盖 AndroidiOSReact前端后端产品设计 等领域,想要查看更多优质译文请持续关注 掘金翻译计划

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 221,695评论 6 515
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 94,569评论 3 399
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 168,130评论 0 360
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 59,648评论 1 297
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 68,655评论 6 397
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 52,268评论 1 309
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,835评论 3 421
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,740评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 46,286评论 1 318
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 38,375评论 3 340
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 40,505评论 1 352
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 36,185评论 5 350
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,873评论 3 333
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 32,357评论 0 24
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,466评论 1 272
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,921评论 3 376
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 45,515评论 2 359

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 172,288评论 25 707
  • 一直以来都想学画画,种种原因一直没有行动,说白了就是自己懒。终于下定决心开始学习,把自己的学习经历记录下来,也算是...
    觀雲阅读 558评论 3 10
  • 在做任何事情之前,做好准备,自己就不会狼狈。一直认为,在学习、工作上,一个人在某方面的能力究竟有多大,几乎直接取决...
    曦妮阅读 143评论 0 0