写在前面的话：

       本命年其实是个幸运年啊，今年就有幸与产品和客户端开发的小伙伴一起工作，这个团队年轻又逗逼……别看我们进坑不久，涉坑未深，但是我们努力也傲娇着呢！哼╭(╯^╰)╮

       stop，掰扯回来，在进行交互与视觉设计中，不断的与他们讨论，讨论沟通是可以得到很多我没有想到或者不了解的：设计以外的惊喜，就这些惊喜，我进行了总结，希望能帮助到大家，如果有与大家的想法有出入，也请不吝指教哇，呜哈哈~

登录页是否需要导航栏？

       导航栏的页面逻辑强调的是层级关系，一级-二级-三级页面等；

       之后我们想一个问题：登录页面一般是从哪里弹出的呢？普遍的有这么几种：

       （1）底部导航“我的”——登录页由底部向上弹出；

       （2）将商品加入购物车——购物车结算——登录页由底部向上弹出；

       （3）底部导航“购物车”——登录页由底部向上弹出；

       由上，我们看到App的登录页的出现可以有很多种情况，而无论每一种的前面几步是神马，最后一步的交互总是酱紫：登录页由底部向上弹出。而不是层级之间的跳转，所以登录页往往没有层级关系。因此，大部分App的登录页面不含导航栏，也就是说登录页不是从导航栏进入，而是不同情况下弹出的~

        当然，这里有一种情况：很多App的登录页会有类似导航的UI设计（返回按钮、帮助等），但是从开发的逻辑来说，这不是“导航栏”~

       登录页导航这一部分的交互要考虑清楚，需要与不需要导航栏的逻辑是不一样的，如果后期还要改，IOS开发小哥可能要蓝瘦香菇~~

登录与忘记密码的“返回逻辑”

.返回逻辑与X逻辑

       先说一下iOS的逻辑：在使用IOS的App时，你会发现有一些页面是从右面进入，也可以使用手势回退。有一些页面是从下面弹出的，这个是不能使用手势回退的，所以打个比方解释这两种逻辑的不同：

（1）返回逻辑：你在翻书，一页一页翻，也可以返回，手势回退，一页一页翻回来。这时候的“返回“按钮，就是翻页效果；

（2）X逻辑：你又拿了一本新书盖在了原书的上面，你从第一页打开。你没办法回到上一本书，你只能在这本书里面翻页。这时候的一个“关闭”按钮，应该是撤掉这本新书。

.登录页面最好不用返回逻辑，只用X逻辑

       比如第一本书是App界面，当需要登录时，弹出了登录页面（第二本书盖上来，第一页）——点击忘记密码（翻到登录的书的第二页）——点下一步（翻到了第三页）。如果从多步忘记密码页面回到登录页面，页面之间有层级关系，可以考虑返回逻辑；但是想撤掉登录页面，就最好只考虑X逻辑，排除返回逻辑，这样更符合用户的操作习惯。

       看淘宝的登录页面，是从下往上弹出，淘宝的“返回”按钮并不是翻页效果，而是页面从下面又拿走了，也就是撤掉“登录”这本新书的操作，其实这个操作是第二种X逻辑，不是返回逻辑~

.忘记密码页面可以有返回与关闭两种提示

       如果用户忘记密码，暂定为两步：验证手机号——设置新密码；

       无障碍完成操作：忘记密码第一步—忘记密码第二步—第二步成功直接回到登录页。有障碍的操作，则分为下面两种看：

（1）有返回与关闭按钮：回到登录页的最长操作（4步）：忘记密码第一步—忘记密码第二步—不想进行第二步操作了，点击关闭按钮——登录页；

（2）只有返回，没有关闭：回到登录页的最长操作（5步）：忘记密码第一步—第二步—返回—忘记密码第一步——登录页；

      所以在有障碍操作时，忘记密码页面有“返回”“关闭”两种操作提示会更合适~

关于搜索页的tips：

搜索页面一般有两个部分：热门搜索+历史搜索；

.热门搜索

       就这一种设计布局看：热门搜索的关键词放置在矩形控件时，依次横向排列。

热门关键词的字数不一，如果控件尺寸小了，就会有关键词溢出；如果控件尺寸大了，关键词字符少时，又会显得很空。所以为了达到更好的视觉效果，矩形控件尺寸无法统一。同理，也无法统一每行最右关键词距页面最右的距离（b表示）~就是这个位置：

       人的浏览顺序一般是从左到右，从上到下。热词数量较多时，就会纵向排列。这样，用户在横向看完热词时，就会纵向继续浏览。一般的，热词纵向是2-4行，一旦热词过多，频繁的变动浏览顺序也容易引起用户疲劳。

       因此，第二种布局（详见京东）：只有一行，滑动该行看更多的热词，我认为好处是这样：

（1）浏览顺序只有一种：用户在热词上的浏览顺序由两种变为一种：左右顺序，用户在“热词”模块无需变动浏览顺序；

（2）边距可控：可控制第一个热词距页面最左的距离a，和最后一个热词距离页面最右的距离b~~

       但是也有第一种布局统一控件尺寸的App，猜想这样做的原因：

（1）设计是需要根据产品来调整交互与视觉的。每一种产品对应的需求是不同的，根据不同的产品需求调整最适合该产品的设计；

（2）热门关键词可以做到可控。就检索的热门关键词来说，到底“热门”的搜索是怎么评定，是按照用户的搜索量去排列，还是后台去“推送”？如果可以做到可控，那么在“热门搜索”这一块，设计就可以决定用哪一种布局~

.历史搜索

布局选择：

       历史搜索关键词数量可能会超过热门搜索的关键词数量，一般历史搜索设置20个左右关键词（依不同产品情况定哦）。如果用“热门搜索”里第一种布局：试想一下，关键词有20个，那就要五六行，浏览顺序是两种，每一行最后一个字符距右的距离又不一样，视觉效果就比较混乱， 因此排除这种布局~~可以用列表纵向排列，同上，浏览顺序只有一种，字符距左右距离可控，视觉效果也比较好。

慎用“清空”：

（1）误操作有点怕： “清空”的按钮，对于想要进行清空操作的用户来讲当然是好用的，但是用户也很有可能误操作，如果误操作点击清空按钮后，再没有设置“确认清空？”的提示，那这无疑是“危险”的用户体验。所以在每一个搜索词后设定单独删除的按钮。可以看到有一些App，每个搜索词后有单独的删除按钮，也有清空全部的按钮，虽然满足了不同用户的需求，但是我觉得清空对购买转化率应该也有一定影响~

（2）影响购买转化率：历史搜索是用户在不同场景下进行的搜索操作，很可能代表着用户曾经想买什么，或者想给朋友买什么等等。他们在进行搜索的时候，就会带有购买欲望，这些购买欲望很可能转化成实际购买力~作为一个看重“购买”的电商产品来说，清空按钮=清空该用户的全部购买欲望。跟清空操作比，单独删除没有那么易用，但是却增加了商品转化的可能。因此，我觉得可以不设计“清空”，只在每个搜索词后进行单独删除。

       目前总结就这么多啦，还有后续的，我再更~~~~如果有理解不到的地方，欢迎大家一起讨论，说出你的想法，哦雷雷~~随手点个赞，你是个好人，诶嘿~~~