建站
咨詢
售后
建站咨詢
新聞中心
本文轉載自微信公眾號「神光的編程秘籍」，作者神說要有光 。轉載本文請聯(lián)系神光的編程秘籍公眾號。
交互流是前端應用或者說產(chǎn)品中最核心的東西，它不會隨著前端技術的發(fā)展而改變，而且它也是公司內多個團隊共同合作的交集。
可能你不太清楚我這句話是什么意思，接下來我們慢慢理清楚。
什么是交互
網(wǎng)頁向用戶展示信息，然后在一些元素上監(jiān)聽事件，用戶通過一些行為觸發(fā)這些事件，然后網(wǎng)頁展示出更多的信息，這樣的過程就是交互。
多個交互串聯(lián)起來組成交互流，前端應用的功能就是通過不同的交互流來完成的。
比如打開百度首頁會展示搜索框，點擊搜索框，輸入內容會出現(xiàn)搜索的一些提示，按回車后網(wǎng)頁上會出現(xiàn)搜索結果。這就是搜索功能的交互流。
前端技術在變，但是前端應用的交互流并沒變。
交互是前端發(fā)展中不變的東西
在 jquery 時代，我們會通過 ajax 從服務端獲取數(shù)據(jù)，然后通過模版引擎渲染成 dom，從而在網(wǎng)頁上展示相應的信息給用戶，并且對一些元素綁定事件。
用戶通過一些行為觸發(fā)這些事件，然后網(wǎng)頁做 dom 的修改，進而展示更多的信息，也可能是異步的從服務端獲取數(shù)據(jù)，然后再渲染成 dom。
到了 mvvm 時代，數(shù)據(jù)和 dom 是分離的，我們只需要通過 template 或者 jsx 等 DSL 來描述 dom 和數(shù)據(jù)的綁定關系，然后只關心數(shù)據(jù)即可。
從服務端獲取數(shù)據(jù)，前端框架就會自動的渲染出相應的 dom，展示相應的信息給用戶，并綁定一些事件。然后用戶通過行為觸發(fā)這些事件，網(wǎng)頁會做數(shù)據(jù)的改變進而改變視圖，或者通過某個異步過程從服務端獲取數(shù)據(jù)，然后再自動更新視圖。
可以看到，mvvm 做的事情只是分離了數(shù)據(jù)和 dom，提高了開發(fā)效率和代碼的可維護性，但是前端應用的交互流并沒有變。
前端技術在發(fā)展，變的是開發(fā)模式，不變的是交互流程。
既然交互是前端應用的核心，那么什么才是好的交互呢?
好的交互是多個團隊合作的結果
我當初選擇做前端的一個原因就是覺得前端可以做很多很炫的特效，相信很多小伙伴也是這么想的。但是工作以后發(fā)現(xiàn)并不是這樣，我們做的頁面可能會很簡潔。
我在百度搜索待過一段時間，當時在維護百度 PC 首頁和搜索頁，那里有很厲害的設計師，但是整天和他們對的是這個數(shù)字要 13 像素，這個文字要 12 像素這種細節(jié)，并沒有多高大上。
為什么呢?因為產(chǎn)品的交互設計的主要目的是為了促進產(chǎn)品核心邏輯的達成。
就像信息流產(chǎn)品，核心的目的就是讓用戶不斷的看更多的信息，花更多的時間在上面。那交互上就要做成自動滾動的無限的加載，并且字體、排版等要讓用戶看著比較舒服，推薦的內容要是用戶喜歡的。
就像電商產(chǎn)品，核心的目的就是讓用戶下單，那就要通過圖片、文字、視頻、直播等多種形式全方位展示商品，并且把購買按鈕做的足夠大和醒目，引導用戶去下單。并且后續(xù)推薦的商品也要是用戶可能會感興趣的。
可以看到，整個交互流的設計是要貼合產(chǎn)品的核心功能的，它也是多個團隊合作的結果：產(chǎn)品團隊負責整體布局和交互流程的設計，UI 團隊負責樣式，算法團隊負責內容的個性化推薦，開發(fā)團隊負責把它們實現(xiàn)，運營團隊負責內容的維護和更新，增長團隊負責分析每一環(huán)的流量轉化率，進而不斷優(yōu)化交互流。
整個公司的各個團隊都是圍繞產(chǎn)品的核心邏輯來工作的，也就是圍繞一條條交互流，并不單是前端要關注的。
交互就是對話
當你和一個銷售談話，你會問他有什么產(chǎn)品，然后他會告訴你有什么，你對某個產(chǎn)品感興趣，他又會給你詳細介紹，你產(chǎn)生了購買的意愿，就會下單。
銷售的客戶談話的主要目的就是為了促成下單，這就像電商網(wǎng)站的交互設計的目的是為了讓用戶下單一樣。
其實不只是網(wǎng)站，寫文章也是交互的設計過程，你表達了一些內容，讀者會產(chǎn)生一些思考，然后你順著他的思考又表達了一些內容，慢慢引導讀者理解你想表達的觀點。這也是一種交互流。
所以說，產(chǎn)品的交互設計就像和用戶的對話，是為了一步步引導用戶去達成產(chǎn)品的核心目的。而前端是則是實現(xiàn)這個交互流的重要一環(huán)。
我們前端開發(fā)的頁面是為了產(chǎn)品服務的，那核心也就是實現(xiàn)這個交互流。完成整個交互流之后，產(chǎn)品才是可用的，在這個基礎上再去做體驗優(yōu)化，提升整個交互流的流暢度甚至做一些交互上的小驚喜。這是前端應用的核心也是產(chǎn)品的核心。
總結
網(wǎng)頁向用戶展示一些信息，并監(jiān)聽事件，用戶通過行為觸發(fā)這些時間，然后網(wǎng)頁展示更多的信息，這是一次交互。
多個交互構成的交互流就是產(chǎn)品的核心邏輯，前端應用主要是要實現(xiàn)這個交互流，不管是 jquery 時代還是 mvvm 時代，雖然開發(fā)模式在改變，但前端應用的核心并沒有變。
交互流也是多個團隊共同合作的結果，產(chǎn)品團隊、設計團隊、算法團隊、開發(fā)團隊、運營團隊等，都是圍繞著這些交互流來達成產(chǎn)品的目的，來優(yōu)化體驗。
理解了交互流，就能更好的理清前端應用的功能，理清產(chǎn)品邏輯，也能更好的理清公司的商業(yè)邏輯和團隊的劃分。
當前名稱：前端應用和產(chǎn)品邏輯的核心：交互流
文章源于：http://www.5511xx.com/article/djhepso.html
