網(wǎng)站設(shè)計(jì)

Website development

?內(nèi)容閃耀的創(chuàng)意布局--獨(dú)特的網(wǎng)站布局精選之一

發(fā)布時(shí)間：2017-10-10 22:42:23

我們已經(jīng)篩選出許多平凡的例子，找到讓他們的內(nèi)容閃耀的創(chuàng)意布局的例子。

靈感

許多網(wǎng)站都跟著同樣的老舊模板。這是一個(gè)英雄形象與中心的行動(dòng)呼吁，這里是我的三列在它下面。這不是一個(gè)糟糕的設(shè)計(jì)，因?yàn)樗淖髌贰?wèn)題是可以預(yù)測(cè)。因此，我們想給您一些采用不同方法的網(wǎng)站示例，以便您可以創(chuàng)建打破模具的頁(yè)面，而不會(huì)破壞用戶(hù)期望。

Heco合作伙伴

Heco Partners通過(guò)流動(dòng)的動(dòng)作吸引您進(jìn)入他們的網(wǎng)站。

我們根本無(wú)法獲得足夠的這個(gè)網(wǎng)站！當(dāng)您在位于芝加哥設(shè)計(jì)機(jī)構(gòu)網(wǎng)站的Heco Partners登陸時(shí)，您會(huì)遇到“我們將信息轉(zhuǎn)化為人們關(guān)心的經(jīng)驗(yàn)”這個(gè)詞，徘徊在一波蕩蕩的浪潮之上。

這兩個(gè)要素結(jié)合在一起，象征著他們將思想轉(zhuǎn)化為行動(dòng)的承諾。沒(méi)有滾動(dòng)，我們會(huì)很清楚他們是誰(shuí)，他們做什么。作為一個(gè)整體，本網(wǎng)站提供了一個(gè)華麗的例子，正確的方式將組合與更詳細(xì)的背景信息相結(jié)合，如其每個(gè)項(xiàng)目所示。我們可以看到他們?nèi)绾螏椭蛻?hù)取得成功，并了解他們的工作方式。

沒(méi)有導(dǎo)航和箭頭提示您向下滾動(dòng)以獲得整個(gè)Heco Partners的故事，但您也可以分歧到基于項(xiàng)目的案例研究。導(dǎo)航終于在這里出現(xiàn)，在項(xiàng)目部分，您可以在屏幕右下方使用滑塊式箭頭翻轉(zhuǎn)項(xiàng)目。

這是一個(gè)缺點(diǎn)，不能從你選擇的一個(gè)部分反彈到下一個(gè)。但是，每個(gè)部分之間的衰落過(guò)渡以及各種其他動(dòng)畫(huà)的美麗，使網(wǎng)站真正的樂(lè)趣滾動(dòng)。

Nelu Cebotari的投資組合

投資組合應(yīng)該顯示出您作為設(shè)計(jì)師的能力。Nelu Cebotari做到這一點(diǎn)。

設(shè)計(jì)組合為您提供機(jī)會(huì)，不僅可以炫耀您所做過(guò)的偉大項(xiàng)目，還可以通過(guò)頁(yè)面本身展現(xiàn)您的設(shè)計(jì)技巧。Nelu Cebotari創(chuàng)建了一個(gè)網(wǎng)絡(luò)投資組合，捕捉他的個(gè)性和技能作為設(shè)計(jì)師，同時(shí)巧妙地避免了陳詞濫調(diào)的陷阱。

黃色可能有點(diǎn)苛刻，但他選擇了正確的靜音色調(diào)為他的背景和整個(gè)放置的形狀。這種顏色選擇使得黑色文字真正脫穎而出。

此設(shè)計(jì)的另一個(gè)獨(dú)特之處在于導(dǎo)航，放置在前面和中央作為關(guān)于，工作和聯(lián)系的行動(dòng)呼吁。懸停在其中的每一個(gè)都顯示從底部向上滑動(dòng)的框。每個(gè)這些廣場(chǎng)有一些文字提示您了解更多信息或聯(lián)系。這與簡(jiǎn)單的輪廓圖標(biāo)結(jié)合使得感覺(jué)輕松的體驗(yàn)。

至少在起初，這種精心設(shè)計(jì)的斯巴達(dá)式的設(shè)計(jì)方法令人驚訝。但是，當(dāng)您將自己的投資組合懸停在手中，示例設(shè)計(jì)就會(huì)生動(dòng)生動(dòng)，誘使您深入到項(xiàng)目中。

聯(lián)系表格也很方便地使用對(duì)話(huà)設(shè)計(jì)方法。所有您需要做的是替換幾個(gè)占位符，單擊提交，您的請(qǐng)求正在進(jìn)行中。將表單的設(shè)計(jì)轉(zhuǎn)化為必要的信息，這使其成為更有效的溝通方式。

聯(lián)系表不必復(fù)雜。這種簡(jiǎn)單的方法使得保持聯(lián)系easy.Type圖片說(shuō)明在這里（可選）

DFink設(shè)計(jì)

完美的DIY美學(xué)設(shè)計(jì)DFink Design分開(kāi)。

我們喜歡簡(jiǎn)約主義 - 但這并不是每個(gè)人的正確方法。畢竟，對(duì)于一些，簡(jiǎn)約的設(shè)計(jì)可以感覺(jué)到冷和無(wú)菌，而不是禪宗。DFink為他的投資組合網(wǎng)站帶來(lái)了一個(gè)骯臟的，手工的，復(fù)古的審美，從簡(jiǎn)約主義走出去。

DFink Design的標(biāo)志有一個(gè)手繪外觀(guān)，它的缺點(diǎn)是美麗的。在整個(gè)頁(yè)面中，我們看到其他手工制作的裝飾品，例如將一個(gè)部分與下一個(gè)部分分開(kāi)的邊框，看起來(lái)像一個(gè)粗糙的墨輥工作，以及類(lèi)似木頭的部分標(biāo)題。字體選擇，從打字機(jī)風(fēng)格的特別精英到哥特式特許經(jīng)營(yíng)，可能看起來(lái)有點(diǎn)太多樣化（并且很多），但是他們?cè)俅我赃@種復(fù)古的感覺(jué)結(jié)合在一起。

他的作品集出現(xiàn)在介紹之下，突然引入了更現(xiàn)代的感覺(jué)。投資組合詳細(xì)頁(yè)面可能會(huì)受益于更多的文字內(nèi)容和重要的項(xiàng)目細(xì)節(jié)，如結(jié)果，但毫無(wú)疑問(wèn)，它們是美麗的。

永不夏天的雪板

從不夏天專(zhuān)注于他們的產(chǎn)品，而不會(huì)失去他們的樂(lè)趣。

行動(dòng)體育公司如滑雪板制造商的行動(dòng)很容易吸引其騎手的魅力和能力。誰(shuí)更多或更大的可以賣(mài)給他或她的愛(ài)好者幾乎任何滑雪板。從來(lái)沒(méi)有夏天，有一個(gè)堅(jiān)實(shí)的團(tuán)隊(duì)名單，讓這些車(chē)手成為他們的故事的一部分，但這里真正的重點(diǎn)是他們的高品質(zhì)的產(chǎn)品。

有很多技術(shù)規(guī)格，但他們的原因是他們將幫助您在斜坡上進(jìn)行備份。他們不用使用煙霧鏡子的術(shù)語(yǔ)，而是讓你知道（相當(dāng)清晰的語(yǔ)言），所有這些材料和施工技術(shù)如何使他們的板子更好。

隨著技術(shù)規(guī)格和重點(diǎn)在板上建設(shè)本頁(yè)可能是信息過(guò)載。他們能夠通過(guò)注入大量的個(gè)性來(lái)避免這種情況。鮑勃·羅斯（Bob Ross）的模仿視頻具有足夠的愚蠢魅力，并伴隨著觀(guān)看人物的喜悅。所有這一切都將是一個(gè)無(wú)臉的制造商，并表明他們也有一個(gè)輕松的一面。

靈魂爵士樂(lè)

宇宙的聲音帶來(lái)了數(shù)字化到唱片店的真實(shí)世界體驗(yàn)。

宇宙的聲音是靈魂爵士樂(lè)的折中唱片公司的數(shù)字分支。從重新發(fā)出愚蠢的funk，爵士樂(lè)和朋克，推出新版本，他們確?？赡苈?tīng)不到很多關(guān)注的音樂(lè)。

他們的網(wǎng)站提供了他們推出的許多流派的良好表現(xiàn)。有很多關(guān)于藝術(shù)家的背景信息以及聲音樣本，以了解他們的聲音。

作為一個(gè)音樂(lè)愛(ài)好者，我已經(jīng)花了大量的時(shí)間翻轉(zhuǎn)專(zhuān)輯在唱片店。我喜歡這個(gè)設(shè)計(jì)是捕捉到在唱片店的感覺(jué)。您可以翻轉(zhuǎn)畫(huà)廊中的各種版本。如果任何藝術(shù)品捕捉到你的眼睛，你可以點(diǎn)擊蓋子仔細(xì)看看。這就像翻過(guò)一堆蠟燭，抓住你立即抓住你的東西拿出來(lái)進(jìn)行進(jìn)一步檢查。通過(guò)將瀏覽記錄的物理行為翻譯成數(shù)字體驗(yàn)，“宇宙之聲”將自己與其他沒(méi)有這種熟悉的互動(dòng)的音樂(lè)零售商分開(kāi)。

宇宙的聲音帶來(lái)了通過(guò)簡(jiǎn)單的懸停互動(dòng)，將唱片商店的音樂(lè)翻轉(zhuǎn)到電腦屏幕的樂(lè)趣。

舊金山現(xiàn)代藝術(shù)博物館

SFMOMA創(chuàng)建了一個(gè)專(zhuān)注于藝術(shù)和可用性的網(wǎng)站的杰作。

博物館包含啟發(fā)和吸引我們的想象力的藝術(shù)。他們的網(wǎng)站應(yīng)該做的一樣。

大多數(shù)博物館網(wǎng)站做了一個(gè)體面的工作，展示特色作品，宣傳當(dāng)前的展覽，并提供重要的訪(fǎng)客信息，如小時(shí)和票務(wù)信息。SFMOMA也做了所有這一切，但是在一個(gè)更美麗的方式。

我們可以看到站在他們面前的訪(fǎng)客的視頻，而不是其中一些更值得注意的作品的圖像，而是從一個(gè)視角拍攝出來(lái)，讓您感覺(jué)自己像是在那里。這些剪輯提供了一些您在訪(fǎng)問(wèn)時(shí)將體驗(yàn)到的一瞥。這是一個(gè)有效利用英雄視頻，傳達(dá)他們的博物館經(jīng)驗(yàn)。

直觀(guān)的導(dǎo)航，雅致的字體，以及對(duì)作品的強(qiáng)烈關(guān)注，使得SFMOMA的網(wǎng)站能夠反映出他們墻上的偉大藝術(shù)。

R2D3

我們?cè)L問(wèn)的大多數(shù)網(wǎng)站似乎與某種商業(yè)有關(guān)。但是，我們絕對(duì)不應(yīng)該網(wǎng)站的潛力也很大。

R2D3只是通過(guò)他們的“機(jī)器學(xué)習(xí)的視覺(jué)介紹”。通過(guò)一系列動(dòng)畫(huà)，他們能夠以相對(duì)簡(jiǎn)單的方式傳達(dá)這個(gè)復(fù)雜的概念。這使得學(xué)習(xí)一個(gè)有吸引力的體驗(yàn)，比盯著教科書(shū)中的單詞和數(shù)字更有趣。

在這個(gè)模塊中，他們使用關(guān)于舊金山和紐約的家庭屬性的數(shù)據(jù)集來(lái)顯示計(jì)算機(jī)如何利用統(tǒng)計(jì)學(xué)習(xí)解決問(wèn)題。對(duì)于像我這樣的非數(shù)學(xué)人士，本教程保持了我的興趣，我感到我對(duì)這個(gè)概念有了更深入的了解。

R2D3使用引人注目的動(dòng)畫(huà)向我們展示機(jī)器學(xué)習(xí)的工作原理。

對(duì)等空間

Peerspace正在改變?nèi)藗兝煤蛯ふ覄?chuàng)意和商業(yè)追求空間的方式。

Peerspace旨在將創(chuàng)意和其他企業(yè)家連接到短期空間。無(wú)論是針對(duì)彈出式商店還是拍攝場(chǎng)所，Peerspace都希望讓位置保持一個(gè)簡(jiǎn)單的過(guò)程。

他們的審查年度不僅看起來(lái)很酷，還有其微妙的粉彩和風(fēng)格化的標(biāo)題處理，但也創(chuàng)造了一個(gè)以“我們創(chuàng)造經(jīng)驗(yàn)如何改變”為主題的敘述。從創(chuàng)建彈出式商店連接的網(wǎng)絡(luò)零售商他們的客戶(hù)，在健身房外的其他體力活動(dòng)，這些都是Peerspace提供解決方案來(lái)找到位置的所有領(lǐng)域。雖然這些元素的放置似乎沒(méi)有什么韻律或理由，但這種隨機(jī)性增添了一種古怪的個(gè)性感，似乎是品牌的核心。

Peerspace也很好的讓客戶(hù)講故事。通過(guò)照片，視頻和寫(xiě)作，我們可以了解Peerspace如何幫助他們。

然而，值得注意的是，這個(gè)內(nèi)容的不幸數(shù)量是通過(guò)圖像傳遞的。這顯著損害了頁(yè)面的SEO及其可訪(fǎng)問(wèn)性，所以我們不得不想知道為什么他們走這條路線(xiàn)。

原創(chuàng)不易，未經(jīng)授權(quán)，嚴(yán)禁轉(zhuǎn)載

原文地址：http://mpian.cn/i,72,7302,0.html

上一篇：精準(zhǔn)的SEO可以推動(dòng)網(wǎng)站流量和業(yè)務(wù)的收入

下一篇：內(nèi)容閃耀的創(chuàng)意布局--獨(dú)特的網(wǎng)站事例之二