企業(yè)做網(wǎng)站界面設(shè)計中基于符號學(xué)的設(shè)計元素提取方法

發(fā)布：2019-03-12 21:07:20 瀏覽：5355

在界面設(shè)計的應(yīng)用領(lǐng)域,網(wǎng)易、騰訊等大型互聯(lián)網(wǎng)公司多次提出以情緒板設(shè)計方法進(jìn)行設(shè)計創(chuàng)意。根據(jù)情緒板設(shè)計方法,設(shè)計實現(xiàn)的過程為根據(jù)意向語義尋找參考圖像,并從參考圖像中提取設(shè)計元素進(jìn)行設(shè)計。在實際應(yīng)用中發(fā)現(xiàn),對于從參考圖像進(jìn)行設(shè)計元素提取的過程主要依賴于設(shè)計師的經(jīng)驗積累或直覺獲取,過程較為抽象,具有不確定性。所以需要為設(shè)計者提供從視覺圖像中提取設(shè)計元素的參考方法。

一、設(shè)計元素的符號學(xué)解讀

從圖像中提取設(shè)計元素的過程是通過材料刺激來驅(qū)動思考的過程,是將抽象的視覺感受轉(zhuǎn)化為具象的設(shè)計元素的創(chuàng)意思考過程。符號學(xué)是設(shè)計過程中重要的方法論,包含了許多思考途徑,為設(shè)計師提供了重要的參考方式。軟件界面設(shè)計中包括了小圖標(biāo)的設(shè)計、文字排版、頁面布局、色彩等設(shè)計元素,這些設(shè)計元素本身就是一種符號。所以對于界面設(shè)計中設(shè)計元素的提取,可參考符號學(xué)的角度分類。

根據(jù)符號學(xué)特征,將設(shè)計符號分為語意,語境,語用,語構(gòu)成四個維度:語意在界面設(shè)計中表現(xiàn)為通過圖標(biāo)、構(gòu)圖形式等設(shè)計所表達(dá)出產(chǎn)品所具有的功能性,如頁面跳轉(zhuǎn)功能、上下左右滑動功能,以及各個小圖標(biāo)表達(dá)出的購物籃、個人中心等具體使用功能;語境研究的是設(shè)計中符號的區(qū)域性與時代性,是社會化的考慮范疇,由于區(qū)域和時代的劃分,用戶對相同事物的認(rèn)知會隨時空和區(qū)域的不同而有所區(qū)別;語用研究的是用戶的使用經(jīng)驗、習(xí)慣等因素對于設(shè)計元素使用的影響,符合用戶使用習(xí)慣的設(shè)計能夠提升用戶對產(chǎn)品的認(rèn)知度;語構(gòu)研究的是視覺圖像的構(gòu)成形式,通過對視覺參考圖像的提煉概括、變異修飾、分解再構(gòu)等設(shè)計手法,通過對原有的參考圖像在表現(xiàn)形態(tài)方面的變換,得出適合的設(shè)計元素。

二、設(shè)計元素提取原則

在進(jìn)行元素轉(zhuǎn)化時,首先設(shè)計師要收集資料,對產(chǎn)品目標(biāo)和用戶需求有深刻的理解,在大腦中形成相應(yīng)目標(biāo)體系,包括目標(biāo)人群喜好、產(chǎn)品風(fēng)格特征以及產(chǎn)品核心價值觀等一系列的約束與期望,這些約束與期望就是產(chǎn)品的符號學(xué)語境。然后,設(shè)計師應(yīng)從產(chǎn)品的語用功能和語意出發(fā),結(jié)合元素的語構(gòu)特征,設(shè)計出符合需求的作品。最后從符號學(xué)語構(gòu)角度進(jìn)行設(shè)計元素的提取,并將其向圖案、色彩、構(gòu)圖等設(shè)計要素進(jìn)行映射。接下來提出具體設(shè)計元素提取方法。

(一)圖形線條提取

在界面設(shè)計中的圖形設(shè)計元素提取過程中,首先要分析圖片素材的特征,根據(jù)符號學(xué)特性進(jìn)行映射。根據(jù)符號學(xué)理論,設(shè)計符號學(xué)映射分為顯性映射和隱性映射。其中,顯性映射主要適用于紋理可直接用在界面設(shè)計中的圖片,通常是作為APP的背景底紋素材;隱性映射為通過常用的設(shè)計方法對視覺圖案進(jìn)行再創(chuàng)造,適用于較為復(fù)雜的圖案,一般參考原型為生活中的實體物品,設(shè)計師通過提取輪廓線,對其簡化、夸張變形、重復(fù)等手段對其再設(shè)計,作為界面設(shè)計中的圖標(biāo)或裝飾元素。

(二)色彩的提取

依據(jù)界面設(shè)計的風(fēng)格,選取能夠表達(dá)相應(yīng)設(shè)計風(fēng)格的圖片。從圖像中選取顏色可通過Photoshop軟件來完成,使用Photoshop中“存儲為Web和設(shè)備所用格式”的方法,顏色選擇為4種或8種顏色得到色彩方案。

(三)構(gòu)圖形式的提取

構(gòu)圖形式的產(chǎn)生需要根據(jù)圖片素材的構(gòu)圖形式來推測相應(yīng)的排版來完成。具體參考方法為:根據(jù)設(shè)計的主題風(fēng)格和功能需求,構(gòu)建整體范圍的外形線為界面邊界,將專題內(nèi)容依據(jù)信息層級填充進(jìn)較大的圖形輪廓中。