Design a login screen - wiznote I UX作业

这是我bittiger上ux培训班的作业哦。

...

1.方向选择

对于design a login screen,我选择的是wizNote的登陆界面来redesign.这是一款类似于Evernote的产品。在redesign前期,我也参考了其他笔记类软件的login页面,开阔思路。自己在视觉方面很薄弱,所以颜色尽量往简洁方面走。

因为没有Mac...哭晕...暂时选择用MockingBot做的。

2.WizNote登陆界面、分析 

Design a login screen - wiznote I UX作业_第1张图片
自己做的图

布局:很模块化,没有整体感,缺少沉浸体验;按钮是长方形设计,太有棱有角;产品的两个特点放在拆分在两个轮播图里,没必要

视觉:wiznote主色调是蓝色+白色,logo和产品使用界面都是如下图这种色调。所以在注册期间搭配深色的背景图,我很不理解,觉得可以换掉。


logo

3.Redesign

Design a login screen - wiznote I UX作业_第2张图片
自己做的

3.1 sign in、sign up、skip按钮

我起初觉得,笔记类app的使用者,有可能是从pc端转移过来的,也有可能第一次在移动端下载使用这款app,所以在“登录、注册”的按钮设计上,我起初觉得应该是两两开,即保持原设计。但是后来再设计过程中,想到笔记app既然主打的是跨平台同步,也就意味着有更多的用户可能是为了同步而下载app。所以突出了“sign in”按钮。


Design a login screen - wiznote I UX作业_第3张图片
自己做的

另外redesign之前,看了下有道云笔记、evernote等竞品的登陆界面,反正我是不喜欢evernote的登陆界面,我觉得它应该增加个“试用”的按钮,让新用户有选择试用的权利,而不是上来就必须要登录或注册。

3.2 color

不喜欢wiznote的登录注册界面。我选择的颜色就是他们的主题色,比较简单,蓝➕白。

3.3problem

wiznote原本的设计中,登录界面右上角有个“配置”按钮,似乎对应企业账户和个人账,默认的是个人账户吧。但是打开时,我很困惑,所以就为当前模式添加了颜色条。

Design a login screen - wiznote I UX作业_第4张图片
自己做的


Yuan Chen老师评价:

做的非常认真,有自己的思辨能力和判断能力,非常棒!从临摹作业做出来了redesign,还领先了一大步,完全领会了老师们布置作业的意图,非常棒!

首先我分为视觉和逻辑两大块简单点评一下。

1.视觉:

小伙伴在做完research说产品的色调偏蓝白所以觉得登录界面需要统一,这是个很好的观察,鼓励鼓励~大基调定下来后细节上有些部分值得再次琢磨,比如:

字体颜色不统一:

登录密码的填写框的提示字颜色,忘记密码的颜色以及第三方登录都是三种不同深浅,不同tone的灰色,建议统一。

第二屏里有一个web形式的选框,需要考虑是否符合mobile的体验习惯。一般来说设计师们在设计手机spp的时候会尽量避免使用web的体验,比如下拉菜单,hover等等,用更加符合手机体验的模式来替代。同时这个菜单弹窗里的字体也不统一。

2.逻辑:

其实在思考一个成熟设计的产品的时候有一点很重要,很多时候设计的决策取决于很多因素,比如自身的商业战略考量,目标用户的测试情况,所以不能仅凭主观的感觉去定义两页轮播图是否有必要。比如我第一眼看到redesign的首页,我可能没有一个概念,wiznote是什么,他的核心功能是什么,如果是一个新手用户,没有一些简单的新手教程(on boarding)可能这个用户就流失掉了。所以这一点可以再重新去考量你的目标用户群体,不仅仅是那些你提到的,pc端转移过来的熟练用户,还有一些是没有接触过wiznote的新用户。

同理,sign in, sign up 以及skip的priority也需要遵循用户画像,商业需求整个全局来考虑。

总体来说还是一个非常走心的作业,很棒!其实做临摹作业可以展现出很多思考的一些盲区,对于在学习ux的小伙伴来说是一个非常好的学习机会!加油!

你可能感兴趣的:(Design a login screen - wiznote I UX作业)