《基于用戶體驗(yàn)的移動(dòng)終端UI設(shè)計(jì)》8000字

基于用戶體驗(yàn)的移動(dòng)終端UI設(shè)計(jì)目錄TOC\o"1-3"\h\u186201緒論 1109821.1研究背景 1109681.2研究意義 1293401.3關(guān)于用戶體驗(yàn)的研究 1214272基于用戶體驗(yàn)的移動(dòng)終端UI設(shè)計(jì)以滴滴為例 265842.1滴滴理財(cái)用戶界面視覺要素分析 352422.1.1理財(cái)業(yè)務(wù)UI視覺要素分析 4255232.1.2保險(xiǎn)業(yè)務(wù)UI視覺要素分析 614682.2滴滴理財(cái)用戶界面形象差異化分析 9179022.2.1滴滴理財(cái)用戶界面形象共同點(diǎn)分析 9210292.2.3滴滴理財(cái)用戶界面形象差異化設(shè)計(jì)需求 9184453滴滴理財(cái)U(kuò)I設(shè)計(jì)展開 10214693.1滴滴金融的信息架構(gòu) 10287423.1.1滴滴金融功能系統(tǒng)圖 105583.1.2滴滴金融的信息架構(gòu) 11253423.2滴滴金融用戶界面設(shè)計(jì)展開 12228193.2.1UI組件設(shè)計(jì) 12226303.2.2產(chǎn)品界面設(shè)計(jì) 15294913.3滴滴金融差異化設(shè)計(jì) 16245743.3.1運(yùn)營(yíng)視覺樣式設(shè)計(jì) 1633853.3.2運(yùn)營(yíng)版式設(shè)計(jì)規(guī)范 19269133.4優(yōu)化設(shè)計(jì)評(píng)估 2112111結(jié)論 23266參考文獻(xiàn) 241緒論1.1研究背景我們的金融體系后來建立起來，然后開始運(yùn)作。加上監(jiān)管體系不完善和信息不對(duì)稱，直接融資在很多方面難以滿足許多公司的財(cái)務(wù)需求。因此，通過交易銀行平臺(tái)進(jìn)行間接融資已成為中國(guó)企業(yè)最重要的融資方式。間接金融占據(jù)著金融體系的中心地位，逐漸決定著金融體系的平衡與穩(wěn)定。因此，金融謠言對(duì)商業(yè)銀行的影響越來越明顯。然而，隨著中國(guó)多階段資本市場(chǎng)和監(jiān)管體系的不斷創(chuàng)新，個(gè)人投資者、企業(yè)、投融資渠道不再局限于商業(yè)銀行平臺(tái)，金融產(chǎn)品的選擇更加廣泛，而是有了更廣泛的選擇，現(xiàn)代社會(huì)是互聯(lián)網(wǎng)信息社會(huì)。手機(jī)越來越受歡迎，現(xiàn)在手機(jī)對(duì)我們的生活至關(guān)重要。在這個(gè)互聯(lián)網(wǎng)飛速發(fā)展的時(shí)代，應(yīng)用的優(yōu)勢(shì)正在逐步提升。例如，開發(fā)的微信息平臺(tái)和視頻應(yīng)用平臺(tái)就是應(yīng)用思維的具體實(shí)例。如果想要在眾多應(yīng)用軟件占據(jù)主導(dǎo)地位，就必須了解其使用者真正需要什么，如果我們了解問題的具體需求，我們就能創(chuàng)建一個(gè)真正滿足用戶偏好的應(yīng)用程序。您可以理解過于復(fù)雜和過于簡(jiǎn)單的功能的重要性。軟件工程的“需求分析”決定了計(jì)算機(jī)的“功能”和預(yù)期結(jié)果。創(chuàng)建精確的應(yīng)用程序時(shí)，需要在創(chuàng)建系統(tǒng)之前執(zhí)行需求分析。需求分析對(duì)程序員來說也很重要。應(yīng)用軟件的主要目的是滿足網(wǎng)絡(luò)技術(shù)發(fā)展和互聯(lián)網(wǎng)通信時(shí)代對(duì)互聯(lián)網(wǎng)產(chǎn)品的原始意圖和簡(jiǎn)化需求。1.2研究意義電子銀行的出現(xiàn)和發(fā)展可以說已經(jīng)突破了傳統(tǒng)銀行業(yè)務(wù)的一些限制因素，可以隨時(shí)隨地、以任何方式為客戶提供金融服務(wù)，這些有利條件不僅能夠增加、吸引和留住客戶。在另外一方面對(duì)開辟新的利潤(rùn)來源也有著舉足輕重的意義，得到好處的不僅僅是客戶，隨著電子銀行的推出，移動(dòng)軟件應(yīng)用在人們的生活中扮演著越來越重要的角色，其發(fā)展也備受關(guān)注。主要原因是與PC軟件相比，移動(dòng)應(yīng)用程序可以為您提供高效、省時(shí)和無(wú)限制的放置。因此，開發(fā)不同的應(yīng)用程序變得尤為重要。人們的生活變得更加實(shí)際和容易，提高工作效率和節(jié)省時(shí)間。UI項(xiàng)目的主要目標(biāo)是為客戶提供“快速”的移動(dòng)體驗(yàn)，這是本文的重點(diǎn)。從用戶體驗(yàn)的角度來看，基于移動(dòng)設(shè)備的UI設(shè)計(jì)必須滿足當(dāng)前的需求，確保UI設(shè)計(jì)的完整性。1.3關(guān)于用戶體驗(yàn)的研究根據(jù)上圖所示，我們可以發(fā)現(xiàn)從用戶體驗(yàn)的角度出發(fā)，日本和國(guó)外的研究人員對(duì)基于用戶體驗(yàn)的用戶體驗(yàn)元素、設(shè)計(jì)原則和應(yīng)用進(jìn)行了一系列研究。對(duì)基于用戶體驗(yàn)理論的界面設(shè)計(jì)實(shí)踐進(jìn)行了較為深入的探討，對(duì)金融服務(wù)用戶的研究較少，對(duì)互聯(lián)網(wǎng)金融服務(wù)用戶的開發(fā)和實(shí)驗(yàn)體驗(yàn)不足。隨著信息技術(shù)的飛速發(fā)展，信息傳輸?shù)乃俣燃涌?，信息傳輸更加便利。信息極大地減少了它的不對(duì)稱性。顯然，貴陽(yáng)銀行必須克服有效利用信息的時(shí)代。直接金融市場(chǎng)的快速發(fā)展為企業(yè)提供了廣泛的融資選擇。2基于用戶體驗(yàn)的移動(dòng)終端UI設(shè)計(jì)以滴滴為例滴滴理財(cái)U(kuò)I優(yōu)化設(shè)計(jì)需求滴滴理財(cái)U(kuò)I優(yōu)化設(shè)計(jì)需求滴滴理財(cái)U(kuò)I視覺要素分析滴滴理財(cái)U(kuò)I形象差異化分析差異點(diǎn)聯(lián)想共同點(diǎn)聯(lián)想信貸業(yè)務(wù)UI視覺要素分析保險(xiǎn)業(yè)務(wù)UI視覺要素分析理財(cái)業(yè)務(wù)UI視覺要素分析運(yùn)營(yíng)界面產(chǎn)品界面用戶界面形象差異化需求用戶界面視覺優(yōu)化需求圖2-1滴滴理財(cái)用戶界面視覺形象要素解析路線圖上圖軟件運(yùn)行信息思維導(dǎo)圖，首先，根據(jù)界面的不同功能和業(yè)務(wù)屬性，分析了droplet財(cái)務(wù)管理界面和競(jìng)爭(zhēng)產(chǎn)品的要素。結(jié)合液滴財(cái)務(wù)管理界面視覺元素的分析結(jié)果，連接了財(cái)務(wù)管理液滴界面的視覺設(shè)計(jì)點(diǎn)，總結(jié)了財(cái)務(wù)管理液滴界面的優(yōu)化設(shè)計(jì)要求。2.1滴滴理財(cái)用戶界面視覺要素分析在圖2-2中有UI工設(shè)計(jì)要素具體信息情況，用戶界面可視化設(shè)計(jì)的用戶界面元素可分為創(chuàng)建產(chǎn)品組存儲(chǔ)庫(kù)的產(chǎn)品界面設(shè)計(jì)元素，以及產(chǎn)品和用戶界面的界面設(shè)計(jì)。組件庫(kù)包括圖標(biāo)、圖形樣式、字體、顏色規(guī)格等等，以實(shí)現(xiàn)統(tǒng)一的界面設(shè)計(jì)，提高開發(fā)人員的工作效率。用戶界面UI設(shè)計(jì)元素包括視覺設(shè)計(jì)風(fēng)格和基于設(shè)計(jì)規(guī)范的設(shè)計(jì)。此外，我們還分析了針織金融產(chǎn)品的視覺元素和用戶界面的視覺元素。圖2-2UI工設(shè)計(jì)要素2.1.1理財(cái)業(yè)務(wù)UI視覺要素分析a.產(chǎn)品UI財(cái)務(wù)管理界面除了作為財(cái)務(wù)管理示例的頂部控制字段外，還以列表的形式顯示。頁(yè)面結(jié)構(gòu)簡(jiǎn)單，沒有節(jié)奏感。感興趣的信息數(shù)量以橙色DIN字體顯示，它將關(guān)注產(chǎn)品的賣點(diǎn)，因此你不會(huì)感到無(wú)聊。在本文檔中，一個(gè)詳細(xì)的界面以簡(jiǎn)潔透明的列表形式顯示在藍(lán)色的“購(gòu)買”按鈕下方。京東金融滴滴金桔寶螞蟻財(cái)富圖2-3理財(cái)產(chǎn)品界面U工設(shè)計(jì)對(duì)比分析使用相應(yīng)的競(jìng)爭(zhēng)界面圖2-3對(duì)現(xiàn)有產(chǎn)品界面進(jìn)行比較和分析，并比較主頁(yè)、京東金融基金和螞蟻基金詳情頁(yè)面以及金融產(chǎn)品。與a、B和C相比，滴滴金桔寶界面比競(jìng)爭(zhēng)產(chǎn)品更為空白。內(nèi)容并不豐富，因?yàn)闆]有人物或標(biāo)題。當(dāng)比較D部分和F部分的細(xì)節(jié)時(shí)，界面是以圖表的形式直觀地表示產(chǎn)品細(xì)節(jié)，而不是簡(jiǎn)單的文本描述。購(gòu)買按鈕和邏輯界面的顏色不匹配，而左側(cè)購(gòu)買按鈕上競(jìng)爭(zhēng)對(duì)手的產(chǎn)品界面設(shè)置為服務(wù)或計(jì)算器的輸入。b.運(yùn)營(yíng)UI京東金融螞蟻財(cái)富滴滴金桔寶圖2-4理財(cái)運(yùn)營(yíng)界面U工設(shè)計(jì)對(duì)比分析上圖中是資產(chǎn)管理的用戶界面與競(jìng)爭(zhēng)產(chǎn)品進(jìn)行了比較。首先，對(duì)于包含日志的布局沒有合理的規(guī)范。圖標(biāo)布局、圖標(biāo)繪畫風(fēng)格和品牌視覺基調(diào)沒有明確的統(tǒng)一。因此，作為一個(gè)創(chuàng)新和受歡迎的機(jī)構(gòu)，黃金多珠寶用戶界面并沒有得到許多金融產(chǎn)品的認(rèn)可。通過觀察競(jìng)爭(zhēng)產(chǎn)品的用戶界面，可以看出其基本圖像的設(shè)計(jì)比真實(shí)圖像或合成圖像中的“Kimbo”具有更多的視覺效果。此外，競(jìng)爭(zhēng)產(chǎn)品的視覺節(jié)奏更注重字體設(shè)計(jì)，讓用戶驚嘆并產(chǎn)生共鳴。2.1.2保險(xiǎn)業(yè)務(wù)UI視覺要素分析a.產(chǎn)品UI如下圖2-5所示，滴管保險(xiǎn)系統(tǒng)的主頁(yè)上有一個(gè)頂級(jí)單杠、金剛圖標(biāo)、倫巴和推薦產(chǎn)品的列表。圖a和圖b顯示，缺乏嚴(yán)格的規(guī)劃和用戶評(píng)分是無(wú)法感覺到的。比較C語(yǔ)言視覺規(guī)劃和微博，通過軟顏色向量的插圖建立友好、溫暖的產(chǎn)品形象。D的主頁(yè)上有淺藍(lán)色浮雕圖像圖標(biāo)。與競(jìng)爭(zhēng)產(chǎn)品E和F的線性符號(hào)相比，體積不足，但可以收集用戶的注意力。騰訊維保滴滴車險(xiǎn)京東金融保險(xiǎn)首頁(yè)保險(xiǎn)首頁(yè)車險(xiǎn)圖2-5保險(xiǎn)產(chǎn)品界面U工設(shè)計(jì)對(duì)比分析b.運(yùn)營(yíng)UI通過對(duì)運(yùn)營(yíng)界面用戶界面和競(jìng)爭(zhēng)產(chǎn)品的對(duì)比分析，如下圖中所示a、B和C發(fā)現(xiàn)“版本UI”用戶界面的設(shè)計(jì)缺失，視覺風(fēng)格存在重要差異。保險(xiǎn)用戶在競(jìng)爭(zhēng)方面難以準(zhǔn)確理解保險(xiǎn)產(chǎn)品的形象，北京部分金融界面和部分金融界面正充分利用紅色、紫色等進(jìn)步元素，營(yíng)造活躍氛圍。UI仍然采用溫暖的視覺設(shè)計(jì)插圖，加深了品牌在用戶心目中的影響力。京東金融螞蟻財(cái)富DE滴滴金桔寶ABC圖2-6保險(xiǎn)運(yùn)營(yíng)界面U工設(shè)計(jì)對(duì)比分析a.產(chǎn)品UI與前兩家業(yè)務(wù)相比，信用交易有一個(gè)特殊的問題。在提供客戶服務(wù)之前，您必須在貸款過程中獲得平臺(tái)貸款。平臺(tái)分析大量用戶的個(gè)人信息，并確定平臺(tái)是否可以向用戶提供貸款。用戶通常不愿向互聯(lián)網(wǎng)平臺(tái)提供個(gè)人數(shù)據(jù)。這種阻力主要是由于平臺(tái)不信任。因此，信貸產(chǎn)品的用戶界面必須提供專業(yè)且安全的用戶形象。螞蟻借唄滴滴滴水籌款京東白條圖2-7信貸產(chǎn)品界面U工設(shè)計(jì)對(duì)比分析如圖所示。通過對(duì)滴水貸、京東白條和螞蟻借唄等等貸款產(chǎn)品通常使用藍(lán)色。因?yàn)樗{(lán)色給人寧?kù)o、安全和科學(xué)的感覺。C和D、E指定的配額在接口中具有最高優(yōu)先級(jí)。b.運(yùn)營(yíng)UI如下圖情況所示，將a部分與圖中的京東金融交易UI項(xiàng)目進(jìn)行比較。紅紫顏色系統(tǒng)逐漸配置為顯示用戶的活動(dòng)環(huán)境并點(diǎn)擊所需，可以看出界面設(shè)計(jì)界面相對(duì)統(tǒng)一?？梢园l(fā)現(xiàn)C和D是日常活動(dòng)是藍(lán)色，通常用于合成真實(shí)圖像。B部分中顯示了主要用于限制節(jié)日的活動(dòng)，并在必要時(shí)添加節(jié)日元素。與之前關(guān)于金融和保險(xiǎn)管理的研究一樣，信貸交易用戶界面的設(shè)計(jì)缺乏足夠的設(shè)計(jì)規(guī)范。單一的視聽界面允許用戶交流專業(yè)的心理情緒。京東白條滴水籌螞蟻借唄圖2-8信貸運(yùn)營(yíng)界面U工設(shè)計(jì)對(duì)比分析2.2滴滴理財(cái)用戶界面形象差異化分析滴滴理財(cái)?shù)呢?cái)富管理用戶界面形象的不對(duì)稱是基于其在前面章節(jié)中對(duì)商業(yè)設(shè)計(jì)元素和競(jìng)爭(zhēng)對(duì)手的充分理解。根據(jù)傳統(tǒng)設(shè)計(jì)方法、用戶界面形象、一致性和設(shè)計(jì)有效性之間的差異，業(yè)務(wù)界面設(shè)計(jì)需要實(shí)現(xiàn)共同的功能。調(diào)查和觀察結(jié)果表明，財(cái)務(wù)管理水平的下降是識(shí)別用戶界面圖像的起點(diǎn)。2.2.1滴滴理財(cái)用戶界面形象共同點(diǎn)分析品牌關(guān)聯(lián)的一般視圖需要滿足同行業(yè)的產(chǎn)品或滿足用戶可接受間隔的標(biāo)準(zhǔn)。通過對(duì)界面管理框架和財(cái)富管理界面元素的綜合分析，闡明了UI組件庫(kù)財(cái)富管理結(jié)構(gòu)的相似性。根據(jù)一致性和識(shí)別原則，UI模塊庫(kù)包含清晰的字符設(shè)計(jì)、統(tǒng)一的字體樣式等。2.2.3滴滴理財(cái)用戶界面形象差異化設(shè)計(jì)需求3滴滴理財(cái)U(kuò)I設(shè)計(jì)展開可以以滴滴理財(cái)應(yīng)用軟件（UI）的發(fā)展設(shè)計(jì)一個(gè)用戶滿意的的設(shè)計(jì)方案，進(jìn)行設(shè)計(jì)任務(wù)的分類。如下圖所示。我的構(gòu)建滴滴金融UI組件庫(kù)我的構(gòu)建滴滴金融UI組件庫(kù)icon表單字體色彩構(gòu)建滴滴金融信息架構(gòu)圖構(gòu)建滴滴金融功能結(jié)構(gòu)圖滴滴金融首頁(yè)保險(xiǎn)首頁(yè)理財(cái)首頁(yè)信貸首頁(yè)滴滴金融產(chǎn)品界面設(shè)計(jì)活動(dòng)頁(yè)版式設(shè)計(jì)規(guī)范banner版式設(shè)計(jì)規(guī)范滴滴金融版式設(shè)計(jì)規(guī)范優(yōu)化設(shè)計(jì)評(píng)估保險(xiǎn)運(yùn)營(yíng)視覺樣式信貸運(yùn)營(yíng)視覺樣式設(shè)計(jì)任務(wù)A-1A-2A-3理財(cái)運(yùn)營(yíng)視覺樣式設(shè)計(jì)任務(wù)A-4設(shè)計(jì)任務(wù)C設(shè)計(jì)任務(wù)D設(shè)計(jì)任務(wù)E設(shè)計(jì)任務(wù)B滴滴金融差異化設(shè)計(jì)圖4-1滴滴理財(cái)U(kuò)工差異化設(shè)計(jì)展開技術(shù)路線首先，結(jié)合滴滴金融業(yè)務(wù)，確定金融應(yīng)用的app功能配置，建立cap金融信息流程圖，為基于此標(biāo)準(zhǔn)建立金融產(chǎn)品之間的接口開辟道路。遵循設(shè)計(jì)任務(wù)清單，作為滿足用戶需求的工具，完成金融產(chǎn)品界面的開發(fā)。根據(jù)任務(wù)清單草案，我們建立了一個(gè)可視化設(shè)計(jì)系統(tǒng)，能夠區(qū)分融資渠道，同時(shí)將輸出應(yīng)用于業(yè)務(wù)渠道設(shè)計(jì)規(guī)范，以實(shí)現(xiàn)視覺差異化設(shè)計(jì)，在滴滴金融界面上的客戶形象差異識(shí)別。3.1滴滴金融的信息架構(gòu)3.1.1滴滴金融功能系統(tǒng)圖功能結(jié)構(gòu)圖是按照功能的從屬關(guān)系畫成的圖表，圖中每一個(gè)節(jié)點(diǎn)都稱為一個(gè)功能模塊。功能結(jié)構(gòu)圖是產(chǎn)品概念化階段的初期輸出。把原來存在滴滴主端APP上的金融功能業(yè)務(wù)進(jìn)行創(chuàng)新，改革形成一個(gè)單獨(dú)的應(yīng)用軟件。對(duì)滴滴金融軟件應(yīng)用進(jìn)行業(yè)務(wù)管理，建立滴滴金融功能結(jié)構(gòu)圖。下圖具體是滴滴金融功能結(jié)構(gòu)圖，主要分為應(yīng)用首頁(yè)、金融理財(cái)業(yè)務(wù)、保險(xiǎn)、信貸和個(gè)人信息界面等等。圖4-2滴滴金融功能結(jié)構(gòu)圖3.1.2滴滴金融的信息架構(gòu)簡(jiǎn)單的產(chǎn)品配置圖是產(chǎn)品結(jié)構(gòu)信息和原型信息的表示。它可以作為早期開發(fā)產(chǎn)品原型的替代品。這使設(shè)計(jì)師能夠清楚地勾勒出帆布機(jī)的基本外觀，因?yàn)樗梢詣?chuàng)建一個(gè)分區(qū)結(jié)構(gòu)和一個(gè)用于溺水的財(cái)務(wù)接口圖。完整的產(chǎn)品結(jié)構(gòu)可以極大地提高設(shè)計(jì)效率，是產(chǎn)品原型準(zhǔn)備的重要依據(jù)。下圖中是滴滴金融基本產(chǎn)品架構(gòu)信息。圖4-3滴滴金融產(chǎn)品信息架構(gòu)3.2滴滴金融用戶界面設(shè)計(jì)展開3.2.1UI組件設(shè)計(jì)根據(jù)之前對(duì)金融和競(jìng)爭(zhēng)產(chǎn)品UI元素的觀察和分析，以及通過用戶調(diào)研獲得的設(shè)計(jì)要求，金融團(tuán)隊(duì)在UI設(shè)計(jì)原則的指導(dǎo)下通過了金融應(yīng)用的u組件設(shè)計(jì)方案。a.色彩規(guī)范如下圖，在圖中我們可以發(fā)現(xiàn)，其滴滴金融軟件應(yīng)用色彩的具體運(yùn)用情況，主要采用充滿科技感和安全感的藍(lán)色為主，再加以橙色作為暖色調(diào)進(jìn)行一個(gè)系統(tǒng)的結(jié)合。圖4-4滴滴金融品牌色彩界定一個(gè)產(chǎn)品的品牌主要可以分為子品牌和母品牌，下圖中品牌圖表說明了符合UI設(shè)計(jì)中統(tǒng)一UI設(shè)計(jì)原則的顏色規(guī)范，該原則必須與UI顏色規(guī)范顏色庫(kù)的顏色組件庫(kù)的顏色相匹配。金融產(chǎn)品用橙子來傳遞活力和財(cái)富。保險(xiǎn)產(chǎn)品可以根據(jù)藍(lán)色光譜顏色和友誼互動(dòng)的概念進(jìn)行調(diào)整。分割線的字體、符號(hào)和顏色采用藍(lán)灰色色調(diào)，反映了金融品牌無(wú)憂無(wú)慮的專業(yè)形象。圖4-5滴滴金融U工色彩規(guī)范b.字體樣式規(guī)范圖4-6顯示了三重界面的UI字體過程。產(chǎn)品界面的字體選擇必須符合金融產(chǎn)品的可讀性表示和穩(wěn)定可靠的屬性形式。選擇一種Apple（蘋果）字體。為了使用Apple（蘋果）字體作為發(fā)射器，用戶界面的字體大小如下圖4-7所示。Apple（蘋果）字體具有很高的通用性和可讀性。字體大小根據(jù)不同的優(yōu)先級(jí)確定，以確保界面的一致性，并符合UI設(shè)計(jì)原則。圖4-6滴滴金融U工字體樣式推演圖4-7滴滴金融U工字體樣式規(guī)范C.圖標(biāo)設(shè)計(jì)下圖中我們可以看到滴滴金融圖標(biāo)發(fā)展經(jīng)歷，以“車險(xiǎn)”圖表為例，在原有卡片的圖表基礎(chǔ)上，增加了科學(xué)、專業(yè)的長(zhǎng)方形設(shè)計(jì)，為用戶提供穩(wěn)定、嚴(yán)謹(jǐn)?shù)牟僮鳝h(huán)境。極簡(jiǎn)主義構(gòu)圖可以用于簡(jiǎn)單美觀的用戶界面顯示，并通過用戶協(xié)議逐個(gè)呈現(xiàn)。dropFund（滴滴金融圖標(biāo)）缺乏關(guān)鍵元素，dropdesignTone（滴滴金融設(shè)計(jì)）與母品牌協(xié)調(diào)，最終促進(jìn)圖標(biāo)設(shè)計(jì)的完成。極簡(jiǎn)圖4-8滴滴金融icon設(shè)計(jì)推演圖4-9顯示了基于一致性和識(shí)別原則的滴滴金融圖標(biāo)開發(fā)系統(tǒng)。菱形區(qū)域功能圖標(biāo)采用黑灰色矩形線性樣式，使用戶更加安全。應(yīng)用界面設(shè)計(jì)類似于直角線形樣式。同時(shí)，它也刷新了圖標(biāo)的整體視覺效果。界面底部的主圖標(biāo)圍繞間隙和矩形構(gòu)建，以反映穩(wěn)定性。同時(shí)，由于體積小于功能標(biāo)記，設(shè)計(jì)更簡(jiǎn)單。圖4-9滴滴金融iconU工裝配設(shè)計(jì)還包括輸入字段、按鈕、形狀和其他組件。長(zhǎng)度關(guān)系也顯示在以下高可靠性模型中。用戶界面模塊庫(kù)的建立是統(tǒng)一用戶界面設(shè)計(jì)的要求，這大大增加了設(shè)計(jì)人員的時(shí)間成本，對(duì)跟蹤設(shè)計(jì)有很大影響。3.2.2產(chǎn)品界面設(shè)計(jì)如圖所示。4-10，接口設(shè)計(jì)示例滴滴金融產(chǎn)品的示例基于之前研究和產(chǎn)品結(jié)構(gòu)模型設(shè)計(jì)的理論支持。上面的名片可以左右移動(dòng)來更改。如果卡處于非活動(dòng)狀態(tài)，則它處于最終科技感，需要用戶請(qǐng)求。軟件應(yīng)用首頁(yè)的表面采用了一種設(shè)計(jì)，這種設(shè)計(jì)改變了線條的紋理，提高了界面的質(zhì)量和技術(shù)感。在保證美感的前提下，盡可能強(qiáng)調(diào)配額、興趣等的好處，是用戶研究設(shè)計(jì)的基礎(chǔ)。該產(chǎn)品的封面代表的是真實(shí)的畫面，而不是向用戶傳達(dá)金融產(chǎn)品真實(shí)可信概念的照片。金融、金融和保險(xiǎn)業(yè)務(wù)的主界面采用橙色、藍(lán)色和藍(lán)色。用戶只能通過非業(yè)務(wù)界面識(shí)別產(chǎn)品。不同公司的設(shè)計(jì)是相同的。當(dāng)切換到菜單底部的選項(xiàng)卡時(shí)，保持用戶界面的調(diào)整，讓用戶有一種流暢的沖浪感覺。圓形按鈕形成地圖的角度和對(duì)比度，以形成界面布局的節(jié)奏。我的個(gè)人信息界面總結(jié)了用戶服務(wù)，解決了店鋪分散、滲透深度和需求困難的問題。首頁(yè)理財(cái)信貸保險(xiǎn)我圖4-10滴滴金融產(chǎn)品界面設(shè)計(jì)3.3滴滴金融差異化設(shè)計(jì)運(yùn)營(yíng)界面是體現(xiàn)產(chǎn)品個(gè)性化和可識(shí)別性的重要部分，運(yùn)營(yíng)界面是用戶增長(zhǎng)的必經(jīng)渠道，也是帶給很多用戶的第一印象，互聯(lián)網(wǎng)上成熟的移動(dòng)應(yīng)用不僅提供了一些高質(zhì)量的產(chǎn)品，而且對(duì)產(chǎn)品的識(shí)別也非常重要。滴滴金融應(yīng)用軟件的財(cái)務(wù)識(shí)別反映在商品和商標(biāo)之間的差異。3.3.1運(yùn)營(yíng)視覺樣式設(shè)計(jì)a.理財(cái)業(yè)務(wù)視覺樣式優(yōu)化后優(yōu)化前圖4-11理財(cái)業(yè)務(wù)運(yùn)營(yíng)視覺設(shè)計(jì)優(yōu)化視覺風(fēng)格的任何差異都必須基于產(chǎn)品本身的特點(diǎn)。經(jīng)過初步調(diào)查，得出結(jié)論，金融工具使用者選擇產(chǎn)品的直接原因是成本效益、安全性和穩(wěn)定性。圖4-11顯示了金融工具操作的視覺設(shè)計(jì)，這表明優(yōu)化設(shè)計(jì)的重點(diǎn)顯示了活躍的氛圍，并允許更廣泛的視覺感受，即教育。它還增加了敏感問題的重要性，例如行動(dòng)的數(shù)量和用戶的興趣。b.保險(xiǎn)產(chǎn)品視覺樣式保險(xiǎn)業(yè)務(wù)的視覺設(shè)計(jì)要求產(chǎn)品通過充當(dāng)用戶的監(jiān)護(hù)人來保護(hù)用戶的健康和財(cái)產(chǎn)。將IP符號(hào)設(shè)計(jì)引入保險(xiǎn)符號(hào)的視覺風(fēng)格，可以讓您準(zhǔn)確直觀地將各類保險(xiǎn)產(chǎn)品呈現(xiàn)在用戶面前，成為單向用戶的實(shí)用“朋友”。從IP特性的角度來看，產(chǎn)品信息比文本描述更容易解釋，用戶的閱讀成本也有所降低。下圖4-12。原型是一個(gè)典型的滴水驅(qū)動(dòng)裝置。帕格兄弟是一個(gè)知識(shí)產(chǎn)權(quán)角色，成熟的司機(jī)，老少皆宜。作為家庭的“支柱”，他從道安保險(xiǎn)公司獲得保險(xiǎn)。這種設(shè)計(jì)縮短了產(chǎn)品與用戶之間的距離，實(shí)現(xiàn)了與用戶的情感交流。除了產(chǎn)品的粘度外，鑒別也很容易。圖4-12保險(xiǎn)業(yè)務(wù)工P人物設(shè)計(jì)圖圖4-13顯示了IP字符在保險(xiǎn)業(yè)務(wù)的視覺設(shè)計(jì)和視覺表現(xiàn)中的應(yīng)用。它在更廣闊的場(chǎng)景中傳達(dá)了產(chǎn)品的情感定位，在一定程度上克服了保險(xiǎn)產(chǎn)品視覺設(shè)計(jì)同質(zhì)化的無(wú)序。優(yōu)化后優(yōu)化前圖4-13保險(xiǎn)業(yè)務(wù)運(yùn)營(yíng)視覺設(shè)計(jì)優(yōu)化C.信貸產(chǎn)品視覺樣式與保險(xiǎn)和金融產(chǎn)品相比，信貸是一種更嚴(yán)肅、更謹(jǐn)慎的產(chǎn)品。信用檢查和信用流程需要產(chǎn)品和用戶的信任。在信貸產(chǎn)品的視覺設(shè)計(jì)中，安全性和專業(yè)性是設(shè)計(jì)的基本要求。圖4-14顯示了優(yōu)化滴管貸款業(yè)務(wù)愿景的比較。優(yōu)化前的單杠設(shè)計(jì)不能像金融產(chǎn)品的視覺風(fēng)格那樣反映信貸產(chǎn)品的特點(diǎn)。優(yōu)化設(shè)計(jì)不僅提高了活動(dòng)的趣味性，還為圖像添加了真實(shí)的物理效果，改善了真實(shí)感知圖像的紋理，達(dá)到了保證信用交易安全性和專業(yè)意識(shí)的目的。優(yōu)化前優(yōu)化后圖4-14信貸業(yè)務(wù)運(yùn)營(yíng)視覺設(shè)計(jì)優(yōu)化3.3.2運(yùn)營(yíng)版式設(shè)計(jì)規(guī)范目前有廣泛使用的設(shè)計(jì)規(guī)則，可以以不同的方式實(shí)現(xiàn)金融交易。下文將描述液滴布置規(guī)范。標(biāo)準(zhǔn)的主動(dòng)界面設(shè)計(jì)采用黃金分割的理論和方法，界面的界面區(qū)分文本的創(chuàng)意區(qū)域，操作系統(tǒng)的設(shè)計(jì)以清晰的視角增強(qiáng)了設(shè)計(jì)的一致性和美感；易于加載信息。1.屏幕活動(dòng)通常，單屏幕有一個(gè)簡(jiǎn)單的運(yùn)用程序，可以根據(jù)需要分發(fā)到圖像的主要區(qū)域。圖4顯示了下面的4-15，只是為了減少活動(dòng)，并且通過更大的視覺圖像，地圖可以為用戶創(chuàng)造一種氛圍。B圖適用于信息經(jīng)常被復(fù)制的情況。將視圖與副本分離可以提高信息的可讀性。AB圖4-15滴滴金融單屏運(yùn)營(yíng)版式設(shè)計(jì)規(guī)范2.多屏幕活動(dòng)圖4-16顯示了多個(gè)屏幕活動(dòng)的視覺特征。由于活動(dòng)信息量大，品牌合同采用界面多識(shí)別度的方法，提高了品牌的識(shí)別水平以及單一標(biāo)準(zhǔn)的不同標(biāo)準(zhǔn)，可以根據(jù)視覺區(qū)域之間的活動(dòng)內(nèi)容百分比選擇多屏幕活動(dòng)，給定圖像和文本之間的百分比不應(yīng)超過任何屏幕。從長(zhǎng)遠(yuǎn)來看，可以使用用戶界面根據(jù)規(guī)則構(gòu)建系統(tǒng)。AB圖4-16滴滴金融多屏運(yùn)營(yíng)版式設(shè)計(jì)規(guī)范b.banner版式規(guī)范設(shè)計(jì)圖4-17顯示了面板的位置規(guī)則。通常顯示用于產(chǎn)品界面上顯示的水平字段操作的資源，作為活動(dòng)界面的輸入。因此，banner的設(shè)計(jì)必須調(diào)整，產(chǎn)品界面采用左右黃金分割的比例，但人們長(zhǎng)久以來已經(jīng)養(yǎng)成了屬于自己的閱讀習(xí)慣，養(yǎng)成了從左到右從上到下的順序，因?yàn)閎anner左邊為文案區(qū)域，右邊為視覺區(qū)域。圖4-17滴滴金融banner版式設(shè)計(jì)規(guī)范文案區(qū)域分為主標(biāo)題和副標(biāo)題，副標(biāo)題作為主標(biāo)題的附屬說明存在，字體統(tǒng)一為蘋方字體，主標(biāo)題字號(hào)40pt，副標(biāo)題字號(hào)32pto以上以活動(dòng)頁(yè)和banner為例對(duì)版式規(guī)范的設(shè)計(jì)進(jìn)行了說明，在規(guī)范中不僅對(duì)圖文比例進(jìn)行了說明，更對(duì)文字間距以及l(fā)og。大小等細(xì)節(jié)進(jìn)行了規(guī)范，因此，設(shè)計(jì)師可以在設(shè)計(jì)過程中形成結(jié)構(gòu)模板，大大縮短設(shè)計(jì)時(shí)間，形成用戶的閱讀習(xí)慣，獲得用戶感興趣的信息，降低閱讀成本。隨著設(shè)計(jì)相關(guān)案例的增多，設(shè)計(jì)規(guī)范也可以形成金融交易收費(fèi)體系，提高識(shí)別水平。3.4優(yōu)化設(shè)計(jì)評(píng)估評(píng)價(jià)優(yōu)化設(shè)計(jì)采用情感測(cè)量方法，選擇6個(gè)滴滴應(yīng)用軟件使用者進(jìn)行情感測(cè)量實(shí)驗(yàn)。用戶應(yīng)根據(jù)操作搜索“優(yōu)化”的金融用戶界面“滴水”，并在觀看這兩個(gè)圖表時(shí)檢查您當(dāng)前的情緒。完成任務(wù)并記錄實(shí)驗(yàn)結(jié)果。下圖中就是此次研究數(shù)據(jù)的具體情況。圖4-18滴滴理財(cái)U(kuò)工優(yōu)化設(shè)計(jì)評(píng)估進(jìn)行業(yè)務(wù)優(yōu)化后的設(shè)計(jì)方案具有更多令人愉快的表情和更少令人不快的表情，表明優(yōu)化后的滴滴金融UI設(shè)計(jì)方案比之前的方案具有更好的用戶體驗(yàn)。它優(yōu)化了財(cái)務(wù)用戶界面之后的滴滴理財(cái)設(shè)計(jì)。結(jié)論通過對(duì)滴滴金融應(yīng)用程序產(chǎn)品界面的優(yōu)化設(shè)計(jì)，它提供了產(chǎn)品保護(hù)和用戶界面，并整合了滴滴理財(cái)?shù)纳虡I(yè)產(chǎn)品。滴滴基金領(lǐng)域的UI項(xiàng)目不僅有統(tǒng)一的設(shè)計(jì)規(guī)則，而且對(duì)各個(gè)公司有直觀的理解。這將促進(jìn)品