視覺能夠給大腦在很短的時間內(nèi)提供很大的信息量，因此產(chǎn)品在被初次使用的時候，人更加關(guān)注其視覺效果。所以很多人就會古板地認(rèn)為，交互設(shè)計等同于產(chǎn)品的動效和頁面跳轉(zhuǎn)。當(dāng)時交互設(shè)計真正研究的不僅僅是關(guān)于視覺風(fēng)格的問題，交互設(shè)計立足于人、技術(shù)和視覺三個領(lǐng)域，關(guān)注人在不同的環(huán)境中如何更好地解決問題。因此，交互設(shè)計應(yīng)當(dāng)關(guān)注用戶體驗，為用戶服務(wù)，不單一追求形式或功能，而是形式追隨功能。
用戶體驗的要素更多圍繞網(wǎng)站的交互設(shè)計展開，闡述了用戶體驗五個層面的整體開發(fā)流程，即表現(xiàn)層、框架層、結(jié)構(gòu)層、范圍層、戰(zhàn)略層。這個過程是自下而上的，開發(fā)流程從戰(zhàn)略層開始，逐漸構(gòu)建基礎(chǔ)往下一個層面設(shè)計開發(fā)。
五個層級的開發(fā)流程
這五個層級名稱顯得抽象，一方面可能是英文和中文之間的翻譯導(dǎo)致，另一方面可能是它將網(wǎng)站的開發(fā)流程以自下而上的形式來表示。這五個層級并不是網(wǎng)站直觀上的層級，而是網(wǎng)站以用戶為中心的設(shè)計方法的開發(fā)流程。
戰(zhàn)略層：用戶研究，定義用戶和市場，確定網(wǎng)站的目標(biāo)。通過人種學(xué)研究的方法進(jìn)行調(diào)研和分析。將收集到的數(shù)據(jù)用戶創(chuàng)建人物角色模型。
范圍層：創(chuàng)建場景劇本，使用人物角色模型，獲得用戶需求。
結(jié)構(gòu)層：信息架構(gòu)，交互框架。通過卡片分類，用戶測試等方法，獲得網(wǎng)站的信息架構(gòu)和交互框架。
框架層：網(wǎng)頁布局設(shè)計，網(wǎng)站內(nèi)容信息。
表現(xiàn)層：網(wǎng)頁視覺效果，關(guān)注配色、排版、動畫。
敏捷式開發(fā)而不是瀑布式開發(fā)
層級間的工作應(yīng)當(dāng)進(jìn)行交流，在低層級的工作開始之后，高層級參與低層級的討論，從而高層級不僅僅可以迅速制作出本層級的產(chǎn)出文檔的雛形，這些雛形也可以指導(dǎo)和啟發(fā)低層級更好的進(jìn)行工作。就比如范圍層根據(jù)初步的用戶研究數(shù)據(jù)進(jìn)行初步需求的套腦風(fēng)暴，戰(zhàn)略層通過初步得出的需求設(shè)計出更好的調(diào)查問卷，調(diào)研更多之前未發(fā)掘的相關(guān)領(lǐng)域。層級間相互合作和促進(jìn)，能迅速地發(fā)現(xiàn)并解決隱藏的問題，減少失誤和遺漏帶來的損失。
信息架構(gòu)的設(shè)計
網(wǎng)站相比移動應(yīng)用，其信息架構(gòu)是龐大而復(fù)雜的。因為網(wǎng)站是在大尺寸顯示器上展現(xiàn)的，有足夠的空間容納大量的導(dǎo)航和頁面功能區(qū)，同時瀏覽器的多窗口標(biāo)簽使得用戶能自由地在不同的頁面之間跳轉(zhuǎn)。響應(yīng)式網(wǎng)站讓信息架構(gòu)設(shè)計的復(fù)雜度又上升了一個等級，也相應(yīng)地影響表現(xiàn)層的實現(xiàn)效果，即視覺和前端的實現(xiàn)。有些的信息架構(gòu)設(shè)計，應(yīng)當(dāng)讓客戶輕松地知道自己當(dāng)前處于哪個頁面，快速找到并跳轉(zhuǎn)至想要去的地方，方便地使用網(wǎng)站來完成任務(wù)。推薦深入閱讀《Web信息架構(gòu)——設(shè)計大型網(wǎng)站》
