UI设计总结
UI設計總結
第一章 UI理論
1.1.平面設計基礎
平面設計所表現的立體空間感,并非實在的三度空間,而僅僅是圖形對人的視覺引導作用形成的幻覺空間。
術語:和諧、對比、對稱、平衡、比例、重心、節奏、韻律
元素:
1.概念元素:點、線、面
2.視覺元素:圖形的大小、形狀、色彩等
3.關系元素:方向、位置、空間、重心等
4.實用元素:設計所表達的含義、內容、設計的目的及功能
1.2.UI理論
UI即User Interface(用戶界面)的簡稱。UI設計則是指對軟件的人機交互、操作邏輯、界面美觀的整體設計。好的UI設計不僅是讓軟件變得有個性有品味,還要讓軟件的操作變得舒適、簡單、自由、充分體現軟件的定位和特點。UI還有其它的意義,如Unit Interval,Univ of Iowa,Unlock Instruction,Urgent Interrupt。
1.3.交互設計
交互設計(英文Interaction Design, 縮寫IXD),是定義、設計人造系統的行為的設計領域,它定義了兩個或多個互動的個體之間交流的內容和結構,使之互相配合,共同達成某種目的。交互設計努力去創造和建立的是人與產品及服務之間有意義的關系,以“在充滿社會復雜性的物質世界中嵌入信息技術”為中心。交互系統設計的目標可以從“可用性”和”用戶體驗“兩個層面上進行分析,關注以人為本的用戶需求。
1.4.原型與架構設計
產品原型可以概括的說是整個產品面市之前的一個框架設計。以網站注冊作為例子,整個前期的交互設計流程圖之后,就是原形開發的設計階段,簡單的來說是將頁面的模塊、元素、人機交互的形式,利用線框描述的方法,將產品脫離皮膚狀態下更加具體跟生動的進行表達。
第二章 PS基礎
PS快捷鍵,如下
Ctrl+A 全部選取
Ctrl+C 復制
Ctrl+D 取消選擇
Ctrl+E 合成圖層
Ctrl+H 顯示/隱藏選擇區域
Ctrl+J 拷貝選中圖層
Ctrl+N 新建
Ctrl+R 顯示/隱藏標尺
Ctrl+S 保存
Ctrl+V 粘貼
Ctrl+X 剪切
Ctrl+Z 還原
Ctrl+[ 改變圖片排序-往下
Ctrl+] 改變圖片排序-往上
Ctrl+點擊圖片、路徑 載入選區
Ctrl+Shift+H 顯示/隱藏路徑
Ctrl+Shift+I 反向選擇
Ctrl+Shift+S 另存為
Ctrl+Shift+T 旋轉
Ctrl+Alt+Z 還原兩步以上操作
Ctrl+Enter 建立選區
F12 恢復
結合老師教的內容做出了一些圖片,如下
圖1是用矩形工具與變換做出來,步驟:先用矩形工具會出一個矩形再拷貝多一個矩形然后Ctrl+T調整矩形的角度最后Ctrl+Shift+Alt+T變換疊加形成圖1
圖2是用變換-扭曲做出來,步驟:先Ctrl+T扭曲然后把畫冊的四角拉向背景畫冊的四家再給圖層添價一個正片疊底最后細節優化就形成了圖2
第三章
PS進階
這個是學習PS并熟悉各個工具功能后做的,應用到了各種工具
明暗對比:光照到的地方亮度提高光照不到的地方暗度提高
陰影:給光照的物體加點陰影,讓物體不會過于生硬
第四章 AI基礎
這些都是在學習AI期間時臨摹的一些圖片
應用到了各種工具,如:鋼筆工具、實時上色、圓形、路徑查找器等等
第五章 AI進階
這張圖片是用鋼筆工具和實時上色做出來的,先用鋼筆工具把人物的輪廓描繪出來再用實時上色工具吸取顏色給人物填充顏色,最后再處理細節
第六章 版式設計
整潔留白,不會覺得太復雜也不會覺得太簡單
藍色為主色調,顯得沉穩,再加上一些線條和形狀的點綴,讓整體不會顯得太過于空曠
第七章 Logo設計
這個是我根據自己的特征設計出來的個人Logo
設計思路
做我的個人Logo時我應用上圖的四個跟我有關元素
上圖是我的個人logo在各個不同物品上的展示效果
比如:在名片上,在信封上,在購物袋上等等
第八章 官網設計
上圖是我借鑒北京師范大學風格再改變一些做出的學院官方
上圖左是在電腦端上的展示效果,上圖右是在平板上展示的效果
第九章 Icon設計
上圖是我根據華為手機主題與個人元素結合做出的九個Icon
分別是:時鐘、日歷、應用商城、圖片、主題、設置、信息、語音助手、計算器
上圖是我的Icon設計思路
上圖是我設計的Icon展示
第十章 后臺網頁設計
這是我根據網上搜索的部分后臺模板提選好看的風格結合再加以改變后形成的
這個后臺網頁我應用了半透明風格,大紅色為主色調,粉紅色為副色調
第十一章 設計作品集
總結
- 上一篇: 超好用!5款完全免费、支持全平台的笔记软
- 下一篇: Linux宝塔控制面板如何实现多个二级域