一、緩存簡(jiǎn)介
緩存無(wú)處不在，瀏覽器端的緩存、服務(wù)器端的緩存、代理服務(wù)器的緩存、對(duì)象緩存、數(shù)據(jù)庫(kù)也有緩存……HTTP中具有緩存功能的是瀏覽器緩存和代理服務(wù)器緩存。下面說(shuō)一下緩存的優(yōu)點(diǎn)：
1.減少冗余的數(shù)據(jù)傳輸，節(jié)省了傳輸時(shí)間
2.減少服務(wù)器的負(fù)擔(dān)，大大提高了網(wǎng)站的性能
3.加快了客戶端加載網(wǎng)頁(yè)的速度
二、使用Fiddler如何查看緩存的Header
與緩存相關(guān)的內(nèi)容放在Header中的Cache項(xiàng)里；Requests和Responses均是這樣。如圖：
三、緩存的新鮮度（通過(guò)什么方式判斷其是否，如何刷新緩存）
Web服務(wù)器通過(guò)兩種方式判斷瀏覽器緩存是否：
（1）瀏覽器把緩存文件的最后修改時(shí)間通過(guò)Header“If-Modified-Since”項(xiàng)傳遞給Web服務(wù)器。
（2）瀏覽器把緩存文件的ETag通過(guò)Header“If-None-Match”項(xiàng)傳遞給Web服務(wù)器。
簡(jiǎn)單描述一下，瀏覽器端想請(qǐng)求一個(gè)文檔，它首先檢查本地緩存，發(fā)現(xiàn)存在這個(gè)文檔的緩存，獲取緩存文檔的最后修改時(shí)間，發(fā)送請(qǐng)求，將值放在Header中的“If-Modified-Since”項(xiàng)傳遞給Web服務(wù)器。Web服務(wù)器接收到請(qǐng)求后，將服務(wù)器的文檔修改時(shí)間（Last-Modified）與HTTP請(qǐng)求中的header中的“If-Modified-Since”值相比較，有兩種情況，如下面圖示：
1.緩存有效：
2.緩存無(wú)效：
截圖舉例：
上面說(shuō)的是If-Modified-Since值對(duì)比的方式；下面說(shuō)一下ETa'g；
四、ETag
ETag（Entity Tag）:實(shí)體標(biāo)簽；是根據(jù)實(shí)體內(nèi)容生成的一段hash字符串（類似MD5之后的結(jié)果），可以用來(lái)標(biāo)識(shí)資源的狀態(tài)（當(dāng)資源發(fā)送變化時(shí)，ETag也會(huì)跟著改變）；ETag是Web服務(wù)端產(chǎn)生的，然后通過(guò)response響應(yīng)給瀏覽器。使用ETag，主要解決Last-Modified無(wú)法解決的情況：
（1.某些服務(wù)器不能得到文件的If-Modified-Since來(lái)判斷文件是否更新；
（2.某些文件修改非常頻繁，以小于秒的單元進(jìn)行修改，而Last-Modified最單元為秒；
（3.有些文件最后修改時(shí)間變化了，但是內(nèi)容并沒(méi)有變化，所以我們不希望瀏覽器以為文件已變化了；
五、與緩存相關(guān)的header
字段名稱 釋義
Cache-Control:max-age=0 以秒為單位
If-Modified-Since:Fri, 11 Jan 2019 01:55:04 GMT 緩存文件的最后修改時(shí)間
If-None-Match:W/"5c37f778-732" 緩存文件的Etag的值
Cache-Control:no-cache 不使用緩存
Pragma:no-cache 不使用緩存
Cache-Control:public 響應(yīng)被緩存，可以共享與多用戶
Cache-Control:private 響應(yīng)只能私有緩存，不可共享
Cache-Control:no-store 絕對(duì)禁止緩存（機(jī)密、敏感文件）
Cache-Control:max-age=60 60秒后緩存過(guò)期（相對(duì)時(shí)間）
Date:Fri, 11 Jan 2019 01:55:04 GMT 當(dāng)前發(fā)送時(shí)間
Expires:Fri, 11 Jan 2019 01:55:04 GMT 緩存過(guò)期時(shí)間設(shè)置（絕對(duì)時(shí)間）
Last-Modified:Fri, 11 Jan 2019 01:55:04 GMT 服務(wù)器端文件的最后修改時(shí)間
Etag:W/"5c37f778-732" 服務(wù)器端文件的Etag值
六、關(guān)于緩存的常識(shí)
1.如何讓瀏覽器不使用緩存？
答：【Ctrl+F5】快捷鍵強(qiáng)制刷新瀏覽器，讓瀏覽器不使用緩存；此時(shí)Fiddler抓包所看到的請(qǐng)求Header中都會(huì)帶有Cache-Control:no-cache;
2.如何讓瀏覽器直接使用緩存，不請(qǐng)求服務(wù)器進(jìn)行緩存驗(yàn)證？
答：第一次訪問(wèn)與第二次訪問(wèn)同一個(gè)網(wǎng)頁(yè)；（注意：第二次訪問(wèn)時(shí)，輸入網(wǎng)址，直接回車）瀏覽器會(huì)直接使用有效的緩存，而不會(huì)發(fā)生HTTP請(qǐng)求去服務(wù)器驗(yàn)證緩存，這種情況稱之為緩存命中；
使用Fiddler抓包，現(xiàn)象：第一次訪問(wèn),有70多個(gè)Session；第二次訪問(wèn)，僅40多個(gè)請(qǐng)求；
3.瀏覽器均可在設(shè)置中設(shè)置不使用緩存；
4.公有緩存、私有緩存的區(qū)別：一個(gè)可以多個(gè)不同的客戶端使用，一個(gè)只可唯一的客戶端使用；
藍(lán)藍(lán)設(shè)計(jì)( sillybuy.com )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)。
Sandy現(xiàn)任阿里影業(yè)—淘票票體驗(yàn)設(shè)計(jì)專家，2015年加入阿里巴巴，深耕B端行業(yè)產(chǎn)品，服務(wù)于電影產(chǎn)業(yè)鏈中的投資、宣發(fā)等角色。2017年起接觸C端用戶產(chǎn)品，推行價(jià)值導(dǎo)向和問(wèn)題導(dǎo)向。2019年開(kāi)始實(shí)踐線上線下全鏈路設(shè)計(jì)。
阿里影業(yè)的服務(wù)涉及的面很廣，涉及到b端與c端全流程的體驗(yàn)服務(wù)，包括面對(duì)片方的制作和宣發(fā)、發(fā)行、乃至面向用戶的售賣與放映，在每個(gè)節(jié)點(diǎn)都有涉及。而淘票票，經(jīng)歷了四年的產(chǎn)品迭代，以一年一個(gè)版本的速度的進(jìn)行優(yōu)化。15年的理念是做一個(gè)好用的購(gòu)票工具，16年新增了營(yíng)銷，17年加強(qiáng)營(yíng)銷，18年新賽道探索。到了2019年，改版應(yīng)該進(jìn)行新的思考：怎樣做？做什么？怎么做？做對(duì)了嗎？
此次淘票票9.0版本是根據(jù)用戶現(xiàn)有的習(xí)慣與市場(chǎng)的變化，由設(shè)計(jì)師發(fā)起的一次自下而上推進(jìn)的改版。以下是淘票票9.0的設(shè)計(jì)策略與設(shè)計(jì)目標(biāo)：
接下來(lái)將對(duì)三點(diǎn)設(shè)計(jì)策略進(jìn)行逐一的講解。
根據(jù)內(nèi)容類型和場(chǎng)景進(jìn)行劃分，結(jié)合內(nèi)容特點(diǎn)和用戶喜好，打造全場(chǎng)景運(yùn)營(yíng)，例如提供影訊、通稿、片單、榜單、熱點(diǎn)、解讀、文章和活動(dòng)等等多元化內(nèi)容。通過(guò)提供不同的內(nèi)容展現(xiàn)給用戶，將內(nèi)容進(jìn)行解構(gòu)、把觸達(dá)的場(chǎng)景進(jìn)行細(xì)化、優(yōu)化設(shè)計(jì)的表達(dá)，從而達(dá)到幫助用戶可以更好的理解電影的目的。
設(shè)計(jì)前，首先應(yīng)當(dāng)熟知兩種設(shè)計(jì)思維導(dǎo)向：
而這次9.0淘票票改版采用的是以問(wèn)題為導(dǎo)向，期間經(jīng)歷了五個(gè)流程：
2.1 找問(wèn)題
首先出去找問(wèn)題，找問(wèn)題的方法有很多，如：用戶研究、定性、定量、業(yè)務(wù)數(shù)據(jù)和體驗(yàn)走查，收集業(yè)務(wù)、用戶、客滿不同視角的疑似問(wèn)題。
2.2 看現(xiàn)象
找完問(wèn)題之后，基于數(shù)據(jù)的支撐，去看用戶有哪些習(xí)慣的變化，看到目前的現(xiàn)象后再進(jìn)行數(shù)據(jù)解讀。
2.3 定位問(wèn)題
基于使用場(chǎng)景和使用效率，進(jìn)一步定位問(wèn)題所在。
2.4 分析原因
分析出癥結(jié)，以便推進(jìn)最終的解題環(huán)節(jié)。
2.5 解題
解題1：場(chǎng)景化探索。
以解決問(wèn)題為目標(biāo)，達(dá)到優(yōu)化用戶體驗(yàn)的目的，對(duì)場(chǎng)景進(jìn)行預(yù)判、探索，把場(chǎng)景分為三個(gè)典型的場(chǎng)景：
解決：針對(duì)第一種場(chǎng)景，選坐頁(yè)可以快速找到選場(chǎng)次的功能，淘票票提供常去影院、附近影院的選擇，減少用戶決策時(shí)間。針對(duì)第二種場(chǎng)景，部分觀影者不知道價(jià)格更高的IMAX廳、杜比廳的觀影效果，價(jià)格比普通廳貴了50塊錢，那么這個(gè)錢值在哪？淘票票使用視覺(jué)映射和科普的手段，例如當(dāng)點(diǎn)擊進(jìn)入杜比廳后，下拉可以呼出信息，了解相關(guān)的影廳，給予科普；而且界面設(shè)計(jì)不同，更貴的影廳視覺(jué)效果好，界面上也提供用戶更強(qiáng)的視覺(jué)沖擊。
解題2：用戶視角信息重構(gòu)，進(jìn)行信息降噪，減少認(rèn)知負(fù)擔(dān)
認(rèn)知負(fù)擔(dān)=信息呈現(xiàn)類型x信息量
以上公式可以看出，假設(shè)設(shè)認(rèn)知負(fù)擔(dān)為定值，當(dāng)信息量增多的時(shí)候，需要減少信息呈現(xiàn)類型，適當(dāng)進(jìn)行信息降噪與信息結(jié)構(gòu)化。降噪是把想要突出的信息更加突出；信息結(jié)構(gòu)化是把同類型的信息以結(jié)構(gòu)化的呈現(xiàn)出來(lái)，讓用戶自然對(duì)信息產(chǎn)生親密性。
對(duì)于信息傳達(dá)，改變之前比較打擾的提示彈窗，現(xiàn)在淘票票會(huì)把所有信息都放在頁(yè)面中，用一種更輕量的方式提示用戶，不再打擾用戶。信息重構(gòu)則是把需要用戶確認(rèn)的信息放在最頭部，例如退票、改票，其次界面羅列的是優(yōu)惠信息，最后才是影城卡營(yíng)銷和賣小食的信息區(qū)域。新舊改版對(duì)比圖很好呈現(xiàn)出淘票票有效減少認(rèn)知負(fù)擔(dān)所做的優(yōu)化。
基于調(diào)研，淘票票的用戶群體趨近年輕化。改版中所制作情緒版、圖標(biāo)、元素、字號(hào)、空間結(jié)構(gòu)等視覺(jué)語(yǔ)言，注重和品牌元素的結(jié)合，產(chǎn)生出新的視覺(jué)語(yǔ)言與品牌形象，從而更加貼近年輕人的心理與喜好。
根據(jù)heart模型進(jìn)行設(shè)置，選出適合9.0版本的衡量維度：S，T，A。以體驗(yàn)?zāi)繕?biāo)出發(fā)，符合業(yè)務(wù)目標(biāo)進(jìn)行探索。不一樣的體驗(yàn)?zāi)繕?biāo)使用不一樣的度量方法。對(duì)于內(nèi)容而言，需要衡量的是用戶的接受度，用戶需要看到它，接受它，并且需要知道用戶是否覺(jué)得有用。而對(duì)于核心購(gòu)票流程，該流程則是比較偏向工具，度量方式則是任務(wù)完成度、完成任務(wù)時(shí)所花費(fèi)的時(shí)長(zhǎng)、信息有沒(méi)有被有效的傳達(dá)給用戶等來(lái)衡量的。最后對(duì)于視覺(jué)方向，用戶的想法會(huì)比較主觀，通過(guò)滿意度和推薦度來(lái)衡量。
提問(wèn)者1：觀影者通常會(huì)在朋友圈、豆瓣和推薦來(lái)決定要看的影片，基本不會(huì)在淘票票上尋找值得看的影片，為什么淘票票會(huì)做這方面的探索？為什么要做內(nèi)容決策這件事？
回答：從想看電影到下單的過(guò)程哪個(gè)地方淘票票是沒(méi)有做好的、做到的，根據(jù)定性調(diào)研，發(fā)現(xiàn)一半以上用戶都不會(huì)在淘票票上進(jìn)行決策。但是淘票票還是希望嘗試一下，希望用戶可以在淘票票上完成完整的購(gòu)票觀影體驗(yàn)。從數(shù)據(jù)顯示，用戶心智還是不好但是有一些提升。而且豆瓣經(jīng)歷了10年從pc到app，保留了用戶的歷史等數(shù)據(jù)，沒(méi)有辦法讓用戶直接轉(zhuǎn)到淘票票進(jìn)行觀影決策，這也不是淘票票希望看到的。淘票票也希望可以和競(jìng)品和合作方去提升觀影決策，達(dá)到共贏的目的。
提問(wèn)者2：淘票票改版之后，有一個(gè)衡量它的改版效果S、T、A的度，有沒(méi)有考慮要做NPS？
回答：淘票票一直有在做，從這次改版之后來(lái)，淘票票所有用戶群指標(biāo)提升了應(yīng)該有五個(gè)百分點(diǎn)，然后年輕用戶的百分點(diǎn)在八個(gè)以上。NPS是一個(gè)非常關(guān)鍵的衡量用戶滿意度的指標(biāo)。
追問(wèn)：NPS是不是適合淘票票這個(gè)產(chǎn)品？還是適合于所以互聯(lián)網(wǎng)產(chǎn)品？
回答：NPS在集團(tuán)內(nèi)它的重視度是很高，基本上阿里系所有的產(chǎn)品都會(huì)有指標(biāo)。
提問(wèn)者3：我之前是淘票票的用戶，曾經(jīng)用過(guò)淘票票做觀影決策，看下面的電影評(píng)價(jià)，結(jié)果發(fā)現(xiàn)電影評(píng)價(jià)是虛高的，就是說(shuō)其實(shí)電影沒(méi)有那么好，但是評(píng)論會(huì)傾向性的選擇一個(gè)好的評(píng)論放在下面，經(jīng)過(guò)這次經(jīng)驗(yàn)之后，就再也不用淘票票作為觀影決策了。想了解現(xiàn)在淘票票的評(píng)論機(jī)制，它是怎么個(gè)呈現(xiàn)的方式？是不是會(huì)優(yōu)先選擇就是比較好的評(píng)論放在首評(píng)？或者是有一些什么樣的計(jì)算方式？另一方面對(duì)于現(xiàn)在的評(píng)論失真的這種情況，有沒(méi)有想到一些改進(jìn)的措施？是最近有沒(méi)有做過(guò)一些改版之類的，就是關(guān)于這種內(nèi)容方面的？除了剛才講的那些界面，視覺(jué)方面的，想了解內(nèi)容方面有沒(méi)有一些提升？
回答：第一點(diǎn)，用戶群的不同。對(duì)于影評(píng)這個(gè)來(lái)決策，淘票票可能跟豆瓣用戶群有非常大的差異，豆瓣是影迷聚集地，愛(ài)電影這幫人的一個(gè)粉絲聚集地，圈子比較小，想要進(jìn)入這個(gè)圈子有一定的成本。但是像淘票票它服務(wù)的是大眾場(chǎng)景，服務(wù)的有外賣小哥，也有大城市去打工的用戶，也有三四線在國(guó)企里那種的員工，淘票票服務(wù)的用戶是大眾的，所以對(duì)于評(píng)分虛高這件事，不是說(shuō)它好或者不好，也就是不能單純的絕對(duì)說(shuō)好還是不好，可能大眾的心智就是這樣的。用戶不像一個(gè)資深影迷，看到速度與激情會(huì)認(rèn)為是大爛片，可能反而覺(jué)得好，非常值得去看。第二點(diǎn)，關(guān)于這種影評(píng)的一個(gè)分發(fā)策略涉及到產(chǎn)品策略，不是很方便講。但是淘票票在這方面一直有優(yōu)化的，并且現(xiàn)在也是在持續(xù)優(yōu)化，希望影評(píng)可以真正為用戶去提供這個(gè)觀影決策。第三點(diǎn)，淘票票的用戶其實(shí)不只是c端用戶，它還有還有影院還有片方，但是水軍應(yīng)該不會(huì)有，至少淘票票平臺(tái)是非常不鼓勵(lì)這種情況，而且會(huì)有一定的反作弊、返水的機(jī)制。
提問(wèn)者4：因?yàn)槭且栽O(shè)計(jì)推動(dòng)的一次改版，想了解一下推動(dòng)的過(guò)程？第一就是因?yàn)槠綍r(shí)改版都是產(chǎn)品的來(lái)做的，那這一次由設(shè)計(jì)來(lái)去推動(dòng)的話，那設(shè)計(jì)跟產(chǎn)品之間的這個(gè)協(xié)作關(guān)系是什么樣的？然后改版歷時(shí)半年，是淘票票的設(shè)計(jì)歷程中是常態(tài)嗎？如果不是的話，平常的這個(gè)改版的節(jié)奏是什么樣的？
回答：第一點(diǎn)，設(shè)計(jì)要不斷的去跟產(chǎn)品、運(yùn)營(yíng)溝通，去跟不同角色溝通，溝通可能是最重要的一點(diǎn)。當(dāng)所有人都達(dá)成共識(shí)了，確實(shí)有這樣的問(wèn)題需要改，那全部門所有人就會(huì)去團(tuán)結(jié)，去把這個(gè)事情搞出來(lái)。搞出來(lái)之后再去向上一層一層的去向上匯報(bào)。匯報(bào)的可能要經(jīng)過(guò)很多輪，不斷有反饋的意見(jiàn)下來(lái)，因?yàn)楸旧硪暯禽斎氲囊膊粔蛉邮艿降穆曇粢矝](méi)有上游接觸的多，所以團(tuán)隊(duì)會(huì)去接受意見(jiàn)，然后重新的進(jìn)行。一輪review下來(lái)大概三四個(gè)月的時(shí)間，然后再去跟開(kāi)發(fā)團(tuán)隊(duì)溝通為什么要去升級(jí)設(shè)計(jì)語(yǔ)言，怎么樣去幫開(kāi)發(fā)提效？怎么在下一次10.0改版的時(shí)候更容易。第二點(diǎn)，團(tuán)隊(duì)第一次歷時(shí)半年進(jìn)行改版，之前沒(méi)有停下腳步來(lái)去深耕用戶體驗(yàn)，所以有一些坑或者一些彎路。平常的改版中基本上是兩周發(fā)一個(gè)版本，非常小步快跑的。對(duì)于設(shè)計(jì)如何跟產(chǎn)品團(tuán)隊(duì)去協(xié)作？剛剛也有講過(guò)，達(dá)成共識(shí)之后，然后把這個(gè)事兒做起來(lái)，提需求、進(jìn)版本，從需求池里評(píng)估需求優(yōu)先級(jí)進(jìn)版本。交互設(shè)計(jì)跟產(chǎn)品經(jīng)理這個(gè)角色沒(méi)有絕對(duì)的一個(gè)邊界，可能都是去不斷的去觸碰，只要去配合合作的好，把這個(gè)產(chǎn)品去做出來(lái)，不用管處在一個(gè)什么樣的一個(gè)崗位。
提問(wèn)者5：最開(kāi)始的時(shí)候有問(wèn)到淘票票和貓眼之間的一些對(duì)比，想了解在改版完之后和平時(shí)的工作中，是怎么會(huì)去了解和競(jìng)品？怎么去比較？有沒(méi)有一些關(guān)注的量化的一些指標(biāo)？
回答：不管服務(wù)于什么樣的產(chǎn)品，都會(huì)做競(jìng)品調(diào)研。會(huì)關(guān)注市場(chǎng)的變化、競(jìng)品的變化。對(duì)于設(shè)計(jì)團(tuán)隊(duì)來(lái)說(shuō)，其實(shí)主要的是關(guān)注的是用戶行為、功能和視覺(jué)界面。包括上了哪些個(gè)新的功能？在不同的渠道是怎么樣去運(yùn)作的？運(yùn)營(yíng)思維是什么樣子的？淘票票團(tuán)隊(duì)有在研究競(jìng)品，有在做競(jìng)品的一個(gè)分析，衡量的指標(biāo)也主要是滿意度、推薦度，因?yàn)闆](méi)有辦法去看競(jìng)品的數(shù)據(jù)，只能通過(guò)用戶反饋去看競(jìng)品跟淘票票的差距。
文章來(lái)源:uxren
測(cè)試代碼
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<button id="btn">按鈕</button>
<script>
let btn = document.getElementById("btn");
btn.onclick = () => { // 鉤子函數(shù)
console.log('我是鉤子函數(shù)');
}
btn.addEventListener("click",() =>{ // 回調(diào)函數(shù)
console.log('我是回調(diào)函數(shù)');
});
// 這是給btn綁定了一個(gè)監(jiān)聽(tīng)器，后面那個(gè)函數(shù)是它的回調(diào)函數(shù)，
// 因?yàn)橄⒉东@的過(guò)程我們并不能參與，而在捕獲執(zhí)行完畢的時(shí)候，
// 回調(diào)函數(shù)才會(huì)執(zhí)行，我們可以把對(duì)消息的處理寫(xiě)在回調(diào)函數(shù)里。
</script>
</body>
</html>
點(diǎn)擊按鈕后代碼輸出如下：
回調(diào)函數(shù)和鉤子函數(shù)的區(qū)別根本上是
鉤子函數(shù)在捕獲消息的第一時(shí)間就執(zhí)行，而回調(diào)函數(shù)是捕獲結(jié)束時(shí)，最后一個(gè)被執(zhí)行的。
什么是鉤子函數(shù)
一般認(rèn)為，鉤子函數(shù)就是回調(diào)函數(shù)的一種，其實(shí)還是有差異的，差異地方就是：觸發(fā)的時(shí)機(jī)不同。
鉤子（Hook）概念源于Windows的消息處理機(jī)制，通過(guò)設(shè)置鉤子，應(yīng)用程序?qū)λ邢⑹录M(jìn)行攔截，然后執(zhí)行鉤子函數(shù)。
什么是回調(diào)函數(shù)
回調(diào)函數(shù)其實(shí)是調(diào)用者將回調(diào)函數(shù)的指針傳遞給了調(diào)用函數(shù)，當(dāng)調(diào)用函數(shù)執(zhí)行完畢后，通過(guò)函數(shù)指針來(lái)調(diào)用回調(diào)函數(shù)。
鉤子函數(shù)和回調(diào)函數(shù)都是事件處理函數(shù)
藍(lán)藍(lán)設(shè)計(jì)( sillybuy.com )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)。
有些產(chǎn)品經(jīng)理會(huì)陷入這種誤區(qū)——需求評(píng)審做完了，自己就可以放羊不管了。而本文則認(rèn)為需求評(píng)審?fù)辏a(chǎn)品經(jīng)理還要做這六件事。
1. 確認(rèn)需求評(píng)審的遺留問(wèn)題并同步各方
2. 制定詳細(xì)&責(zé)任到人的項(xiàng)目計(jì)劃
3. 完成文案設(shè)計(jì)
4. 按照項(xiàng)目計(jì)劃，協(xié)同各方，往前推進(jìn)，關(guān)鍵環(huán)節(jié)必須與各方確認(rèn)。關(guān)鍵環(huán)節(jié)包括：
5. 準(zhǔn)備項(xiàng)目review
6. 開(kāi)始下個(gè)需求的方案設(shè)計(jì)和需求文檔準(zhǔn)備
產(chǎn)品經(jīng)理A：需求終于評(píng)審?fù)炅?。有種放飛的感覺(jué)，可以休假，去浪了！
產(chǎn)品經(jīng)理B：你說(shuō)真的嗎？為什么我評(píng)審?fù)?，還一直在被開(kāi)發(fā)、測(cè)試、法務(wù)、財(cái)務(wù)窮追不舍？
產(chǎn)品經(jīng)理C：你說(shuō)真的嗎？為什么我評(píng)審?fù)?，從?lái)都是我在窮追不舍開(kāi)發(fā)、測(cè)試、法務(wù)、財(cái)務(wù)？
產(chǎn)品經(jīng)理D：你們開(kāi)玩笑的吧？就我這么慘！我不但要緊追不舍開(kāi)發(fā)、法務(wù)、測(cè)試、法務(wù)、財(cái)務(wù)，還要被老板、被客戶窮追不舍。
產(chǎn)品經(jīng)理A、B、C：哥們，來(lái)講講，最喜歡聽(tīng)?wèi)K兮兮的故事了。你的傷痛最能撫平我的內(nèi)心。
產(chǎn)品經(jīng)理D：好吧。需求評(píng)審只講清楚了產(chǎn)品的骨架、細(xì)節(jié)，讓各方開(kāi)始投資源。評(píng)審?fù)?，產(chǎn)品經(jīng)理還有一堆事要推進(jìn)，沒(méi)法放羊。
要跟的事情主要有下面6件：
需求評(píng)審總有一些遺留問(wèn)題要進(jìn)一步確認(rèn)，而后同步給各方。我不是圣人，有時(shí)候有些問(wèn)題或者細(xì)節(jié)沒(méi)想到，評(píng)審的時(shí)候，大家提出來(lái)了，得趕快明確。
有時(shí)候需求評(píng)審中還有很大的bug沒(méi)想到，必須快速解決，要在開(kāi)發(fā)沒(méi)動(dòng)工前，都捋順。要不然變成需求變更，或者上線后被推倒重來(lái)，欲哭無(wú)淚。
我這種求生欲這么強(qiáng)，也沒(méi)人罩著的，必須狠命把需求做到95分以上。100分也不太敢說(shuō)，畢竟眾口難調(diào)。
產(chǎn)品經(jīng)理還得身兼項(xiàng)目管理，項(xiàng)目管理從來(lái)都是事有輕重、事無(wú)巨細(xì)，難以假手他人。雖然我會(huì)盡可能調(diào)動(dòng)大家的積極性，讓大家自驅(qū)管理項(xiàng)目，但還得牽扯不少精力。
項(xiàng)目管理的關(guān)鍵點(diǎn)：明確項(xiàng)目計(jì)劃、關(guān)鍵節(jié)點(diǎn)、每個(gè)關(guān)鍵節(jié)點(diǎn)的負(fù)責(zé)人、驗(yàn)收方案。
比如什么時(shí)候交互評(píng)審、視覺(jué)評(píng)審、聯(lián)調(diào)、showcase、發(fā)布？分別是誰(shuí)主要牽頭負(fù)責(zé)，哪些人需要參與。
為了防止項(xiàng)目延期，每個(gè)節(jié)點(diǎn)都還得提前趕。真是操碎了心。
文案從來(lái)不是隨便寫(xiě)寫(xiě)。文案是和客戶交流的重要途徑，整幾個(gè)客戶看不懂的文案上去，后面客戶咨詢搞死人！
文案設(shè)計(jì)除了客戶視角之外，也不是自己想怎么寫(xiě)就怎么寫(xiě)，還要和法務(wù)、客服團(tuán)隊(duì)溝通。因?yàn)槲陌副豢蛻敉对V的案例，又不是沒(méi)有。
還有啊，我的產(chǎn)品有3種語(yǔ)言，簡(jiǎn)體中文、繁體中文、英文，雖然每種語(yǔ)言有專門的文案設(shè)計(jì)師，但得跟他們說(shuō)清楚，也要花不少時(shí)間、精力。
當(dāng)然，也有很多產(chǎn)品經(jīng)理，不管文案這種小事?？晌矣X(jué)得文案體現(xiàn)了產(chǎn)品經(jīng)理最基本的素養(yǎng)，是產(chǎn)品的底子。
關(guān)鍵環(huán)節(jié)有6個(gè)：
1）交互評(píng)審
一般來(lái)說(shuō)會(huì)由交互設(shè)計(jì)師發(fā)起，開(kāi)發(fā)、測(cè)試、法務(wù)、財(cái)務(wù)都要參與。
這樣能保證大家在說(shuō)同一件事情，避免我要的是頭牛，結(jié)果開(kāi)發(fā)給了頭驢。
如果設(shè)計(jì)師項(xiàng)目參與度低，交互評(píng)審還得我自己上。哪里缺人，我就得到哪補(bǔ)坑。
2）視覺(jué)評(píng)審
一般來(lái)說(shuō)，交互和視覺(jué)評(píng)審會(huì)一起。
有時(shí)候項(xiàng)目很復(fù)雜，或者交互、視覺(jué)分工明確，那就得分開(kāi)了。
通常由視覺(jué)設(shè)計(jì)師發(fā)起。同樣，如果視覺(jué)設(shè)計(jì)師參與度低的話，我還是得補(bǔ)坑。
3）推進(jìn)聯(lián)調(diào)進(jìn)度
聯(lián)調(diào)是很容易扯皮的環(huán)節(jié)，大家來(lái)自不同域、不同職能團(tuán)隊(duì)，各有各的小九九，所以得盯著，避免聯(lián)調(diào)成為坑王。
4）推進(jìn)測(cè)試進(jìn)度
進(jìn)入到測(cè)試就意味著開(kāi)發(fā)的七七八八了，當(dāng)然有時(shí)候?yàn)榱藟嚎s項(xiàng)目周期，開(kāi)發(fā)、測(cè)試會(huì)階段性并行。
除了測(cè)試進(jìn)度，還得關(guān)注測(cè)試發(fā)現(xiàn)的問(wèn)題，可能開(kāi)發(fā)還得返工，也可能會(huì)發(fā)現(xiàn)需求評(píng)審中大家都沒(méi)有注意到的問(wèn)題，得及時(shí)補(bǔ)救。
5）showcase
Showcase，說(shuō)白了就是項(xiàng)目驗(yàn)收。
驗(yàn)收前，得先列出來(lái)要驗(yàn)收哪些內(nèi)容，主流程、分支流程、逆向流程、重大關(guān)鍵節(jié)點(diǎn)。Showcase，也有可能發(fā)現(xiàn)新的問(wèn)題，但基本上要避免在showcase環(huán)節(jié)發(fā)現(xiàn)重大問(wèn)題，不然就得重大需求變更了。
showcase有時(shí)候由測(cè)試主導(dǎo)，有時(shí)候沒(méi)資源，我得自己上。
6）項(xiàng)目發(fā)布
如果一路順利，就該發(fā)布項(xiàng)目了。
項(xiàng)目發(fā)布計(jì)劃雖然也是之前就定好的，但要考慮的方方面面也還挺多的，可以看之前的文章《項(xiàng)目發(fā)布要考慮的因素》。
總而言之，要和各方溝通好，要保證項(xiàng)目順利發(fā)布呦。
項(xiàng)目終于上線了，可我得天天得看客戶反饋，看數(shù)據(jù)，跟客戶聊，跟業(yè)務(wù)聊，準(zhǔn)備復(fù)盤(pán)review。
產(chǎn)品狗似乎永遠(yuǎn)都在準(zhǔn)備復(fù)盤(pán)、復(fù)盤(pán)中、復(fù)盤(pán)后反思的路上。
項(xiàng)目通常是并行的。在需求評(píng)審?fù)旰?，我已?jīng)開(kāi)始下一個(gè)需求的研究、設(shè)計(jì)了。
開(kāi)發(fā)資源從上一個(gè)需求釋放出來(lái)的時(shí)候，產(chǎn)品經(jīng)理肯定得把下一個(gè)需求方案設(shè)計(jì)好，開(kāi)始新的需求評(píng)審，妥妥的做好資源銜接。資源一旦釋放出來(lái)，下次想要資源，難上加難啊。
產(chǎn)品也需要持續(xù)迭代，讓客戶感受到，我們的產(chǎn)品在成長(zhǎng)、進(jìn)步，給人希望。
文章來(lái)源：人人都是產(chǎn)品經(jīng)理
前言
《以人為中心的設(shè)計(jì)指南》是我翻譯的第二本完整的設(shè)計(jì)書(shū)籍。在我開(kāi)始廣泛的閱覽國(guó)外優(yōu)秀的設(shè)計(jì)團(tuán)隊(duì)、設(shè)計(jì)公司的沉淀輸出后，收獲頗豐。我意識(shí)到很多年輕的設(shè)計(jì)師尤其是傳統(tǒng)意義上的UI，苦于進(jìn)階無(wú)門，很難系統(tǒng)的去學(xué)習(xí)設(shè)計(jì)理論、設(shè)計(jì)方法以及設(shè)計(jì)流程，無(wú)法系統(tǒng)化梳理設(shè)計(jì)知識(shí)，就只能在有限的設(shè)計(jì)范圍內(nèi)修修補(bǔ)補(bǔ)，就像你在局限于視覺(jué)時(shí)沒(méi)有意識(shí)到體驗(yàn)，在忠實(shí)于體驗(yàn)時(shí)又忽略了商業(yè)，總是無(wú)法全面的考慮和輸出設(shè)計(jì)方案，這是源于沒(méi)有系統(tǒng)化的學(xué)習(xí)。
國(guó)外的人機(jī)交互、體驗(yàn)設(shè)計(jì)領(lǐng)域的確發(fā)展較早，有著大量的理論和方法的沉淀，國(guó)內(nèi)各大設(shè)計(jì)團(tuán)隊(duì)雖然也開(kāi)始持續(xù)輸出一些本土化的內(nèi)容，但仍然擺脫不了系統(tǒng)化這個(gè)問(wèn)題。因此我從今年開(kāi)始，就有了翻譯國(guó)外設(shè)計(jì)論論體系及對(duì)應(yīng)的成熟可用的設(shè)計(jì)方法的沖動(dòng)。如果你讀了我往期的文章，你應(yīng)該了解到了設(shè)計(jì)思維的五個(gè)步驟、了解了用戶體驗(yàn)的七要素、可用性方法以及眾多可操作的實(shí)踐方法。
我翻譯的內(nèi)容既有各大設(shè)計(jì)機(jī)構(gòu)無(wú)私分享的內(nèi)容，也有我自費(fèi)購(gòu)買的設(shè)計(jì)課程，我希望為大家?guī)?lái)一些真正持續(xù)影響設(shè)計(jì)生涯的內(nèi)容，要實(shí)現(xiàn)這一目標(biāo)，軟件技法做不到，只有思維方法、系統(tǒng)化知識(shí)可以做到。
本次翻譯的《以人為中心的設(shè)計(jì)指南》是IDEO出產(chǎn)的一本設(shè)計(jì)工具書(shū)，包括具體的設(shè)計(jì)思路，規(guī)范的設(shè)計(jì)流程，以及各種關(guān)鍵設(shè)計(jì)原則。它將結(jié)合實(shí)例，教授設(shè)計(jì)師如何解決問(wèn)題，如何以人為本的解決復(fù)雜問(wèn)題。
本書(shū)內(nèi)容量較大，共有四大模塊，及73個(gè)小章節(jié)，我將以連載的形式發(fā)布譯文，完整翻譯后，為大家排版一份PDF格式的電子書(shū)，分享給讀者，也分享給國(guó)內(nèi)的所有設(shè)計(jì)師，每個(gè)人都可以盡一份力讓國(guó)內(nèi)的涉及環(huán)境變得更好。
本篇文章主要翻譯介紹部分和第一模塊的7個(gè)小節(jié)（標(biāo)紅部分），闡述了IDEO團(tuán)隊(duì)在設(shè)計(jì)過(guò)程中一直堅(jiān)守的心態(tài)。下面開(kāi)始正文。
介紹
以人為中心的設(shè)計(jì)師意味著什么？
擁抱以人為本的設(shè)計(jì)意味著相信所有的問(wèn)題，即使是那些看似棘手的問(wèn)題，比如貧困、性別平等。此外，這意味著相信每天面對(duì)這些問(wèn)題的人是掌握答案的人。以人為本的設(shè)計(jì)為任何類型的問(wèn)題解決者提供了與社區(qū)與用戶一起設(shè)計(jì)的機(jī)會(huì)，深入了解我們所服務(wù)的人，構(gòu)思各種想法，并根據(jù)人們的實(shí)際需求創(chuàng)造創(chuàng)新性的解決方案。
在IDEO，我們幾十年來(lái)一直使用以人為中心的設(shè)計(jì)來(lái)創(chuàng)造產(chǎn)品、服務(wù)、體驗(yàn)和社會(huì)企業(yè)，這些產(chǎn)品、服務(wù)、體驗(yàn)和企業(yè)之所以被采納和接受，是因?yàn)槲覀儼讶藗兊纳詈驮V求放在核心位置。社會(huì)各個(gè)領(lǐng)域的創(chuàng)新時(shí)機(jī)已經(jīng)成熟，我們已經(jīng)一次次證明我們的方法行之有效。作為一名以人為中心的設(shè)計(jì)師，你要相信，只要你堅(jiān)持從別人身上學(xué)到的東西，你的團(tuán)隊(duì)就能找到世界需要的新解決方案。有了這份實(shí)地指南，你現(xiàn)在就擁有了將這種信念變?yōu)楝F(xiàn)實(shí)所需的工具。
接受不同的心態(tài)
以人為中心的設(shè)計(jì)師不同于其他的問(wèn)題解決者——我們修修補(bǔ)補(bǔ)，不斷測(cè)試，我們一開(kāi)始就失敗了，而且經(jīng)常失敗，我們花了大量的時(shí)間但可能仍然不知道問(wèn)題的答案。然而，我們勇往直前。我們是樂(lè)觀主義者和創(chuàng)造者，是實(shí)驗(yàn)者和學(xué)習(xí)者，我們感同身受，不斷重復(fù)，我們?cè)谝庀氩坏降牡胤綄ふ异`感。我們相信解決方案就在那里。
通過(guò)專注于我們的目標(biāo)群體并提出正確的問(wèn)題，我們將一起達(dá)成目標(biāo)。我們會(huì)想出很多點(diǎn)子，有些行得通，有些行不通。我們把我們的想法具體化，這樣我們就可以進(jìn)行測(cè)試。
然后我們提煉它們。最終，我們的方法等同于瘋狂的創(chuàng)造力，不斷地推動(dòng)創(chuàng)新并給予我們自信，它將我們引向我們開(kāi)始時(shí)從未意識(shí)到的解決方案。現(xiàn)在，我們要分享我們的設(shè)計(jì)哲學(xué)和心態(tài)。
讓我們與眾不同的七種心態(tài):同理心、樂(lè)觀、迭代、創(chuàng)造自信、實(shí)踐、接受不確定性，以及從失敗中學(xué)習(xí)。
理解的過(guò)程
以人為中心的設(shè)計(jì)并不是一個(gè)完美的線性過(guò)程，每個(gè)項(xiàng)目都有自己的特點(diǎn)，但無(wú)論你面臨什么樣的項(xiàng)目，你都將經(jīng)歷三個(gè)主要階段:靈感、構(gòu)思和實(shí)現(xiàn)。通過(guò)依次采取這三個(gè)階段，你將與你為之設(shè)計(jì)的用戶產(chǎn)生深刻的理解;你會(huì)弄清楚如何將你學(xué)到的東西變成設(shè)計(jì)新解決方案的機(jī)會(huì)；在最終將你的產(chǎn)品正式上線之前，你會(huì)建立并測(cè)試你的想法。在IDEO，我們使用以人為中心的設(shè)計(jì)來(lái)處理大量的設(shè)計(jì)挑戰(zhàn)，盡管我們的項(xiàng)目涵蓋社會(huì)企業(yè)到傳播活動(dòng)到醫(yī)療設(shè)備各個(gè)領(lǐng)域，但這種創(chuàng)造性解決問(wèn)題的特殊方法每次都能幫助我們度過(guò)難關(guān)。
靈感
在這個(gè)階段，你將學(xué)習(xí)如何更好地理解別人。你會(huì)觀察他們的生活，聽(tīng)到他們的訴求和愿望，并逐漸加深你對(duì)這個(gè)設(shè)計(jì)挑戰(zhàn)的理解。
構(gòu)思
在這里，你將理解你所了解的一切，產(chǎn)生大量的想法，確定設(shè)計(jì)的機(jī)會(huì)，并測(cè)試和改進(jìn)您的解決方案。
實(shí)現(xiàn)
現(xiàn)在是你把你的解決方案帶到現(xiàn)實(shí)中的機(jī)會(huì)。你將弄清楚如何把你的想法推向市場(chǎng)，以及如何最大限度地發(fā)揮它在世界上的影響力。
使用工具
雖然沒(méi)有哪兩個(gè)以人為中心的設(shè)計(jì)項(xiàng)目是完全相同的，但是我們使用相同的設(shè)計(jì)流程和工具為每個(gè)項(xiàng)目進(jìn)行設(shè)計(jì)。
例如，為了與我們要服務(wù)的人建立深厚的同理心，我們總是對(duì)他們進(jìn)行訪談。
為了保持創(chuàng)造力和活力，我們總是在進(jìn)行團(tuán)隊(duì)協(xié)作。
為了使我們的思維更有創(chuàng)造力、更加敏銳，我們總是把我們的想法做成有形的原型，因?yàn)樗鼛椭覀兘鉀Q問(wèn)題。
因?yàn)槲覀兒苌僭诘谝淮尉统晒?，所以我們總是分享我們的產(chǎn)出，并根據(jù)我們得到的反饋進(jìn)行迭代。
這本指南中的57種方法提供了一套全面的練習(xí)和活動(dòng)，可以幫助你從制定設(shè)計(jì)挑戰(zhàn)到將其推向市場(chǎng)。有些方法你會(huì)用兩到三次，有些則不會(huì)。但是作為一個(gè)整體，他們會(huì)讓你走上持續(xù)創(chuàng)新的道路，同時(shí)讓你所設(shè)計(jì)的社區(qū)或用戶成為你工作的中心。
相信這個(gè)過(guò)程，即使它讓你感到不舒服
以人為中心的設(shè)計(jì)是一種獨(dú)特的解決問(wèn)題的方法，這種方法有時(shí)會(huì)讓人覺(jué)得很瘋狂而不像一個(gè)方法——但如果你總是使用傳統(tǒng)的解決方案，你就很少能找到創(chuàng)新的解決方案。這個(gè)過(guò)程的目的是讓你直接從用戶那里學(xué)習(xí)，敞開(kāi)心扉，接受各種各樣的創(chuàng)造可能性，然后專注于最理想、最可行的方案。你會(huì)發(fā)現(xiàn)自己在這個(gè)過(guò)程中頻繁地推翻假設(shè)，當(dāng)你完成它的三個(gè)階段時(shí)，你會(huì)從具體的觀察到高度抽象的思考快速變換，然后再回到原型的具體細(xì)節(jié)。我們稱之為發(fā)散和收斂（菱形設(shè)計(jì)法則）。
在構(gòu)思階段，通過(guò)更廣泛的思考（大范圍，多領(lǐng)域），我們想出了各種可能的解決方案。
但因?yàn)槲覀兊哪繕?biāo)是最具可行性的方案，所以我們必須確定，在這一系列的想法中，哪一個(gè)最有可能真正發(fā)揮作用。你會(huì)發(fā)散和收斂幾次，每一次新的周期，你會(huì)越來(lái)越接近一個(gè)投放市場(chǎng)級(jí)別的解決方案。
創(chuàng)建真正可用的方案
以人為中心的設(shè)計(jì)是一種獨(dú)特的定位，最終目的是達(dá)成解決方案的可取性（用戶角度），技術(shù)可行性，商業(yè)可行性。
首先從用戶開(kāi)始，了解他們的希望、恐懼和訴求，我們很快就能發(fā)現(xiàn)什么是用戶亟需的。一旦我們確定了一系列能夠吸引用戶的解決方案，我們就開(kāi)始著手于在技術(shù)上可行的方案以及如何使解決方案在經(jīng)濟(jì)上的可行性。這是一個(gè)平衡的過(guò)程，但這對(duì)于設(shè)計(jì)成功且可持續(xù)的解決方案至關(guān)重要。
一：心態(tài)
1.創(chuàng)造性的信心
任何人都可以像設(shè)計(jì)師一樣理解世界。作為一個(gè)問(wèn)題解決者，解鎖這種潛力所需要的只是創(chuàng)造性的信心。創(chuàng)造性的自信是指每個(gè)人都具有創(chuàng)造力的信念，而創(chuàng)造力不是繪畫(huà)或構(gòu)圖或雕刻的能力，而是一種理解世界的方式。
創(chuàng)造性信心是以人為本的設(shè)計(jì)師在實(shí)現(xiàn)思維的飛躍，信任他們的直覺(jué)以及追求他們尚未完全弄清楚的解決方案時(shí)所依賴的品質(zhì)。我們相信，您可以并且將會(huì)為問(wèn)題提出創(chuàng)造性的解決方案，并且相信所有這一切都需要著手去實(shí)踐且深入嘗試。
它是一種自信，相信你所需要做的只是卷起袖子投入進(jìn)去。創(chuàng)造性的自信會(huì)驅(qū)使你去做事情，去測(cè)試它們，去不斷犯錯(cuò)，然后繼續(xù)前進(jìn)，確信你會(huì)到達(dá)你需要去的地方，并且你一定會(huì)一路持續(xù)創(chuàng)新。
建立創(chuàng)造性的自信需要時(shí)間，實(shí)現(xiàn)這一目標(biāo)的部分原因是相信以人為中心的設(shè)計(jì)過(guò)程將向您展示如何以創(chuàng)造性的方式解決手頭的任何問(wèn)題。從微小的成功開(kāi)始，然后建立一個(gè)更大的目標(biāo)，你會(huì)看到你的創(chuàng)造性信心的增長(zhǎng)，不久你就會(huì)發(fā)現(xiàn)自己變成了一個(gè)非常有創(chuàng)造力的人。
2.著手去做
作為以人為本的設(shè)計(jì)師，我們之所以這樣做，是因?yàn)槲覀兿嘈庞行危▽?shí)物、可視化）的力量。我們知道，把一個(gè)想法變成現(xiàn)實(shí)，可以揭示出許多僅僅靠理論所不能揭示的東西。當(dāng)目標(biāo)是將有效的解決方案投入使用時(shí)，您不能生活在抽象和理論中。你必須讓它們成為現(xiàn)實(shí)。 以人為中心的設(shè)計(jì)師是實(shí)干家、修補(bǔ)匠、工匠和建設(shè)者。我們使用任何我們可以使用的東西，從紙板和剪刀到復(fù)雜的數(shù)字工具。我們建立我們的想法，這樣我們就可以測(cè)試它們，在真正去做一些東西后，我們會(huì)發(fā)現(xiàn)以前從來(lái)沒(méi)有想到的機(jī)會(huì)和復(fù)雜性。制作也是一種奇妙的思考方式，它有助于我們關(guān)注設(shè)計(jì)的可行性。此外，把想法變成現(xiàn)實(shí)是一種非常有效的分享方式。如果沒(méi)有來(lái)自人們的反饋，我們將不知道如何進(jìn)一步完善我們的想法。
3.從失敗中學(xué)習(xí)
失敗是一個(gè)非常強(qiáng)大的工具，設(shè)計(jì)實(shí)驗(yàn)原型、交互和測(cè)試他們是以人為本設(shè)計(jì)的核心。要知道并非所有這些能發(fā)揮作用，當(dāng)我們想要解決一個(gè)大問(wèn)題時(shí)，我們一定會(huì)失敗，但如果我們保持良好的心態(tài)，我們就會(huì)從中受益。
以人為中心的設(shè)計(jì)是從一個(gè)不知道如何解決設(shè)計(jì)挑戰(zhàn)的地方開(kāi)始的。只有通過(guò)傾聽(tīng)、思考、構(gòu)建和提煉我們的答案，我們才能得到對(duì)我們的用戶有用的東西。“早失敗，早成功”是IDEO的一個(gè)常見(jiàn)口號(hào)，它的力量之一就是允許出錯(cuò)。由于拒絕冒險(xiǎn)，一些設(shè)計(jì)師實(shí)際上與真正的創(chuàng)新機(jī)會(huì)失之交臂。
托馬斯·愛(ài)迪生說(shuō)得好:“我沒(méi)有失敗。我剛剛發(fā)現(xiàn)了10000種行不通的方法。對(duì)于以人為中心的設(shè)計(jì)師來(lái)說(shuō)，找出行不通的東西是找到有用的東西的一部分。
失敗是以人為中心的設(shè)計(jì)中固有的一部分，因?yàn)槲覀兒苌僭诘谝淮螄L試時(shí)就能取得成功。事實(shí)上，第一次嘗試就做好并不是重點(diǎn)。關(guān)鍵是把一些東西創(chuàng)造出來(lái)，然后用它來(lái)不斷學(xué)習(xí)，不斷提問(wèn)，不斷測(cè)試。如果以人為本的設(shè)計(jì)人員最終取得成功，那是因?yàn)樗麄冊(cè)?jīng)失敗了無(wú)數(shù)次。
4.同理心
同理心是指站在別人的立場(chǎng)上，理解他們的生活，并從他們的角度解決問(wèn)題的能力。
以人為本的設(shè)計(jì)是以同理心為前提的，你為之設(shè)計(jì)的用戶是你通往創(chuàng)新解決方案的路標(biāo)。你所要做的就是感同身受，理解他們，并在設(shè)計(jì)過(guò)程中把他們時(shí)刻掛在心里。
比如長(zhǎng)期以來(lái)，國(guó)際發(fā)展界一直在設(shè)計(jì)解決貧困問(wèn)題的方案，卻沒(méi)有真正同情和理解它所要服務(wù)的人民。但是，通過(guò)設(shè)身處地為我們的設(shè)計(jì)對(duì)象著想，以人為中心的設(shè)計(jì)師可以開(kāi)始通過(guò)一個(gè)新的、強(qiáng)大的視角來(lái)看待這個(gè)世界，以及所有改善它的機(jī)會(huì)。
讓自己沉浸在另一個(gè)世界中，不僅會(huì)為你打開(kāi)新的創(chuàng)造可能性，而且它能讓你拋開(kāi)先入為主的理念和過(guò)時(shí)的思維方式。與你為之設(shè)計(jì)的用戶產(chǎn)生共鳴是真正理解他們生活的背景和復(fù)雜性的最佳途徑。但最重要的是，它將使你的設(shè)計(jì)過(guò)程完全圍繞用戶，從而產(chǎn)出對(duì)他們來(lái)講真正有用的東西。
5.接受不確定性
以人為中心的設(shè)計(jì)師總是從不確定的問(wèn)題開(kāi)始。在一些注重于快速找到方案的公司文化中，這或許不是一個(gè)好的開(kāi)始。但是從第一步開(kāi)始，接受不確定性的設(shè)計(jì)人員會(huì)勇敢的走出去，追求很多不同的想法，甚至找到意想不到的解決辦法。通過(guò)接受這種模糊性，并相信以人為中心的設(shè)計(jì)過(guò)程將引導(dǎo)我們走向一個(gè)創(chuàng)新的答案，我們實(shí)際上迸發(fā)出更強(qiáng)的創(chuàng)新能力。
將以人為中心的設(shè)計(jì)師與其他設(shè)計(jì)師區(qū)別開(kāi)來(lái)的一個(gè)特點(diǎn)是，我們相信總會(huì)有更多的創(chuàng)意。我們不再執(zhí)著于自己的傳統(tǒng)想法，因?yàn)槲覀冎牢覀儠?huì)擁有更多新的想法。因?yàn)橐匀藶橹行牡脑O(shè)計(jì)是一個(gè)如此富有創(chuàng)造力的過(guò)程，而且因?yàn)槲覀兂珜?dǎo)團(tuán)隊(duì)合作構(gòu)思，所以很容易拋棄不好的想法，保留一些一般的想法，并最終得到最好的想法。
雖然這似乎違反直覺(jué)，但這種不確定性實(shí)際上促使以人為中心的設(shè)計(jì)師進(jìn)行創(chuàng)新。
如果我們一開(kāi)始就知道答案，我們能學(xué)到什么呢?我們?cè)鯓硬拍芟氤鰟?chuàng)造性的解決方案呢?我們?yōu)橹O(shè)計(jì)的人會(huì)在哪里指引我們?擁抱不確定性實(shí)際上解放了我們的創(chuàng)造力，鼓勵(lì)我們?nèi)プ非笠粋€(gè)最初無(wú)法想象的答案，這讓我們走上了持續(xù)性創(chuàng)新的道路
6.樂(lè)觀
我們相信設(shè)計(jì)本身就是樂(lè)觀的。
為了迎接一個(gè)艱難的挑戰(zhàn)，特別是像貧困這樣巨大而棘手的挑戰(zhàn)，我們必須相信，創(chuàng)新是唯一的方法。如果我們不這樣做，我們甚至不會(huì)去嘗試。樂(lè)觀是對(duì)可能性的擁抱，即使我們不知道答案，但我們相信總會(huì)有一個(gè)方案等待我們?nèi)ネ诰颉?br />
除了推動(dòng)我們走向解決方案，樂(lè)觀還使我們更有創(chuàng)造力，鼓勵(lì)我們?cè)谟龅剿篮瑫r(shí)繼續(xù)前進(jìn)，并幫助項(xiàng)目中的所有參與人員凝聚在一起。從解決問(wèn)題的角度來(lái)處理問(wèn)題，會(huì)給整個(gè)過(guò)程注入解決最棘手問(wèn)題所需的能量和動(dòng)力。
以人為中心的設(shè)計(jì)師總是專注于可能發(fā)生的事情，而不是可能遇到的無(wú)數(shù)障礙。這是我們的核心信念——每一個(gè)問(wèn)題都是可以解決的——這就是以人為中心的設(shè)計(jì)師的樂(lè)觀。
7.迭代
作為以人為中心的設(shè)計(jì)師，我們采用迭代的方法來(lái)解決問(wèn)題，從我們的用戶那里得到反饋是促使解決方案誕生的關(guān)鍵部分。通過(guò)不斷地迭代、持續(xù)改進(jìn)我們的工作，我們會(huì)有更多的想法，嘗試各種各樣的方法，不斷釋放我們的創(chuàng)造力，更快地找到成功的解決方案。
迭代使我們保持敏捷、反應(yīng)靈敏，并訓(xùn)練我們一直專注于核心的想法，經(jīng)過(guò)幾次迭代后，每個(gè)細(xì)節(jié)都恰到好處。如果你每次建立一個(gè)原型或分享一個(gè)想法時(shí)都追求完美，那么你就會(huì)花很長(zhǎng)時(shí)間去完善一些不一定有效的東西。但是，通過(guò)構(gòu)建、測(cè)試和迭代，您可以不花費(fèi)過(guò)多的時(shí)間和資源來(lái)推進(jìn)您的想法，直到您確定它是正確的。
在項(xiàng)目早期，我們不斷進(jìn)行迭代，因?yàn)槲覀冎赖谝淮尾粫?huì)得到正確的結(jié)果。迭代讓我們有機(jī)會(huì)去探索，去犯錯(cuò)，去驗(yàn)證我們的直覺(jué)，最終會(huì)得到一個(gè)將被采納的解決方案。我們進(jìn)行迭代，因?yàn)樗屛覀儾粩鄬W(xué)習(xí)。我們不是躲在工作室里，打賭某個(gè)想法、產(chǎn)品或服務(wù)會(huì)大受歡迎，而是迅速地走出去，讓我們的用戶成為我們的向?qū)А?/span>
第一部分就到這里了，重新回顧下，在本篇文章中，你應(yīng)該了解到IDEO在設(shè)計(jì)過(guò)程中一直堅(jiān)守的7個(gè)心態(tài)。
他們分別是創(chuàng)造性的信心、著手去做、從失敗中學(xué)習(xí)、同理心、接受不確定性、樂(lè)觀、持續(xù)迭代。
數(shù)組常見(jiàn)方法
數(shù)組的方法
一、join() 方法 ----->不會(huì)改變?cè)瓟?shù)組
二、concat() 方法 ----->不會(huì)改變?cè)瓟?shù)組
三、splice(index, num, item) ----->會(huì)改變?cè)瓟?shù)組
藍(lán)藍(lán)設(shè)計(jì)( sillybuy.com )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)。
目錄頁(yè)主要出現(xiàn)在一些篇幅比較長(zhǎng)的書(shū)籍（畫(huà)冊(cè)）中，其位置一般被安排在扉頁(yè)之后，目錄雖然不是正文，卻概括了一本書(shū)的所有內(nèi)容，具有便于讀者快速了解及查閱書(shū)本內(nèi)容的作用，所以，即使說(shuō)目錄頁(yè)是一本書(shū)中最重要的頁(yè)面也不為過(guò)。
既然如此，那么目錄頁(yè)的設(shè)計(jì)自然也是十分重要，于是乎，蔥爺整理了 8 個(gè)很不錯(cuò)的目錄設(shè)計(jì)技巧分享給大家。
直線在目錄設(shè)計(jì)中的作用主要有以下三個(gè)。
1. 連接
即把每節(jié)內(nèi)容的標(biāo)題與其對(duì)應(yīng)的頁(yè)碼連起來(lái)，這是比較常規(guī)的一種做法，可以使目錄更加清晰，重復(fù)排列的線條會(huì)形成統(tǒng)一、規(guī)整的美感。采用這種排版方式時(shí)，標(biāo)題與頁(yè)碼一般會(huì)設(shè)置成兩端對(duì)齊，這樣的效果更加整潔、清晰。
2. 創(chuàng)造形式
對(duì)于一些文字內(nèi)容比較少的目錄頁(yè)，如果像上面的例子一樣排列會(huì)顯得比較單調(diào)和小氣，所以可以借助直線來(lái)增加其趣味性和張力。由于內(nèi)容不多，所以即使不嚴(yán)格對(duì)齊也不會(huì)影響閱讀。
3. 信息區(qū)隔
比如在下圖的例子中，直線起到了兩個(gè)信息區(qū)隔的作用，一是區(qū)隔頁(yè)碼與大標(biāo)題；二是使七個(gè)大章節(jié)的內(nèi)容獨(dú)立開(kāi)來(lái)。
這種形式也適合內(nèi)容比較少的目錄頁(yè)，當(dāng)有了圖片后，目錄頁(yè)似乎也變成了一個(gè)內(nèi)頁(yè)版面，更加豐富、飽滿。圖片在目錄設(shè)計(jì)中主要有兩個(gè)用法。
1. 概括章節(jié)的主要內(nèi)容
其功能與標(biāo)題一樣，所以如果要使用這種方式，那么就需要為目錄中的每個(gè)大標(biāo)題都搭配對(duì)應(yīng)的圖片。
2. 裝飾
這里的圖片不是與標(biāo)題一一對(duì)應(yīng)的，其目的是為了消除純文字目錄的單調(diào)感，使版面更豐富、更好看。
即將目錄中的元素（頁(yè)碼、標(biāo)題、圖片）用表格的形式來(lái)排列，這么做也可以使信息更加清晰，更有秩序。由于這種做法在目錄設(shè)計(jì)中并不常見(jiàn)，所以顯得很特別。
頁(yè)碼或者序號(hào)是目錄頁(yè)必不可少的元素，章節(jié)細(xì)分比較多的目錄都會(huì)標(biāo)明頁(yè)碼，而分類比較少的目錄一般會(huì)采用序列號(hào)，用來(lái)區(qū)分幾個(gè)大板塊。把頁(yè)碼或序號(hào)拉大并使用筆畫(huà)比較粗的字體，除了可以使其更明了、醒目以外，還可以增加版面的大小對(duì)比，提升設(shè)計(jì)感。
把頁(yè)碼裁切一下，會(huì)更有設(shè)計(jì)感。
即把文字信息豎向等分成兩份或兩份以上，適用于文字比較多的版面，所以如果目錄頁(yè)的內(nèi)容比較多時(shí)也適合分欄排版。由于每一欄的內(nèi)容都嚴(yán)格對(duì)齊，且頁(yè)碼比較大，所以欄與欄之間即使錯(cuò)位排列也不會(huì)影響閱讀。
除了文字還可以用圖片來(lái)分欄。
即把目錄信息沿著某條軸排列，這種形式在目錄設(shè)計(jì)中也比較少見(jiàn)，適用于內(nèi)容比較少的目錄頁(yè)。軸的形式一般為豎軸和橫軸，排列的形式通常為錯(cuò)位排版。
上圖并不是以線為軸，而是以圖片和色塊為軸。
我們都知道網(wǎng)格系統(tǒng)是畫(huà)冊(cè)設(shè)計(jì)的常用工具，可以有效組織版面信息，使其更有序、更整潔，所以內(nèi)容比較多的目錄頁(yè)也可以用網(wǎng)格系統(tǒng)來(lái)排版，為了避免單調(diào)和無(wú)趣，通常會(huì)加入圖片元素。
如果目錄的文字比較少，版面就容易顯得很空、很單調(diào)，常見(jiàn)的做法是增加圖片或者把文字拉大，其實(shí)主動(dòng)保留大量空白也是一種解決辦法，比如把內(nèi)容集中排列在版面的頂部、底部、左下角、右下角等位置，留出其他位置的空白。這么處理的版面雖然有一種不平衡感，但動(dòng)感和設(shè)計(jì)感更強(qiáng)，大面積的留白還可以適當(dāng)緩解眼睛的疲勞。
無(wú)論做什么設(shè)計(jì)我們都要以它的最終目的為設(shè)計(jì)準(zhǔn)則，由于目錄是為了方便瀏覽和查閱書(shū)本內(nèi)容，所以設(shè)計(jì)時(shí)一定要注意視覺(jué)的整潔與信息的清晰，所以可以發(fā)現(xiàn)對(duì)齊和統(tǒng)一是最常被用到的兩個(gè)技巧。
如果經(jīng)常聽(tīng)評(píng)片會(huì)，許多朋友會(huì)聽(tīng)過(guò)這樣一句話：「這樣拍會(huì)顯得畫(huà)面更有張力……」就攝影而言，我們認(rèn)為張力，是讓一幅攝影作品在視覺(jué)上出效果的重要「內(nèi)力」。此外「張力」還被廣泛應(yīng)用在點(diǎn)評(píng)一段演唱，一幅畫(huà)，一次表演……我們都似乎能感受「張力」的意境，卻又似乎不能參透它的意思。
如何理解「張力」？如何借此來(lái)提高我們的攝影感悟？下面我就試著做個(gè)粗淺的分析吧。
關(guān)于「張力」有很多略顯深?yuàn)W的解釋。我認(rèn)為下面這種解釋較為通俗，同時(shí)與攝影有一些關(guān)聯(lián)：
互補(bǔ)物、相反物和對(duì)立物之間的沖突或摩擦?！话愣?，凡是存在著對(duì)立而又相互聯(lián)系的力量、沖動(dòng)或意義的地方，都存在著張力。（轉(zhuǎn)引自楊果〈隱藏的視點(diǎn)：中西「張力」范疇再辨〉，《江漢學(xué)術(shù)》，2013年10月）
盡管這段話不是針對(duì)攝影，甚至不是針對(duì)視覺(jué)藝術(shù)而寫(xiě)的，但是卻很好的解釋了張力一詞?！笍埩Α梗╰ension）由「內(nèi)涵」（intension）和「外延」（extension）二詞而來(lái)。其實(shí)它在物理學(xué)上的意思便是其在美學(xué)上的意義的絕佳比喻。
那么我們便可以粗淺感受一下「張力」在一張照片（或者說(shuō)任何一種視覺(jué)藝術(shù)）中表達(dá)的是什么了：它通常表示了一幅照片對(duì)立而又統(tǒng)一的相互作用，這種作用通常產(chǎn)生緊張感、拉扯感，產(chǎn)生一種繁復(fù)的韻味。力的暗示、不平衡、斷裂、突發(fā)等效果都屬于張力范疇。
舉個(gè)極其通俗的例子，如果我要用圖片表達(dá)「跨欄」。
這張「沒(méi)有張力」，因?yàn)槌Ｒ?guī)、平衡、穩(wěn)定：
這張「有張力」，因?yàn)榭鋸?，不平衡?
當(dāng)我們說(shuō)一張照片的「張力」的時(shí)候，更多表達(dá)的是照片給我們帶來(lái)的主觀感受。通常情況下，一張「有張力」的照片背后蘊(yùn)含著以下的特質(zhì)。
1. 拉扯感
即我們可以感覺(jué)到「力量的存在」，似乎被某種力量拉扯著。哇，這是再直白不過(guò)的張力了。
以拍街頭行人為例，「奔跑」「轉(zhuǎn)向」或其他肢體較為夸張的動(dòng)作和表情通常能讓我們體會(huì)到力量。人的潛意識(shí)總是會(huì)傾向于，試著讓一些看起來(lái)沒(méi)有達(dá)到穩(wěn)態(tài)的東西趨向于達(dá)到穩(wěn)態(tài)，夸張的動(dòng)作同時(shí)也暗示著那些行人「將要跨出下一步」「將要轉(zhuǎn)過(guò)去」「將會(huì)拉扯肌肉」等等。
△ 韓松 / 攝 iPhone 7p， 莫斯科。奔跑的人。
△ 韓松 / 攝 iPhone 6， 馬爾丁，孩子的表情較為夸張，能感受到肌肉的拉扯，畫(huà)面感染力較強(qiáng)。
△ 韓松 / 攝 iPhone 6， 馬爾丁。同樣是人物照，這張就畫(huà)面張力略顯單薄。
而另一種拉扯感來(lái)自所拍攝的元素的形態(tài)本身。例如夕陽(yáng)下被拉長(zhǎng)的影子，具有縱深感的空間，夸張尖銳的幾何形態(tài)等。它們都會(huì)讓我們有被拖拽、被虹吸、被纏繞等感覺(jué)。
△ 韓松 / 攝 iPhone 7p， 布達(dá)佩斯。影子。
2. 沖突
制造各種對(duì)比與沖突。
例如強(qiáng)烈的色相對(duì)比，陰影和高光的高調(diào)對(duì)比等等。這無(wú)疑用畫(huà)面的色彩擊中我們的眼球。
再如一切能造成沖擊力的題材沖突：如抽象和具象，虛幻和真實(shí)，細(xì)膩與粗糙，動(dòng)態(tài)與靜態(tài)等等。
△ 韓松 / 攝 iPhone 6， 香港。紅衣人物和綠色墻面的「撞色」。
△ 韓松 / 攝 iPhone 6， 里斯本。行人和影子。
3. 構(gòu)圖
夸張的構(gòu)圖也能產(chǎn)生張力。
斜線的構(gòu)圖通常更有張力，因?yàn)樗鋸埗鴱?qiáng)烈。但斜線的構(gòu)圖是需要磨練的，有時(shí)候「為了斜線而斜線」會(huì)顯得矯揉造作（之前的文章我建議大家先從擺正，拍平開(kāi)始）。
△ 譚凌飛 / 攝 iPhone 6， 薩爾茨堡。斜射的影子讓不起眼的場(chǎng)景有了張力。
極度不遵從「三分法」「對(duì)稱」「平衡」等原則，而又在某種意義上很精妙地構(gòu)圖，有時(shí)候也能造成張力。這種構(gòu)圖的本質(zhì)是打破了平衡感，擾動(dòng)了我們潛意識(shí)里的平衡球。元素的極大和極小的對(duì)比，大量留白和極度撐滿，以及一些「莫名其妙」的夸張形式，都有可能成為視覺(jué)張力的發(fā)力點(diǎn)。
△ 韓松 / 攝 iPhone 6s， 北京。
△ 韓松 / 攝 iPhone 7p， 日本高松?！笜O大」的場(chǎng)景和「極小」的人物，拉開(kāi)了比例。
△ 韓松 / 攝 iPhone 7p， 巴黎。雕塑和觀眾的比例和顏色對(duì)比形成張力，然而他們的動(dòng)作又有一些聯(lián)系。
1. 手機(jī)外置廣角或魚(yú)眼鏡頭
手機(jī)定焦鏡頭較為平和，如果加上外置的廣角或魚(yú)眼鏡頭能夠拍一些較有沖擊力的照片。廣角顧名思義是有很寬廣的視角，能夠近距離將比較寬的場(chǎng)景元素都拉扯在一起，讓斜線、曲線都更為夸張。
2. 勇敢面對(duì)那些「不舒服」的素材吧
其實(shí)本質(zhì)還是在于不平衡。擁擠、窺視、抖動(dòng)、不穩(wěn)定的、轉(zhuǎn)瞬即逝，這些東西都不太舒服，但又常常因此形成視覺(jué)上的動(dòng)感。擁擠人群中的一瞥，從奇特角度的窺探人物的活動(dòng)、快速運(yùn)動(dòng)的騎車的人，匆匆而過(guò)的行人汽車等等，讓我們感到有「絲毫不安」，卻也預(yù)示著「這不是穩(wěn)態(tài)」，是矛盾而拉扯著的。
△ 韓松 / 攝 iPhone 7p， 布拉格。擁擠的人群。
△ 韓松 / 攝 iPhone 7p， 日本奈良。透過(guò)吃草的鹿看后面的鹿。
△ 譚凌飛/ 攝 iPhone 6s， 巴黎。差點(diǎn)被遮住的鐵塔。
3. 不平衡的構(gòu)圖
自不多說(shuō)。對(duì)角線、夸張的引導(dǎo)線，螺旋線，撐滿畫(huà)面的構(gòu)圖。那些找不到幾何中心而又精妙的構(gòu)圖。
△ 韓松 / 攝 iPhone 7p， 日本。螺旋線。
4. 拍攝運(yùn)動(dòng)物體
跑步的人，快走的人，跳躍的人，快速通過(guò)的車。
△ 韓松 / 攝 iPhone 6s， 伊斯坦布爾。撐傘的人走過(guò)。
△ 韓松 / 攝 iPhone 7p， 莫斯科。拉手風(fēng)琴的人與匆匆而過(guò)的行人。
5. 后期
通過(guò)調(diào)高飽和度等參數(shù)強(qiáng)化色相的對(duì)比等等。
△ 韓松 / 攝 iPhone 7p， 日本。后期調(diào)高了些飽和度，強(qiáng)化了人物和背景的顏色對(duì)比。
不得不承認(rèn)，張力還是一個(gè)比較抽象的概念，我們從來(lái)不會(huì)以「張力」為目的去拍一張照片，更多的時(shí)候，我們是無(wú)意識(shí)地被「有張力」的場(chǎng)景所吸引，也具有從一堆原片中甄選出「有張力的照片」的能力。重要的是會(huì)在取景框中通過(guò)構(gòu)圖的運(yùn)用來(lái)制造張力的可能性。
文章來(lái)源：優(yōu)設(shè)
一、首先找到第一次發(fā)起網(wǎng)絡(luò)請(qǐng)求的地址，將服務(wù)器返回set-cookie當(dāng)全局變量存儲(chǔ)起來(lái)
wx.request({
......
success: function(res) {
console.log(res.header);
//set-cookie:PHPSESSID=ic4vj84aaavqgb800k82etisu0; path=/; domain=.fengkui.net
// 登錄成功，獲取第一次的sessionid,存儲(chǔ)起來(lái)
// 注意：Set-Cookie（開(kāi)發(fā)者工具中調(diào)試全部小寫(xiě)）（遠(yuǎn)程調(diào)試和線上首字母大寫(xiě)）
wx.setStorageSync("sessionid", res.header["Set-Cookie"]);
}
})
二、請(qǐng)求時(shí)帶上將sessionid放入request的header頭中傳到服務(wù)器，服務(wù)器端可直接在cookie中獲取
wx.request({
......
header: {
'content-type': 'application/json', // 默認(rèn)值
'cookie': wx.getStorageSync("sessionid")
//讀取sessionid,當(dāng)作cookie傳入后臺(tái)將PHPSESSID做session_id使用
},
success: function(res) {
console.log(res)
}
})
三、后臺(tái)獲取cookie中的PHPSESSID，將PHPSESSID當(dāng)作session_id使用
<?php
// 判斷$_COOKIE['PHPSESSID']是否存在，存在則作session_id使用
if ($_COOKIE['PHPSESSID']) {
session_id($_COOKIE['PHPSESSID']);
}
session_start();
echo session_id();
jqGrid提供了表格底部匯總、合計(jì)行功能，我們先看下user-guide關(guān)于jqGrid合計(jì)行都有哪些說(shuō)明？然后再看個(gè)DEMO，看看jqGrid表格底部匯總、合計(jì)行到底如何實(shí)現(xiàn)。
1、user-guide關(guān)于jqGrid合計(jì)行的說(shuō)明
1）表格配置：footerrow, boolean, 默認(rèn)false
If set to true this will place a footer table with one row below the gird records and above the pager. The number of columns equal those specified in colModel
表格是否顯示底部合計(jì)行。
2）表格配置：userDataOnFooter，boolean，默認(rèn)false
When set to true we directly place the user data array userData in the footer if the footerrow parameter is set to true. The rules are as follows: If the userData array contains a name which matches any name defined in colModel, then the value is placed in that column. If there are no such values nothing is placed. Note that if this option is used we use the current formatter options (if available) for that column. See footerData method.
如果設(shè)為true，則userData可以用來(lái)填充匯總行。
3）匯總行賦值：footerData([string action], [object data], [boolean format])
This method gets or sets data on the grid footer row. When set data in the footer row, the data is formatted according to the formatter (if defined) in coModel. The method can be used if footerrow option is set to true.
parameters
string action - can be ‘get’ or ‘set’. The default is get. ‘get’ returns an object of type name:value, where the name is a name from colModel. This will return data from the footer. The other two options have no effect in this case. ‘set’ takes a data object and places the values in the footer The value is formatted according to the definition of the formatter in colModel - see next parameter. The object should be in name:value pair, where the name is the name from colModel
object data - data to be set in the footer in name:value pair, where the name should correspond to the name of colModel in order to be set in the appropriate cell.
boolean format - default is true. This instruct the method to use the formatter (if set in colModel) when new values are set. A value of false will disable the using of formatter
2、一個(gè)DEMO，如何利用gridComplete事件進(jìn)行表格數(shù)據(jù)匯總并賦值給合計(jì)行
1）案例截圖
2）html代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>jggrid底部匯總行</title>
<link rel="stylesheet" href="https://cdn.bootcss.com/twitter-bootstrap/3.3.7/css/bootstrap.min.css" />
<link rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/4.5.0/css/font-awesome.min.css" />
<link rel="stylesheet" href="https://cdn.bootcss.com/jqueryui/1.11.0/jquery-ui.min.css" />
<link rel="stylesheet" href="https://js.cybozu.cn/jqgrid/v5.3.1/css/ui.jqgrid.css" />
<script src=";
<script src=";
<script src=";
</head>
<body>
<div class="page-content container">
<div class="page-body"> <!-- page-body -->
<div class="panel panel-default" id="panel-orders">
<table id="orders"></table>
</div>
</div>
</div>
<script type="text/javascript">
var data = [];
function getBills() {
var rowCount = 10;
for (var i = 0; i < rowCount; i ++) {
data.push({
sid: i,
goods_no: i + 1,
goods_name: '零件名稱' + rowCount + i,
car_type_name: '車型' + rowCount + i,
package_name: '包裝器具' + rowCount + i,
unit_name: '件',
snp: 0.89,
bill_amount: rowCount + i,
goods_count: rowCount + i,
bill_no: 'BN0000000' + i,
qrcode: '1000000000' + i,
barcode: '1000000000' + i,
})
}
$("#orders").jqGrid("clearGridData").jqGrid('setGridParam',{data: data || []}).trigger('reloadGrid');
}
$(function() {
$("#orders").jqGrid({
colModel: [
{label: "零件號(hào)", name: "goods_no", width: 60},
{label: "零件名稱", name: "goods_name", search:false, width: 180},
{label: "車型", name: "car_type_name", width: 70},
{label: "包裝器具", name: "package_name", width: 70},
{label: "單位", name: "unit_name", width: 40},
{label: "訂單號(hào)", name: "bill_no", width: 120},
{label: "訂單數(shù)量", name: "goods_count", width: 80},
],
datatype: 'local',
rownumbers: true,
height: 300,
rowNum: 1000,
footerrow: true,
gridComplete: function() {
var rows = $("#orders").jqGrid("getRowData"), total_count = 0;
for(var i = 0, l = rows.length; i<l; i++) {
total_count += (rows[i].goods_count - 0);
}
$("#orders").jqGrid("footerData", "set", {goods_name:"--合計(jì)--",goods_count:total_count});
}
});
getBills();
});
</script>
</body>
</html>
3）代碼說(shuō)明：
表格構(gòu)建時(shí)，設(shè)置：footerrow: true
gridComplete(jqGridGridComplete)事件處理，進(jìn)行數(shù)據(jù)匯總并賦值給合計(jì)行
gridComplete fires after all the data is loaded into the grid and all other processes are complete. Also the event fires independent from the datatype parameter and after sorting paging and etc. Does not fire if datatype is a defined as function.
4）獲取匯總行數(shù)據(jù)
var row = $("#orders").jqGrid(“footerData”, “get”);
藍(lán)藍(lán)設(shè)計(jì)( sillybuy.com )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)。
藍(lán)藍(lán)設(shè)計(jì)的小編 http://sillybuy.com