UI设计

第一阶段:

1. 什么是色彩?

     1.1 定义:色彩是光物体对光谱的反射。

     1.2 光谱:红 橙 黄 绿 青 蓝 紫

2. 色彩的种类?

    以下是打印设备的颜色:

215548_7Lcb_3824391.png

    以下是电子设备的颜色调配:

215606_D77g_3824391.png

3. 色彩的三要素?

    3.1 色相:即色彩,物体所呈现的颜色;

    3.2 明度:物体颜色明亮程度;

    3.3 纯度(饱和度):颜色的浓度;

4. 色彩搭配基础知识:光源色,物体色和固有色;

    4.1 光源色:指发光体所发出的光线的颜色,如阳光,月光,火光,各种灯光等。会改变物体固有色。

    4.2 物体色:指物体对光源色选择吸收和反射,反映到人的视觉中的光色感觉。不透明物体颜色有其反射的光色决定,透明物体颜色有其透过的光色决定。简而言之,看到物体是什么颜色,就是其在改光源下的物体色。

    4.3 固有色:指物体在正常的日光照射下出现的固有色彩。也指物体在通常情况下给人的色彩印象(概念),如,红旗是红色,草地是绿色,黑人的黑皮肤。。。。

5. 色相环的实际应用:

    5.1 色相环:

222332_43GW_3824391.png12色轮

222416_SV6n_3824391.png24色轮

在色环轮中,对角180度的色彩是互补色,60度相邻之间的色彩(彼此相邻的色彩都是邻近色)的是邻近色,120度的两个色彩为对比色。

    5.2 互补色:互补色搭配可以使互为补色的颜色更加鲜艳明亮,且大多能产生一种饱和满足的色彩感觉,可以达到炫目,富有刺激感的效果。如:红花配绿叶。。。。

    5.3 邻近色:在色环带上凡是在60度范围内的颜色都输入邻近色的范围。如绿色和蓝色,红色和黄色。邻近色往往是你中有我,我中有你。邻近色的搭配特点是比较舒适平稳,给人安定平和的感觉。优点是接受快,缺点是审美疲劳也快,容易失去新鲜感。

    5.4 对比色:色彩之间对比强烈,有很强的排斥感,两种色彩之间相互衬托,往往给人留下深刻的印象,常用服装设计。

6. 常见的色彩搭配:

    6.1  红色搭配:常见的红色搭配:红白(多用于广告装修设计,给人明快鲜艳大气),红黑(多用于服装搭配),红黄(多用于表现喜庆的设计)。

224916_ygQN_3824391.png

    6.2 橙色搭配:

225159_WV13_3824391.png

225415_Xwvu_3824391.png

    6.3 绿色搭配:

225437_grud_3824391.png

225510_NPKN_3824391.png

 

    6.4 蓝色搭配:

225600_icI5_3824391.png

 

7.色彩的表现方法和体系:

    7.1 常见的色彩表现:把色彩按照一定方式排列起来,包括色相环和立体色;

222824_IOcz_3824391.png立体色模型

    7.2 RGB色彩: 电子设备都是以rgb表示色彩。

223141_mNob_3824391.png

    7.3 CMYK色彩:印刷物品的色彩模式cmyk分别表示青,洋红,黄,黑;

223344_axOA_3824391.png

    7.4 色彩的情感效果:

224042_UTnc_3824391.png

    7.5 色彩的温度感:

224419_PETs_3824391.png

    7.6 色彩的生理性感觉方式:

224643_bVkw_3824391.png

224739_ZIZK_3824391.png

    7.7 色彩的联系作用:

224843_FpjE_3824391.png

224859_Kap1_3824391.png

8. 色彩没与设计色彩应用:

    8.1 色彩设计创意思维:

    8.2 平衡比例:

225404_aBuh_3824391.png

    8.3色彩对称:

225549_pSts_3824391.png

    8.4 色彩节奏:

225821_ZUVB_3824391.png

225953_FbEd_3824391.png

    8.5 色彩呼应:

230020_XvSB_3824391.png

230121_2MPL_3824391.png

9. 平面设计常用布局的方法:

    9.1 平面设计常用布局:

230557_IXEd_3824391.png

230716_LfTA_3824391.png

 

    9.2 布局用户体验:

230823_LboI_3824391.png

230948_KrrZ_3824391.png

    9.3布局的形式美:

231047_vgVI_3824391.png

231237_vvdp_3824391.png

    9.4布局的目的性:

231251_QIOQ_3824391.png

10 移动端设计常见的布局:

    10.1 列表式布局:

220144_6rhS_3824391.png

220206_I1aV_3824391.png

    10.2 陈列馆式布局:

220240_Njil_3824391.png

220254_NnSK_3824391.png

    10.3 九宫格式布局:

220324_1HLq_3824391.png

220339_HL8V_3824391.png

    10.4 选项卡式布局:

220413_OUba_3824391.png

220439_geVW_3824391.png

    10.5 旋转木马式布局:

220526_f9Yt_3824391.png

220604_C5la_3824391.png

    10.6 行为扩展式布局:

220620_WZ3t_3824391.png

220636_OqV5_3824391.png

    10.7 多面板式布局:

220744_HgyR_3824391.png

220802_K4A0_3824391.png

    10.8 图表式布局:

 220851_F5lM_3824391.png

220916_b3ts_3824391.png

11.  页面设计主题定位方法:

    11.1 内容理解:

221231_e5XK_3824391.png

    11.2 素材联想和收集:

221349_1Tye_3824391.png

    11.3 素材的合成:

221533_WV6a_3824391.png

    11.4  整理和布局:

221912_FpR9_3824391.png

222111_RA7D_3824391.png

12 素材的收集与合成:

    12.1 创意的构思:

222314_Abnd_3824391.png

    12.2 素材的选择收集:

222433_VNoC_3824391.png

    12.3 素材的合成:

222616_r7xA_3824391.png

13. 页面布局和用户体验的关系:

    13.1 布局和体验的关系:

223452_XEfs_3824391.png

    13.2 简单易懂,避免累赘:

223648_edM8_3824391.png

223736_ifz5_3824391.png

    13.3 减少操作步骤:

223835_VAaS_3824391.png

223856_8oPh_3824391.png

    13.4 主动直接:

 

224027_OKQj_3824391.png

 

二: ps基础

1. 课时1:计算机图形分位图(点阵图)和矢量图二种。

    1.1 位图:

222037_g8nh_3824391.png

    1.2 矢量图:

222129_2Ezk_3824391.png

2. 课时2: 优化配置photoshop。

    2.1 设置暂存盘(即图像的暂时存储位置盘):编辑(菜单栏)->首选项->性能,暂存盘和历史记录状态(默认记录最近的20条操作历史记录)

3. 课时3:ps的图层。

223817_WDQX_3824391.png

    3.1 图层的复制:

224722_6Pei_3824391.png

        方法一:在图层面板中,将需要复制的图层,按住左键拖拽到图层面板最下面的复制图层中。即可复制图层,然后在选中该图层进行移动到想要的位置即可。

        方法二: 选中要复制的图层,ctrl+g即可复制该图层。

        方法三: 选中要复制的图层,左键按住该图层+alt,鼠标变成双箭头,即可拖拽即可复制该图层。

 

 

 

 

 

 

 

 

转载于:https://my.oschina.net/u/3824391/blog/1812500

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值