首頁(yè)

創(chuàng)意十足的網(wǎng)頁(yè)視差滾動(dòng)效果欣賞

藍(lán)藍(lán)設(shè)計(jì)的小編

最近大家伙越來(lái)越關(guān)注視差滾動(dòng)網(wǎng)站設(shè)計(jì)了,很多同學(xué)都在四處尋找相關(guān)的案例來(lái)賞析學(xué)習(xí)。此前我們也分享過(guò)相關(guān)的制作教程及文章。

那么今天藍(lán)藍(lán)設(shè)計(jì)繼續(xù)推薦創(chuàng)意十足的視差滾動(dòng)酷站界面設(shè)計(jì),希望能為你的案例帶來(lái)靈感:)強(qiáng)烈推薦收藏。

Beatbox Academy

Beatbox Academy animated css parallax scrolling

如何在響應(yīng)式網(wǎng)頁(yè)中安置和處理圖片及視頻

藍(lán)藍(lán)設(shè)計(jì)的小編

響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì),是一種正在流行的網(wǎng)頁(yè)開(kāi)發(fā)思想,它是利用靈活可變的柵格系統(tǒng),令網(wǎng)頁(yè)的顯示模式可以根據(jù)訪問(wèn)設(shè)備的屏幕尺寸規(guī)格而進(jìn)行自適應(yīng)。預(yù)計(jì)2015年的時(shí)候,移動(dòng)端的用戶(hù)數(shù)量將會(huì)從目前的8億,增長(zhǎng)到19億,而這也意味著目前我們?yōu)樽烂鏋g覽器而設(shè)計(jì)的網(wǎng)頁(yè),將會(huì)在他們的手機(jī)和平板上呈現(xiàn)出非常糟糕的使用體驗(yàn)。

但是隨著實(shí)際應(yīng)用狀況的改變,響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)還是會(huì)出現(xiàn)一系列復(fù)雜的并發(fā)癥。本文余下的部分,就是詳細(xì)闡述如何在響應(yīng)式網(wǎng)頁(yè)中安置和處理多媒體元素,諸如圖片和視頻,最終的目的是幫你做出一個(gè)靠譜的網(wǎng)站,能讓這些元素?zé)o縫地在各種手持設(shè)備上加載運(yùn)行,提升用戶(hù)體驗(yàn)。

響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)中的圖片處理

先說(shuō)說(shuō)響應(yīng)式圖片的處理方法。在響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)中,圖片處理的問(wèn)題或多或少地和傳統(tǒng)網(wǎng)頁(yè)中的導(dǎo)航欄設(shè)計(jì)有相似之處。隨著新的移動(dòng)設(shè)備的普及,更高像素密度的屏幕使得網(wǎng)頁(yè)的任何一個(gè)瑕疵都顯得無(wú)比明顯,因此,圖片處理的核心問(wèn)題在于如何確保網(wǎng)站(尤其是圖片)的各個(gè)方面都能盡可能靈活,并且確保每個(gè)像素不會(huì)在高分屏下模糊。

一組時(shí)尚的鞋帽服飾類(lèi)網(wǎng)頁(yè)設(shè)計(jì)

藍(lán)藍(lán)設(shè)計(jì)的小編

服飾鞋帽向來(lái)是時(shí)尚必爭(zhēng)之地,除產(chǎn)品本身的宣傳是核心競(jìng)爭(zhēng)力,在用戶(hù)還未接觸到實(shí)體之前,通過(guò)網(wǎng)站宣傳往往是給新用戶(hù)留下一個(gè)好印象的開(kāi)始。

宣傳產(chǎn)品的網(wǎng)站界面設(shè)計(jì),充滿美感的大照片和酷炫的網(wǎng)頁(yè)現(xiàn)在是必不可少的,來(lái)看看藍(lán)藍(lán)設(shè)計(jì)下面一組時(shí)尚類(lèi)型的鞋帽服飾網(wǎng)站設(shè)計(jì)吧。

更多時(shí)尚類(lèi)網(wǎng)站設(shè)計(jì)欣賞:
http://bouu.cn/

Heren

Heren

超美的水彩效果網(wǎng)頁(yè)設(shè)計(jì)

藍(lán)藍(lán)設(shè)計(jì)的小編

小時(shí)候,一盒水彩,幾張白紙,就可以一個(gè)人安靜地待上好久。還記得綠色用得特別快,因?yàn)橄矚g用綠色,畫(huà)很多的樹(shù)葉,畫(huà)大片的草地。不過(guò)現(xiàn)在可以用電腦畫(huà),再也不用擔(dān)心缺哪個(gè)顏色啦!
以下是藍(lán)藍(lán)設(shè)計(jì)收集的一組數(shù)字水彩效果的網(wǎng)站設(shè)計(jì),每個(gè)都好漂亮,看是否能勾起你童年的美好回憶。是否對(duì)你的UI設(shè)計(jì)有所幫助!

Istok Pavlovic

watercolor-effects-1

簡(jiǎn)約時(shí)尚的電商網(wǎng)站設(shè)計(jì)

藍(lán)藍(lán)設(shè)計(jì)的小編

小型電子商務(wù)網(wǎng)站設(shè)計(jì)能享受這樣的:不用像很多大型連鎖商店那樣必須使用預(yù)先規(guī)定的界面設(shè)計(jì)樣式,他們不需要內(nèi)容繁多的登錄頁(yè)面,也不需要有著成百上千條分類(lèi)的大型菜單欄,甚至不需要一個(gè)建議性或可選擇的產(chǎn)品鏈接。
所有小型商店的好商品需要的是一位很棒的設(shè)計(jì)師來(lái)為它們建立一個(gè)簡(jiǎn)潔且現(xiàn)代感十足的網(wǎng)站。當(dāng)然,一枚”立即購(gòu)買(mǎi)”的按鈕會(huì)很有用。
我相信當(dāng)你看完藍(lán)藍(lán)設(shè)計(jì)這些簡(jiǎn)約時(shí)尚的電商網(wǎng)站設(shè)計(jì)后,你會(huì)對(duì)視覺(jué)營(yíng)銷(xiāo),電子商務(wù)有全新的認(rèn)識(shí)!

或者會(huì)發(fā)自肺腑的感嘆:原來(lái)這就足夠了,購(gòu)物真的不需要那么復(fù)雜。

Tatchies

39

網(wǎng)站如何提速:圖片優(yōu)化網(wǎng)站推薦

藍(lán)藍(lán)設(shè)計(jì)的小編

頁(yè)面的加載時(shí)間是每一個(gè)UI設(shè)計(jì)師都擔(dān)心的數(shù)據(jù),或者至少是每個(gè)界面設(shè)計(jì)師都應(yīng)該擔(dān)心的問(wèn)題。圖片的大小肯定是一個(gè)需要留意的問(wèn)題。這就是藍(lán)藍(lán)設(shè)計(jì)為什么在這里寫(xiě)了幾個(gè)有助于優(yōu)化頁(yè)面中的圖片的小技巧,這些小技巧將有助于大家解決這個(gè)問(wèn)題,這些小技巧也可以在你需要優(yōu)化圖片的時(shí)候提供很多幫助。對(duì)你的網(wǎng)站設(shè)計(jì)有所幫助!

TinyPNG
TinyPNG是使用智能有損壓縮技術(shù),來(lái)減小png圖片的大小。

如何給你的網(wǎng)站增加品牌價(jià)值?

藍(lán)藍(lán)設(shè)計(jì)的小編

的品牌在大型的企業(yè)集團(tuán)公司中價(jià)值數(shù)十億美元。每個(gè)公司都應(yīng)該努力創(chuàng)造一個(gè)品牌。由于建立網(wǎng)站通常是建立品牌的第一步,這里有幾種方法可以使你的網(wǎng)站給你的品牌增加價(jià)值。

簡(jiǎn)潔幾乎總會(huì)出現(xiàn)在成功的故事中:這就是我們?nèi)祟?lèi)的樣子。我們可能會(huì)覺(jué)得有一些復(fù)雜,簡(jiǎn)單可以緩和一些事情。也是一種把事情完成的方式。嘗試一些復(fù)雜的事情會(huì)降低你的成功率。保持你的網(wǎng)頁(yè)設(shè)計(jì)簡(jiǎn)單。如果你是一個(gè)小企業(yè),那么你只需要一對(duì)夫婦的做的網(wǎng)頁(yè)和博客(也可能是精心布置店面)。你不會(huì)需要大量的內(nèi)容。你當(dāng)然不需要閃光燈。你會(huì)得到你想要的,不是嗎?下面藍(lán)藍(lán)設(shè)計(jì)和朋友們分享一下如何給你的網(wǎng)站設(shè)計(jì)增加品牌價(jià)值的方法,希望對(duì)大家的網(wǎng)站界面設(shè)計(jì)有所幫助!

網(wǎng)站是為別人而做,不是為了你

暢游VC-優(yōu)設(shè)截圖

如何避免犯哪些網(wǎng)頁(yè)設(shè)計(jì)最常見(jiàn)的可用性錯(cuò)誤

藍(lán)藍(lán)設(shè)計(jì)的小編

在過(guò)去十年中高品質(zhì)的網(wǎng)頁(yè)可用性一直是業(yè)內(nèi)討論的核心,因?yàn)樗鼘?duì)用戶(hù)來(lái)說(shuō)越來(lái)越重要。好的可用性也可以幫助建立品牌知名度,從而提升用戶(hù)對(duì)一個(gè)網(wǎng)站設(shè)計(jì)或者是一家公司的評(píng)價(jià)。今天人們依然高度關(guān)注可用性,是因?yàn)榇蟠笮⌒〉墓疽呀?jīng)證明了好的可用性策略是多么重要。

在過(guò)去幾年中,良好的可用性成為那些成功的初創(chuàng)公司的核心。多數(shù)情況下,簡(jiǎn)單的想法最具創(chuàng)造性,可用性主要是指:使一個(gè)功能或者產(chǎn)品易于使用,但同時(shí)也要保持產(chǎn)品質(zhì)量維持在高水平上。

如今,很多文章會(huì)談到普遍意義。在對(duì)該話題年復(fù)一年的討論之后,似乎UI設(shè)計(jì)者們?nèi)匀缓茈y去理解它??捎眯栽缫巡辉偈且粋€(gè)玩笑,下面藍(lán)藍(lán)設(shè)計(jì)這些建議應(yīng)當(dāng)被打印出來(lái)并粘到你桌子對(duì)面的墻上。

鏈接的顏色

我經(jīng)常發(fā)現(xiàn)自己在瀏覽網(wǎng)頁(yè)時(shí),有些頁(yè)面上的鏈接沒(méi)有以某種形式高亮顯示。這是我見(jiàn)過(guò)的最愚蠢的錯(cuò)誤。我愿意訪問(wèn)那些鏈接使用默認(rèn)藍(lán)色的頁(yè)面,而不是鏈接和 普通文字一個(gè)顏色的頁(yè)面。用戶(hù)需要知道如何在頁(yè)面之間導(dǎo)航、在哪兒能點(diǎn)擊鏈接。你不能指望他們把鼠標(biāo)一行行的掠過(guò)所有文字去找鏈接,直到發(fā)現(xiàn)鼠標(biāo)箭頭變成 “小手兒”。

網(wǎng)頁(yè)設(shè)計(jì)中那些不容忽視的細(xì)節(jié)

藍(lán)藍(lán)設(shè)計(jì)的小編

你有沒(méi)有經(jīng)歷過(guò)看到一個(gè)頁(yè)面的時(shí)候馬上就被它的界面設(shè)計(jì)吸引并且留下了深刻的印象呢?然后你進(jìn)一步細(xì)看這個(gè)頁(yè)面發(fā)現(xiàn)真正使這個(gè)頁(yè)面變得神奇的是一些小細(xì)節(jié),在藍(lán)藍(lán)設(shè)計(jì)這篇文章中我們將看到幾種把細(xì)節(jié)設(shè)計(jì)做到完美的頁(yè)面。

完美的像素線

Image Spark UI設(shè)計(jì)師用一個(gè)像素的線條來(lái)分割頂部導(dǎo)航,搜索輸入框,導(dǎo)航底欄。任何時(shí)候一個(gè)較淺的顏色緊挨著一個(gè)較深的顏色會(huì)使人出現(xiàn)有一個(gè)凸起的邊緣的錯(cuò)覺(jué)。請(qǐng)注意這種線條只能比背景色稍微淺一點(diǎn)點(diǎn)。如果使用一條白線那將失去這種效果。

熱門(mén)網(wǎng)頁(yè)和手機(jī)APP設(shè)計(jì)欣賞

藍(lán)藍(lán)設(shè)計(jì)的小編

一周又過(guò)去了,藍(lán)藍(lán)設(shè)計(jì)這里收錄了最近國(guó)外精彩的網(wǎng)頁(yè)設(shè)計(jì)手機(jī)App設(shè)計(jì),不多說(shuō)了,來(lái)享受這些精彩的界面設(shè)計(jì)創(chuàng)意之作吧!
 

JOBS: Le Film

atdesign_01

日歷

鏈接

個(gè)人資料

存檔