活动资格验证流程设计

为了加强厝边网与微博网友的互动，同时也让更多人认识雅乐这个网站所提供的服务。公司决定发起一个线上结合线下的活动，活动需要符合一定的条件（1.绑定微博；2.上传头像）才能参与，同时为了简化验证流程，避免频繁页面跳转提高参与门槛，考虑在一个页面内完成资格验证。

so…

总目标：验证并引导 用户达到参与活动的条件，顺利进入活动页。

任务分解：

TODO1：绑定微博

[caption id=”” align=”alignnone” width=”539”] 活动资格验证流程第一步中的所有可能性[/caption]

上图列出了资格验证流程第一步中所有可能的过程，在这环节可以获得页面访客微博账户（W）和厝边网账户（C）的登录状态，以此确定展示的页面

1. 两种帐号同时登录的访客，到达验证环节出口进入下一验证环节

2. 至少一种帐号未登录

   1. W登录C未登录，绑定页（cuobian.com）
   2. C登录W未登录，授权页（api.weibo.com）

   3. 两种帐号均未登录的访客

      1.  微博帐号
      
              1.  已有，**微博登录页**
      2.  未有，**微博注册页**
      
          2.  厝边网帐号
      
              1.  已有，**厝边网登录页**
      2.  未有，**厝边网注册页**
      

      第一种（1），厝边网和微博帐号都已登录最理想，直接跳过这一环节；

第二种（2.1和2.2）中的前两个情况也好办，都是打开授权页，进入微博已有授权流程；

第二种中的最后一个情况（2.3）乍看页面挺多，层级也比较深，而层级越深步骤越多，访客中途退出的可能性就越大。但只要有一个登录状态改变，也就转变前两个情况（2.2）之一。考虑到厝边网已有登录页弹窗可以利用，登录页弹窗中有注册链接可兼顾无厝边网帐号访客，且对于我们而言可控性高于微博授权页，故考虑对两种帐号均未登录的访客展示厝边网登录页。如下图

[caption id=”” align=”alignnone” width=”539”] 活动资格验证流程步骤一——弹窗展示页的选择[/caption]

1. 两种帐号同时登录的访客，到达验证环节出口进入下一验证环节

2. 至少一种帐号未登录

   1. W登录C未登录，绑定页（cuobian.com）
   2. C登录W未登录，授权页（api.weibo.com）

   3. 两种帐号均未登录的访客

      1.  微博帐号
      
              1.  已有，<span class="cutOff">微博登录页</span>
      2.  未有，<span class="cutOff">微博注册页</span>
      
          2.  厝边网帐号
      
              1.  已有，**厝边网登录页**
      2.  未有，<span class="cutoff">厝边网注册页</span>
      

      这样以后，根据用户微博账户和厝边网账户登录情况的不同，将只有三种可能的展示页面。

TODO2：上传头像

这一步相对简单，通过用户头像url是否为默认值，即可判断是否满足条件。

对于不满足的，显示图片上传控件或同步微博头像的按钮即可。

流程衔接

验证流程可以以TODOlist 的形式在验证引导页中展示，引导页在整个验证过程始终保留，不仅可用作进度提示，也降低验证流程被打断的概率。

所以应该尽可能将页面和控件展示在弹窗中，厝边网弹窗控件的内容部分是一个Iframe引用，步骤完成后通过回调函数将父页面中TODOlist的相应条目标记为已完成并关闭入口；帐号注册和激活可能无法在弹窗中完成的操作，则在新建页面中完成。

小结

有些整体看起来比较庞大而繁杂的问题，可以将它分步骤、列出每一步中所有可能，然后由简入繁 各个击破，小技巧是在宏观上对所有同情况进行归纳和等效处理，找到其中最大公约数，让处理过程得到简化。