網站制作NEWS
Photoshop制作流暢的動態(tài)APP演示動畫
動態(tài)已成趨勢,相比靜態(tài),更直觀,更能展示產品效果。本教程將教你用PS制作動態(tài)演示GIF教程,本教程使用了PS CC,但是CS5和CS6依然能夠支持本教程。然后您還需要下載手機Mock UP效果模板和一些圖庫照片。
1、靜態(tài)設計
步驟1:新建畫布
步驟2:視圖>新建參考線,垂直,間隔15px,左面4條,右面4條;視圖>新建參考線,水平,在40px,128px,220px處設置水平參考線,完成后效果如下圖。
步驟3:在畫布上添加狀態(tài)欄,也就是第一條水平參考線上方40px處,狀態(tài)欄各位可以從源文件里面直接復制獲取。
或者參考IFEC翻譯的這篇文章:Photoshop設計iOS7風格的郵件軟件應用
下一步,創(chuàng)建新圖層,然后在40px和128px之間創(chuàng)建選區(qū),填充顏色#2c3137.
步驟4:在標題欄添加應用的標題和Logo
步驟5:畫一個放大鏡icon,圓形結合圓角矩形即可,顏色和App Logo相同。再畫一個選項icon,圓角矩形即可,顏色和App Logo相同。
步驟6:在128和220px水平參考線之間的區(qū)域創(chuàng)建選區(qū),填充顏色和上一選區(qū)顏色一樣。然后在兩個區(qū)域之間添加2px,不透明度80%的亮色的分割線。
步驟7:選擇文字工具,添加分類;為了暗示所選中的分類,所選中的分類要用粗體、亮色;其他用普通粗細,暗色。
然后“雜志”復制一份,使用粗體+亮色,然后不透明度設置為0%,暫時隱藏,“首頁復制一份”,常規(guī)體+暗色,不透明度設置為0%,暫時隱藏
多重隨機標簽