设计协作,用摹客

更好的产品协作设计平台,设计师的利器,产品经理的帮手,工程师的伙伴

文章分类
设计1+2,摹客就够了!

摹客,支持Sketch/PS/XD/Figma/Axure设计稿交付、自动标注切图、全流程协作。助力产品团队高效工作!

立即开启
【友情推荐】uimaker - 专注于ui设计,为ui设计师提供ui设计相关教程、素材及灵感。

了解更多
入门教程 了解更多
成都君德鑫力达科技发展有限公司

分享到微信朋友圈:

打开微信,点击底部的“发现”,使用 “扫一扫” 即可将网页分享到我的朋友圈。

博客 > 产品设计 > AI教程 | 三分钟搞定像素画!

AI教程 | 三分钟搞定像素画!

SUPERYEAH_098
2018-12-27
472532

欢迎来到叶设计的自习室

持续更新 · 设计干货

工具自习 | 经验教程 | 素材分享

Hello guys!

Welcome to Superyeah's Study Room.

Sit down, and have fun!

大家好哇!

前段时间叶哥忙着沉淀项目和思考人生,已经好久没有更新教程类的文章了,今天必须得发点干货补偿一下大家。

三分钟,只需要三分钟,轻松get在AI中绘制像素画滴技能~

好了,我们一起来上自习吧!

01

新建文档


Ctrl+N 快速新建文档,设置宽高都为800px,注意看单位是不是像素哦,颜色模式就用默认的RGB就好啦。


02

绘制网格



找到「直线段工具」,就是上图中一根斜线的图标,对它点击右键,在弹窗中选择【矩形网格工具】。

选择了矩形网格工具之后,直接在画布中单击一下,就会弹出这个弹窗啦,大家可以参考图中的数值绘制一个规范的网格~

网格画好了,我们需要让它跟画布水平+垂直居中。

这里如果有零基础的小朋友,不知道对齐工具怎么调出来的——你可以在顶部菜单栏点击「窗口」,然后找到【对齐】,快捷键是Shift+F7

03

建立实时上色组



找到「形状生成器」,就是上图中两个圆+一个鼠标的图标,对它点击右键,在弹窗中选择【实时上色工具】,快捷键是K

在实时上色工具的状态下,鼠标移到网格上面,就会变成红色,并且有文字提醒:单击以建立“实时上色”组,那么你不用犹豫,赶快单击一下!

好了,接下来你可以画画了!


04

准备色板



在实时上色工具状态下,不太方便随时调色,所以建议大家提前建立好色板(就是有颜色的形状而已),到时候直接用快捷键吸色即可!

05

绘制像素画



到这一步了,整个绘制过程就更简单啦!

开始涂!

选中实时上色工具(K),按住Alt,鼠标会变成一根吸管,去单击黄色的色板吸色,然后直接在网格中单击上色 / 或者长按并移动鼠标连续上色,是不是很好用呢!

涂多了怎么办?

别怕,办法总是有的啦。

还是这张图,大家选择「实时上色选择工具」,快捷键Shift+L,然后再单击你涂多了的地方,按下Delete删掉它~~

用实时上色选择工具选中多余地方时,会是这种点状网格的状态。

06

分离网格



恭喜了!你的像素画已经成功完成了!

接下来我们就让画像从网格中分离出来吧!

首先,你要确保网格是在选中状态。

然后,在顶部菜单栏执行【对象】>【扩展】

在扩展的弹窗中,默认勾选这三个选项,点击确定即可。

(单身狗也许会出现无法勾选“对象”的情况,不用管它,摸摸头)


最后!


选中网格,执行两次【取消编组】,就分离出来了唷,开心吗(*^▽^*)

三分钟到了,是不是还不过瘾?

那就继续你的创作8!

叶哥也画了一些吃豆人的图供大家做练习

一定会有同学留言询问封面图上的字体用的是啥呢?

叶哥很自觉的,现在就告诉你们——

中文:方正像素12

英文:Mouse

今天的自习就上到这里啦。

本文经作者授权转载。

原文地址:https://weibo.com/ttarticle/p/show?id=230940432177...


上一篇
年末福利!35款精美的Adobe XD UI 套件下载【完全免费】

Summer   12/28

知名APP(支付宝、微信、花瓣等)首页设计技巧及原型实例讲解

Thomas   12/26

下一篇
需要帮助?

我是小摹,你的7*12小时产品顾问

立即扫码加入官方微信群

官方热线:19130671449

服务邮箱:service@jongde.com