解析PS的Velositey插件在網(wǎng)頁(yè)設(shè)計(jì)中應(yīng)用

2019-12-24 15:16:20 來(lái)源/作者: 互聯(lián)網(wǎng) / 華恒 己有:871人學(xué)習(xí)過(guò)

解析PS的Velositey插件在網(wǎng)頁(yè)設(shè)計(jì)中應(yīng)用,PS教程網(wǎng)

在這個(gè)案例中,我們使用的Header的樣式是Logo在左,導(dǎo)航在右。在圖層面板中,你可以看到Header中所有圖層均置于文件夾中,你可以根據(jù)需求進(jìn)行命名。

解析PS的Velositey插件在網(wǎng)頁(yè)設(shè)計(jì)中應(yīng)用,PS教程網(wǎng)

注意:如果你隨后選擇其他的Header,Velositey會(huì)幫你替換掉。

增加Slider區(qū)域(Slider Section)

盡管大尺寸Banner和slider區(qū)域有缺陷,但是很多網(wǎng)站依然選擇保留這個(gè)區(qū)域。Velositey中內(nèi)置了許多樣式,增加slider區(qū)域和添加Header一樣容易,點(diǎn)擊選擇即可。

解析PS的Velositey插件在網(wǎng)頁(yè)設(shè)計(jì)中應(yīng)用,PS教程網(wǎng)

案例中,我們選擇最后一個(gè)slider樣式,于是就生成了一個(gè)包含標(biāo)題、內(nèi)容和兩個(gè)按鈕的slider區(qū)域。

解析PS的Velositey插件在網(wǎng)頁(yè)設(shè)計(jì)中應(yīng)用,PS教程網(wǎng)

正如上圖所示,你可以在圖層面板中看到slider區(qū)域的圖層分組。

增加內(nèi)容區(qū)域

增加內(nèi)容區(qū)域也一樣簡(jiǎn)單。Velositey中第三個(gè)選項(xiàng)卡就是內(nèi)容區(qū)域。

解析PS的Velositey插件在網(wǎng)頁(yè)設(shè)計(jì)中應(yīng)用,PS教程網(wǎng)

我選擇了第三個(gè)樣式,點(diǎn)擊后添加了三列內(nèi)容,每列包含標(biāo)題、圖片和預(yù)制的內(nèi)容。

解析PS的Velositey插件在網(wǎng)頁(yè)設(shè)計(jì)中應(yīng)用,PS教程網(wǎng)

增加更多模塊

在Velositey中,每個(gè)模塊相當(dāng)于一個(gè)獨(dú)立的內(nèi)容塊。它的內(nèi)容和用途由設(shè)計(jì)師來(lái)決定。和Header、滑塊區(qū)域不同,我們可以在文檔中添加多個(gè)模塊。

解析PS的Velositey插件在網(wǎng)頁(yè)設(shè)計(jì)中應(yīng)用,PS教程網(wǎng)

在案例中,我們添加了第一個(gè)模塊,其中包含一個(gè)橫跨整個(gè)柵格的圖片,標(biāo)題和預(yù)制的文本。

解析PS的Velositey插件在網(wǎng)頁(yè)設(shè)計(jì)中應(yīng)用,PS教程網(wǎng)

添加Footer

通常網(wǎng)頁(yè)的最底下都會(huì)添加Footer,同樣的,Velositey為我們內(nèi)置了一些可選的Footer:

解析PS的Velositey插件在網(wǎng)頁(yè)設(shè)計(jì)中應(yīng)用,PS教程網(wǎng)