1. <dd id="nlasp"></dd>

        <div id="nlasp"><tr id="nlasp"></tr></div>
        1. <em id="nlasp"></em>
          1. 當前位置: 首頁 > 設計教程 > 網頁設計教程 > Photoshop設計移動APP應用類型網站

            Photoshop設計移動APP應用類型網站

            最終效果

            Photoshop設計移動APP應用類型網站

            教程所需素材

            所有素材打包下載:http://urlxf.qq.com/?JRbqE37

            第一步

            新建(Ctrl + N)一個 1200 x 1150 px,背景為:#FFFFFF的文檔。使用“矩形選擇工具”(M)畫一個 1200 x 220px的矩形框,然后填充顏色(此顏色不做固定要求)。

            Photoshop設計移動APP應用類型網站

            接下來,我們把剛剛創建的圖層命名為“header”。使用“圓角矩形工具”(U)并設置半徑為20px。

            Photoshop設計移動APP應用類型網站

            畫一個950 x 60px 的圓角矩形

            Photoshop設計移動APP應用類型網站

            命名圓角矩形圖層“Navigation“。重新選擇圓角矩形工具(U)然后在“Navigation“右上方再次拖出一個圓角矩形作為搜索框。把該層命名為 “Search”。

            Photoshop設計移動APP應用類型網站

            第二步

            選擇 “Header” 圖層 按照如下設置添加”圖層樣式“

            投影設置:不透明度:34%;角度:90度;距離:5px; 大小:5px;

            Photoshop設計移動APP應用類型網站

            漸變疊加

            Photoshop設計移動APP應用類型網站

            在“Header”圖層上方建立一個發光圖層并命名為“Header Glow”. 選擇 “Header”圖層并執行命令 “圖層 >載入選區”選擇 “漸變工具” (G) “鏡像漸變”. 如圖所示。

            Photoshop設計移動APP應用類型網站

            然后把剛剛設置的圖層透明度降低為“15%”

            Photoshop設計移動APP應用類型網站

            分享到: 
            Photoshop設計透明質感的產品介紹頁面
            Photoshop設計簡潔大方的網頁UI

            熱門推薦

            体彩11选5开奖查询