首頁

一組賦予你扁平化配色靈感的網(wǎng)頁設(shè)計(附配色工具)

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

 

近期我們看到了扁平化配色的一個趨勢,很多Flat Design網(wǎng)站使用了耀眼、明亮的色彩,如果是以前我會覺得用這類顏色會有點花哨,但當(dāng)我看了相關(guān)的扁平化設(shè)計作品,發(fā)現(xiàn)這并不花哨,反而很好看。

我想大家最近也看過iOS7的界面設(shè)計和iPhone 5C新款手機(jī),那是一種充滿活力、時尚新穎的顏色,即使用在網(wǎng)頁設(shè)計上也非常不錯,下面大家看看來自line25整理的扁平化網(wǎng)頁作品,希望能給你帶來創(chuàng)造靈感!

扁平化配色神器:
扁平化設(shè)計配色參考網(wǎng)站:FLATUICOLORS

Apple

除了導(dǎo)航保留原味,蘋果官網(wǎng)該平的都平了。。。

Apple

Mud

Mud

關(guān)注App設(shè)計!20個漂亮的扁平風(fēng)格移動端界面

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

現(xiàn)在扁平化風(fēng)格在網(wǎng)頁設(shè)計方面已經(jīng)有許多優(yōu)秀的范例了,比如這22個超贊的扁平化設(shè)計經(jīng)典案例就有很多我們可以借鑒學(xué)習(xí)的地方。但是移動端的界面設(shè)計扁平化風(fēng)格較少,所以今天從BehanceDribbble收集的這一組移動端的扁平化設(shè)計就該好好看看咯,學(xué)習(xí)一下它們優(yōu)秀的細(xì)節(jié)和配色吧 : )

如果你對扁平化風(fēng)格的網(wǎng)站更有興趣,那么推薦閱讀:
一組賦予你扁平化配色靈感的網(wǎng)頁設(shè)計

Yummly Mobile

創(chuàng)意十足!折疊效果在移動App中的應(yīng)用

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

在今天的移動 App 界面設(shè)計中,你可以看到不同創(chuàng)意類型的視覺效果。特別是在 Dribbble 上面,有很多應(yīng)用程序的 UI 概念設(shè)計讓你驚嘆。當(dāng)然,他們大多只是作為一個概念設(shè)計,可能永遠(yuǎn)也不會成為一個真正的應(yīng)用程序。

但如果你想獲得靈感,那很有必要看看下面這些極具創(chuàng)意的動效設(shè)計。

你還可以來看一下這些:
《關(guān)注App設(shè)計!20個漂亮的扁平風(fēng)格移動端界面》

Unlock Concept

Slide Concept


Portfolio iPhone App


App Concept – UI

提升網(wǎng)站用戶體驗:你不能不知道的6條專業(yè)建議

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

作為網(wǎng)頁設(shè)計師,我們知道,我們的任務(wù)就是與用戶對話。這就是為什么我們能夠從容的著手眼前的工作。我們選擇顏色、字體,以及要使用的網(wǎng)頁布局,甚至編寫CSS的方式,所有的東西看起來都那么有目的性。

正如我們精心制作設(shè)計時,我們會意識到結(jié)果會透露出一些關(guān)于我們,設(shè)計師的內(nèi)容。然而這些我們所設(shè)計東西并不是總能很好道出我們的初衷。

所以每當(dāng)你正在進(jìn)行一個網(wǎng)站的設(shè)計,問自己:我們?nèi)绾谓o用戶更好的關(guān)懷感?

浮動窗口廣告 = 金錢比UX和內(nèi)容更重要

因此,很多網(wǎng)站都選擇了浮動窗口或者遮罩層廣告,這似乎是現(xiàn)代形式的彈出窗廣告。

就像他們的前輩,彈出窗口廣告 ,浮動窗口的廣告很煩人。

浮動窗口廣告是非常具侵?jǐn)_性的策略,從而影響并且中斷用戶體驗。

想「廣告」與「用戶體驗」二者兼得的同學(xué)推薦閱讀:網(wǎng)站廣告和用戶體驗的平衡之道

 

wps_clip_image-7620

如果你的用戶非常艱難的才能訪問到你的網(wǎng)站上的內(nèi)容,那么你一定有些地方做錯了。你的設(shè)計應(yīng)該展示給用戶的最優(yōu)先事項是它的體驗,當(dāng)然也要說明網(wǎng)站的內(nèi)容也是十分重要的一方面。

通過中斷,延遲,或者別的什么方式讓用戶千辛萬苦地才能了解到您的內(nèi)容,那么你是在告訴他們,用戶的價值低于金錢。

同樣,任何強(qiáng)迫用戶注冊,登錄,填寫郵箱等方式才能訪問到內(nèi)容,都應(yīng)重新考慮是否涉及欠妥。

試想一下這種情況:由于你當(dāng)前的主機(jī)無法滿足現(xiàn)有需求,于是你拼命尋找一個新的主機(jī)。它只是不斷崩潰,而這是在告訴你,你已經(jīng)超越了當(dāng)前解決方案(PS:順便祝賀你站點的成長)。

如同很多科技的創(chuàng)業(yè)者們,你最初的解決問題的行動是用谷歌搜索一臺新的主機(jī) 。

你偶然在Quora看見了一條線索,一個很多如同你一樣的創(chuàng)業(yè)者們經(jīng)常光顧的站點。

7個設(shè)計師必備的國際頂尖設(shè)計網(wǎng)站

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

成為dA(deviantart)的忠實用戶有很多理由——dA是最大的藝術(shù)社區(qū);成為dA用戶簡直是設(shè)計新手的必經(jīng)之路。但是,這些都不妨礙你加入其他專業(yè)的網(wǎng)站來展現(xiàn)你的才華。

創(chuàng)立于12年前的dA現(xiàn)在擁有最多的藝術(shù)愛好者受眾。然而,最近有人說dA有太多的作品只有在你腦補(bǔ)能力超強(qiáng)的時候才能稱之為”藝術(shù)”。用戶太多了,所以各種批評的聲音也紛至沓來!不管怎樣,不管你喜歡與否,dA是一個很棒的藝術(shù)社區(qū),不過,加入其他藝術(shù)網(wǎng)站也會讓你受益良多。

今天,我們來了解七個主要的可作為dA替補(bǔ)的藝術(shù)社區(qū)來激勵設(shè)計師和有創(chuàng)意的藝術(shù)家。

preview-large-7bestdaalternative

1.Behance


1-Behance

與dA不同,Behance是為那些專業(yè)藝術(shù)家,那些以藝術(shù)謀生或者將藝術(shù)作為一個非常嚴(yán)肅的愛好的人建立的。由于嚴(yán)格規(guī)定和高標(biāo)準(zhǔn),Behance正在成為一個高級的專業(yè)網(wǎng)站。

Behance的網(wǎng)站看上去很直觀,很有條理:作品按小組,類別,甚至國家來分類。用戶可以根據(jù)愛好,專業(yè)水平或者正在一起做的項目來建立朋友圈或合作伙伴圈。如果你想找這個網(wǎng)站的亮點,那就看看招聘版塊和交互系統(tǒng)吧。在Behance,藝術(shù)家們能得到一致的作品集系統(tǒng)來按照步驟展示工作流程和項目進(jìn)度。雖然一堆大手的名字會嚇到新手,但是Behance可能是唯一能與藝術(shù)家和設(shè)計師分享你的經(jīng)驗和知識并且獲得專業(yè)反饋的地方。

17個漂亮實用的Photoshop CS6教程

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

今天,我們繼續(xù)分享Photoshop CS6教程技巧。在這篇文章中,您可以學(xué)會怎樣創(chuàng)建一些有范兒的黑暗騎士風(fēng)格的海報,還有很多酷炫的字體設(shè)計教程。如果很久沒有學(xué)習(xí)新的ps技巧,那么,今天的17個教程,對于您練手來說,將再適合不過了。
在Photoshop中創(chuàng)建一個鋼鐵文字效果

在Photoshop CS6的泰坦之怒

怒贊!7個下載UI組件包的網(wǎng)站

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

現(xiàn)在Photoshop的UI工具包是設(shè)計師們最喜愛的資源,收藏到一套好的組件包,常常是欣喜若狂呀。
包包們已經(jīng)成為web設(shè)計者迅速開發(fā)不可或缺的神兵利器,里面往往會放滿了網(wǎng)站所需要的一切組件,譬如:導(dǎo)航、翻頁、焦點圖、滾動條、按鈕、表格、菜單等等!
為了讓大家高興高興,特別整理收集了7個網(wǎng)站的組件包下載入口,是的!是入口!
里面藏著很多高質(zhì)量的免費的UI組件包,優(yōu)設(shè)哥建議您把網(wǎng)址先收藏了,到了晚上夜深人靜的時候下載。

1、Dribbble

View UI kits from Dribbble

Dribbble 這里不只是一個看劉碧設(shè)計師和他們200*150小氣格子圖的地方,如果您夠細(xì)心,您將可以順藤摸瓜找到成堆有用的資源,那些免費的PSD就像彩蛋一樣藏在任何一個地方。

隨便舉幾個栗子:

Hanna UI Kit

View the UI kit

低調(diào)內(nèi)涵:20個優(yōu)雅網(wǎng)頁背景紋理欣賞

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

 

合理運用素材,利用紋理繪制精美絕倫的網(wǎng)頁背景。

Read the full post

盡管極簡設(shè)計和扁平化不提倡使用紋理。但是設(shè)計無絕對,很多情況下,紋理的質(zhì)感,能讓整個網(wǎng)頁提升好幾個層次。
紋理能夠營造一種復(fù)古氛圍。本文收錄了20個網(wǎng)站,全部在紋理運用上頗有心得,可以看看他們的設(shè)計細(xì)節(jié)。
趕緊整理整理你所下載的資源包,動手實驗一個吧!

Orchard Keepers

Orchard Keepers

 

Postable

Postable

20個UI界面PSD下載(來自Dribbble分享)

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

今天這篇文章收集了20個新鮮出爐的用戶界面 PSD 源文件素材,你可以免費下載使用。這些免費素材不僅能幫助設(shè)計師們節(jié)省大量的時間,而且能有很好的效果。感謝那些很有才華的設(shè)計師分享它們的勞動成果,讓更多的人可以使用他們的創(chuàng)意設(shè)計。

Search UI

20個UI界面PSD下載(來自Dribbble分享)

 

Any Color Vertical Ribbon

20個UI界面PSD下載(來自Dribbble分享)

Labels

20個UI界面PSD下載(來自Dribbble分享)

 

十四套PS字體設(shè)計教程大集合

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

在任何領(lǐng)域,想要做好最重要的事情就是你應(yīng)該熟悉該領(lǐng)域的相關(guān)工具,設(shè)計領(lǐng)域的Adobe Photoshop是相當(dāng)完美的工具,因為你可以利用這個軟件很容易的創(chuàng)造許多圖象。不僅如此,你還可以在一個漂亮的理想的方式中管理文本,因為 Photoshop支持這類功能。我想說,文本和Photoshop工具可用于創(chuàng)建一些令人驚異的和創(chuàng)造性的圖象。如果你能夠在你的設(shè)計項目中呈現(xiàn)文本, 意味著你擁有真正專業(yè)的技能,現(xiàn)在通過以下文字效果教程你也可以很容易做到這一點。

網(wǎng)絡(luò)上有很多這種教程,但是這次是超乎尋常的Photoshop教程,使你的文本看上去更藝術(shù)。使用Photoshop文字效果可以在大部分的設(shè)計中很突出。文本效應(yīng)是最重要的一個要素,設(shè)計現(xiàn)在這個技巧的方法就在下面的教程中。

Create a Sports-Themed Text Effect in Photoshop Using Layer Styles

Purple Glow Text Effect

Ridiculously Realistic Scorching Fire Effect!

 

日歷

鏈接

個人資料

存檔