產(chǎn)品定位

公司研發(fā)的分子光譜物質(zhì)鑒別與性質(zhì)感知技術(shù)，將分子光譜（包括中紅外、近紅外和拉曼等）與數(shù)據(jù)庫信息挖掘技術(shù)相結(jié)合，實現(xiàn)即時物質(zhì)鑒別與性質(zhì)測定，為油品快速分析而開發(fā)，具有檢測速度快、結(jié)果準(zhǔn)確、操作方便、維護(hù)簡單等優(yōu)點。

目標(biāo)用戶

西派特光譜多指標(biāo)快速分析軟件通過與先進(jìn)的定標(biāo)數(shù)據(jù)庫技術(shù)相結(jié)合，該儀器能檢測油品多種性能指標(biāo)的需求。適用于市場監(jiān)管部門及煉油、化工企業(yè)開展成品油快速篩查、原材料進(jìn)廠檢測、化驗室中控分析、加油站油品品質(zhì)監(jiān)控。

設(shè)計風(fēng)格

此次藍(lán)藍(lán)設(shè)計共為該軟件設(shè)計了四種方案，最終確定方案一。其主要風(fēng)格偏向簡潔大方，呈現(xiàn)嚴(yán)謹(jǐn)統(tǒng)一的視覺體驗，使界面更加干凈整潔。通過層級，大小，顏色，字體的區(qū)分在展現(xiàn)數(shù)據(jù)的清晰的同時，內(nèi)容層次分明，保留一定的空間感與呼吸感。

前期通過客戶提供的原型圖，藍(lán)藍(lán)設(shè)計人員為其提供四種設(shè)計方案供用戶選擇，效果圖如右圖所示。

方案一：簡約淡雅優(yōu)美，將?視覺關(guān)注點集中在信息本身。 ??分為?頭、背景圖、表格部分，形成空間層感。 表格設(shè)計不同尋常，層次清晰、現(xiàn)代。 表頭字體和內(nèi)?字體有深淺變化，重點突出。超標(biāo)或不達(dá)標(biāo)有圖符顯著示意。

方案二：本?案與之前設(shè)計的其它產(chǎn)品?格?致。顏?采?深灰為背景?、藍(lán)?為主?調(diào)，具有科技感，主背景使??業(yè)紋理的效果，體現(xiàn)?業(yè)精準(zhǔn)度。圖標(biāo)顏?和內(nèi)容顏?都是同??系，在體現(xiàn)科技感的同時，?不失穩(wěn)重。

方案三：藍(lán)?頂部?格下，其它細(xì)節(jié)表達(dá)?式的嘗試。

方案四：藍(lán)?頂部?格下，其它細(xì)節(jié)表達(dá)?式的嘗試。

藍(lán)藍(lán)設(shè)計人員將原型圖中的logo放置右側(cè)，讓用戶一眼看到，能夠加強品牌的感知度。

首頁功能區(qū)采用現(xiàn)在流行的扁平化風(fēng)格，檢測和數(shù)據(jù)圖標(biāo)融入代表行業(yè)屬性的設(shè)計元素，提升產(chǎn)品專業(yè)度。同時采用藍(lán)色，增強品牌認(rèn)知。

首頁主要展示檢測數(shù)據(jù)，該頁面數(shù)據(jù)與數(shù)據(jù)之間留有空白，同時重要信息用不同顏色的色塊進(jìn)行區(qū)分，將復(fù)雜的數(shù)據(jù)以清晰簡潔的方式呈現(xiàn)給用戶，提升用戶的產(chǎn)品體驗。

原型圖

該頁面為檢測頁面的僅采譜頁面。右側(cè)通過滑動滾動條可以看到更多編號信息，提升使用效率。數(shù)據(jù)列表時通過顏色深淺區(qū)分顯示是否點擊，使內(nèi)容層級明確。

我們可以看到原型圖中功能區(qū)放置左側(cè)，藍(lán)藍(lán)設(shè)計人員將功能區(qū)放置右側(cè)，這樣做的目的一是一般情況下人眼視覺重點在右側(cè)，更方便用戶操作；二是可以左右平衡，加強視覺比例。

原型圖

數(shù)據(jù)頁面用戶通過搜索框，輸入想查找的樣本。完成輸入后，即顯示相關(guān)樣本數(shù)據(jù)信息。通過點選數(shù)據(jù)，來進(jìn)行刪除、保持、打印的操作。

藍(lán)藍(lán)設(shè)計人員將原型圖右側(cè)中的查詢、刪除、保存、打印功能放置界面上面，即節(jié)省頁面的空間，又可以簡單高效的傳達(dá)給用戶，同時增強頁面的美觀性。

數(shù)據(jù)頁列表采取與檢測頁相同樣式的列表樣式，保證界面的統(tǒng)一規(guī)范，減少后期項目的開發(fā)成本。

原型圖

設(shè)置頁面包括基本參數(shù)、譜儀狀態(tài)、清洗參數(shù)和實時能量圖這四個功能板塊。

客戶提供的原型圖將三個功能橫向、圖表縱向的布局進(jìn)行擺放，藍(lán)藍(lán)設(shè)計人員將所有板塊縱向排列擺放，這樣做的目的是為了保持視覺的統(tǒng)一性，同時用戶看內(nèi)容信息也會更輕松，不易分散用戶的注意力。

原型圖