5個(gè)國外醫(yī)療網(wǎng)站設(shè)計(jì)及配色賞析

時(shí)間：2023-08-09 17:39:01 | 來源：網(wǎng)站運(yùn)營

時(shí)間：2023-08-09 17:39:01 來源：網(wǎng)站運(yùn)營

5個(gè)國外醫(yī)療網(wǎng)站設(shè)計(jì)及配色賞析：隨著人們對(duì)醫(yī)療健康認(rèn)識(shí)水平的提高，相關(guān)的醫(yī)療服務(wù)和醫(yī)療網(wǎng)站設(shè)計(jì)也在不斷規(guī)范化。從網(wǎng)站設(shè)計(jì)的角度來講，醫(yī)療網(wǎng)站對(duì)于醫(yī)療內(nèi)部來說就是連通整個(gè)醫(yī)院的信息高速公路；而對(duì)于患者來說，優(yōu)秀的規(guī)范化設(shè)計(jì)能更好的引導(dǎo)他們準(zhǔn)確快速的獲取醫(yī)療信息。




如何設(shè)計(jì)出優(yōu)秀的醫(yī)療網(wǎng)站呢？不妨看看一些優(yōu)秀的案例。




1. Weightmedics - 減肥類網(wǎng)站設(shè)計(jì)




地址：https://www.weightmedics.co.uk/index.html







設(shè)計(jì)特色：卡通風(fēng)格、扁平化設(shè)計(jì)、顏色搭配活潑淡雅




不同于一般的減肥網(wǎng)站，沒有密密麻麻的減肥套餐推薦，沒有夸張的瘦身前后對(duì)比圖。整體網(wǎng)站設(shè)計(jì)以卡通方式呈現(xiàn)，淡藍(lán)色的背景色搭配白色字體，簡潔淡雅。局部搭配的橙色調(diào)使網(wǎng)站活潑而不單調(diào)。




2. The Doctors Laser Clinic -醫(yī)療美容類網(wǎng)站設(shè)計(jì)




地址：https://laserdocs.co.uk/







設(shè)計(jì)特色：迎合女性審美、卡片式設(shè)計(jì)、優(yōu)雅紫色調(diào)為主




作為醫(yī)療美容類網(wǎng)站，大部分以女性顧客為主。所以懂得迎合女性審美，不僅僅是從產(chǎn)品服務(wù)，網(wǎng)站設(shè)計(jì)也必須能在第一眼獲得女性顧客的青睞。網(wǎng)站整體的紫色調(diào)優(yōu)雅大方，不同層次的紫色卡片設(shè)計(jì)能循序漸進(jìn)的對(duì)顧客進(jìn)行引導(dǎo)。CTA部分的設(shè)計(jì)以深紫色做為強(qiáng)調(diào)，吸引點(diǎn)擊，從而增加轉(zhuǎn)化。




3. Beauty is power; a smile is its sword - 牙醫(yī)類網(wǎng)站設(shè)計(jì)




地址：

https://dribbble.com/shots/4090230-Beauty-is-power-a-smile-is-its-sword-Dental-Website-Idea







設(shè)計(jì)特色：黑色背景突出網(wǎng)站主題、簡潔的黑白搭配，形成色調(diào)對(duì)比


正如這個(gè)網(wǎng)站的設(shè)計(jì)主題，微笑之美在于一口健康好牙。這個(gè)牙醫(yī)網(wǎng)站設(shè)計(jì)的特別之處在于它沒有常見的白大褂和擬人化的牙齒圖案來突出主題，而是采用較為抽象的微笑來展示設(shè)計(jì)概念。作為牙醫(yī)網(wǎng)站，也不失為很好的宣傳廣告。巧妙的顏色搭配使得網(wǎng)站中黑色部分設(shè)計(jì)并不沉悶，反而十分燦爛。




4. Tychee Training - Medical Training - 醫(yī)療類網(wǎng)站設(shè)計(jì)




地址：https://dribbble.com/shots/4688223-Tychee-Training-Medical-Training







設(shè)計(jì)特色：活潑的橙色調(diào)、插畫風(fēng)格、扁平化設(shè)計(jì)




網(wǎng)站背景色采用橙白搭配，使整個(gè)頁面看起來新鮮有活力。十分符合現(xiàn)代人追求的健康生活。首頁采用了時(shí)下流行的插畫風(fēng)格，結(jié)合扁平化網(wǎng)頁設(shè)計(jì)，給人溫暖活潑的感覺。




5. Psychologist - 心理健康網(wǎng)站設(shè)計(jì)




地址：

http://preview.themeforest.net/item/psychologist-personal-singlemulti-page-html-template-with-page-builder-and-admin-pages







設(shè)計(jì)特色：響應(yīng)式設(shè)計(jì)、HTML5、清新淡綠色調(diào)




整體網(wǎng)頁設(shè)計(jì)以淡綠色調(diào)為主，導(dǎo)航欄、字體、以及天空的顏色融為一體，是一個(gè)清新而又富有生命力的顏色。而網(wǎng)站響應(yīng)能力和卓越性能是促成轉(zhuǎn)化的一部分。作為心理健康類網(wǎng)頁設(shè)計(jì)的模板，也可以給新手提供一個(gè)很好的參考。




看了以上的案例分析，不知大家有沒有注意到一個(gè)共同點(diǎn)，就是對(duì)于醫(yī)療網(wǎng)站設(shè)計(jì)中顏色運(yùn)用的分析。




那么，在醫(yī)療類網(wǎng)站設(shè)計(jì)中，有哪些可以遵守的設(shè)計(jì)原則呢？




網(wǎng)站色調(diào)搭配是一個(gè)影響網(wǎng)頁的重要因素。不同的顏色會(huì)產(chǎn)生不同的效果。







（1）紅色：紅色會(huì)使人興奮，并且感到緊張不安。所以醫(yī)療類網(wǎng)站不適合使用紅色做為主色調(diào)。

搭配：紅色系中的粉紅色比較適合于使用在醫(yī)療美容類的網(wǎng)站，營造出迎合女性柔美、純真的氣氛。




（2）黑色：色調(diào)比較莊重，且容易讓人聯(lián)想到死亡。所以如果對(duì)顏色搭配不好把握，建議避免過多使用黑色作為主色調(diào)。

搭配：黑色與高亮度的黃色搭配，可以得到清晰整潔的效果。屬于比較適合活潑跳躍、色彩絢麗的配色方案。




（3）藍(lán)色：藍(lán)色比較適合和平淡雅潔凈的頁面，因此一些醫(yī)院網(wǎng)站也會(huì)適當(dāng)采用藍(lán)色，活單獨(dú)使用，或搭配使用。

搭配：淺藍(lán)色具有淡雅、清新、浪漫和高貴的特性，常被用于化妝品、女性、醫(yī)療網(wǎng)站的設(shè)計(jì)中。




（4）綠色：綠色代表的是清爽、理想、希望和生長的意象，較符合服務(wù)業(yè)、醫(yī)療健康業(yè)、教育行業(yè)、農(nóng)業(yè)類網(wǎng)頁設(shè)計(jì)的要求。

搭配：綠色可與多種顏色搭配而達(dá)到和諧的效果，也是醫(yī)院網(wǎng)站中最為廣泛的顏色之一。




（5）紫色：紫色象征著女性化，代表著高貴和奢華、優(yōu)雅與魅力，也象征著神秘與莊重、神圣和浪漫。

搭配：紫色加入少量的白色，就會(huì)成為一種十分優(yōu)美、柔和的色彩。




（6）橙色：橙色具有健康、活力、勇敢和自由等象征意義，能給人以莊嚴(yán)尊貴神秘等感覺。應(yīng)用在醫(yī)院網(wǎng)站設(shè)計(jì)中可以營造溫暖的氛圍。

搭配：不能大面積使用，只能小塊地與其他色彩搭配起點(diǎn)綴的作用。


（7）白色：白色是網(wǎng)頁設(shè)計(jì)中通用的顏色，它具有容易突出彩度的特性。

搭配：搭配黑色顯得高貴具有都市氣息，但不適合作為醫(yī)療網(wǎng)站主色調(diào)。




（8）黃色：在很多設(shè)計(jì)作品中黃色都被用來表現(xiàn)喜慶的氣氛和華麗的商品。

搭配：黃色屬于一種中性色彩，因此它在網(wǎng)站設(shè)計(jì)中幾乎可以和任何一種色彩搭配。




在高保真網(wǎng)頁原型中，色彩的運(yùn)用也同樣是網(wǎng)頁設(shè)計(jì)的加分項(xiàng)目。顏色搭配得當(dāng)?shù)脑晚?xiàng)目更有助于獲得投資和贏取客戶的機(jī)會(huì)。那么，你需要的是選擇一款支持色料庫的原型設(shè)計(jì)工具，而非單色的線框圖工具。國產(chǎn)原型設(shè)計(jì)工具M(jìn)ockplus中可直接通過色號(hào)或使用拾色器來設(shè)置組件、圖標(biāo)顏色。對(duì)于網(wǎng)頁設(shè)計(jì)、App設(shè)計(jì)都是非常友好的。







總結(jié)：




不僅僅是針對(duì)醫(yī)療類的網(wǎng)站設(shè)計(jì)，所有類型的網(wǎng)站設(shè)計(jì)都應(yīng)該變得規(guī)范且有創(chuàng)意。對(duì)于設(shè)計(jì)師來說，更應(yīng)該學(xué)習(xí)的是如何避免網(wǎng)頁設(shè)計(jì)落入俗套。網(wǎng)頁設(shè)計(jì)中的色彩搭配也并不只適用于醫(yī)療網(wǎng)站，其他類型的網(wǎng)站也應(yīng)該尤其注意在色彩搭配方面出彩，為自己的設(shè)計(jì)加分。

相關(guān)閱讀：

反面教材，這9個(gè)糟糕的網(wǎng)頁設(shè)計(jì)實(shí)例引以為戒

設(shè)計(jì)類網(wǎng)站的“聯(lián)系我們”頁面設(shè)計(jì)盤點(diǎn)

干貨！2018年你值得一看的網(wǎng)頁設(shè)計(jì)作品集賞析

網(wǎng)頁設(shè)計(jì)有難題？12款網(wǎng)頁設(shè)計(jì)模板給你靈感！

極簡網(wǎng)頁設(shè)計(jì)技巧，打造簡約之美

進(jìn)階學(xué)習(xí)，如何無代碼設(shè)計(jì)一款美觀且實(shí)用的網(wǎng)站？

網(wǎng)站著陸頁設(shè)計(jì)，讓用戶開心著陸的10大技巧！

網(wǎng)站設(shè)計(jì)缺乏創(chuàng)意？視差滾動(dòng)網(wǎng)站設(shè)計(jì)讓你與眾不同

收集網(wǎng)站用戶反饋的5個(gè)常用問題

這9款小眾時(shí)尚的酒店網(wǎng)站設(shè)計(jì)，讓你不再戀家

時(shí)尚的不僅僅是它們的服裝，還有它們的網(wǎng)站設(shè)計(jì)

10個(gè)最新交互式Web設(shè)計(jì)實(shí)例欣賞

---