交互式智能藝術(shù)圖片網(wǎng)站的設(shè)計(jì)探究

前言：想要寫(xiě)出一篇引人入勝的文章？我們特意為您整理了交互式智能藝術(shù)圖片網(wǎng)站的設(shè)計(jì)探究范文，希望能給你帶來(lái)靈感和參考，敬請(qǐng)閱讀。

摘要：本文構(gòu)建了一個(gè)交互式智能藝術(shù)圖片網(wǎng)站，AI與圖像的結(jié)合使該網(wǎng)站具備了“快速圖像風(fēng)格遷移”、“修復(fù)模糊、褶皺圖片”、“黑白圖片上色”等智能化應(yīng)用，增強(qiáng)了用戶體驗(yàn)和網(wǎng)站的趣味性。個(gè)人作品上傳、可過(guò)濾敏感消息的網(wǎng)頁(yè)聊天室與用戶留言功能，為藝術(shù)圖片愛(ài)好者搭建了一個(gè)展示、欣賞與交流作品的綠色、多元交互平臺(tái)，使網(wǎng)站更具生機(jī)和活力。

關(guān)鍵詞：快速圖像風(fēng)格遷移；圖像修復(fù)；flask；Bootstrap；智能網(wǎng)站；WebSocket通信協(xié)議；敏感詞匯過(guò)濾

藝術(shù)是人們情感交流的媒介，它使我們的生活更加美好，人工智能和藝術(shù)的“跨界融合”成為當(dāng)今研究的熱點(diǎn)之一。本文利用深度學(xué)習(xí)模型，設(shè)計(jì)了圖像風(fēng)格變換、圖像修復(fù)等功能。此外，為了給用戶提供一個(gè)更加健康、便捷、豐富的藝術(shù)交流環(huán)境，此網(wǎng)站也設(shè)計(jì)了投票、留言以及基于WebSocket通信協(xié)議和“自動(dòng)禁言”的聊天室功能。為眾多藝術(shù)圖片愛(ài)好者提供一個(gè)更加智能化的圖片展示、處理與交流平臺(tái)。

1關(guān)鍵技術(shù)

1.1快速圖像風(fēng)格遷移

風(fēng)格遷移是指創(chuàng)建一張新圖像，保留目標(biāo)圖像的內(nèi)容，同時(shí)抓住參考圖像的風(fēng)格，盡可能的使內(nèi)容損失函數(shù)和風(fēng)格損失函數(shù)最小化[1]。風(fēng)格遷移使用卷積層的中間特征還原出對(duì)應(yīng)這種特征的原始圖像[1]，圖像還原的方法是梯度下降。設(shè)原始內(nèi)容圖像為，原始風(fēng)格圖像為，待生成圖像為，因此組合的內(nèi)容損失和的風(fēng)格損失，定義總損失：（1）其中：α，β是平衡兩個(gè)損失的超參數(shù)。原始的圖像風(fēng)格遷移以為目標(biāo)，在生成圖像時(shí)需要用梯度下降來(lái)逐步迭代，速度很慢。在快速圖像風(fēng)格遷移中，不使用優(yōu)化的方法逐步迭代生成，而是使用訓(xùn)練好的生成網(wǎng)絡(luò)直接生成?？焖賵D像風(fēng)格遷移由生成網(wǎng)絡(luò)和損失網(wǎng)絡(luò)兩個(gè)神經(jīng)網(wǎng)絡(luò)組成[2]，如圖1所示：左側(cè)虛線框內(nèi)為生成網(wǎng)絡(luò)（fw，w為權(quán)重參數(shù)），即一個(gè)深度殘差網(wǎng)絡(luò)；右側(cè)虛線框內(nèi)為損失網(wǎng)絡(luò)（φ）。利用損失網(wǎng)絡(luò)來(lái)定義內(nèi)容和風(fēng)格損失，根據(jù)損失值來(lái)訓(xùn)練生成網(wǎng)絡(luò)。設(shè)輸入圖像為，轉(zhuǎn)換圖像為，原始內(nèi)容圖像為，原始風(fēng)交互式智能藝術(shù)圖片網(wǎng)站的設(shè)計(jì)與實(shí)現(xiàn)穆衛(wèi)衛(wèi)郭鵬博（天津師范大學(xué)天津市300387）格圖像為，利用損失網(wǎng)絡(luò)定義的內(nèi)容損失為，內(nèi)容損失使用VGG-16的relu3_3層輸出特征[3]，即圖中的，風(fēng)格損失為，風(fēng)格損失使用VGG-16的relu1_2、relu2_2、relu3_3、relu4_3層輸出，對(duì)應(yīng)圖中的、、、，組合這兩種損失定義總損失，利用總損失訓(xùn)練生成網(wǎng)絡(luò)。對(duì)于每張需要轉(zhuǎn)換的圖片，相當(dāng)于在生成網(wǎng)絡(luò)中進(jìn)行一次前向傳遞，極大地縮短了圖片生成所消耗的時(shí)間。本文在TensorFlow中實(shí)現(xiàn)快速風(fēng)格遷移，對(duì)每個(gè)風(fēng)格分別訓(xùn)練一個(gè)簡(jiǎn)單的卷積神經(jīng)網(wǎng)絡(luò)來(lái)學(xué)習(xí)這些特定風(fēng)格的變換，利用訓(xùn)練好的生成網(wǎng)絡(luò)進(jìn)行圖像風(fēng)格轉(zhuǎn)換。

1.2基于WGAN-GP的圖像去模糊與褶皺技術(shù)

WGAN-GP是基于Wasserstein距離實(shí)現(xiàn)的改進(jìn)版生成對(duì)抗網(wǎng)絡(luò)[4]。其對(duì)SmoothL1損失函數(shù)進(jìn)行了優(yōu)化：加入梯度懲罰GP項(xiàng)，避免梯度爆炸[5]。在保證生成器梯度變化的前提下，WGAN-GP能夠使模型在訓(xùn)練過(guò)程中表現(xiàn)得更加穩(wěn)定。本文借助端到端的U-NET網(wǎng)絡(luò)結(jié)構(gòu)可以直接生成圖像的優(yōu)勢(shì)，構(gòu)建待處理照片和生成圖片間的映射關(guān)系[5]。判別器與生成器相互協(xié)同對(duì)抗，使生成圖片的效果更佳。1.3基于NoGAN的DeOldify技術(shù)DeOldify是用于恢復(fù)和著色老照片的深度學(xué)習(xí)項(xiàng)目，它采用了效率更高的NoGAN訓(xùn)練方法[6]。相比于傳統(tǒng)的GAN，它可以將復(fù)原圖片的細(xì)節(jié)處理得更好、效果更加逼真，其對(duì)于保證視頻著色的穩(wěn)定性來(lái)說(shuō)至關(guān)重要。目前，DeOldify擁有Artistic、Stable和Video三種型號(hào)，每種型號(hào)都有其關(guān)鍵的優(yōu)勢(shì)和劣勢(shì)，適用于不同用例。

1.4DFA過(guò)濾敏感詞算法

DFA（DeterministicFiniteAutomaton），即確定有窮自動(dòng)機(jī)，其通過(guò)事件和當(dāng)前的狀態(tài)確定下一個(gè)狀態(tài)。算法核心為建立了大量以敏感詞為基礎(chǔ)的敏感詞樹(shù)，對(duì)文本中的文字進(jìn)行敏感詞匹配時(shí)，首先，進(jìn)行文本的預(yù)處理，過(guò)濾掉起干擾作用的無(wú)意義字符[7]。預(yù)處理完成后，匹配根節(jié)點(diǎn)是待檢測(cè)文本第一個(gè)字的樹(shù)，匹配成功后，對(duì)根節(jié)點(diǎn)的子樹(shù)依次進(jìn)行檢索，最終確定待檢測(cè)文本是否為敏感詞。若是，進(jìn)行文本拋棄；若否，檢測(cè)剩余文本。DFA過(guò)濾敏感詞算法在實(shí)現(xiàn)文字過(guò)濾時(shí)速度較快。

1.5數(shù)據(jù)庫(kù)存儲(chǔ)技術(shù)

數(shù)據(jù)庫(kù)技術(shù)是數(shù)據(jù)處理和信息管理系統(tǒng)的核心，主要用于大量數(shù)據(jù)的組織存儲(chǔ)問(wèn)題。MySQL是一種開(kāi)源的關(guān)系型數(shù)據(jù)庫(kù)管理系統(tǒng)，擁有體積小、運(yùn)行速度快、成本低的特點(diǎn)，適合此量級(jí)網(wǎng)站的使用。

2系統(tǒng)設(shè)計(jì)

本文選用自由、靈活、可擴(kuò)展性強(qiáng)的flask框架創(chuàng)建并運(yùn)行一個(gè)web應(yīng)用程序，它可以實(shí)現(xiàn)python后端代碼和keras的模型訓(xùn)練語(yǔ)法的對(duì)接，方便實(shí)現(xiàn)深度學(xué)習(xí)模型執(zhí)行上線定時(shí)任務(wù)。相比于flask的模板引擎jinjia2提供的前端結(jié)構(gòu)，本文在flask中集成了Bootstrap開(kāi)源前端框架，Bootstrap框架所提供的用戶界面組件可以創(chuàng)建更加整潔規(guī)范且生動(dòng)的頁(yè)面。由于flask并沒(méi)有提供一個(gè)全面的表單驗(yàn)證機(jī)制，為了保證代碼的簡(jiǎn)潔和可維護(hù)性，本文使用了wtforms表單驗(yàn)證插件進(jìn)行對(duì)用戶請(qǐng)求數(shù)據(jù)的驗(yàn)證。同時(shí)，在后端采用tensorflow框架以完成圖片處理工作。交互式圖片藝術(shù)網(wǎng)站功能結(jié)構(gòu)圖如圖2所示。功能設(shè)計(jì)如下：

2.1用戶注冊(cè)登錄用戶注冊(cè)登錄模塊實(shí)現(xiàn)了用戶的賬戶注冊(cè)和網(wǎng)站登錄功能。用戶在注冊(cè)界面輸入賬號(hào)、郵箱、密碼、電話等信息后，可以完成賬戶的注冊(cè)。在登錄界面，用戶輸入賬戶信息即可登錄網(wǎng)站，進(jìn)入個(gè)人主頁(yè)。2.2個(gè)人中心個(gè)人中心模塊實(shí)現(xiàn)了作品上傳、查看留言、作品刪除等功能。用戶在選擇想要上傳的圖片后，輸入作者、日期及作品描述相關(guān)信息后完成作品上傳。用戶可以在個(gè)人中心讀取來(lái)自其他用戶的留言，并進(jìn)行回復(fù)。

2.3圖片處理

2.3.1快速圖像風(fēng)格遷移?？焖賵D像風(fēng)格遷移可以讓圖片擁有特定風(fēng)格畫(huà)派的明顯紋理結(jié)構(gòu)。用戶上傳待處理圖片后，選擇想要的圖片風(fēng)格。系統(tǒng)進(jìn)行圖片風(fēng)格轉(zhuǎn)換，返回具有特定風(fēng)格的圖片。2.3.2修復(fù)模糊、褶皺圖片。模糊與褶皺圖片修復(fù)功能可以幫助用戶修復(fù)由于拍攝、存儲(chǔ)不當(dāng)而造成損傷的圖片，自動(dòng)彌補(bǔ)圖像損失的細(xì)節(jié)。2.3.3圖片上色。黑白照片上色功能可實(shí)現(xiàn)老照片的色彩修復(fù)，使黑白圖片變得更加鮮活，最大程度還原歷史場(chǎng)景。

2.4網(wǎng)絡(luò)聊天室

此模塊實(shí)現(xiàn)了多用戶在線交流功能。為了保證一個(gè)綠色健康的交流環(huán)境，網(wǎng)絡(luò)聊天室會(huì)對(duì)交流者的發(fā)言進(jìn)行快速過(guò)濾，包含敏感詞匯的消息將被禁止顯示。2.5在線留言用戶在看到自己感興趣的作品后可以使用在線留言功能向作者留言，交流個(gè)人的感受并與作者探討。

3功能實(shí)現(xiàn)

3.1圖片上傳與展示

3.1.1圖片上傳。在前端使用ajax上傳圖片，需要?jiǎng)?chuàng)建FormData對(duì)象，改變ajax中的data屬性，在ajax中設(shè)置processData:false，contentType:false，async:false參數(shù)。后端的視圖函數(shù)接收用戶圖片上傳的請(qǐng)求后，調(diào)用flask_uploads.UploadSet對(duì)象的save函數(shù)接收并存儲(chǔ)圖像。為了節(jié)省數(shù)據(jù)庫(kù)空間并且保證網(wǎng)站的響應(yīng)速度，該視圖函數(shù)只將圖片的名稱和地址存入數(shù)據(jù)庫(kù)，圖片文件存儲(chǔ)在服務(wù)器本地文件夾中。3.1.2圖片展示。服務(wù)器讀取用戶上傳成功的圖片文件后，通過(guò)對(duì)圖片進(jìn)行base64編碼操作，將處理后獲得的圖片流傳遞給前端，并在前端的img標(biāo)簽中以base64編碼形式添加圖片完成顯示。

3.2圖片處理

3.2.1快速圖像風(fēng)格遷移。用戶進(jìn)入圖片風(fēng)格變換頁(yè)面，上傳原圖片，同時(shí)選擇濾鏡風(fēng)格，點(diǎn)擊“生成圖片”。系統(tǒng)獲取到上傳的圖片及濾鏡，開(kāi)啟線程并調(diào)用訓(xùn)練好的圖像遷移模型對(duì)圖片進(jìn)行風(fēng)格化處理。處理完成后，由系統(tǒng)自動(dòng)檢測(cè)圖片生成路徑，返回生成圖片。如圖3所示。3.2.2圖片修復(fù)。。用戶進(jìn)入照片修復(fù)頁(yè)面，上傳需要修復(fù)處理的圖片。從模糊圖片修復(fù)、褶皺圖片修復(fù)和黑白圖片上色三個(gè)功能中進(jìn)行選擇，點(diǎn)擊“修復(fù)圖片”。服務(wù)器端在獲取上傳的圖片及修復(fù)信息后，開(kāi)啟線程調(diào)用已經(jīng)訓(xùn)練完成的模型進(jìn)行圖片修復(fù)。處理完成后，同樣由系統(tǒng)自動(dòng)檢測(cè)圖片生成路徑，返回生成圖片。

3.3網(wǎng)絡(luò)聊天室的實(shí)現(xiàn)

本文使用Bootstarp前端框架設(shè)計(jì)前端聊天室頁(yè)面，使用websocket協(xié)議在客戶端與服務(wù)器之間建立起全雙工的通信方式，實(shí)現(xiàn)消息的發(fā)送和接收?？蛻舳耸褂胹ocket.io.js，服務(wù)器端使用flask-socketio擴(kuò)展。首先，在運(yùn)行環(huán)境中用pip安裝flask-socketio。在前端引入socket.io.js，用戶輸入消息點(diǎn)擊發(fā)送按鈕，消息通過(guò)socket.emit發(fā)送到服務(wù)端。服務(wù)器端用@socketio.on裝飾器裝飾的函數(shù)接收和處理消息。在此事件處理中開(kāi)啟敏感詞匯過(guò)濾線程，在線程中利用DFA算法實(shí)現(xiàn)敏感詞匯過(guò)濾，包含敏感詞匯的消息將被自動(dòng)拋棄，合法的消息將被存入需發(fā)送給客戶端的message隊(duì)列，返回一個(gè)消息的html字符串，并對(duì)其進(jìn)行渲染。通過(guò)設(shè)置broadcast=True，把消息廣播到與服務(wù)器建立websocket鏈接的所有客戶端?？蛻舳送瑯佑胹ocket.on方法接收返回信息，將其添加到顯示區(qū)域。網(wǎng)絡(luò)聊天室交互界面如圖4所示。

3.4數(shù)據(jù)庫(kù)存儲(chǔ)技術(shù)的應(yīng)用

建立數(shù)據(jù)庫(kù)。在數(shù)據(jù)庫(kù)中建立相互關(guān)聯(lián)的數(shù)據(jù)表，以此實(shí)現(xiàn)數(shù)據(jù)存儲(chǔ)。（1）用戶注冊(cè)表。用戶注冊(cè)表主要用于存儲(chǔ)用戶賬號(hào)數(shù)據(jù)，包含賬號(hào)、郵箱、密碼、電話等，ID作為唯一標(biāo)識(shí)。（2）作品信息表。作品信息表主要用于記錄用戶上傳作品及其相關(guān)信息，包含主題、作者、日期、描述等。（3）投票匯總表。投票匯總表主要用于對(duì)投票活動(dòng)進(jìn)行數(shù)據(jù)匯總和信息統(tǒng)計(jì)，包含：作者、主題、日期、得票數(shù)等。（4）留言記錄表。留言記錄表主要用于記錄留言信息，包含留言者、文本內(nèi)容、作者。

4結(jié)語(yǔ)

傳統(tǒng)圖片網(wǎng)站的單一功能已經(jīng)不能滿足藝術(shù)圖片愛(ài)好者的需求，基于人工智能深度學(xué)習(xí)的多元化圖片分享網(wǎng)站讓用戶可以用一種新的方式創(chuàng)作圖片，填補(bǔ)了藝術(shù)圖片方向上社區(qū)分享型網(wǎng)站的空白。自動(dòng)分類、圖片配樂(lè)等功能的逐步完善，將會(huì)不斷增強(qiáng)用戶體驗(yàn)，使網(wǎng)站更加智能化。

作者:穆衛(wèi)衛(wèi) 郭鵬博 單位:天津師范大學(xué)