收下这个占位图生成器,让你的原型图更精致!

占位图占位图生成器神器推荐
最美UI小编收集整理的收下这个占位图生成器,让你的原型图更精致!教程,供你快速学习设计工具

在设计网页或是配置版面时经常会需要预先保留图片位置,让开发或示范时使画面更接近最终样貌,如果手边的图片还没处理,我们可以通过占位图片呈现出特定大小的图片范围。简单来说,占位图片生成器利用网址直接调整、产生特定尺寸范例图,省去必须自行裁切图片的麻烦,因为是以网址形式加载图片,即使没有下载图片依然能在网页上显示。

本文要推荐的「Dummy Image」算得上是占位图片生成器翘楚,Dummy Image 让开发者在线产生特定尺寸大小、背景色、文字色、文件格式或带有文字的范例图,除了利用网页界面调整各个选项,亦可通过网址进行设定,快速制作出开发或设计版面时会用到的占位图。

Dummy Image 是一个开放源码(Open Source)项目,相关信息可在 GitHub 找到,也有不少开发者将它制作成不同程序语言版本。值得一提的是网站收录许多常见的广告尺寸、屏幕和影片大小,通过链接快速带入某个你想使用的范围大小,就能达到预览效果。

Dummy Image

网站链接:httPS://dummyimage.com/

使用教学

开启 Dynamic Dummy Image Generator 占位图产生器后,会有一个预先显示的占位图,从下方选项调整图片尺寸、背景颜色和前景文字颜色,格式部分有 png、gif 和 jpg 三种格式,可以将图片保存后使用,或是利用图片下的网址来插入图片。

收下这个占位图生成器,让你的原型图更精致!

默认情况下 Dummy Image 会在图片里标示尺寸大小,如果想要显示其他文字,也可以直接输入在下方「Text」字段(这里可正常显示中文),文字就会呈现出来,很适合用来对于图片位置标记命名。

收下这个占位图生成器,让你的原型图更精致!

透过 Dummy Image 就能快速产生特定尺寸大小的占位图片。

收下这个占位图生成器,让你的原型图更精致!

如果在开发网页或应用程序时想要预留广告字段,测试一下广告放进页面后的效果,从 Dummy Image 网站就能找到各种标准广告尺寸(像是常见的 300×250、336×280、468×60 或 728×90 等等),点选广告名称就能取得该大小的占位图或是直接复制链接使用。

其他还有像是标准的屏幕尺寸、影片大小都能找到对应的占位图。

收下这个占位图生成器,让你的原型图更精致!

其实 Dummy Image 所有功能都可以通过网址进行设定,举例来说,网址后方接上的第一个数值是图片宽度,使用单一数字会产生该长度的正方形,直接输入像是 640×480 产生特定尺寸的占位图;第二和第三个数值分别代表背景色和文字颜色,使用 hex 数值指定色码。

其他还有设定图片格式、自定义文字等等用法,有兴趣的话可参考网站说明文件。

收下这个占位图生成器,让你的原型图更精致!

值得一试的三个理由:

  • 可产生特定尺寸、颜色和格式的占位图片(Placeholder)
  • 利用网址直接调整图片大小等各项参数
  • 提供各种广告标准尺寸、屏幕和影片尺寸

如果觉得最美UI所整理的设计内容对你有所帮助,欢迎将最美UI网站推荐给身边设计好友。

本设计资源来源于网友网络收集整理提供,主要用于学习设计之用,请勿直接用于商业化设计。

猜你在找的设计工具


Fontworks和谷歌合作啦!免费开放8款开放日本字体下载
Fontworks Inc.(フォントワークス株式会社)是一家成立于 1993 年的日本字体公司,旗下有知名的筑紫系列、UD 字体系列和 Klee(クレー)字体,经常出现在广告的标题,看起来很有气质,筑紫系列和 Klee 也被内建于
设计师必备的12个APP,你有几个?
大家好,我是小凹,我又来分享干货了。 大家平时手机APP中有多少是跟提升和学习有关的?自己碎片化的时间都用来做什么呢?是否在微博、微信、淘宝、抖音之间游走?在这些APP里获得即时的快乐后,又很空虚?
想录制屏幕?这个谷歌扩展插就可以满足你!
有时候会需要录制计算机屏幕画面,可能是介绍产品、操作教学或是制作课程,也会搭配摄影机和麦克风进行讲解,就要寻找一款适合自己的屏幕录像工具。现在有不少浏览器扩充功能就能做到这些事,而且操作上很简便。
设计圈超火的3个Sketch插件,让你效率逆天(已打包)
不知道大家日常有没有使用插件的习惯,反正我是经常使用,为什么?因为效率更高了,做图更快了。今天给大家推荐 3 个我常用的 Sketch 插件,它们真的很实用,而且我身边很多设计师也在使用。
为什么我10秒就能做出漂亮的背景图?有这个神器你也行!
前言 我相信大家肯定有遇到过,时间短,还需要一张漂亮的背景图,这肯定是弄不出来的呀,那么办?今天就给大家带来一个免费生成背景的神器。