第1步

讓我們開始設(shè)計！首先，這不是一個基本的教程，所以我會跳過一些基本的解釋。無論如何，與中間的任何人-Photoshop技能的先進(jìn)水平，將是能夠做到這一點。第二，它真的很難得到完全相同的結(jié)果，我有，你必須使用你的想象力和口感好，得到類似或比我更好的設(shè)計。第三，這是考慮到一個WordPress模板的應(yīng)用而設(shè)計，但你可以迅速轉(zhuǎn)換成另一個引擎的主題，甚至是自定義網(wǎng)站。

向前走呢！創(chuàng)建一個新的文件960像素，1000像素，RGB。得出一些指導(dǎo)，以紀(jì)念限制，去圖像>畫布大小調(diào)整的文件，使畫布的寬度大（1460×1000像素）。這樣，你有你的設(shè)計集中到一個大文件，看看它是如何看起來寬屏分辨率。此外，提請為指導(dǎo)，以紀(jì)念頭高度。

在文檔中繪制水平的指導(dǎo)，并使用它來填充一個深藍(lán)色的徑向漸??變（＃0D2B53-＃010D1F）的“背景”層。我也加入幾個主要頁面的左側(cè)和右側(cè)的填充邊界的指南。

這是非常有可能，我們將改變文檔的高度，所以添加新的填充層下面的“背景”層（＃010D1F）。

由于PSDTUTS+讀者建議采用經(jīng)典云過濾器，而不是真正的圖片，我們會嘗試，這一次。粘貼到一個新層命名為“云”的一些風(fēng)暴云，圖片和改變其混合模式為疊加。然后去圖層>圖層蒙版>隱藏所有，并繪制從白色到黑色的徑向漸??變（＃FFFFFF的-＃000000），從頂部中間幾乎底部中間。然后調(diào)整“云”水平一點點云暗。

現(xiàn)在粘貼一個新的圖層，并命名為一個西班牙海岸漂亮的天際線“的天際線。”然后創(chuàng)建一個新的調(diào)整圖層>通道混合器，選擇黑與白，藍(lán)過濾器（RGB）。然后應(yīng)用，效果只是“地平線”在圖層調(diào)板的層，按住Option鍵并單擊“通道混合器”層和“天際線”層之間。最后，改變“天際線”圖層的混合模式為疊加。

應(yīng)用圖層蒙版>顯示全部“天際線”層。然后用一個大的黑色（＃000000）軟刷隱藏圖像的邊界，然后選擇一個垃圾刷（我使用這個垃圾套刷Kelzky13，尤其是刷250和181）和多一點點的邊界不規(guī)??則。

下一步類型的題目是“魔術(shù)師”使用Scriptina字體。然后應(yīng)用圖層樣式如下所示：外發(fā)光（＃9EB6D0）和一個漸變疊加（＃70ABF6，＃FFFFFF，＃B4CBE7，＃FFFFFF的）。另外，現(xiàn)在是一個好時機(jī)，組織到文件夾中，我們的開發(fā)設(shè)計。所有圖層放入一個新的文件夾命名為“背景”和另一個文件夾內(nèi)名為文本“的標(biāo)志?！?/p>

現(xiàn)在我們將添加一些明星到我們的設(shè)計，你可以使用任何明星套刷，但我使用的這一套：星域刷BL1nX。然后用刷550集，繪制成新層命名的文件夾內(nèi)的白色（＃FFFFFF）明星“明星。”請注意，我把我點了最耀眼的明星。到的“Stars1的”層使用三種顏色（＃3A8FEF，＃FFFFFF的，＃66C9FC的），然后應(yīng)用一個漸變疊加。

接下來，使用615刷星域集，添加更多的恒星向天空，將命名為一個新層“Stars2”，然后用柔軟的橡皮擦，刪除了建筑物的星星。接下來，添加一個外夜光（＃8AB2FF），“Stars2。”

加入更多的明星“星2”跨層設(shè)計，然后使用橡皮擦工具，刪除一些地區(qū)的明星。最后，應(yīng)用一個漸變疊加效應(yīng)“Stars2”層，使用四種顏色：＃6AB1D1，＃FFFFFF的，94CFED＃，＃FFFFFF的。

現(xiàn)在下載這些明星刷仁妮，保持刷子方便，因為他們在本教程中我們將使用幾次。選擇一個65像素的畫筆（我使用的是148號）和成上面我點的新層，畫一個白色（＃FFFFFF）明星。然后套用外夜光（＃00BCF9），使其變亮的星。

重復(fù)的“魔術(shù)師”的文本，選擇文本，然后鍵入單詞“夜”，在它的地方。接下來，設(shè)置外發(fā)光，白色（＃FFFFFF）和漸變疊加三種顏色（＃F9DA5B，＃FEAE00，和＃FFD403），看到下面的圖片來檢查過濾器的值。

讓我們添加一些云的夜晚！下載redheadstock的云二刷。下一步，選擇刷人數(shù)2464，并設(shè)置其大小為960px（匹配的設(shè)計布局的主要寬度）。設(shè)置前景色為＃234B7F并粘貼到一個新的圖層，并命名為一個單一的云“cloud1?！睘榱吮３纸M織層，我把云成單獨的文件夾內(nèi)的“背景”的文件夾?，F(xiàn)在的的“cloud1”高度伸展一點點。

之后，道奇和燒傷云位。請注意，我減輕該地區(qū)的標(biāo)志明星和暗云的底部。此外，改變“cloud1”的不透明度為50％。

加入一個新的圖層，并命名為“cloud2更多的云”您可以使用任何你喜歡的云，但使用這個作為一個前景色：＃5F83A5?；乇茉埔稽c點的底部，以改善照明轟動。

重復(fù)前面的步驟，但這個時候，使用這種顏色的另一個刷：＃36638C和凌駕于“cloud1?！闭{(diào)整它的大小，然后道奇和/或燒傷的云，如果必要的。

選擇一個大的軟橡皮和刪除的的“cloud1”層創(chuàng)造出淡入淡出效果的底部。

這實際上是一個關(guān)鍵的一步，我們將添加的主要容器的背景，你必須永遠(yuǎn)不會忘記你的網(wǎng)頁設(shè)計。使用矩形工具繪制一個矢量矩形（＃0A1D37），將所有下面的“云”文件夾中的新層。請注意，我的矩形內(nèi)填充指南。然后選擇矩形層，去圖層>圖層蒙版>顯示全部…繪制一個白色到黑色的漸變，在矩形的頂端增加了一個不錯的效果。最后，滴在指南下面的矩形的淡入淡出，這將幫助我們，當(dāng)我們變成這種設(shè)計的HTML+CSS。通知，從指南的背景顏色的底部應(yīng)該是純。

現(xiàn)在添加另一個矩形，但這個側(cè)邊欄的背景時，再次與指導(dǎo)幫助自己，并使用顏色＃091525。然后，適用于新的矩形圖層蒙版，就像在上一步一點點。產(chǎn)品經(jīng)理。

在這一點上，我們已經(jīng)做了基本的標(biāo)題背景?，F(xiàn)在是時候添加一些細(xì)節(jié)。我會放在頭一個獨特的RSS圖標(biāo)。這幅畫的滿月復(fù)制并粘貼到一個新的圖層，并命名為“月球-RSS?！比缓笳{(diào)整色相/飽和度值，使月亮一點點黃色，添加內(nèi)外輝光過濾器（見下面所示的值）。

添加到新層以上的月亮在圖層調(diào)色板的顏色＃7997B3一個小的云形狀。然后用一個大的軟橡皮，刪除一些地區(qū)的新的云。

添加到新層在前面的“月亮”層的經(jīng)典RSS形狀（＃DCA30B），但背后的“云”層。然后，適用于如下所示的過濾器（一個漸變疊加，外發(fā)光和陰影）。最后，添加了RSS形狀明星的地方（見第10步）。

這個圖片粘貼到一個新的層，我們將使用它作為我們的主要頁面的導(dǎo)航欄的背景。由于原始圖像是有點捉襟見肘，我們需要作出更廣泛的，我打的選擇和移動（自由變換）工具，以增加滾動的寬度。然后經(jīng)滾動使用該標(biāo)志經(jīng)只是一點點。

躲閃滾動一些地區(qū)增加陰影和提高經(jīng)紗的錯覺。

為了提高滾動的質(zhì)感，應(yīng)用一個漸變疊加過濾器（＃045F96和FBF4BD的）和圖案疊加。

現(xiàn)在添加一個滾動的陰影。您可以使用投影濾鏡，或做什么，我做的，重復(fù)的滾動層，調(diào)整色相/飽和度的減負(fù)-100，模糊一點點黑色的副本和自由變換工具，以使其不規(guī)則扭曲。

接下來，添加了滾動的云，道奇，燒傷和刪除，就像在第15步。然后添加網(wǎng)頁鏈接的文本，用格魯吉亞-斜體。使用標(biāo)準(zhǔn)的鏈接顏色＃0B1827，和懸停的鏈接的顏色＃211808。此外，像星的背景和懸停效果行添加一些額外的細(xì)節(jié)。你可以看到下面的圖片底部的層結(jié)構(gòu)。

作為一個頁面的導(dǎo)航欄上的最后細(xì)節(jié)，創(chuàng)建一個新層以上的滾動和使用顆粒刷，畫一條線，就像是一幅水彩畫（見下??面的圖片）。做了幾次，但使用不同的顏色。此外，下導(dǎo)航欄的“明星”低于40％的不透明度。

新增RSS相關(guān)的文本。我使用的是10像素的詠嘆調(diào)，用黃色（＃F2C90D）和白色（＃FFFFFF）。不要忘記設(shè)置抗鋸齒的方法沒有，因為大多數(shù)的瀏覽器呈現(xiàn)的文字，沒有任何抗鋸齒（IE7和Safari是例外）。

作為一個額外的細(xì)節(jié)，加上這幅畫，一個漂亮的氣球。從背景中提取氣球放在某處的標(biāo)志，它相匹配的場景顏色的“氣球”層添加顏色疊加（＃1F416E-混合模式：疊加）。此外，你可以燃燒的氣球的左側(cè)只是一點點。

接下來使用畫筆添加多顆以上的氣球和滾動的星域刷615（見第8步）。我還加入了和弦的氣球與3PX堅實的刷畫一個白色的曲線。此外，使用橡皮擦，在這里和那里的恒星，以減少金額。

這是添加后的時間。首先，添加一個新層，并命名為“文章的標(biāo)題和元數(shù)據(jù)行?！笨吹较旅娴膱D片查看字符值。另外，我也加入附近的一個小星星的元數(shù)據(jù)作為一個可視化的細(xì)節(jié)。

讓“郵報”的文件夾添加到更多的信息，因為在網(wǎng)頁上的列表，將有幾個后的預(yù)覽。我們將添加在左邊的預(yù)覽圖像（一個1px的描邊效果由200像素200像素），在簡短的文字的權(quán)利。同時，我們將添加一個預(yù)覽后，右上方有多少意見。意見欄，創(chuàng)建一個新文件夾命名為“評論”，并添加一個小的云和一些小星星小背景。基本上，只是重復(fù)前面的步驟，當(dāng)我們在設(shè)計的頭之一，但在一個微小的措施。然后添加了一些意見和下面的一句話點評。

接下來，添加一個標(biāo)簽以下后線，并增加在該行右邊的小明星。作為背景后加入一點點的星域，只是如果你想。最后，畫出分頻器（＃1D324F），使用行工具后。

然后重復(fù)“郵報”的文件夾和編輯的副本，以創(chuàng)建兩個或三個不同職位。需要增加在這一點上，您的文檔的高度，這是非?？赡艿?，只是做它通過使用裁剪工具或圖像>畫布大小，突出部分想在第1步。當(dāng)你調(diào)整大小，您的主文檔，增加雙方的主要背景和側(cè)邊欄背景以及高度。

讓側(cè)邊欄上現(xiàn)在的工作。我們要添加的搜索表單。創(chuàng)建一個新文件夾命名為“邊欄”和它里面創(chuàng)建另一個文件夾，并將它命名為“搜索”。吸引到該文件夾??中的云和??躲閃和Bur這使它看起來像下面的圖片。然后用圓角矩形工具，繪制一個矩形在云中。套用1px的描邊效果：（＃697372）矩形，并改變其填充值50％。

使用任何星域?qū)右陨系脑茖犹砑右恍┌咨切牵浀们宄卸嘤嗟男?。然后重?fù)，減少和編輯>水平翻轉(zhuǎn)“氣球”的步驟29層。投入的“搜索”文件夾。此外，添加標(biāo)題文字的使用斜體格魯吉亞和一個很好的黃色（＃D5A934）顏色。下一步添加搜索指令和按鈕“去！”。你可以看到下面的圖像底部的字符的值。作為最后的細(xì)節(jié)，后面的文字繪制單一的一顆璀璨的明星。

添加側(cè)邊欄內(nèi)容的文字，標(biāo)題，鏈接，并放入一個單獨的文件夾中的每個部分。此外，添加每個文件夾的軟星域背景和每個標(biāo)題后面閃亮的明星。此外，添加任何一個環(huán)節(jié)上的懸停效果的例子作為一個閃亮的明星。不要忘記padding和margin指南。

我們到達(dá)結(jié)束。讓側(cè)邊欄添加一個頁腳。首先，側(cè)邊欄的背景畫的底部用軟刷上的圖層蒙板有點淡出。接下來繪制少云，然后減淡和加深。確保云不入侵的主要內(nèi)容背景或超過側(cè)邊欄的寬度。然后添加云層后面白色的星域，并再次重復(fù)氣球。我保存到一個文件夾名為“側(cè)欄頁腳?！?/p>

最后，我們將創(chuàng)建頁腳。第一層的主要內(nèi)容背景的面膜使用一個大的軟筆刷，隱藏在底部褪色。然后選擇一些云畫筆和畫整個設(shè)計的底部。我結(jié)合大暗藍(lán)色（＃0B1C38）云和小藍(lán)＃223E63）云，在下面的圖片所示。請記住，這些云將成為一個背景圖像，所以盡量不交叉內(nèi)容和頁腳之間的指南。此外，記得把頁腳的所有相關(guān)層的一個新文件夾，并命名為“頁腳”。

燒傷最輕云。然后，通過刷星集615繪制一個白色的星域。之后，用不同的刷子繪制一個光明的星域，在這種情況下，656集。最后，刪除星域，用柔軟的大橡皮擦。

我希望你找到這個嘖嘖有用。Plus會員可以下載PSD文件，并修改任何你想要的，添加或刪除的詳細(xì)信息，并創(chuàng)建自己的星空設(shè)計。

。