2012年6月，我在CNN.com工作時，接到了為“選舉之夜”進行用戶體驗設計的任務。接下來的5個月我為那1個晚上貢獻了全部精力——但我的成功對選舉的勝利方沒啥影響。我所關注的是頁面的可讀性，數(shù)據(jù)的可視化，可變形的畫布，以及在iPhone上怎么實現(xiàn)該死的鼠標懸停彈窗效果。在當時，CNN.com首次上線了響應式體驗站點，同時，我也第一次面臨響應式體驗設計。
這是一場豪賭。選舉之夜對于CNN.com來說就像周日超級碗那樣重要。如果完成的出色，這將是我4年來收入最高的一個晚上。此外的壓力就是苛刻的完成時間，截止日期毫無商量余地，要么11月6日上線，要么就玩完。
接下來我了解到第一個開發(fā)沖刺任務將在4天后拉開序幕。4天？！我的項目經理冷靜地告訴我：“別擔心，開發(fā)人員僅需要一個第一版的原型，在他們做第一版原型時，你可以接著做下一版。”
啥？我怎么可能在還沒對機器進行粗略設計的前提下就開始設計機器的齒輪？
當我們在固定屏幕大小的情況下進行頁面設計時可以考慮不周全；最終可以通過把獨立設計的頁面縫合在一起來達到目標。我對于響應式設計毫無頭緒，但我知道我們需要清晰且簡單的體系，而不是把頁面（簡單地）串在一起。正如所有的工程師和設計師所知，在一個系統(tǒng)中，可移動的元素越多，就越可能造成災難。
所以，在最初的4天設計中，我并沒有繪制互不關聯(lián)的線框圖，相對的，我畫了一份具有可重用、可互相替換組件的完整體系圖。如下圖所示：
我在會議室里向那些本希望看到單一“已完成”原型的相關人員展示這張圖。我表示，相比我們的2008個設計方案，我已減少了組件和原型模板的數(shù)量，并且新的體系圖非常簡單，僅需一張8.5 × 11的紙就可以展示了！值得慶幸的是，一名核心人員在房間中看到了我所展示的草圖的價值：用更少的素材來構建產品。
我在2012年制作的草圖遠達不到完美，更多時候都是在嘗試多做快做。我倉促地開工，禁止彈窗和條形圖，始終考慮桌面優(yōu)先，擔心位置偏移而不是優(yōu)先級夠不夠。我采用設計封面頁的經驗（這經驗應該用在設計的最后階段），包裝出了一款不成熟的主頁。我花了過多精力在固定頂層導航上，而不是首先關注內容模塊。
盡管不完美，這張草圖的設計理念，以及背后的思路方法，與我產生了共鳴。它不是站點地圖，因為它沒有層級；它也不是故事版，因為它沒有任務流。相對的，這張圖展示了一種系統(tǒng)級思維，它改變了我做用戶體驗設計的思路。
如果我掌握了現(xiàn)在的知識，這就是我將會創(chuàng)造出的，剝離開交互、持久導航、網(wǎng)頁和布局的草圖，它展示了3個對象的體系：州、競選，以及州-競選結果。
這種方法可行：我們的響應式“選舉之夜”被認為是周日超級碗的CNN高管的希望。但我們真的是九死一生，為了確保設計效果在無數(shù)設備上都展示得當，我們沒日沒夜地工作。我不確定我們是否能采用更復雜的設計來完成這一任務。
今天，我已把這一艱難的考驗轉化成一種可被證明的、結構化的、基于對象的流程。在這篇文章中，我將介紹面向對象的用戶體驗設計，分享我進行對象關系映射的過程，并幫助你開始自己動手實現(xiàn)它。
未完待續(xù)……
