李間 鄭好 黃智煜 林小龍

【摘 要】為了滿足人們對圖片素材的實(shí)時需求，達(dá)到圖片內(nèi)容能匹配用戶需求，我們基于智能手機(jī)的硬件基礎(chǔ)，搭建一個照片代拍系統(tǒng)來解決以上需求。MutualPic正是可以解決這一需求的照片代拍系統(tǒng);MutualPic系統(tǒng)基于LAMP環(huán)境、Laravel框架開發(fā)，集成RBAC權(quán)限管理功能、API接口以及多客戶端，且具有前后端分離特色;本文將從系統(tǒng)功能概要設(shè)計(jì)、系統(tǒng)架構(gòu)分析設(shè)計(jì)、數(shù)據(jù)庫分析與API 接口功能設(shè)計(jì)、多客戶端界面設(shè)計(jì)五大模塊闡述拍照共享平臺的系統(tǒng)分析與設(shè)計(jì)過程。

【關(guān)鍵詞】照片代拍;Laravel;MVC設(shè)計(jì)模式;應(yīng)用程序接口;權(quán)限管理

中圖分類號： TP311.1-4;G642 文獻(xiàn)標(biāo)識碼： A 文章編號： 2095-2457（2019）03-0106-002

DOI：10.19694/j.cnki.issn2095-2457.2019.03.043

MutualPic generation photo system analysis and design

LI Jian ZHENG Hao HUANG Zhi-yu LIN Xiao-long CHEN Yong-ling

（Guilin university of electronic technology， Guilin Guangxi 541000， China）

【Abstract】In order to meet people's real-time needs for picture materials and meet the needs of users for picture content matching， we built a photo-taking system based on the hardware basis of smart phones to solve the above needs. Mutualic.It is to solve this need of the photo generation system; The MutualPic system was developed based on LAMP environment and Laravel framework， and integrated with RBAC authority management function， API interface and multiple clients， with the characteristic of separation of front and rear ends. This paper will elaborate the system analysis and design process of the photo-sharing platform from five modules： system function outline design， system architecture analysis design， database analysis and AP interface function design， and multi-client interface design.

【Key words】Photo generation; Laravel; MVC design pattern; Application programming interface; Rights management

0 引言

在浩如煙海的信息化世界中，人們想找到需要的圖片素材是比較費(fèi)時和困難的，當(dāng)下大部分用戶尋找圖片素材有兩種方式，一種是利用搜索引擎來尋找，但搜索引擎返回的結(jié)果量多且雜;另一種是通過質(zhì)量較高的圖片素材網(wǎng)站來尋找素材，而這類網(wǎng)站雖然圖片優(yōu)質(zhì)，但其匹配范圍也僅限于該站的數(shù)據(jù)庫，還是無法滿足用戶的需求。

而科技的發(fā)展使手機(jī)攝像頭的分辨率越來越高，智能手機(jī)已經(jīng)足夠滿足拍攝的需要，并且相比照相機(jī)等設(shè)備使用起來也更方便。因此，基于智能手機(jī)的硬件基礎(chǔ)，搭建一個照片代拍系統(tǒng)來解決圖片內(nèi)容與用戶需求匹配是我們的目標(biāo)。

1 系統(tǒng)功能概要設(shè)計(jì)

1.1 使用方功能設(shè)計(jì)

對于MutualPic代拍照片系統(tǒng)而言，要解決的用戶需求是對圖片素材的需求，那么相應(yīng)的功能設(shè)計(jì)如下：

（1）主體功能

創(chuàng)建相冊與上傳照片也就是平臺用戶創(chuàng)建相冊，并能夠通過上傳或選擇已有相冊來回應(yīng)其他需求者發(fā)出的圖片需求信息;同時平臺用戶可以通過平臺搜索引擎能夠直接尋找自己需要的圖片素材。

（2）客戶端功能

注冊和登錄，讓使用方成為平臺用戶，并通過用戶這一角色能夠享有平臺數(shù)據(jù);用戶還可以進(jìn)行數(shù)據(jù)總覽、用戶數(shù)據(jù)分類管理、用戶信息修改;還有為用戶提供各功能的使用方法的圖文說明、以及用戶反饋的提交。

（3）積分等級等功能：

從電子商務(wù)專業(yè)理論知識考慮，為了保持和拓展用戶，從運(yùn)營考慮而為使用者設(shè)計(jì)各種特色功能，如結(jié)合主要功能開發(fā)的一系列積分獎勵系統(tǒng)或是等級權(quán)限系統(tǒng)等。

1.2 運(yùn)營方功能設(shè)計(jì)

運(yùn)營方作為MutualPic系統(tǒng)的運(yùn)營者和維護(hù)者，需要具備MutualPic系統(tǒng)管理的最高權(quán)限，并為其提供可視化的數(shù)據(jù)管理操作，以及為其運(yùn)營后期再次開發(fā)減少難度，相應(yīng)功能設(shè)計(jì)如下有：管理控制面板，用戶管理，權(quán)限管理，菜單管理，公告管理，主題業(yè)務(wù)功能管理，其他業(yè)務(wù)功能管理，API接口與開發(fā)文檔。

2 系統(tǒng)架構(gòu)分析設(shè)計(jì)

開發(fā)環(huán)境與開發(fā)技術(shù)

本系統(tǒng)選擇在LAMP環(huán)境下進(jìn)行開發(fā)和運(yùn)行，選用Ubuntu作為開發(fā)和運(yùn)行環(huán)境主要原因是：開源免費(fèi)、運(yùn)行快、便于維護(hù);A表示Apache，apache作為一個跨平臺的Web服務(wù)器軟件，其穩(wěn)定的性能能讓開發(fā)更具安全性;M是指采用Mysql數(shù)據(jù)庫;P即是指選用PHP編程語言，制作Web應(yīng)用使用PHP編程語言可謂是相當(dāng)輕便迅速。

3 數(shù)據(jù)庫分析與設(shè)計(jì)

數(shù)據(jù)庫需求分析

MutualPic數(shù)據(jù)庫要建立一系列數(shù)據(jù)表來反應(yīng)各業(yè)務(wù)功能之間的關(guān)系。MutualPic系統(tǒng)的主要業(yè)務(wù)功能是：用戶注冊與登錄模塊、照片與相冊相關(guān)功能模塊、需求與回應(yīng)相關(guān)功能模塊。以及其他的業(yè)務(wù)功能比如菜單模塊、收藏模塊、點(diǎn)贊模塊、公告模塊等，是系統(tǒng)的附屬功能，主要考慮如何滿足相應(yīng)業(yè)務(wù)功能的需求或做的更佳完善。

數(shù)據(jù)表詳細(xì)設(shè)計(jì)

用賬戶表users的具體結(jié)構(gòu)，users表用于存儲MutualPic的賬戶信息。

相冊表photogroups的詳細(xì)字段設(shè)計(jì)，photogroups表用來表示用戶創(chuàng)建的相冊，并標(biāo)注該相冊內(nèi)圖片素材的地點(diǎn)、描述等信息。

照片（圖片素材）表photos的詳細(xì)字段設(shè)計(jì)，photos表用來記錄用戶上傳的照片或圖片素材的存儲路徑已經(jīng)所屬相冊，以便在客戶端顯示時獲取圖片路徑以及素材的相關(guān)信息。

需求表requests的詳細(xì)字段設(shè)計(jì)，根據(jù)用戶的需求以便平臺推薦圖片素材或其他用戶查看需求信息并做出回應(yīng)。

回應(yīng)表responses的詳細(xì)字段設(shè)計(jì)，responses表記錄哪個用戶（user）用其發(fā)布的哪一個相冊（photogroup）來回應(yīng)哪一個需求。

4 多客戶端界面設(shè)計(jì)

MutualPic作為一個照片代拍系統(tǒng)，主要數(shù)據(jù)是圖片信息，其Web前端設(shè)計(jì)的視覺效果必然十分重要，且代拍照系統(tǒng)針對的主要用戶是移動端用戶，在Web前端設(shè)計(jì)時應(yīng)用響應(yīng)式設(shè)計(jì)也是必然的。同時由于帶拍照系統(tǒng)主要面對移動端客戶，也將調(diào)用API接口制作一個Android客戶端應(yīng)用，不僅作為一個簡易的、臨時的App也可以為后期的運(yùn)維者或開發(fā)者提供API調(diào)用的示例，所以多用戶界面設(shè)計(jì)分為Web前端界面設(shè)計(jì)和Android界面設(shè)計(jì)。

4.1 Web前端界面設(shè)計(jì)

（1）首頁設(shè)計(jì)

MutualPic系統(tǒng)Web前端首頁作為一個圖片類平臺的主展示頁面，在設(shè)計(jì)上要做到雅觀、大氣，功能菜單簡單明了，主要功能布局突出，展示信息量全而優(yōu);并且在首頁設(shè)計(jì)時就要考慮到前端的主題風(fēng)格，并設(shè)計(jì)出一些公用的代碼片段、樣式文件、腳本文件以統(tǒng)一風(fēng)格。

（2）相冊列表界面設(shè)計(jì)

相冊列表界面要做到分類齊全，搜索簡便，相冊信息以及相冊相關(guān)操作按鈕視覺效果突出。

（3）相片展示界面設(shè)計(jì)

相冊展示針對已登錄用戶與未登錄用戶提供不同的操作按鈕，并需要擁有視覺效果良好的展示和輪播效果。

（4）需求列表界面設(shè)計(jì)

相冊列表界面要做到搜索簡便，需求信息以及回應(yīng)需求的操作按鈕視覺效果突出，并提供相關(guān)推薦。

（5）用戶面板界面設(shè)計(jì)

用戶面板要做到信息完整，功能鏈接布局突出、分類規(guī)整、鏈接有效。

（6）注冊登錄界面設(shè)計(jì)

登錄注冊界面設(shè)計(jì)做到操作簡單，需填寫的表單字段表達(dá)清楚，能夠做到注冊快捷、登錄簡便。

（7）使用幫助界面設(shè)計(jì)

幫助界面采用簡單的針對功能的提問鏈接，并放棄傳統(tǒng)的冗長的文字說明采用實(shí)際操作截圖進(jìn)行說明。

4.2 Android界面設(shè)計(jì)

由于帶拍照系統(tǒng)主要面對移動端客戶，本說明書雖然主要針對系統(tǒng)開發(fā)，但也將調(diào)用API接口制作一個Android客戶端應(yīng)用，不僅作為一個簡易的、臨時的App也可以為后期的運(yùn)維者或開發(fā)者提供API調(diào)用的示例，Android客戶端主要界面設(shè)計(jì)也分為主界面設(shè)計(jì)和賬戶頁面設(shè)計(jì)。

4.3 管理系統(tǒng)界面設(shè)計(jì)

管理系統(tǒng)雖不屬于客戶端，但其界面統(tǒng)一，設(shè)計(jì)成本低，因此不另作一節(jié)，而在本節(jié)進(jìn)行簡要的界面設(shè)計(jì)。

（1）業(yè)務(wù)功能管理數(shù)據(jù)表模板界面

業(yè)務(wù)功能管理的界面模板采用左側(cè)分欄菜單，右側(cè)數(shù)據(jù)功能記錄表以及相關(guān)條目操作的形式，以此做到管理視覺明朗易讀、風(fēng)格統(tǒng)一的效果。

（2）相冊、照片管理界面

照片與相冊功能模塊的管理界面與普通的管理界面不同，需要顯示圖片縮略圖，因此設(shè)計(jì)不同的界面模板。

（3）菜單管理界面

菜單管理界面實(shí)現(xiàn)管理員對MutualPic系統(tǒng)管理面板左側(cè)的分欄菜單進(jìn)行自定義調(diào)整，要求界面能夠?qū)崿F(xiàn)可拖拽功能。

（4）登錄界面

后端管理系統(tǒng)登錄界面設(shè)計(jì)做到操作簡單，需填寫的表單字段表達(dá)清楚，能夠做到登錄簡便快捷。

5 結(jié)束語

本文介紹了MutualPic代拍照片系統(tǒng)的分析與設(shè)計(jì)過程，主要講解了系統(tǒng)功能概要設(shè)計(jì)、系統(tǒng)架構(gòu)分析設(shè)計(jì)、數(shù)據(jù)庫分析與API接口功能設(shè)計(jì)、多客戶端界面設(shè)計(jì)。文中設(shè)計(jì)了系統(tǒng)的注冊和登錄，可以通過平臺搜索引擎能夠直接尋找自己需要的圖片素材。并通過用戶這一角色能夠享有平臺數(shù)據(jù);還可以進(jìn)行數(shù)據(jù)總覽、用戶數(shù)據(jù)分類管理、用戶信息修改;以及用戶反饋的提交等功能。但是由于筆者能力水平有限，本文只是對系統(tǒng)進(jìn)行分析與設(shè)計(jì)，為了進(jìn)一步滿足了用戶需求，還進(jìn)一步完善和實(shí)現(xiàn)系統(tǒng)的功能。

【參考文獻(xiàn)】

[1]劉國旭.LAMP架構(gòu)下的企業(yè)網(wǎng)站開發(fā)[D].吉林大學(xué)，2013.

[2]陳昊，陳遠(yuǎn)征，陶業(yè)榮，等.Laravel框架關(guān)鍵技術(shù)解析[M].北京：電子工業(yè)出版社，2016：3.

[3]趙超鴻.利用JSON構(gòu)建Android終端的Web API[J].中國信息技術(shù)教育，2015（05）：74-77.