美文网首页设计攻略
关于设计尺寸的那些事

关于设计尺寸的那些事

作者: 创客贴设计 | 来源:发表于2017-02-09 15:53 被阅读133次

经常会收到大家这样的一些反馈:我下载下来的图片为什么这么模糊啊?或者是下载下来的文件好大啊10多MB,能不能压缩啊,发朋友圈都上传不上去啊!

这两种问题绝大多数都是由于选择了不恰当的尺寸造成的。前者设置的尺寸较小,在使用时被强制放大,那肯定会模糊啊;后者多是选择了印刷场景的易拉宝或海报等尺寸,这些尺寸都是半米或是1-2米的长度,却想用在那小小的可怜屏幕上。

下面我来教大家如何选择合适的尺寸或是如何将喜欢的模板改成适合使用的尺寸:

01. 单位

先来讲一下单位,这是基础中的基础,创客贴上的单位有两种:像素(PX)与毫米(mm),为什么用毫:米不用厘米和米呢?网页上设计的计算比较多嘛,能少用小数就少用。

像素(px):为电子设备上使用的长度基本单位,比如电脑分辨率的单位就是像素,常见的尺寸有iPhone6(1334像素 x 750像素 DPI:326像素/英寸),大众笔记本显示器(1920像素 x 1080像素 DPI:72像素/英寸)。

这里还提到了DPI,简单来说就是像素密度,相同分辨率的图片,DPI越高,尺寸越小。

分辨率(px)/DPI(px/in)=实际尺寸(in)

毫米(mm):这个大家都知道,就不过多的解释了,常见的A4纸就是297毫米x210毫米。

02. 预设场景

在我们的场景选择页面,我们设置了很多常见的尺寸。比如海报、易拉宝、PPT、社交图片、公众号文章首图、信息图等等。

我们对其分为了四大类:

社交媒体:公众号文章首图、社交图片类的社交场景图片,单位全部为像素,适合在电子设备上显示;

广告印刷:海报、易拉宝、名片类的实际印刷尺寸,单位全部为毫米,适合用于打印;

工作文档:PPT、A4文档尺寸;

生活:邀请函、桌面壁纸等生活息息相关的尺寸。

想要查看尺寸具体数值的话,我们只需要将鼠标悬停在相应的图片上就能看到。

03. 自定义尺寸

在首页banner的下方有自定义按钮,大家可以设置适合自己的精确的尺寸,在这里要先选择好单位,用于打印就选择毫米(mm),用于电子设备上显示就可以使用像素(px)。

想要知道用于打印的尺寸只需要用尺子将尺寸量一下就可以;

而想要用于手机上的图片尺寸如果不需要很精确,就可以将宽度设为1300px左右,高度根据内容去使用“画布尺寸调整”功能去调整。

如果需要特别精确的尺寸也是可以做到的,将图片在电脑上打开,然后使用QQ截图,在截图的右下角就会显示截图区域的大小。

04. 解决方式

那么如果看中了海报中的某个模板,但是太大,我想用在微信上,怎么办呢,这时就可以使用我们的智能变换场景功能(会员功能),在新场景底部选择自定义,输入和现在尺寸等比的较小的尺寸就可以了,是不是很简单!

相关文章

  • 关于设计尺寸的那些事

    经常会收到大家这样的一些反馈:我下载下来的图片为什么这么模糊啊?或者是下载下来的文件好大啊10多MB,能不能压缩啊...

  • 关于尺寸的那些事

    说到前端肯定会遇到这样一个事情, 2倍图,3倍图, em, rem, px 等等.沟通起来你说的那个不是我说的那个...

  • APP设计尺寸那些事!

    IOS 设计尺寸 桌面图标导出尺寸 上传AppStore所需尺寸 启动页/引导页 导出尺寸 Android 设计尺...

  • MVVM

    1.iOS 关于MVC和MVVM设计模式的那些事

  • 关于设计的尺寸知识

    一般的设计尺寸:android:7201280 pxiOS:6401136 px 单位:px(相对单位)ppi,d...

  • 关于设计风格那些事

    1. 现代简约风格 行走在流行时尚前沿,简约大气,时尚创新 2. 恬淡田园风格 沉醉在午后花影藤风 3. 新中式风...

  • 屏幕适配的一些概念01

    设计尺寸规范-表格 设计尺寸规范-图文 设计尺寸规范-开发尺寸 也可以看看 屏幕适配的一些概念02 手机适配浏览,...

  • Android 关于"尺寸"的那些事(dp,dip,sp,pt,

    必备概念 屏幕大小:屏幕大小是手机对角线的物理尺寸,以英寸inch为单位。比如我的Mix 2手机屏幕大小为5.99...

  • 最全设计尺寸规范+屏幕尺寸 | 设计师必备

    “ 设计尺寸规范之IOS篇 ” “ 设计尺寸规范之Android篇 ” “ 屏幕尺寸之手机篇 ” “ 屏幕尺寸之电...

  • 基础知识梳理

    iOS基础 1.mvc、mvvm iOS 关于MVC和MVVM设计模式的那些事 2.autoReless 自动释放...

网友评论

    本文标题:关于设计尺寸的那些事

    本文链接:https://www.haomeiwen.com/subject/lxxwittx.html