網站ui設計思路
『壹』 UI設計圖標思路怎麼寫
你當時是怎麼設計的這個圖標？或者是，你這個圖標的構思是從哪兒構思的，或者是，你看到什麼物體，或者造型而想出來的，但是不能是傢具，UI設計當中，最忌諱的就是看到傢具而設計出的
『貳』 網頁是如何實現的，Web UI設計理論入門教程
一、學習HTML5和CSS3基礎
隨著這移動互聯網快速發展的時代，尤其是4G時代，HTML5+CSS3已然成為新一代的web前端技術。
隨著HTML5的發展和普及，了解 HTML5 也將成為 Web開發人員的必修課。涉及到網頁外觀時，就需要學習 CSS 了，它可以幫你把網頁做得更美觀。
利用 HTML5 和 CSS3 模擬一些你所見過的網站的排版和布局(色彩，圖片，文字樣式等等)。
當然，遠標Web前端開發課程第一階段還會學習 PS設計工具使用和互聯網UI設計理論。
二、學習Java，了解DOM
Java 是一種能讓你的網頁更加生動活潑的程序語言。學習 Java 的基本語法，學會用 Java 操作網頁中 DOM 元素。
Web前端開發課程第二階段完全可以實現大家平常喜歡玩的 2048 游戲。(是不是感覺挺有意思)
接著學習使用一些 Java 庫，比如 Jquery 是大部分 Web開發人員都喜歡用的，通過 Jquery 可以有效的提高 Java 的開發效率。
三、學習Web前端核心
學習 Jquery 之後，大家就要學習 HTML5 高級階段(HTML5 Canvas 繪圖、HTML5 SVG、音頻和視頻處理、表單處理、表單驗證...等)
四、學習HTTP協議及Server端技術
伺服器端腳本編程(後台開發)也是Web開發人員的基本功之一。
要構建動態頁面通常會使用到資料庫，通常php使用Oracle、MySQL資料庫。
對於Web伺服器來說，Apache 一個就已經是了。那麼Apache、php、資料庫，該怎麼理解它們的關系?
1、Apache是伺服器基礎，php和資料庫都需要Apache來協調工作
2、php是腳本解釋，如果不用php，那麼Apache出來的東西就只是靜態的，而不能在伺服器實現功能
3、資料庫完全可以單獨使用，但是和Apache、php一起，則是由php代碼調用資料庫介面，而apache就負責解釋php代碼，讓他能真正地實現對資料庫的調用
五、學習Web前端高級技術
當你掌握了HTML5，CSS3，Java等技術之後，就應該找一個Web框架加快你的Web開發速度，使用框架可以節約你很多時間。
學習的Bootstrap是目前很受歡迎的前端框架。Bootstrap 是基於 HTML、CSS、JAVA 的，它簡潔靈活，使得 Web 開發更加快捷，是web前端開發者最喜歡，也是現在企業里最常用的前端框架。
Angular JS是一款優秀的前端JS框架，已經被用於Google的多款產品當中。AngularJS有著諸多特性，最為核心的是：MVC編程、模塊化、控制器、路由、事件綁定等等。
AngularJS通過為開發者呈現一個更高層次的抽象來簡化應用的開發。如同其他的抽象技術一樣，這也會損失一部分靈活性。換句話說，並不是所有的應用都適合用AngularJS來做。AngularJS主要考慮的是構建CRUD應用。幸運的是，至少90%的WEB應用都是CRUD應用。但是要了解什麼適合用AngularJS構建，就得了解什麼不適合用AngularJS構建。
『叄』 UI設計原則與思路有哪些
我們在設計UI時，通常是有一些步驟與原則，下面列出了一些常用的設計思路。
1，明確劃分與UI相關和與UI無關的部分
根據UI的設計圖，首先把界面展現的數據先抽出去，只看UI的表現。
2，劃分屏幕大小，明確出跳轉關系
考慮不同APP所對應的屏幕大小及DPI，不同的屏幕與DPI，可能會存在不同的UI布局。
3，列出需要用到的UI元素（Widget）
把界面上展現的UI元素列出來，像常用的button, imagebutton這些很簡單，一看就知道，關鍵是有些UI，可能會涉及到一些自定義的View，這里一定要多考慮。
4，列出哪些UI元素可以用SDK的，哪些則是需要自定義
通常一個項目裡面都會有自定義的組件（View），多數是組合控制項------把不同的Widget組合成一個Layout。
5，進行內部邏輯和UI界面的整合
通常一個View裡面，都會有一些邏輯，特別是自定義的View，可能會封裝一些特定的屬性。
在使用這些View的時候，UI的activity會與這些View有一個邏輯的整合。
『肆』 UI設計該怎麼學
UI設計工作內容：
編輯負責軟體界面的視覺設計、排版設計和製作工作；根據各種相關軟體的用戶群，提出構思新穎、有高度吸引力的創意設計。
對頁面進行維護優化，使用戶操作更趨於人性化；維護現有的應用產品；收集和分析用戶對於GUI的各種需求。
UI設計師涉及范圍包括電腦PC端的軟體界面設計、網站網頁設計、移動端APP應用設計及部分其他界麵包裝設計。
主要從業人員需要熟練 Photoshop、Illustrator、Axure RP、AE、C4D、墨刀等軟體工具；
1. 負責公司產品在智能電視、PC端、移動端頁面/應用的整體設計；
2. 基於用戶體驗、人機交互、圖形化設計、界面設計等前沿理論實現產品風格設計。
3. 充分理解產品策劃思路及理念，配合產品經理和研發人員實現產品各種界面的視覺設計；
4. 建立和完善產品界面視覺設計規范；
5. 根據交互設計及產品規劃，完成產品（iPhone、Android 、Web平台App及網站）相關的用戶界面視覺設計。
6. 配合產品開發中的圖形界面（GUI）設計。
7. 完成產品相關推廣活動的專題頁面、FLASH的設計及製作。
8. 與研發團隊充分溝通協作，確認可控的誤差范圍和視覺效果的最終實現。
9. 根據視覺設計的發展趨勢及用戶研究的結果不斷優化產品的圖形界面（GUI）
那麼初學UI設計需具備哪些入門知識架構內容：
1、視覺設計部分：
首先，視覺設計不僅僅是做ICON，做界面或者界面元素。有很多人認為，如果去互聯網公司做視覺方向ui設計，只會簡單做圖標、界面就行，其實這是極其幼稚的想法。
那麼初學UI設計者以下幾項技能必需要掌握：
1）平面構成；
2）色彩構成；
3）版式設計；
4）圖標繪制；
5）配色原理；
6）設計意識；
7）了解用戶體驗設計、可用性原則；
8）信息挖掘、用戶調研、數據分析；
9）邏輯能力；
10）產品思維；
11）交互設計原則、不同平台的規范；
12）審美能力；
13）溝通能力；
『伍』 超贊干貨，一個完整的UI設計流程是怎樣的
需要的基礎就是一些簡單的美術基礎和平面設計基礎，要求也不算高，一般流程是這樣的，大致5個階段，PS ，Illustrator ， DW，InDesign都會用到。
第一階段 UI用戶設計基礎（UI行業發展及UI設計師職業規劃，美術基礎，平面設計基礎，圖形與創意設計，網頁設計基礎，互動式網站），軟體：Photoshop、Illustrator
第二階段 移動界面設計（圖標創意思路與方法，圖標的創作設計，主題圖標設計，Ios系統Android系統Windows phone系統，UI設計實訓課程）
第三階段 交互類（UCD，交互設計高級技術）
第四階段 流程設計（界面開發對接，流程管理，移動媒體綜合開發實訓）
第五階段 綜合項目實訓及就業階段（根據所學內容，選擇一種移動平台（IOS/Android/Winphone），軟體界面，WUI類型設計，完成初稿設計。依據項目初期確定的需求進行驗收，並簽署驗收報告。）
『陸』 UI設計需要學習哪些內容
UI設計的培訓課程主要分為設計理念的培訓和軟體操作的培訓,具體課程如下:
1.視覺設計基礎:通過Illustrator軟體圖形應用系統的學習,使學員掌握圖形視覺設計基礎。
2.光影結構視覺應用技術:通過Illustrator軟體光影結構體系的學習,使學員掌握物體光影結構表現技法。
3.UI設計:通過Illustrator與Photoshop軟體圖形圖像系統學習,使學員掌握高品質UI圖形設計的方法。
4.超寫實應用與表現:通過Illustrator軟體超精度表現系統學習,完成超寫實製作技巧。
5.構成與視覺語言:學習構成視覺語言,使學員掌握設計應用視覺表現技術。
6.視覺藝術表現與應用:通過色彩藝術與視覺表現形式的結合應用,使學員的設計能力達到商業級別的要求。
7.Flash平台應用:通過Flash軟體系統學習,使學員掌握Flash動態應用基礎。
8.超媒體綜合應用技術:通過Flash軟體高級應用學習,使學員掌握動態結構表現語言技術。
9.互動式平台應用技術:通過Flash ActionScript 3 軟體程序系統學習,使學員掌握高級別交互結構表現。
如果能夠完全掌握這些知識,你將成為優秀的UI設計師,實現穩定高薪就業。前面也說過了,UI設計師如今被重視,所以比起普通的設計師更有前途,未來的發展前景也更為廣闊。
軟體如下：
1.PSCC2017
PS 全稱 Photoshop
UI設計用的最多的軟體，90%以上的UI設計師都是要會PS的，其處理圖片功能非常強大，調色方面也不錯，還有圖層樣式，布爾運算方面都是UI設計必備的。不過也有劣勢，就是無法繪制矢量圖形，排版也不是很好。還有圖層也有點多。管理起來不是很方便。在UI設計中主要的用途是用來繪制界面和圖標。
2.AICC2017
AI 全稱 Illustrator
一款矢量繪圖軟體，在做UI圖標上非常不錯。特別是繪制扁平化圖標這塊。很好用。也有矢量功能畫出來的圖形可以放大縮小。劣勢就是不能調色。做擬物化圖標也不是很好做。
3.AECC2017
AE 全稱 After Effects
主要是做來做影視後期視頻特效的，但是在UI這個的話就是用來做一些UI的交互動效。動效這塊是效率最高的軟體，不過不能用AE畫圖標做界面。這個AE不擅長。
4.ARP 全稱 Axure RP Pro
主是要用來做原型圖的，在交互設計原型這塊是比較火的一款軟體。
最後也補一句，軟體只是一個工具，千萬不要覺得會了軟體就會了設計，不要太依靠軟體了，會了工具後還要學習理論知識才能成為一個合格的設計師。
(6)網站ui設計思路擴展閱讀：
UI設計（或稱界面設計）是指對軟體的人機交互、操作邏輯、界面美觀的整體設計。UI設計分為實體UI和虛擬UI，互聯網說的UI設計是虛擬UI，UI即User Interface(用戶界面)的簡稱。
好的UI設計不僅是讓軟體變得有個性有品位，還要讓軟體的操作變得舒適簡單、自由，充分體現軟體的定位和特點。
設計內容：
與之相應，UI設計師的職能大體包括三方面：
1.圖形設計，軟體產品的產品「外形」設計。
2.交互設計，主要在於設計軟體的操作流程、樹狀結構、操作規范等。一個軟體產品在編碼之前需要做的就是交互設計，並且確立交互模型，交互規范。
3.用戶測試/研究，這里所謂的「測試」，其目標恰在於測試交互設計的合理性及圖形設計的美觀性，主要通過以目標用戶問卷的形式衡量UI設計的合理性。如果沒有這方面的測試研究，UI設計的好壞只能憑借設計師的經驗或者領導的審美來評判，這樣就會給企業帶來極大的風險。
『柒』 一個完整的UI設計，需要那些過程
1、確認目標用戶：
在UI設計過程中，需求設計角色會確定軟體的目標用戶，獲取最終用戶和直接用戶的需求。用戶交互要考慮到目標用戶的不同引起的交互設計重點的不同。
2、採集目標用戶的習慣交互方式：
不同類型的目標用戶有不同的交互習慣。這種習慣的交互方式往往來源於其原有的針對現實的交互流程、已有軟體工具的交互流程。
當然還要在此基礎上通過調研分析找到用戶希望達到的交互效果，並且以流程確認下來。
3、提示和引導用戶：
軟體是用戶的工具。因此應該由用戶來操作和控制軟體。軟體響應用戶的動作和設定的規則。對於用戶交互的結果和反饋，提示用戶結果和反饋信息，引導用戶進行用戶需要的下一步操作。
4、一致性原則：
軟體中往往存在多個組成部分（組件、元素）。不同組成部分之間的交互設計目標需要一致。
例如：如果以電腦操作初級用戶作為目標用戶，以簡化界面邏輯為設計目標，那麼該目標需要貫徹軟體（軟體包）整體，而不是局部。
5、可用性原則：
軟體要為用戶使用，用戶必須可以理解軟體各元素對應的功能。
比如：刪除操作元素。用戶可以點擊刪除操作按鈕，提示用戶如何刪除操作或者是否確認刪除操作，用戶可以更加詳細的理解該元素對應的功能，同時可以取消該操作。
(7)網站ui設計思路擴展閱讀
UI設計師的職能大體包括三方面：
一是圖形設計，軟體產品的「外形」設計。
二是交互設計，主要在於設計軟體的操作流程、樹狀結構、操作規范等。一個軟體產品在編碼之前需要做的就是交互設計，並且確立交互模型，交互規范。
三是用戶測試/研究，這里所謂的「測試」，其目標恰在於測試交互設計的合理性及圖形設計的美觀性，主要通過以目標用戶問卷的形式衡量UI設計的合理性。
如果沒有這方面的測試研究，UI設計的好壞只能憑借設計師的經驗或者領導的審美來評判，這樣就會給企業帶來極大的風險。
『捌』 如何利用UI設計一個清晰的網站結構
UI網頁設計和網站建設不同，網站建設單單只是通過程序源碼實現網站功能的實現，而UI設計則是體現在視覺角度，當兩者相輔相成之時則將會成就網站建設的核心。深圳網站建設公司都會配備有專業的全職設計師，可能在設計師的需求上大都是創意，然而在我們真正做一個項目或者工程的時候則會發現「藝術家並不是需要創新，而是需要會活用技巧。」優秀的設計效果離不開技巧的運用，而技巧的運用則能夠烘托出設計之美。
新華針對UI網頁設計的實戰經驗和總結，以直觀的改善網頁視覺效果為目的來提升網站的高級感為目的，從網頁的設計層次、字體、結構、對比、透明度等諸多因素上進行對比和調整，其詳細內容可以分為以下幾點：
1、使用色彩和字重來創造層次結構，而不是單純的大小對比
在對UI 文本進行樣式控制的時候，最常見的錯誤莫過於過度依賴字體大小差異來營造對比。
單純實用字體大小對比，所營造的對比並不夠，嘗試結合色彩和字重來營造更好的對比效果。
如果可以的話，你甚至可以採用兩到三種顏色：
（1）主要內容採用深色（諸如標題，但是不要用純黑）
（2）次要內容採用灰色（比如文章發表日期）
（3）輔助性內容採用淺灰色（比如頁腳中的版權聲明）
類似的，在UI設計的時候，通常兩種不同的字重足以營造出優秀的層次感：
（1）大多數的文本採用正常的字重（400到500，具體取決於字體）
（2）對於需要強調的文字採用較重的字重（600到700，具體取決於字體）
應當盡量不要讓正文部分字重低於400，因為這一部分字體字體本身尺寸已經較小，低於400會使得可讀性不佳。如果你依然需要降低字重，那麼不妨讓字體色彩更淺一點，或者替換成其他識別度較強、字重相對較小的字體。
2、不要在有色背景上實用灰色的文本
在白色背景下，將黑色的文本改成灰色，是不錯的淡化其視覺效果的做法，但是在彩色背景下這么做，則是另外一回事。
實際上，讓白色背景下文本由黑變灰實際上是達到降低對比度的效果。
但是在彩色背景下，想要降低對比度是應該讓文本逐步接近背景色，而不是改為灰色。
想要降低和背景色之間的對比，通常有兩種方法：
（1）降低白色文本的不透明度
降低不透明度，能夠讓背景的顏色透過來一些，以一種不沖突的方式降低前景文字和背景之間的對比度。
（2）基於背景色手工挑選文本的顏色
當背景是圖像或者圖案的時候，半透明的文本會影響可讀性，這個時候最好是基於背景主色調來挑選相應的文本色。
（3）陰影設計
相比於採用大范圍的擴散模糊陰影，使用微妙的垂直偏移陰影效果更明顯，更自然，它模擬了最常見的光源特徵，光線從上往下照下來所營造的陰影效果。
如果你對此有興趣，Material Design Guideline 非常清晰地給你講明白了這樣的陰影的製作細節。
4、盡量少使用 Borders
盒子模型是網頁前端最常用到的工具。當你需要在兩個元素之間創建分隔的時候，盡量避免實用兩者的邊界直接接觸。
雖然 Border 是分隔兩個元素的好辦法，但是它不是唯一的方法，使用過多會讓整個布局的設計感降低，甚至會造成混亂。
所以你可以嘗試下面的辦法來規避：
（1）使用 box shadow
box shadow 同樣可以營造出邊界感，而且更加微妙，並不會顯得突兀，不會分散用戶的注意力。
（2）實用不同的背景色來區分
通常，相鄰的元素背景只需要有微妙的差別就能夠讓人對他們進行區分。所以，你所需要做的就是在不同的區塊採用不同的背景色，並且嘗試刪除邊框，因為你根本不需要它。
（3）增加額外的留白
創建元素之間的分離效果，並不一定要通過線框來表現，只要增加留白，讓它們分隔開就行了。通過留白和間距來實現元素分組是UI設計中的常用手法。
5、不要讓小圖標無端地放大
當你在設計著陸頁的時候，可能會突出產品的功能，這個時候你需要一些大圖標來作為視覺錨點，這個時候你可能會去 Font Awesome 或者 Zondicons 這樣的網站找幾個免費的矢量圖標，然後放大到符合你需求的尺寸。
它們都是矢量圖標，照說是可以無損放大的。但是一個通常只有16×16 的圖標放大三四倍，它固然無損，但是在視覺上就顯得頗為不專業了：缺乏細節，總感覺過於矮胖。
可是，如果這些小圖標是你唯一能夠搞得到的素材的話，那麼不妨試著將它置於另外一個帶有顏色的圖形當中：
這樣的設計不僅能夠讓圖標達到預期的視覺體積，而且看起來要比單純放大，看起來細節會更多一些。當然，如果你手頭不是那麼緊的話，最好還是買幾個大尺寸的高素質圖標，比如 Heroicons 或 Iconic。
真正而有效的UI設計需要符合用戶、符合網民的需求進行設計，在網站建設的基礎上完成網站的維護，網站建設離不開UI設計，所以掌握以上技巧後運用到設計中輔助網站建設，將會使得用戶對網站的體驗感和高級感更加滿意。
『玖』 界面設計和網頁設計是一個思路么
相似但是有區別
界面設計呢 比較注重功能的承載方面，服務於使軟體功能更回好用，無需很花答哨，簡潔明了即可（參考蘋果系統界面）
當然網頁也分為功能型和視覺傳達類型 ，前者同界面設計類似，突出功能。後者更為注重視覺的美觀，震撼（這取決於網站需求),類似於平面設計
『拾』 網站進行UI設計需要注意哪些問題
你好！
一、清晰的界面往往會給用戶留下深刻印象模糊的網站界面，會很容易引起視覺疲勞。因此，UI第一要素就是建立清晰界面的思維，將其應用到實際開發之中去，這將會在很大程度上提高用戶體驗度。
二、遵從「簡潔但不簡單」的設計原則 好的網站UI設計，不僅具備清晰的界面，還要給用戶以簡潔的感覺。用戶的第一印象是非常重要的，簡潔的UI設計原則會讓用戶在最短的時間內找到自己想要的內容，提高了效率，很多建站公司都明白其中的道理，進行網站改版就是為了簡潔化。扁平化設計就是一個好的思路。
三、給用戶以熟悉的感覺 所謂的給用戶熟悉的感覺，是UI設計的要點，我們要在創新的基礎上周密考慮用戶的需求，不能讓他們感覺陌生，從而流失顧客，這樣對企業來說會是一個很大的損失。
四、和用戶交互，提升頁面響應速度 UI的最終目標是提升用戶體驗，所以我們較強和用戶的交互，了解用戶的需求，提升頁面響應速度，最大程度為用戶帶去便利和舒適的瀏覽體驗。
五、整體必須保持一致風格 網站整體要有一個同意的風格，這其中不僅包含了顏色的搭配要統一，而且字體、網頁布局等也要統一。只有保持統一的風格，才不會讓用戶在訪問頁面時產生錯愕的感覺。
希望能幫助到你！
還請及時點贊謝謝！
祝生活愉快！