记一次画喵喵

先上个没画完的图

在画这个喵的事情上,我犯了很多错误。

首先,形没打对,是不是觉得有点怪怪的,是的,眼睛画大了。但这个也没关系啦,大不了当我画个大眼喵好了。

其次也是很重要的是,没有分析好明暗关系和光源颜色,仔细看的话,是能看出我的颜色是很乱的,原画是阴影偏蓝,高光偏紫红。然而我在画的过程中时而吸原图的色,时而吸定好的色(左下角那个)。导致爪子部分颜色混乱。当然,这也可以后期在PS里调整。

最重大的一个错误是,我过于注意原画的细节,导致我很多时候先描线,再铺底。这让我浪费掉很多时间。还好我有分层的好习惯,没有酿成大错。

晚安。

最近几乎都没有学习,心烦气躁。

希望明天能改善,加油。

菜鸟摄影入门

作为做设计的,真的应该到处走走,增加一些见识。我总说我要成为摄影大神,却总是只是说说,到真正有机会拍照的时候,只是纯按快门。

很想去旅行,看看外面的世界,无奈很胆小,不敢一个人说走就走。

旅游没开始,这里说一些心得。

重要的话说在前面:

照片一定要经过后期处理,包括裁剪。

拍摄时要注意基本构图,注意画面不杂。

  1. 在拍摄过程中,你想重点表现就可以不用太在乎其他东西。比如说想拍云层,那么下方建筑暗到没细节也是可以的。反之一样。当然,在举例情况下,你想建筑也表现得很好,也可以拍两张,一张表现云,一张表现建筑,后期合成。
  2. 拍摄时,要拍的比实际要达到的效果更暗一些,这样能更好的表现细节。
  3. 利用物品进行遮挡拍摄,如栏杆、网、楼梯之类的。
  4. 怎么拍出失焦的梦幻感,在手机没有对焦成功(如镜头靠太近、自动对焦没完成等情况)时,当然也可以在后期进行模糊处理。
  5. 抓拍时不建议连拍,要培养拍照的一种感觉。
  6. 利用镜面反射,如车的后视镜、水的倒影、玻璃、车身等。
  7. 多拍摄平常遇不到的情景、景物、人。
  8. 常见的就用不同视角,如拍腿;把画面调成黑白;拍人的头发、侧面;背面;鞋之类。
  9. 可以视情况加锐化,加减饱和度,加减明度和调整对比。
  10. 拍有特点的人,有特点的景,不普通不老套的动作姿势。
  11. 把无关联的两个物体用摄影手法联系到一起。
  12. 利用影子的趣味感、神秘感、诡异感等。
  13. 运用对比、特异、重复等构图手法。
  14. 学会利用有意思的拍摄角度,如航拍大情景、仰视拍动物,建筑、正上方拍食物、斜上方拍食物(一般别方方正正老老实实的拍,拍文具等排列可以有规律)
  15. 真假混淆。
  16. 利用好一些特殊APP、特殊滤镜,如模拟星空。
  17. 利用水的倒影制作油画效果(扔一个石子在水面上),当然前提是景色或物体颜色丰富。
  18. 利用器材瑕疵,这也是一个特殊技法。
  19. 如何拍出光斑,其实和第4点有点像,也是在失焦的情况下拍摄。(如拍摄一个油光发亮的的肉啊烧烤啊,可以靠很近,开闪光)

我们都知道顺光是沿着光线方向,也就是拍摄者背对光源。但是在很多情况下需要补光,那么如何在没有特殊器材的情况下,拍出不错的人像照片呢,首先选址很重要。

有哪些看上去很高大上,但实际很简单的PS技巧?(渐变色篇)

在知乎上看到的。

用渐变工具,随便选两个相近的颜色:

 

然后随便拉出一个看起来就不怎么样的图:

然后打开高斯模糊,直接把半径拉到最大:

然后狂摁Ctrl+F直到你觉得这样手累,不对,是看得过眼了。

最后就随便打一些字,完成。

够零基础吧,够随便吧…..

PS:到这一步了发现颜色选错了?没关系,我们摁Ctrl+U呼出色相/饱和度,然后随意拖,直到得到你想要的效果。

 

我把它命名为“三分颜色开染坊”法。

颜色进阶版

先确定主题,找一个比较符合主旨的颜色,然后进渐变选项,加入颜色:

然后用吸管将另一边也变为同样的颜色:

点开颜色,按照幼儿园学的红橙黄绿青蓝紫来将色带上的颜色挪一个色系。

即成不用模糊的:

之后随便加个图形,用魔棒点选。比如说我想做个鲸鱼为主题的:

用渐变工具拖动。注意和原来的渐变方向相反:

然后我发现这样子鲸鱼和背景的对比太不明显了……. 而且这个鲸鱼不喷水TAT(内心OS:大哥,你不喷水谁知道你是鲸鱼啊 TAT)

于是摁Ctrl+M调出曲线工具,上下拖动一下,然后强行加个水,即成:

PS AI 布尔运算

相比于AI的便捷来说,PS的布尔运算简直是一大噩梦。

明明是同一个公司做的软件,方式却大不相同(知道是有原因的啦…)

假设两个形状,A和B,要求最终结果是:A是被减的形状,B是减A的形状

AI

要达到上述结果,条件必须是:

  • 可以不在一个图层。
  • 要同时选中这两个。
  • 同时三个以上一起进行布尔运算如减,结果是最底层的那个形状减去上面所有的形状,就算把下面几个编组也没用。当然可以先把把下面几个合并形状再让上面的图层对其进行减法。反正在进行布尔运算前多思考总是对的。
  • 运算过后,最终形状的填充和描边是:除“减去顶层之外”,都不是随被减形状的填充与描边
  • 最终形状是在被减图层里。

PS

要达到上述结果,条件必须是:

  • 两个形状必须在一个图层!!不在就要先选中这两个图层,右击“合并形状”!!
  • 单独选中最上面的图层也就是B,不是被减物。(可是明明B就是顶层形状,为什么要选中它,然后“减去顶层形状”啊喂!)
  • 三个形状在一起进行布尔运算的话,过程会及其痛苦,完全猜不到到底是减去哪个。还是老老实实一个一个来。
  • 因为A和B在一个图层里了,在形状选择工具下,就算只选中其中一个改填充和描边,另外一个也会变。(ps:PS对于形状工具的改描边与填充真的是敲及不友好啊!不像AI里一个shift+X键就能互换)
  • 有一种相对来说比较方便的方法。比如说先画了一个形状A,然后按住Alt键画另外一个形状B,就自动从A上面减掉了和B相交的部分;同理,按住shift画B,就等于加上了B,当然这和直接画了B,然后AB图层“合并形状”意思是一样的;按住Shift+Alt组合键,表示保留原有的形状和新建的形状重合的部分。
  • 进行布尔运算后那些原本形状的锚点一个也没少,可以“合并形状组件”。

 

 

注:PS的X快捷键是互换前后景,AI的X快捷键是切换填色/描边 (不是互换),AI的shift+X键是互换填色/描边。

PS和AI的布尔运算共同点

  • A在下,B在上。(即被减物在下)

总结:

特么的谁懂用AI却用PS做复杂图形的布尔运算简直就是傻,建议都在AI里面做好了拖到PS,弹出来的选项可以是选“智能对象”也可以是“形状图层”。

立体场景插画的运用及绘制技法

昨天晚上观看了腾讯大牛(站酷ID为“江湖哥”)在学汇网的一个直播课程 ——立体场景插画的运用及绘制技法。

果然看直播的体验是不一样的,观看过程中会比看回录的要认真的多,生怕错过精彩的知识点。在看直播时,有什么问题也可以直接提问,这个老师非常有耐心,讲的也非常好,往往能清晰的、一针见血的解答问题。

收获很大,跟你们分享~

开讲时,明确了一件事情:立体场景是基于什么设计原理?

答案是轴测图(isometric)

轴测就是轴测图没有近大远小的关系,竖直方向高度没有变化,只有水平方向按角度偏移。(这样就与传统透视区分开来)

前一段时间刮起了一阵纪念碑谷风的热潮,现在余热还没有散去。

之前没有接触过的人也可以好好玩玩这种风格。

绘制这种场景可以使用PS、AI、c4d、手绘。按理来讲,这些都可以做,各有各的特点,只要其中之一精通的话,完全可以满足要求,但是为了提高工作效率我们往往要结合使用(特别是大型的、复杂的场景)——打印好网点图或者网格图,在纸上绘制手稿,进行扫描,最后在电脑上描。

但软件具体是怎么结合使用的呢?

AI主要用到“效果>3D>凸出与斜角(绕转和旋转可以做圆环之类的)”,重点是做好后进行取消编组,把图形各部分依次复制到PS里。(3D制作、渲染会比较自然,但用PS、AI绘制会比较生动、有趣,看个人需要)。另外,3D面板里面的立方体是可以直接转动的,这样可以自定义角度

PS主要用到钢笔工具形状工具选择工具等,重点是智能对象的使用。(tip:先把一个方块转化为智能对象,然后做斜切,后面想把这个透视了的方块替换成其他图形,可以直接双击这个智能对象,在新打开的psb文件里面绘制、替换就好)

我记得我提问了一个AI里面使用渐变的问题,想知道有什么关于AI渐变使用技巧。老师回答的是可以把图形拖进PS调,但这违反了我的初衷,我是想直接在AI里出效果。在后来观察老师的操作中,我恍然大悟,知道了答案。先分析你想得到一个什么样的画面,然后可以在面板适合的地方画一些矩形等,填充调好的需要的颜色或者渐变,后期其他图形想填充其中一种颜色或渐变,就可以用吸管(快捷键i)吸(AI的窗口里面有个“颜色”和“渐变”,可以调出来,实时调色)。这个和在PS里画三大面五大调的调色配色其实是一个方法,但是我没有举一反三,实在太笨。

 

PS 动作

切换到动作面板,然后点击新建组按钮,然后在这个组里新建动作(记得组和动作都要命好名,可以设置快捷键),点击录制按钮,进行了什么操作/命令都会记录下来。

录制完了之后点击停止按钮即可完成。

点击某项命令,点击录制,然后做一个命令,再停止录制,这样,这个命令就加到了那项命令之后。

对某张图片进行这个动作,直接快捷键。当然,动作里面有些命令想不进行,可删除也可去勾跳过。(在“动作”面板最左都有个勾,当你想处理的文档不需要某项命令,但又不想把这项命令删掉,就可以取消勾选)

另外,在“动作”面板最左那个勾右边(也就是一些命令带数值的话,前面就会有个勾)。勾上它,批处理的时候,执行动作,遇到这一步命令就会弹出来让我们设置。

需要注意的是,我们想单存一个动作是不行的,PS只能存一个文件夹。所以我们在存储动作时,是要选择装动作那个组,然后才能“存储动作”。

当我们想处理大量的图片如在数张图片上面加上水印,可以事先做好这样一个加水印的动作,然后在文件>自动>批处理,设置“组”和其中的“动作”,及“源”(也就是要处理的目标文件夹,把所有要处理的图片放进这个文件夹,可以勾选“包含所有子文件夹”)、“目标”(选择“文件夹”即存储到新的文件夹里)。最后特别要注意最后一项“错误”,应选择“将错误记录到文件”。

ps:

快捷键d—复位画板
有一些操作如做选区,可以事先设置单位为百分比。

 

PS的背景橡皮擦和魔术棒橡皮擦怎么用

前一段时间有个好朋友叫我帮他把蓝色背景的证件照P成白色背景。我居然花了十几分钟,很不可思议,我的认知里是几秒钟能搞定的。只是我那时突然忘记了最佳方法——背景橡皮擦。

  1. 设置前景色为头发颜色或者任何你想抠出来的物体的颜色,背景色为这张图片的背景。
  2. 在图层面板选择人物图层,接下来选择背景色橡皮擦工具,限制=不连续,容差50%,保护前景色打上勾勾,取样=背景色版。在需要擦除的地方用橡皮擦开始擦除背景。

(当然,每个情况都会有它的最佳方案,这只限于像证件照一样背景比较单一的图片,而且对于抠出来的图片质量要求不是很高才适用)

魔术棒橡皮擦工具,就更简单了,它是魔术棒加橡皮擦工具的综合,一点一拉就擦掉了。

【我们一起读书】掌握自己的时间(实践部分)

对于时间管理,目的性要强,注重效率,规划好十分钟要完成的事情,尽量十分钟完成。

掌握自己的时间

你所做的每件事都要花费时间,这意味着你必须通过管理你的时间这个最稀缺的资源,来决定你的成就和成效。

首先,不知道大家有没有一个误区:时间不需要管理。结合我自身实际来看,一是觉得时间没有管理的必要,因为你本身的事情单一,觉得管理起来反而太麻烦了。逝者如斯,不舍昼夜,如何让时间产生的效益最大化,就需要管理了。早睡早起也是一种管理。 继续阅读“【我们一起读书】掌握自己的时间(实践部分)”

低保真VR原型制作

目前UI设计范畴有:

  1. 网页界面手持设备界面(系统界面,独立APP应用界面)
  2. 平板电脑、电脑系统、应用软件界面、游戏界面及车载导航设备界面
  3. 智能电视界面、可穿戴设备界面及家电类微型液晶屏界面
  4. 医疗及各种数码机床等自动化控制界面,微型嵌入式设备界面
  5. 卡拉OK点歌、远程会议监控、虚拟现实等界面

我接触过的是粗体标记的

今天想讲的是VR(虚拟现实)界面设计原型制作

 

之前在做“数字校园”的时候,看到有人做了一张工大的全景图,当时很好奇。后来做产品渲染的时候又想自己制作HDR。人生中最痛苦的事是你想了解一个东西,却不知道用什么关键词搜。

今天突然想起来,又去了解了下,知道了一些。

 

首先要明确的一点是“这也是界面设计”。

用到的工具有PS、AI、Flaming pear(能把做好的“水平剖面图”转化为“等距柱状投影图)、gopro vr player 2.2(这个是把做好的JPG图片拖进去就能预览VR效果的工具,但是好像只能Mac用,win用户可用“devalvr player”代替、代码编辑器。

用到的文件有水平剖面参考线(在AI、PS里面画原型图/ui图辅助)

水平剖面参考线长这样。

 

一个模板文件夹,直接改里面的关键代码(替换下切好的图、改下数据)。这里用的是coffeescript语言,我表示我不懂,也不太想懂,以后调位置交给前端就好,我只负责设计和切图……

模板文件夹内容是这样

 

 

 

 

 

 

 

 

 

 

具体步骤:

1、构建参考线,绘制线框稿,绘制水平剖面图


2、调整透视并创建720°视图(等距柱状投影图)。

 

4、视觉稿预览

 

 

 

注:

像那种块中块可以加重阴影,背景图片可以找或自己做的通透感和透明感比较强的图片,这样在VR场景中显得纵深感更强。

这个demo只能做定点旋转视图效果,不能前后纵深,左右平移试图。左面处理透视的方法,和右面不一样。结果也不一样,左边的是向左延伸,而右边的直接映射到右边的“墙”上。
PS导出JPG(也就是做好的等距柱状投影图)时画布自然要是2:1的比例。
在代码中修改关键数据时,像那些位置性质的标签(elevation纵向 ,heading横向,expand是放大的动画,collapse缩小变没的动画)单位是角度

Flaming pear也是VR摄影经常用到的一个插件,如果只有一台相机,拍照的时候用一个脚架,前后左右上下各拍一张,在PS里面对着这个像十字架的参考线铺上去。裁好,用这个插件就能做好一张2:1比例的“等距柱状投影图”。(相关教程:http://blog.sina.com.cn/s/blog_9b9575b50102wjao.html

微软material design官方视频:https://www.youtube.com/watch?v=rrT6v5sOwJg

微软fluent design官方视频:https://www.youtube.com/watch?v=vcBGj4R7Fo0

 

最近在用AI,发现了很多知识盲点

AI CTRL+5

在制作图形过程中,一些形状你不想打印出,但是又需要看到它的存在范围或路径,就可以ctrl+5制作参考线。

这种参考线与传统参考线不一样在于它是有形状的,很多要做刀模版呀或原尺寸(不含出血的)的时候都会用到它。

风格化

在AI的【效果】里面有很多有意思的东西,比如说3D,svg滤镜、风格化、文档栅格效果设置,还有一些我很惊讶的效果,像素化、模糊、素描、纹理、艺术效果等。大部分我都没用过,后续补充。

现在先看看风格化。

在做字体设计时,我经常用到里面的圆角。

在做一些UI方面的展示或者是做排版时,我们会用到投影来提高视觉效果。

3D

编组选择工具

编组选择工具(直接选择工具的隐藏工具):用以在不破坏组合(包括群组)的情况下,选择组合中的物体。

编组选择工具只能选择到整个物体,可以再任何组合命令中(包括群组),不解散组合命令从而选中组合中的物体,但是无法单独选中或者修改锚点或者路径(连缩放物体都需要切换工具)。

这就解决最近经常遇到的困扰:经常会使用到创建剪切蒙版,但是时不时要选择到组内的形状来编辑或复制,我通常用的方法是“隔离选中的组/路径/剪切蒙版”简直要被逼疯。

刻刀工具

选中该刀工具后,按住键盘上的ALT加SHIFT键,从图形中间拉一条笔直的线,就可以将图形割开成两部分。

AI渐变网格高级用法

渐变网格可以帮助我们在复杂图形的表面体现光影的效果,而且是矢量的。

网格渐变第一步便是建立网格,有以下三种方式:

  1. 创建形状之后,对象-创建渐变网格,然后输入对话框中的行和列。
  2. 用网格工具创建网点和网格线,只需要在你需要创建网点的地方点击就可以了。
  3. 创建一个径相渐变或线性渐变之后,选择,然后对象-扩展,在这个对话框里面选择渐变网格的操作,将其转换为一个渐变网格。

控制和着色网格点

  • 你可以选择和移动网点,以及使用网格工具(U)操作手柄或直接选择工具(A)。
  • 删除网格线,用网格工具按住Alt键然后选中要删除的网格线即可。
  • 也可以用直接选择工具选中一个网格点,然后按Delete删除网格点,这时只要经过这个点的网格线都将被删除。
  • 位于线的交点的网格点可以是有色的,其他类型的网格点只创建网格的形状,选中其中一个点,给它上颜色。
  • 曲线段上面的渐变网格的顶部和底部,如果我们采取添加锚点工具,这些线段上面的一些无形的点就会变的有用起来了。
  • 这种类型的锚点不能包含颜色信息并且不能被直接控制,用添加锚点工具创造一个新的网格点。这种类型的锚点不能包含颜色信息并且不能被直接控制,用添加锚点工具创造一个新的网格点。

AI自定义图案笔刷/描边

临摹了十个小时的异形

在画的过程中,我遇到一些重复性的操作问题,比如说异形下面那一圈大小不一的圆。如果是在PS里面,我可以先自己制作一个图形作为笔刷,用画笔描边路径的方法来画,那么,在AI里面用什么操作实现相同的效果呢?

 

AI里面有很多内置的很好看很有用的笔刷,但是在一些特殊情况下,不能够满足要求。

第一步,制作一个图形, 将其拖入到色板里面。

第二步,点击画笔面板右边的菜单项,选择新建画笔。在弹出来的面板上选择“图案画笔”,点击确定按钮。

第三步,在弹出来的图案画笔选项设置下图相应的选项,包括边线拼贴、外角拼贴、内角拼贴;添加间距以适合,点击确定按钮。(图案可以选择五个)

然后就可以看到自己新建的图案画笔出现在画笔面板上了。

如果确定之后,对画笔的效果不满意,可以点击画笔面板右边的菜单项,选择“画笔选项”,来更改画笔设置。

消失点

可应用在有强烈透视的图片修图中。

在滤镜-消失点里面按顺序由左至右从近 到远的顺序点四个点,然后在左侧点击图章工具等进行修图处理。

 

另外可联想到,如果想画一套相同透视的图标改怎么画呢?

 

AI里面有一个透视工具

【按SHIFT+V, 点击立方体的外围,如箭头所示,使得立方体没有颜色,就可以正常绘制一个没有透视的图形。

绘制好了之后,按SHIFT+V, 点击立方体的一个面,具体点哪个面看自己的需求。然后选中想透视的图形,拖进透视格里就有了精确的透视。】

 

但是一般我们画那种微写实的图标一般都是使用PS。

在PS里面实现一定透视的方法:

例如找一张两点透视网格图片,拖进PS,然后用钢笔工具等在格子上绘制想要的图形。(这个是克美小姐姐的方法)

另外可以直接用一点透视、两点透视的知识直接画出来,作为几个分角度的模板。

 

【我们一起读书】彼得·德鲁克对时间管理有何高招?

当我们去关注时间管理时,肯定是因为自己的时间出了什么问题,再寻求良方,对症下药。从我个人的时间经验来讲,我无法控制自己在手机上花费的时间、睡觉和起床的时间,看看彼得·德鲁克能否解决你我自己的时间难题。 继续阅读“【我们一起读书】彼得·德鲁克对时间管理有何高招?”

代码人的职业选择

代码人的职业规划不是准绳,但是也不可或缺!

我们一般假定写代码的人有两条职业道路可以走,一条是安心做个代码人,踏实写好代码,就是所谓的“技术路”;一条是转管理,以后就做个技术管理人,带着一帮技术团队冲锋陷阵,就是所谓的的“管理路”。 继续阅读“代码人的职业选择”

像素图标绘制

像素图标属于位图,强调清晰的轮廓、明快的色彩,几乎不使用混叠方法来绘制光滑的线条,所以常常采用.gif格式。优点是尺寸精致,信息容量小。

这里有一篇关于它的文章http://www.uisdc.com/pixel-icon

准备 工作

工具

铅笔工具、钢笔工具、形状工具、吸管工具、油漆桶-取消勾选【消除锯齿】、橡皮擦-块模式、其他选区工具-取消勾选【消除锯齿】

设置

  • 执行[编辑]\[首选项]\[单位与标尺]\[参考线网格]\[切片]项命令,并设置[间隔]和[子网]为想要的像素(我设置的是1像素,结果网格和像素死活对不齐,查了半个多小时,找到答案,设置为1.0像素就可以了,我去!);然后执行菜单[视图]\[显示]\[网格]命令,打开网格显示。
  • 使用矢量工具时,勾选对齐边缘,绘制的图形会自动对齐像素,选择矢量工具(钢笔、形状工具) – 顶部工具栏里找到对齐边缘 – 勾选。(会出现对齐边缘不可选的状态,可能是一、钢笔工具不是选的形状;二、形状工具下,当前图层不是形状图层)
  • 从Ai复制到Ps怎样保留可编辑性
    从Ai复制矢量图形到Ps时,应当选择粘贴为形状图层,这样就可以在Ps内继续编辑图形,用形状选择工具将锚点一一调整以对齐像素。

透视

透视可采用一点透视、两点透视,一般采用斜上方45°俯视的上帝视角。

取色

一般使用渐变色,等距取出3、5或8等数份颜色做成色板,放一边待用。

 

像素图标难度在于对角度的把控,圆滑的圆角怎么画,斜线怎么画,像素多少节奏怎么把控。

 

暑假我为什么选择在家?

作为一个不打算考研的2018届大学毕业生,这是最后一个暑假,对于我们是十分珍贵的。很多同学找了实习,而我却选择了在家。春杰说:“在家学习效率不会很低吗?”我说:“低就低吧。”

那么,我为什么会选择在家?

两点之一,我的一个梦想。

在这里我要提到前几天奶奶过生日时,我印象很深刻的一件事。梅姐姐(表姐)有一个儿子,历来我特别喜欢, 乖巧聪明可爱,我随口问了他的姐姐“你喜欢你弟弟吗”“非常讨厌”惊讶过后便是理所当然。

过去里的十几年,我也讨厌我弟。

在病房里,护士说“你的弟弟真可爱,我抱走了哦。”我想的是“赶紧抱走,别抱回来了。”

后来,我便失去了宠爱和自由。从小学开始,我便当爹当妈一样,给他做饭洗衣,去哪都要带上这个累赘,家里的电视也被霸占,因为他被父母打骂。

有很长一段时间,我恨不得杀了他。

每个假期,我都要“抚养”他,完全超出了一个作为姐姐的职责。

而这个假期,没有我妈,没有我弟,我能享受到一个真正属于我自己的,能自己掌控行为的假期。这是我期待已久,对我来说实现了很多年的梦想。多可悲。

两点之二,我想更清晰认识自己。

在父母亲戚眼里,我是别人家的孩子,刻苦勤劳。在朋友同学男票眼里,我是一个吃了睡睡了吃的堕落者。在学习这件事上,我到底是怎样的一个人,不得而知。

这是一个实验。在没有人干扰我也没人督促我的情况下,会只顾享受这惬意的生活,无暇学习,迷茫的混吃混喝,还是会突破自我,发掘自己高度自觉的一面。