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展示

第十章 后台网页设计

这是我根据网上搜索的部分后台模板提选好看的风格结合再加以改变后形成的
这个后台网页我应用了半透明风格，大红色为主色调，粉红色为副色调

第十一章 设计作品集