www.bmdqw.com

互联网产品设计：切图小贴士

 “点九”切图事半功倍

 

 

　　用户手中看到的产品界面，并非设计师呕心沥血创作的效果图，而是一个个单独的切
图经由开发同学技术实现。切图作为设计师与开发者之间的桥梁，它的作用很关键，合适的
切图、精准的位置可以最大限度的还原效果图的设计，精妙的切图更会有事半功倍的效果哦

!

　　我们经常会做一个俗称

“点九”的切图，什么是“点九”呢?“点九”是 Android 平台处理图

片的一种特殊的形式，由于文件的扩展名为：

“.9.png”，所以被称为“点九”。“点九”也是由

于

Android 平台多种分辨率需适配的需求下，发展出来的一种独特的技术。它可以将图片横

向和纵向随意进行拉伸，而保留像素精细度、渐变质感和圆角的原大小，实现多分辨率下的
完美显示效果，同时减少不必要的图片资源，可谓切图利器。

　　

“点九”的制作工具为“draw9patch”，具体制作步骤这里不多讲了，插播小贴士第一条：

舍弃这个制作工具吧，减少繁琐的步骤，不要再每张图片都拖到工具里画啦

!直接用 ps+铅

笔就可以画哦。

　　

“点九”的学问当然很大，但 Android 切图不仅需要清楚“点九”的方法，还有其他各种小

技巧。下面为大家分享我在工作中总结的几个关于切图的心得。

　　

(一)站在开发的角度来切图

　　了解技术实现方式，就像了解一位开发同学，更多的了解，会让工作更加顺畅。

　　如为下图按钮做

“点九”图，一部分同学可能会这样做：