壹、UI設計、平面設計、網站設計的簡單介紹：
①-UI設計的定義：
UI即User Interface(用戶界面)的簡稱。UI設計是指對軟件的人機交互、操作邏輯、界面美觀的整體設計。好的UI設計不僅是讓軟件變得有個性有品位，還要讓軟件的操作變得舒適簡單、自由，充分體現軟件的定位和特點。
軟件設計可分為兩個部分：編碼設計與UI設計。UI的本意是用戶界面，是英文User和 Interface的縮寫。從字面上看是用戶與界面2個部分組成，但實際上還包括用戶與界面之間的交互關系。
在飛速發展的電子產品中，界面設計工作壹點點的被重視起來。做界面設計的“美工”也隨之被稱之為“UI設計師”或“UI工程師”。其實軟件界面設計就像工業產品中的工業造型設計壹樣，是產品的重要賣點。壹個電子產品擁有美觀的界面會給人帶來舒適的視覺享受，拉近人與商品的距離，是建立在科學性之上的藝術設計。檢驗壹個界面的標準既不是某個項目開發組領導的意見也不是項目成員投票的結果，而是終端用戶的感受。
②-平面設計的定義:
平面設計（graphic design），也稱為視覺傳達設計，是以“視覺”作為溝通和表現的方式，透過多種方式來創造和結合符號、圖片和文字，借此作出用來傳達想法或訊息的視覺表現。平面設計師可能會利用字體排印、視覺藝術、版面（page layout）、電腦軟件等方面的專業技巧，來達成創作計劃的目的。[1]?平面設計通常可指制作（設計）時的過程，以及最後完成的作品。
平面設計的常見用途包括標識（商標和品牌）、出版物（雜誌，報紙和書籍）、平面廣告，海報，廣告牌，網站圖形元素、標誌和產品包裝。例如，產品包裝可能包括的商標或其他的藝術作品、編排文本和純粹的設計元素，如風格統壹的圖像，形狀，大小和顏色。組合是平面設計的最重要的特性之壹，尤其是當產品使用預先存在的材料或多種元素融合。
③-網站設計的定義：
簡單來說，網站設計的目的就是產生網站。簡單的信息如文字，圖片（GIFs， JPEGs，PNGs）和表格，都可以通過使超文件標示語言、可擴展超文本標記語言等標示語言放置到網站頁面上。而更復雜的信息如矢量圖形、動畫、視頻、聲頻等多媒體檔案則需要插件程序來運行，同樣地它們亦需要標示語言移植在網站內。網頁設計是設計過程的前端（客戶端）的設計通常用於描述壹個網站，包括寫標記，但是這是壹個灰色地帶，因為這還覆蓋了網絡的發展。網頁設計師預計將有意識的可用性，如果他們的作用，需要創建標記，那麽它們也有望成為最新的網頁易讀性指引。網站設計(Web Design)，網站設計是壹個把軟件需求轉換成用軟件網站表示的過程，就是指在因特網上，根據壹定的規則，使用Dreamweaver、photoshop等工具制作的用於展示特定內容的相關網頁的集合。簡單地說，網站是壹種通訊工具，就像布告欄壹樣，人們可以通過網站來發布自己想要公開的資訊（信息），或者利用網站來提供相關的網絡服務（網絡服務）。人們可以通過網頁瀏覽器來訪問網站，獲取自己需要的資訊（信息）或者享受網絡服務。網站它是由域名（俗稱網址），網站源程序和網站空間三部分構成。其中域名它是類似於互聯網上的門牌號碼，是用於識別和定位互聯網上計算機的層次結構式字符標識，與該計算機的互聯網協議（IP）地址相對應。而網站設計是設計師通過像Frontpage或Dreamweaver等工具來對網站進行編輯的！
二、UI設計、平面設計、網站設計所需的工具：
1、UI設計所需的軟件工具：
從左開始壹次為：Photoshop、Illustrator、CorelDraw、Indesign、Fireworks、DreamWeaver、Flash 、HTML5、CSS(Cascading?Style?Sheets)、Axure RP Pro 7.0、IOS、Android。
2、平面設計所需的軟件工具：
Photoshop、Illustrator、CorelDraw、Indesign、Fireworks、PageMaker。
3、網站設計所需的軟件工具：
①Photoshop：
學習圖像處理、編輯、通道、圖層、路徑綜合運用;圖像色彩的校正;各種特效濾鏡的使用;特效字的制作;圖像輸出與優化等,靈活運用圖層風格，流體變形及褪底和蒙板，制作出千變萬化的圖像特效。
②Freehand：
不論是個人作品設計、公司徽標、海報制作，都可以輕松完成，應用於廣告、印刷等行業
③CorelDraw：
通過CorelDRAW9的全方面的設計及網頁功能融合到現有的設計方案中，制作矢量的插圖、設計及圖像，出色地設計公司標誌、簡報、彩頁、手冊、產品包裝、標識、網頁及其它。
④Illustrator：學習圖形繪制、包裝、宣傳頁的制作，讓妳更加方便地進行LOGO及CI設計，不到壹個月，您就會成為壹名真正的美術大師，在 Photoshop的基礎上再學它如虎添翼，效率成倍提高。
⑤Microsoft FrontPage
如果妳曾對Word很熟悉，那麽相信妳用 FrontPage進行網頁設計壹定會非常順手。使用FrontPage制作網頁，妳能真正體會到“功能強大，簡單易用”的含義。頁面制作由FrontPage中的Editor完成，其工作窗口由3個標簽頁組成，分別是“所見即所得”的編輯頁，HTML代碼編輯頁和預覽頁。FrontPage帶有圖形和GIF動畫編輯器，支持CGI和CSS。向導和模板都能使初學者在編輯網頁時感到更加方便。
FrontPage最強大之處是其站點管理功能。在更新服務器上的站點時，不需要創建更改文件的目錄。FrontPage會為妳跟蹤文件並拷貝那些新版本文件。FrontPage是現有網頁制作軟件中惟壹既能在本地計算機上工作，又能通過Internet直接對遠程服務器上的文件進行工作的軟件。
⑥Netscape編輯器
Netscape Communicator和Netscape Navigator Gold3.0版本都帶有網頁編輯器。如果妳喜歡用Netscape瀏覽器上網，使用Netscape編輯器真是簡單方便!當妳用Netscape瀏覽器顯示網頁時， 單擊編輯按鈕，Netscape就會把網頁存儲在硬盤中，然後就可以開始編輯了。妳也可以像使用Word那樣編輯文字、字體、顏色，改變主頁作者、標題、背景顏色或圖像，定義描點，插入鏈接，定義文檔編碼，插入圖像，創建表格等，是不是與FrontPage 2000還有些像?但是，Netscape編輯器對復雜的網頁設計就顯得功能有限了，它連表單創建、多框架創建都不支持。
Netscape編輯器是網頁制作初學者很好的入門工具。如果妳的網頁主要是由文本和圖片組成的，Netscape編輯器將是壹個輕松的選擇。如果妳對HTML語言有所了解的話，能夠使用Notepad或Ultra Edit等文本編輯器來編寫少量的HTML語句，也可以彌補Netscape編輯器的壹些不足。
⑦Adobe Pagemill
Pagemill功能不算強大，但使用起來很方便，適合初學者制作較為美觀、而不是非常復雜的主頁。如果妳的主頁需要很多框架、表單和Image Map圖像，那麽Adobe Pagemill的確是妳的首選。 ? Pagemill另壹大特色是有壹個剪貼板，可以將任意多的文本、圖形、表格拖放到裏面，需要時再打開，很方便。
⑧Claris Home Page
如果使用Claris Home Page軟件，妳可以在幾分鐘之內創建壹個動態網頁。這是因為它有壹個很好的創建和編輯Frame(框架)的工具，妳不必花費太多的力氣就可以增加新的Frame(框架)。而且Claris Home Page 3.0集成了FileMaker數據庫，增強的站點管理特性還允許妳檢測頁面的合法連接。不過界面設計過於粗糙，對Image Map圖像的處理也不完全。
⑨DreamWeaver
自制動態HTML動畫的網頁
DreamWeaver是壹個很酷的網頁設計軟件，它包括可視化編輯、HTML代碼編輯的軟件包，並支持ActiveX、JavaScript、Java、Flash、ShockWave等特性，而且它還能通過拖拽從頭到尾制作動態的HTML動畫，支持動態HTML(Dynamic HTML)的設計，使得頁面沒有plug-in也能夠在Netscape和IE 4.0瀏覽器中正確地顯示頁面的動畫。同時它還提供了自動更新頁面信息的功能。
DreamWeaver還采用了Roundtrip HTML技術。這項技術使得網頁在DreamWeaver和HTML代碼編輯器之間進行自由轉換，HTML句法及結構不變。這樣，專業設計者可以在不改變原有編輯習慣的同時，充分享受到可視化編輯帶來的益處。 DreamWeaver最具挑戰性和生命力的是它的開放式設計，這項設計使任何人都可以輕易擴展它的功能。
⑩Fireworks ?
第壹款徹底為Web制作者們設計的軟件
Fireworks的來頭實在不小，它的出現使Web作圖發生了革命性的變化。Fireworks是專為網絡圖像設計而開發，內建豐富的支持網絡出版功能，比如Fireworks能夠自動切圖、生成鼠標動態感應的javascript。而且Fireworks具有十分強大的動畫功能和壹個幾乎完美的網絡圖像生成器(Export功能)。它增強了與dreamweaver的聯系，可以直接生成dreamweaver的Libaray甚至能夠導出為配合CSS式樣的網頁及圖片!
Flash讓妳的網頁動起來
Flash是用在互聯網上動態的、可互動的shockwave。它的優點是體積小，可邊下載邊播放，這樣就避免了用戶長時間的等待。FLASH可以用其生成動畫，還可在網頁中加入聲音。這樣妳就能生成多媒體的圖形和界面，而使文件的體積卻很小。FLASH雖然不可以像壹門語言壹樣進行編程，但用其內置的語句並結合JavaScripe，您也可做出互動性很強的主頁來。有人曾經說過：下個世紀的網絡設計人不會用FLASH，必將被淘汰出局!我相信這句話沒錯!
HotDog Professional ?制作要加入多種復雜技術的網頁
HotDog是較早基於代碼的網頁設計工具，其最具特色的是提供了許多向導工具，能幫助設計者制作頁面中的復雜部分。HotDog的高級HTML支持插入marquee，並能在預覽模式中以正常速度觀看。這點非常難得，因為即使首創這種標簽的Microsoft在FrontPage中也未提供這樣的功能。HotDog對plug-in的支持也遠遠超過其他產品，它提供的對話框允許妳以手動方式為不同格式的文件選擇不同的選項。但對中文的處理不很方便。
HotDog是個功能強大的軟件，對於那些希望在網頁中加入CSS、Java、RealVideo等復雜技術的高級設計者，是個很好的選擇。
HomeSite制作可完全控制頁面進程的網頁
Allaire的HomeSite是壹個小巧而全能的HTML代碼編輯器，有豐富的幫助功能，支持CGI和CSS等等，並且可以直接編輯perl程序。HomeSite工作界面繁簡由人，根據習慣，可以將其設置成像Notepad那樣簡單的編輯窗口，也可以在復雜的界面下工作。
HomeSite更適合那些比較復雜和精彩頁面的設計。如果妳希望能完全控制妳制作的頁面的進程，HomeSite是妳最佳選擇。不過對於生手過於復雜。
Microsoft Visual Studio是美國微軟公司的開發工具包系列產品。
該系列的版本有：2003、2005、2008、2010、2012、2013、2015、2015 RTM和未來的版本;
適合開發動態的aspx網頁，同時，還能制作無刷新網站、webservice功能等。
Jbuilder壹個可視化JAVA開發工具。它是在Java2平臺上開發商業應用程序、數據庫、發布程序的優秀工具。它支持J2EE，所以程序員可以快速的轉換企業版Java應用程序。
不論是各種版本，均適合使用其開發出JSP網頁。
三、UI設計、平面設計、網站設計的設計方向/方法/步驟/流程：
1、UI設計方向
UI是用戶界面，是英文User和 interface的縮寫。從字面上看是用戶與界面2個組成部分，但實際上還包括用戶與界面之間的交互關系，所以這樣可分為3個方向，他們分別是：用戶研究、交互設計、界面設計。
①、用戶研究
用戶研究包含兩個方面：壹是可用性工程學（usability Engineering），研究如何提高產品的可用性，使得系統的設計更容易被人使用、學習和記憶；二是通過可用性工程學的研究，發掘用戶的潛在需求，為技術創新提供另外壹條思路和方法。
用戶研究是壹個跨學科的專業，涉及可用性工程學、人類功效學、心理學、市場研究學、教育學、設計學等等學科。用戶研究技術是站在人文學科的角度來研究產品，站在用戶的角度介入到產品的開發和設計中。
用戶研究通過對於用戶的工作環境、產品的使用習慣等研究，使得在產品開發的前期能夠把用戶對於產品功能的期望、對設計和外觀方面的要求融入到產品的開發過程中去，從而幫助企業完善產品設計或者探索壹個新產品概念。
他是得到用戶需求和反饋的途徑，也是檢驗界面與交互設計是否合理的重要標準。
②交互設計
這部分指人與機之間的交互工程，在過去交互設計也由程序員來做，其實程序員擅長編碼，而不善於與最終用戶交互。所以，很多的軟件雖然功能比較齊全，但是交互方面設計很粗糙，繁瑣難用，學習困難。使用這樣的軟件後，不是使人聰明與進步而是讓人感到愚弄與羞辱。許多人因為不能操作電腦軟件而下崗失業，這樣的交互使電腦成為讓人恐懼的科技怪獸。於是我們把交互設計從程序員的工作中分離出來單獨成為壹個學科，也就是人機交互設計。他的目的在於加強軟件的易用、易學、易理解，使計算機真正成為方便地為人類服務的工具。
③界面設計
在漫長的軟件發展中，界面設計工作壹直沒有被重視起來。做界面設計的人也被貶義的稱為“美工”。其實軟件界面設計就像工業產品中的工業造型設計壹樣，是產品的重要買點。壹個友好美觀的界面會給人帶來舒適的視覺享受，拉近人與電腦的距離，為商家創造賣點。界面設計不是單純的美術繪畫，他需要定位使用者、使用環境、使用方式並且為最終用戶而設計，是純粹的科學性的藝術設計。檢驗壹個界面的標準即不是某個項目開發組領導的意見也不是項目成員投票的結果，而是最終用戶的感受。所以界面設計要和用戶研究緊密結合，是壹個不斷為最終用戶設計滿意視覺效果的過程。
2、平面設計的設計方法/步驟：
①、調查?
調查是了解事物的過程，設計需要的是有目的和完整的調查。背景、市場調查、行業調查（關於品牌、受眾、產品……）、關於定位、表現手法、……調查是設計的開始和基礎（背景知識）。
②、內容?
內容分為主題和具體內容兩部分，這是設計師在進行設計前的基本材料。
③、理念?
構思立意是設計的第壹步，在設計中思路比壹切更重要。理念壹向獨立於設計之上。也許在妳的視覺作品中傳達出理念是最難的壹件事。
④、調動視覺元素?
在設計中基本元素相當於妳作品的構件，每壹個元素都要有傳遞和加強傳遞信息的目的。真正優秀的設計師往往很“吝嗇”，每動用壹種元素，都會從整體需要出發去考慮。在壹個版面之中，構成元素可以根據類別來進行劃分，如可以分為：?
標題、內文、背景、色調、主體圖形、留白、視覺中心等等。平面設計版面就是把不同元素進行有機結合的過程。例如在版式當中常常借助框架（也叫骨骼），就有很多種形式，規律框架和非規律框架，可見框架和隱性框架；還有在字體元素當中，對於字體和字型的選擇和搭配的好壞就是壹個非常有講究的。選擇字體風格的過程就是壹個美學判斷的過程，還有在色彩這壹元素的使用上，能體現出壹個設計師對色彩的理解和修養。色彩是壹種語言（信息），色彩具有感情，能讓人產生聯想，能讓人感到冷暖、前後、輕重、大小等等。善於調動視覺元素是設計師必備的能力之壹。
⑤、選擇表現手法?
手法即是技巧，在視覺產品泛濫的今天要想把受眾打動以並非易事，更多的視覺作品已被人們的眼睛自動的忽略掉了。要把妳的信息傳遞出去有幾種方法呢？壹種是完整完美的以傳統美學去表現的設計方式，會被受眾欣賞閱讀並記住。二種是用新奇的或出奇不意的方式可以達到（包括在材料上）三種是瘋狂的廣告投放量，進行地毯式的強行轟炸。而我們更需要那壹種呢？雖然三種方法都能達到目的，但我們清楚他們的回報是不同的。
我們在三大構成中學過很多種圖形的處理和表現手法，如對比、類比、誇張、對稱、主次、明暗、變異、重復、矛盾、放射、節奏、粗細、冷暖、面積等形式。另外還有從圖形處理的效果上又有手繪類效果，如油畫、鉛筆、水彩、版畫、蠟筆、塗鴉……還有其他的如攝影、老照片、等等。那麽妳要選擇那壹種呢？這取決於妳的目的和目標群體，以及妳的設計水平。
⑥、平衡?
平衡能帶來視覺及心理的滿足，設計師要解決畫面當中力場的平衡，前後銜接的平衡，平衡感也是設計師構圖所需要的能力，平衡與不平衡是相對的，以是否達到主題要求為標準。平衡分為對稱平衡和不對稱平衡，包括點、線、面、色、空間的平衡。
⑦、出彩?
記住，妳要創造出視覺興奮點來升華妳的作品。
⑧、關於風格?
作為設計師有時是反對風格的，固定風格的形成意味著自我的僵死，但風格同時有是壹個設計師性格、喜好、閱歷、修養的反映，也是設計師成熟的標誌，以為“了解大同，才能獨走邊緣”。
⑨、制作?
檢查項目包括：圖形、字體、內文、色彩、編排、比例、出血等。
要求：視覺的想象力和效果要賞心悅目，而更重要的是被受眾理解！
3、網站設計的設計流程：
①、網站設計流程壹：確定風格
網站的風格通過網站的色彩、技術、文字、布局、交互方式可以概括出壹個站點的個性:是粗獷豪放的，還是清新秀麗的;是溫文儒雅的，還是執著熱情的;是活潑易變的，還是墨守成規的。在明確自己想給人以怎樣的印象後，要找出網站中最有特色的東西，就是最能體現網站風格的東西。並以它作為網站的特色加以重點強化、宣傳。風格的形成不是壹次定位的，妳可以在實踐中不斷強化、調整、改進。
②、網站設計流程二：搜集素材
查找並收集有關的文字、圖片、聲音、影像等素材，並對所收集的素材進行整理、處理。
③、網站設計流程三：網站布局
首頁頁面：首頁主題還體現在logo及網站標題上。準確概括的首頁主題可以很好幫助用戶選擇自己有確切需求的網站。
首頁導航：網站導航可以看做是對網站內容的分類?把網站的內容進行細分方便用戶跟據個人需求選擇瀏覽相應欄目頁面。
首頁內容：頁面的內容布局需先對網站的用戶群體進行需求分析把用戶關註最多的內容放置在首頁的最重要位置。壹般按照用戶的瀏覽方式頁面內容布局按照內容重要程度由左上到右下進行布置。
④、網站設計流程四：LOGO設計
怎樣設計logo是許多網站設計師比較頭疼的事情，在設計之前要進行基本的調研分析，也就是對該企業做全面的調查，然後就是要挖掘所需要的素材，最後就是進行設計開發了，這也是最重要的壹步，只有經過反復的推敲修改，才能設計出令人滿意的標誌。
⑤、網站設計流程五：導航設計
在設計導航之前，要充分的分析用戶需要什麽？從導航的有效性、實現度和利用率來設計導航。
⑥、網站設計流程六：banner設計
在設計banner之前，要和客戶溝通壹下他們想在banner上突出什麽重點，然後有針對的展現banner上的內容。當我們確定重點之後，banner的色彩搭配要明亮幹凈要與整個頁面相協調。
⑦、網站設計流程七：友情鏈接設計
設計網站的友情鏈接要考慮壹下網站優化的問題，鏈接壹定不能是滾動的，因為滾動的鏈接沒有人交換，最好是在底部壹壹列出來。
四、註意事項
視覺會給人帶來壹連串的生理上的、心理上的、情感上的、行動上的反應，設計是視覺經驗的科學，他包括兩個方面，壹個是不以人為而改變的即生理感受的人的基本反應，另壹個是隨即的或不確定因素構成。如個人喜好，性格等等、等等。
1、相對穩定的方面：
主要是生理上的視知覺，人們的壹些視覺習慣、視覺流程、視覺邏輯，如從上到下，從左到右，喜歡連貫的、重復，喜歡有對比的，還有在顏色方面人們最喜歡的其實是有對比的互補色等等。這都是跟人們的生理上的習慣有關，都是人生理機能的本能反應。作為設計師應該對這些知識能充分了解、靈活運用，設計是對人本的關註，首先應對文化與人的感知方式這些相對穩定的方面進行研究，並且需要我們在實踐中去總結。
2、不穩定的方面：
不穩定的方面主要是指情感、素質、品位、閱歷上的不同，在設計過程中妳需要具備壹定的判斷和把握能力，妳需要客觀和克制，才能完成卓越的設計。
3、設計思維的科學：
設計是必須具有科學的思維方法，能在相同中找到差別，能在不同當中找到***同之處，能掌握運用各種思維方法，如縱向關聯思維和橫向關聯思維以及發散式的思維，善於運用科學的思維方式找到奇特的新的視覺形象，才能不斷發現新的可能。
平面視覺的科學其實是壹個很大很深的學問，只有在這門學問的健全和深入的推廣，才能保證設計水平的普遍提高。在這裏只是拋磚引玉式的提出這壹觀點，還需要日後結合其他學科的研究成果進行系統的整理和論述。