功能取色法

 功能取色法
 提取主要颜色,也就是色彩鲜艳的正色。
 提取互补色,也是平衡色。
 提取浅色,让画面有透气感。
 提取主要颜色的同频色,可以多提取几种。
 提取重色,也就是很重的颜色。压住画面。
 有一点需要注意,主要颜色不一定是画面中的主角的颜色,可能是背景颜色,主角的颜色,可能是辅助色。他们通常都不一定是一种颜色,,可能是几种颜色的组合。
 功能配色法中的平衡色,不是仅仅针对主色的平衡,还可以在某一个局部起到平衡的作用。只要有需要平衡的地方,都是要平衡的。
 互补色是颜色色相,产生强烈的反差,更能突出主题的平衡。
 冷暖色主要是对情感的一种平衡,也是从心理上的一种平衡。
 深浅色,主要是从光的角度进行的一种平衡。
 花色与纯色,也是一种能够达到画面整体和谐的平衡。
 大与小,从视角上也可以产生一种平衡关系。
 有色彩与无色彩,从色彩的丰富性和单调性产生一种平衡。
 同频色
 从色调、色相、组合好的形状,都可以同频,让它们同一个韵律和共振感。
 色彩聚焦,让颜色形成一种焦点的聚集。
 总结一下
主色彩,一般不要多于三种。
平衡色,不要多于三种。 
同频色,一种或者多种。
 此外,还要有一种最重的颜色,压住重心。
 还要有一种最浅的颜色,让画面有呼吸感,透气感。
 

web设计规范

 

web端的设计规范
 背景颜色、导航颜色 、内容颜色为主色,一般3种左右,辅色一般5种左右。
 字体颜色 主色和辅色一般3~5种,文字链接的颜色一般设置两种,深色和浅色。
 图标状态一般分为正常状态,hover 状态。哪种状态一定要保持一致性。
 下拉弹出框的设置,要标出两种状态,正常状态和点击状态,要标出它们的颜色颜色变化值。
 按钮的状态一般分为:正常状态 ,鼠标经过状态,点击过的状态,三种。
 注意整理分组,规则图标和不规则图标要分开主来放;并把他们的每种状态全部列出来,分组放在文档里。
 文章栏目标题名称或姓名内容,字体要设置不同的规格,,比如名称为14PX、雅黑,标题20PX、雅黑,内容14PX、雅黑,要标出上下左右的距离统一为多少。要标出行与行之间的距离,名称与标题,标题与段落之间的距离。
 

app 切图规范

切图的规范 

屏幕比较小的尺寸,用@1x,稍微大一点的屏幕尺寸,用@2x ,如果屏幕宽度大于768px,,用@3x,切图格式,一般用png24 . 

导航栏 Nav;bav_(功能描述).PNG nav_mune.png  nav_mune_pre.png  

常用的功能操作按钮的缩写:

login_bg登陆背景,login _btn登陆按钮,login _putin 登录框。 

btn按钮  ip输入  按钮文字btntext  复选框 chb  单选框 rb  下拉cbb  

列表页list   list_功能属性_描述 list_icon_like .png  

ta b标签栏 Tab_(功能描述).png Tab_set_pre.png Tab_set.png  

主页按钮 Home_icon_like 描述可以是英文间拼音等第一个字母组成 常用点击按钮:icon_(颜色) 

.9.png针对安卓的一种切图,图片可以愿意变换大小,注意最外层图层的背景必须是纯黑色或者纯透明。 

切图的时候可以把点击的背景一起切下来需要标注。 

Mac支持.flv格式的播放器

Mac支持.flv格式的播放器,找了多个才找到一款好用的,分享一下。

sPlayer Mac版支持视频格式: MP4,MOV,MKV,AVI,WMV,FLV,RMVB,ASF,OGV等所有常见格式,支持音频格式: MP3,WAV,WMA,FLAC,APE等,支持字幕格式: SRT,SSA,ASS等,支持图像格式: JPG,PNG,BMP,TIFF等,支持播放列表格式: m3u8,pls。

sPlayer Mac版支持支持视频旋转和硬件加速,同时播放多个媒体文件。软件内建音频增强和多音轨选择,内嵌/外,挂字幕选择,字幕同步。双击,全屏/恢复。空格,暂停/播放。

sPlayer Mac版和与iOS版本的播放器一样的简单,轻快和强大。值得拥有。

sPlayer Mac版下载:

https://pan.baidu.com/s/1NT4vDXglYapxFwZKVtxfFA 提取码: sv9i

做图标需要注意的点

做图标需要注意的点:

1、绘制图标前,要先设置好对齐像素;尽量选择几何图形而不是钢笔工具;

2、参考线和网格设置,comment+K,打开设置,把网格线间隔和次分割线的数值设置为,需要做的图标大小;比如,需要做的图标是64×64,参考线和网格设置的数字就是64,保证每一个网格都是一个像素。

3、一个图标用一个画板,这样比较有利于后期切片导出等操作。

4、做的图标尺寸,如果复制需要缩放一个,图标的尺寸是偶数,复制的图标缩放的尺寸也要是偶数。反之亦然。

5、圆角和线条相应保持同一。

6、一套图标要保持一致性,让整体保持平衡。以简洁为主,有识别性,注意强化特点。

7、做好一套图标后,要检查,打开 像素预览,看一下图标是否正常显示。

8、尝试做出不同风格。

9、包装和排版。

AI常用快捷键

1.   L–圆 

2.   M–矩形

3.   I–吸管工具

4.   A–直接选择工具(小白)

5.   V–选择工具

6.   V–选择工具

7.   P–钢笔工具 8.shirt+M–形状生成器

     形状生成器状态下,

      按shirt删掉边,按Alt删掉图形

9.comment+2–锁定图层

10. comment+3–隐藏图层

11. comment+D–重复上一步操作

12.   H–移动画板

13. shirt+W—宽度工具

14. S比例缩放工具

15. U–网格工具

16. R—旋转工具

17. Comment+K –调出首选项→设置界面,可以设置网格、参考线等

UI设计学习的路线

UI设计学习的路线 

一、设计是什么?设计是如何产生的?设计可以做什么?
      了解美术史,学会入门的美术鉴赏,目的是以正视听。学会用多个纬度去思考美学, 学会用更深入的方法来看待问题,学会从更宏观的视角审视行业……这样,你才能更客观的去理解UI的发展历程。这些知识和思想,将为你的职业生涯做出启蒙,才更容易成为一个有内涵有深度的设计师

二、手绘

以正确绘出静物为止,最重点要掌握的一个绘画技能,我觉得是结构素描。可以在纸张上对想绘制的图形做出快速、准确的打稿,效率和延展性远胜上机鼠绘。

三、掌握软件Sketch、PS、AI、DW、……可以用它临摹出任何使用这种软件设计的图形。
常自己做一些练习来测试自己对软件掌握度在哪里,就很容易发现问题,然后自己去查资料做研究。
好好去理解每个软件可以实现什么,优势是什么,极限在哪里。

四、设计理论 先是基础中的基础:三大构成:▪ 平面构成▪ 色彩构成▪ 立体构成

五、对于字体的认识 《商业字体设计》(方茜) 《好字体》(向玫玫)《文字设计的原理》([日]伊达千代,内藤孝彦)

六、逻辑取舍 文章:《太及时了!视觉设计师怎样让前端100%实现设计效果?
学会HTML5 CSS3 JQ的入门,安卓、IOS的实现规范!

七、鉴赏模仿 前面的步奏都是一个设计师基础素养的实现,而一个出色设计师还需要培养自己的套路和风格——站在巨人的肩膀上。

你要学会如何辨别优秀的作品,可以从多个渠道收集优秀作品和案例,首推使用:
Behance
花瓣网 (又到了求粉的季节,懒惰的可以只看我的花瓣 死翘翘的超人的花瓣个人主页)
www.pinterest.com
SDC设计师网址导航 (其它的可以在导航里逛)
学会看优秀的案例,用它们给你提供设计的燃料,然后你要做的就是抄!抄!抄!用你学过的设计理论在实现中对案例进行分析,只有发现了它们的优点并自己动手实践实现了,才对你的提升有实际帮助。你每天抄一个案例,BANNER、ICON、APP界面,那么不出几个月,你就能对现有的设计形式套路了如指掌,可以设计出安全不会有太大毛病的UI设计稿。

八、阅读思考扩展
不要做一个只知有设计,不知有数理化的蟾蜍,只能在你自己的井里蹦跶。

        每个方向都需要阅读相应的教材,重要性无以复加,你需要在观看的时候一边做练习。然后才是具体设计类的书籍,记得不要再买那些无用的通篇告诉你软件操作的书籍。
设计的理论书籍教会你怎么设计,你需要在不断接受知识的同时,马上对它们做实验,不停的练习,不停的产生问题并解决。在你的设计观念足够成熟前,绝对不要没事上网看设计的XX法则,如何做好网页设计你需要掌握的XX个技巧,完全就是设计界的鸡汤文,它们看着其实挺有道理,但完全没办法给新人提供实践指南

一定要持续关注这些那些最简单,但是最受欢迎的网站和应用。例如:知乎、INS、微信、淘宝等等。去不断讨论、查阅,来理解为什么是当前的呈现式样,而不如自己的预期。
你要在练习和思考中进步,不要盲目的追求视觉表现,这样的UI设计师是很难真正的成长起来。
设计的终极目的是解决问题,而不是盲目的表现自己对美的追求。所以我要新手不要去看那些只上传飞机稿的网站。
当前主流设计平台的趋势就是,少数大神驱动庞大的底端设计群体,如果你已经在前几个步骤得到提升,那么这些网站的多数设计师已经在思想上没法和你并驾齐驱,不要去这些地方混迹。这些网站不会有真正有价值对等的交流和见解
当你抄了两三个月案例,就已经有足够多的作品集了,你已经可以打包做简历去应聘了。届时你的水准将超越绝大多有数年经验的设计师了!

*成熟的设计不只是你个性技巧的表达,还有你对解决问题所展示出来的理性和洞见。很多设计师和同层次的其它专业人员比较起来显得太幼稚和粗浅,症状也在这里。不要只用设计的角度去看世界,去涉猎更多的专业,让眼界更宽广,有更多的角度去理解世界,得到的感悟将给你带来难以估量的升华和进步。

*设计是一门需要沉淀的技艺,却恰巧遇见了日新月异的互联网文化。这让大家对流行极具敏感度,而开始追赶潮流,轻视正统和法则。这整个流程需要或许需要1整年的时间,但我相信,只要有足够的耐心,是可以让一个新手成长成为一名合格的UI设计师,请放慢你的角度,不要急于求成。

*这是可以持续一生的事业和技艺,在正确的方法下,越积累越成熟,老而弥坚。

 

 

来源于网上收集,仅供学习参考,禁止其它用途!

PS快捷键

common(CTR)+S     保存图片

common(CTR)+G     合并为组

common(CTR)+J    复制图层

common(CTR)+U    调出颜色

shift+common(CTR)+u 去色

common(CTR)+T    改变大小

common(CTR)+Alt+t    改变大小并复制

common(CTR)+Alt+Shirt+t   改变大小并复制并重复操作

common(CTR)+Alt+Shirt+E   快照(盖印)

common(CTR)+i   颜色反向

common(CTR)+L  色阶

common(CTR)+M  曲线

common(CTR)+B  色彩平衡

common(CTR)+Enter 把路径转换为选区

Shift+F6  羽化

common(CTR)+R 调出标尺

12345,在移动工具模式下,改变图层的不透明度

12345,在画笔模式工具下,改变画笔的不透明度