❶ UI設計前端學習哪些內容
1、HTLM基礎認知DIV框架及CSS樣式
首先要了解HTLM基礎、CIV框架以及CSS樣式， HTML稱為超文本標記語言，是一種標識性的語言。它包括一系列標簽.通過這些標簽可以將網路上的文檔格式統一，使分散的Internet資源連接為一個邏輯整體。DIV元素是用來為HTLM文檔內大塊的內容提供結構和背景的元素。 CSS不僅可以靜態地修飾網頁，還可以配合各種腳本語言動態地對網頁各元素進行格式化。CSS 能夠對網頁中元素位置的排版進行像素級精確控制，支持幾乎所有的字體字型大小樣式，擁有對網頁對象和模型樣式編輯的能力。
2、浮動原理、Margin認知
Margin，是CSS的語法，這個簡寫屬性用於在一個聲明中設置所有當前或者指定元素所有外邊距的寬度，或者設置各邊上外邊距的寬度。
3、框架應用搭建
框架很多，在這個教程中選擇一個主流框架帶大家看看前端框架如何搭建。
4、插入圖片、文字標簽和版頭、導航欄
編寫的網頁中插入圖片，可以使瀏覽網頁的用戶得到更好的體驗效果。在這一部分會講解插入圖片、文字標簽以及版頭和導航欄如何實現。
5、Banner塊插入、內容文字排版、內聯元素、A標簽和Banner鏈接定位
Banner是網路廣告最早採用的形式，也是目前最常見的形式。它是橫跨於網頁上的矩形公告牌，當用戶點擊這些橫幅的時候，通常可以鏈接到廣告主的網頁。而網頁中的文字內容排版也直接影響著網頁的美觀以及網頁的用戶體驗。
6、錨點標簽、超鏈接標簽、固定定位和絕對定位、相對定位
標簽用於定義超鏈接，用於從一張頁面鏈接到另一張頁面。用於設置錨點，用於頁面定位。
7、導航二級菜單顯示隱藏
很多網頁中的二級菜單示，需要滑鼠移動到一級菜單或者點擊一級菜單才會展開顯示二級菜單。
8、input表單
input表單欄不直接顯可以獲取用戶的信息，做出對應的動作，教程中直觀的展示input表單的應用方法。
❷ UI設計前端主要學些什麼
UI設計不一定需要精通前端，但是如果UI設計了解前端可以減少和開發人員溝通的技術成本，讓團隊協作更加高效。那UI設計如何學習前端，需要學習到什麼程度呢？
我們分享一個前端教程-網頁鏈接，這裡面詳細講解了UI設計中的Web前端設計規則及工具，可以幫助大家深入理解Web前端UI設計方法。
1、HTLM基礎認知DIV框架及CSS樣式
首先要了解HTLM基礎、CIV框架以及CSS樣式， HTML稱為超文本標記語言，是一種標識性的語言。它包括一系列標簽．通過這些標簽可以將網路上的文檔格式統一，使分散的Internet資源連接為一個邏輯整體。DIV元素是用來為HTLM文檔內大塊的內容提供結構和背景的元素。 CSS不僅可以靜態地修飾網頁，還可以配合各種腳本語言動態地對網頁各元素進行格式化。CSS 能夠對網頁中元素位置的排版進行像素級精確控制，支持幾乎所有的字體字型大小樣式，擁有對網頁對象和模型樣式編輯的能力。
2、浮動原理、Margin認知
Margin，是CSS的語法，這個簡寫屬性用於在一個聲明中設置所有當前或者指定元素所有外邊距的寬度，或者設置各邊上外邊距的寬度。
3、框架應用搭建
框架很多，在這個教程中選擇一個主流框架帶大家看看前端框架如何搭建。
4、插入圖片、文字標簽和版頭、導航欄
編寫的網頁中插入圖片，可以使瀏覽網頁的用戶得到更好的體驗效果。在這一部分會講解插入圖片、文字標簽以及版頭和導航欄如何實現。
5、Banner塊插入、內容文字排版、內聯元素、A標簽和Banner鏈接定位
Banner是網路廣告最早採用的形式，也是目前最常見的形式。它是橫跨於網頁上的矩形公告牌，當用戶點擊這些橫幅的時候，通常可以鏈接到廣告主的網頁。而網頁中的文字內容排版也直接影響著網頁的美觀以及網頁的用戶體驗。
6、錨點標簽、超鏈接標簽、固定定位和絕對定位、相對定位
<a> 標簽用於定義超鏈接，用於從一張頁面鏈接到另一張頁面。用於設置錨點，用於頁面定位。
7、導航二級菜單顯示隱藏
很多網頁中的二級菜單欄不直接顯示，需要滑鼠移動到一級菜單或者點擊一級菜單才會展開顯示二級菜單。
8、input表單
input表單可以獲取用戶的信息，做出對應的動作，教程中直觀的展示input表單的應用方法。
其實以上教程只是web前端很小的一部分，UI設計如果能夠了解前端知識，在設計中可以更好的考慮實現問題，也能夠更好的和開發人員交流，也能夠提高團隊協作的效率，加速項目的進度。
❸ ui與web前端的區別是什麼
UI設計和Web前端的工作並不一樣，但也有公司為了提高工作效率在這兩塊工作是由同一個人來做的。ui與web前端的區別主要有：
1、概念不同
UI設計（或稱界面設計）是指對軟體的人機交互、操作邏輯、界面美觀的整體設計。UI設計分為實體UI和虛擬UI，互聯網說的UI設計是虛擬UI，UI即User Interface(用戶界面)的簡稱。
web前端是創建Web頁面或app等前端界面呈現給用戶的過程，通過HTML，CSS及JavaScript以及衍生出來的各種技術、框架、解決方案，來實現互聯網產品的用戶界面交互。
2、研究方向不同
UI設計的研究方向是：用戶研究、交互設計、界面設計；
web前端的研究方向是技術方向：包括html、css、js等需要編寫代碼。
3、職業機會不同
UI設計的職業方向是：前端開發工程師、資深前端開發工程師、前端架構師等；
web前端的職業方向是：圖形設計師、交互設計師、用戶測試/研究工程師等；
計交給美工來做，把html5、css、js的添加交給web前端工程師來做，
4、工作內容不同
UI前端：主要負責系統/app，UI界面設計，以及html代碼實現，主要工作偏向於設計。
web前端：主要講ui提供的設計圖，編碼成靜態html，實現所有特效；並負責所有交互的對接，對js要求較高，會要求一些後台介面的開發工作，因此對後台開發語言也有一定的要求。
5、所需技術不同
web前端會用到Bootstrap、Vue、Jquery、Javascript、CSS、html等技術知識；
而UI前端需要是有很好的審美能力，通常需要有美術設計教育背景。
❹ UI交互設計和前端是什麼樣的關系，為啥有聽別人說前端也是UI
交互設計和UI設計的關系：
1、交互設計是一種面向目標的設計。所有的工作都是圍繞用戶行為設計的。交互設計人員設計用戶行為，使用戶更方便高效地實現產品業務目標，並獲得愉快的用戶體驗。
ui設計有兩個概念：窄和寬。廣義的概念包含了互動的含義。事實上，UI設計包括圖形設計、網頁設計和移動界面設計，交互是當今設計師的一項重要任務。
2、如果UI設計是通用的，則應該包括原型設計、交互設計和視覺設計。狹義的ui通常只是人們看到的ui可視化設計的最後一部，交互是用戶操作事件的反映。
例如，點擊彈出菜單，瀏覽鏈接就會變成紫色，這是一種非常微妙的互動，但它處處反映用戶體驗。交互設計更多的是關於用戶行為響應的設計、UI可視化設計，以及更多關於界面的靜態設計。