1、求取一份用ps cc設計的web網頁和移動界面設計的視頻教程,謝謝
1、首先需要創建一個新文檔,大小 1200*1172px,背景設置為#efefef
2、使用矩形工具,在所創建新的圖層內一個大的灰色矩形,命名「Grey」,大小1200*62px。
3、為這個Grey矩形添加如下圖層樣式。
4、在Grey圖層上方再新建一個圖層Image,再該層添加另一個形狀,但這次我將使用圓角矩形工具。加入選擇一張如下圖漂亮的夢幻圖片。
5、對這張夢幻圖片,添加一些圖層樣式,如下。
6、在大圖片下面,繼續創建4個小矩形。嘗試使用不同的顏色。
我使用的尺寸是222*182px。顏色值分別是:#f15522、#66aa44、#eea411、#1188cc
7、現在我們做一下小顏色塊上的高光效果。
創建另一個層(按CTRL + SHIFT + ALT + N),在高光層內,添加白色到透明的徑向漸變。
8、調整該高光層的混合模式為疊加,同時改變不透明度為50%.
9、復制該高光層到每個顏色圖層上方。
10、接下來做導航部分。
在網站布局的頂部,將創建一個新的矩形。
11、對該層使用下面的圖層樣式。
12、創建一個小圓橢圓工具,直徑22px。
13、對這個小圓,添加下面的圖層樣式。
14、現在進行圓形的重要的調整,刪除圓形下半部。有兩種方法:
①、首先需要右鍵單擊層在你的圖層面板中,然後使用矩形選框工具選擇的下半部分的圓圈,按鍵盤上按上刪除。
②、另一種方式是柵格化的該圓形路徑,使用橡皮擦。
15、為導航添加Icon。
這個導航樣式適合比較簡約版Icon,並做出凹陷進去的圖層質感。
16、對於所有這些Icon,添加下面的圖層樣式。
17、在Icon之間,加入一些垂直分割線。
18、分割線設置如下的圖層樣式。
19、下一步是為網頁加入Logo。
20、使用圓角矩形工具,在Image圖層底部添加另一個的形狀。
21、為該矩形添加下面的圖層樣式。
22、使用橢圓工具繼續添加一些小圓形。
23、在顏色矩形右上方,使用橢圓工具繪制一個圓形。
24、選擇圓形圖層,創建剪切模板。
25、對於這個白色圖形,添加下面的圖層樣式
26、復制該樣式,到每個顏色框的右上方,並保持相同的空間比例。
27、然後添加另一個圖標,和一些標題文本。
28、繼續完善內容,注意正文內容較多時,要文字比例比較小,同時採用與標題字顏色反差,這樣能突顯出Title的醒目性,並在其間加入橫向分割線。
29、最後一個步驟,添加另一個文本與橫排文字工具。
30、這是最後的結果。希望你會喜歡它。
您可以使用該Web布局,加以細微的修改,使得它成為另一個Wordpress主題。
2、PS怎麼簡單的設計UI界面
ui設計需要的基礎就是一些簡單的美術基礎和平面設計基礎,要求也不算高,你這版個情況應該沒問題權,編程不太需要。一般流程是這樣的,大致5個階段,PS ,Illustrator , DW,InDesign都會用到。
第一階段 UI用戶設計基礎(UI行業發展及UI設計師職業規劃,美術基礎,平面設計基礎,圖形與創意設計,網頁設計基礎,互動式網站),軟體:Photoshop、Illustrator
第二階段 移動界面設計(圖標創意思路與方法,圖標的創作設計,主題圖標設計,Ios系統Android系統Windows phone系統,UI設計實訓課程)
第三階段 交互類(UCD,交互設計高級技術)
第四階段 流程設計(界面開發對接,流程管理,移動媒體綜合開發實訓)
第五階段 綜合項目實訓及就業階段(根據所學內容,選擇一種移動平台(IOS/Android/Winphone),軟體界面,WUI類型設計,完成初稿設計。依據項目初期確定的需求進行驗收,並簽署驗收報告)
3、做網頁界面設計一定要用PS出PSD文件嗎
做界面設計當然要保存psd文件,這樣便於修改,導出成jpeg就不能再次編輯修改了
4、UI設計和網頁美工的區別是什麼
UI設計只是網站美工的一部分,網站美工需要學習的內容有UI設計,PS,AI,html語言,javaScript語言等。
網頁美工局限於美術設計和頁面製作,UI注重交互,用戶體驗是第一目標。
UI設計師的職能大體包括三方面:一是圖形設計,軟體產品的產品「外形」設計。二是交互設計,主要在於設計軟體的操作流程、樹狀結構、操作規范等。一個軟體產品在編碼之前需要做的就是交互設計,並且確立交互模型,交互規范。三是用戶測試/研究,這里所謂的「測試」,其目標恰在於測試交互設計的合理性及圖形設計的美觀性,主要通過以目標用戶問卷的形式衡量UI設計的合理性。
網頁美工需要學習網站概念知識、色彩構成、網頁設計中的美學規律、FIREWORKS網頁圖形處理、FLASH二維動畫、PHOTOSHOP平面設計軟體在網站設計中的應用、作品設計及點評等內容。
UI設計:UI即User Interface(用戶界面)的簡稱。UI設計則是指對軟體的人機交互、操作邏輯、界面美觀的整體設計。好的UI設計不僅是讓軟體變得有個性有品味,還要讓軟體的操作變得舒適、簡單、自由、充分體現軟體的定位和特點。
網頁美工:是精通美學,photoshop(PS),FLASH,dreamwaver(DW)等一網站製作軟體的網路人員,必須具有良好的創意和一定程度的審美觀。必要時需要一定的策劃知識。為網站所有的頁面畫出來並用DW和css排版出來。頁面必須清晰簡潔,還要適宜後台調用。
5、剛學完網頁設計,想用ps設計個網頁界面,可不知從何下入手
一般顯示器解析度 寬:1024 高: 768 寬減去滾動條的寬度, 一般為1003-1004 不會有橫拉條 高度 根據頁而定
開始不知如何下手的話,可以 下些模板 模仿人家的做,
培養下美感 , 有一定 基礎了 在自己設計 ...
多做多練 就好了 現在 一般都是 用表格和 DIV 做
反正不論哪種 都可以,
6、推薦一本關於網頁界面效果設計的ps書籍?
其實你不需要買書的,要做頁面效果設計首先你得會PS和dreamver,還有FW,這些你都學習一下,然後多看看別人設計的頁面。相信這些基礎的學好以後你對頁面效果自然有一個新的理解!如果你要決定從事網頁美工方面的建議你還是都學學,而且要精通!
7、網頁界面設計,PS做起來真心麻煩……用illustrator做好不好?為什麼?
好 ,各有各有優勢,有些功能AI無法實現或不方便實現,有些功能PS無法實現或不方便實現
取決於你對哪個軟體熟悉
8、怎麼用ps做出界面設計?
1、打開ps,新建一張790*400的畫布。
2、Alt+Delete 填充背景色為 #1c46e3,並為其添加漸變疊加圖層樣式。
3、選擇圓版角矩形工具,權創建 250*90圓角半徑2像素 的白色圓角矩形,並為其添加圖層樣式。
4、到此為止的效果如下圖。
9、如何將PS設計好的一幅完整的產品圖片做成可以在網頁以點擊不同的圖片進入到產品的詳細界面
把圖片放到網頁中加個超鏈接,鏈接到那個詳細界面的地址就好了