2012年6月，我在CNN.com工作时，接到了为“选举之夜”进行用户体验设计的任务。接下来的5个月我为那1个晚上贡献了全部精力——但我的成功对选举的胜利方没啥影响。我所关注的是页面的可读性，数据的可视化，可变形的画布，以及在iPhone上怎么实现该死的鼠标悬停弹窗效果。在当时，CNN.com首次上线了响应式体验站点，同时，我也第一次面临响应式体验设计。
这是一场豪赌。选举之夜对于CNN.com来说就像周日超级碗那样重要。如果完成的出色，这将是我4年来收入最高的一个晚上。此外的压力就是苛刻的完成时间，截止日期毫无商量余地，要么11月6日上线，要么就玩完。
接下来我了解到第一个开发冲刺任务将在4天后拉开序幕。4天？！我的项目经理冷静地告诉我：“别担心，开发人员仅需要一个第一版的原型，在他们做第一版原型时，你可以接着做下一版。”
啥？我怎么可能在还没对机器进行粗略设计的前提下就开始设计机器的齿轮？
当我们在固定屏幕大小的情况下进行页面设计时可以考虑不周全；最终可以通过把独立设计的页面缝合在一起来达到目标。我对于响应式设计毫无头绪，但我知道我们需要清晰且简单的体系，而不是把页面（简单地）串在一起。正如所有的工程师和设计师所知，在一个系统中，可移动的元素越多，就越可能造成灾难。
所以，在最初的4天设计中，我并没有绘制互不关联的线框图，相对的，我画了一份具有可重用、可互相替换组件的完整体系图。如下图所示：
我在会议室里向那些本希望看到单一“已完成”原型的相关人员展示这张图。我表示，相比我们的2008个设计方案，我已减少了组件和原型模板的数量，并且新的体系图非常简单，仅需一张8.5 × 11的纸就可以展示了！值得庆幸的是，一名核心人员在房间中看到了我所展示的草图的价值：用更少的素材来构建产品。
我在2012年制作的草图远达不到完美，更多时候都是在尝试多做快做。我仓促地开工，禁止弹窗和条形图，始终考虑桌面优先，担心位置偏移而不是优先级够不够。我采用设计封面页的经验（这经验应该用在设计的最后阶段），包装出了一款不成熟的主页。我花了过多精力在固定顶层导航上，而不是首先关注内容模块。
尽管不完美，这张草图的设计理念，以及背后的思路方法，与我产生了共鸣。它不是站点地图，因为它没有层级；它也不是故事版，因为它没有任务流。相对的，这张图展示了一种系统级思维，它改变了我做用户体验设计的思路。
如果我掌握了现在的知识，这就是我将会创造出的，剥离开交互、持久导航、网页和布局的草图，它展示了3个对象的体系：州、竞选，以及州-竞选结果。
这种方法可行：我们的响应式“选举之夜”被认为是周日超级碗的CNN高管的希望。但我们真的是九死一生，为了确保设计效果在无数设备上都展示得当，我们没日没夜地工作。我不确定我们是否能采用更复杂的设计来完成这一任务。
今天，我已把这一艰难的考验转化成一种可被证明的、结构化的、基于对象的流程。在这篇文章中，我将介绍面向对象的用户体验设计，分享我进行对象关系映射的过程，并帮助你开始自己动手实现它。
未完待续……
