04.01 Photoshop教程 網頁設計 華麗的房地產網頁設計首頁效果

本教程介紹高檔商業網站的設計過程和方法。作者為大師級別的高手,製作當然非常講究。畫面構成簡潔大氣,素材安排恰到好處。色彩渲染層次感強。總體非常經典,值得學習。

Photoshop教程 網頁設計 華麗的房地產網頁設計首頁效果

下面是詳細分析

1、前期素材準備,去網上搜集一些華麗,有氣派的素材圖片,根據下圖標誌風格選擇一些歐式華麗素材。(這裡只能大家展示了部分本案例用到的素材)

Photoshop教程 網頁設計 華麗的房地產網頁設計首頁效果

Photoshop教程 網頁設計 華麗的房地產網頁設計首頁效果

Photoshop教程 網頁設計 華麗的房地產網頁設計首頁效果

2、先將畫面分成上中下三欄,Logo中間排列,菜單有金屬感,將菜單指示效果做成金屬感,菜單間的空隙要比Logo左右兩邊的空隙小,利用調整圖層控制Logo背景的光效,為了增強菜單背景的肌理質感,適當在背景上鋪上歐式花紋。

Photoshop教程 網頁設計 華麗的房地產網頁設計首頁效果

3、將城市背景元素加進來,需要自己找相關的素材。背景城市在放置的時候一般要重心下移,留出天空的位置,也要留出位置方法廣告詞,不要把畫面塞得很滿,畫面有透氣感才好。

Photoshop教程 網頁設計 華麗的房地產網頁設計首頁效果

4、城市背景與天空混合。把城市圖層混合模式改為“正片疊底”,在城市圖層下面新建一些圖層,用鋼筆工具將大樓的外輪廓勾出來,用白色填充,多做幾個圖層分別填充白色,便於以後修改。然後用調整圖層將右邊天空的雲彩調亮。

Photoshop教程 網頁設計 華麗的房地產網頁設計首頁效果

Photoshop教程 網頁設計 華麗的房地產網頁設計首頁效果

Photoshop教程 網頁設計 華麗的房地產網頁設計首頁效果

5、接下來擺放主體元素,用帝王,地標建築代表巔峰,傲視群雄。這是要表達的核心元素。主體元素可以使人或物,如寶座、權杖、皇冠等。擺放元素要注意大小、位置、比例要合適,主元素造型要完整,大部分必須整體沒有缺失。

Photoshop教程 網頁設計 華麗的房地產網頁設計首頁效果

6、擺放廣告詞的地方,背景圖形不要太複雜,廣告詞是重色背景就要淺些,廣告詞的背景是深色,廣告詞就用淺色,一般的地產廣告詞由主標題、副標題、說明文字、英文翻譯組成。

Photoshop教程 網頁設計 華麗的房地產網頁設計首頁效果

7、整體調色:

首先是VI色:VI色決定畫面的色調關係,確定後畫面是暖調還是冷調,亮調還是暗調;然後是色彩冷暖:色彩冷暖是指在同一色調範圍內色彩關係要有冷暖對比。還有色彩協調:色彩協調指色彩在對比的基礎上達到統一協調均衡。

Photoshop教程 網頁設計 華麗的房地產網頁設計首頁效果

完成最終效果

Photoshop教程 網頁設計 華麗的房地產網頁設計首頁效果


分享到:


相關文章: