酷站两连发!收录日本都市图片素材库+响应式在线预览网站 - 优设-UISDC

酷站两连发!收录日本都市图片素材库+响应式在线预览网站

2017/11/05 7173评论区

编者按:今天给大家推荐两个网站。一个是专门收录日本几个大城市街景为主的图库网站,可以自由使用于个人或非商业用途。另一个是用来检视自适应设计的免费在线工具。可以随时预览在不同移动端口下的样式。

街画ガイド

http://komekami.sakura.ne.jp/

「街画ガイド」(街头相片指南)是一个日本免费图库,以收录日本几个大城市街景为主。包括东京、横滨、大都会区、大阪、京都、关西等地区,根据网站说明,这是一个相当完整的免费照片数据库,所有相片皆可免费下载并自由使用于商业或非商业用途,无须标示出处(授权说明)。

如果你想去日本旅行,「街画ガイド」也能够告诉你有那些值得造访的景点名胜,通过网站搜索功能,可以快速找出东京在内的几个日本府县知名的建筑设施或街道。若你想要给网站或博客文章找插图,但手边又没有合适的相片,也可以到「街画ガイド」碰碰运气,或许会有令你满意的结果。

STEP 1

开启「街画ガイド」网站后,可以看到网站已经没什么更新了,但依然有相当多的库存照片可以使用,右侧有分类标签可快速选择,看不懂日文没关系,其实大部分都是汉字,当然你也可以通过 Google 翻译将网站翻译成中文显示,对于中文用户来说可能会更简单一些。

STEP 2

右上角筛选功能可根据地区、城市来查找收录的街景或名胜景点,包括东京、神奈川、大阪、埼玉、千叶、京都、静冈、滋贺、兵库、爱知及三重县,选择大分类后可于下方再选择小范围区域。

STEP 3

我还蛮喜欢「街画ガイド」网站的排列方式,浏览动线相当流畅,除了会有某个地区的重要图片外,下方还会有包括 Google Maps、地址、最近车站、营业时间和入场价格等基本数据,点击上方照片可开启更详细内容。

STEP 4

要如何从「街画ガイド」图库免费下载相片呢?点击到详细信息页面后,会显示拍摄的各项细节,再点上方相片就会打开原始图片。只要右键另存新档即可将它下载、保存使用。

下图就是我从「街画ガイド」获取的其中一张相片范例,有兴趣的朋友可自行去寻宝一下。

值得一试的三个理由:

  • 以收录日本各城市街景、景点名胜为主的免费图库。
  • 涵盖东京、横滨、大都会区、大阪、京都、关西等地区。
  • 免注册可免费下载使用,适用于个人及商业用途无须标示出处。

Responsive Screenshots

「Responsive Screenshots」是一款用来检视自适应设计的免费在线工具,只要输入检测网址,即可预览网站在 iMac、Macbook、iPad 及 iPhone 下的显示情形,比较可惜的是 Responsive Screenshots 不支持中文显示,中文字在图片上可能无法完整出现,但这个工具主要用意是查看网页整体的版型或样式,即使无法显示中文也不影响它的可用性,只是截取的图片没那么好看。

STEP 1

开启 Responsive Screenshots 网站后,可以看到一个网址列及四个默认设备,默认情况下会在 iMac 27、Macbook Pro 15、iPad 及 iPhone X 下测试网页的显示样式情形。

STEP 2

如果有特殊需求,也可以从下方设备部分点击、选择其他同类产品,例如 Macbook 也可以选 13 吋或 Macbook Air 等不同产品线。

桌面计算机除了 iMac 27 外,也有 iMac 21.5 及 Apple Thunderbolt 屏幕。

STEP 3

输入网址后,点击右侧的「Grab Shots」按钮来获取摄取画面,网页会提示你可能会耗费 5-10 秒钟时间,取决于你测试的网页大小而定,在结束前请先不要关闭网页。

STEP 4

测试完成后 Responsive Screenshots 会显示网页在不同屏幕大小的设备呈现出来的效果,如同前面所说,有些使用 RWD 的页面,当整体宽度足够时才会显示选单及侧边栏,若宽度不足(例如使用平板计算机或手机)就会隐藏选单及侧边栏,让有限的空间可以被更有效率应用,也更能符合各种屏幕大小阅读。

如果你想看更大张的摄取画面,Responsive Screenshots 网页最下方能下载JPEG格式摄图,也能点击「Download ZIP」批次下载所有测试结果。

值得一试的三个理由:

  • 测试网页在 iMac、Macbook、iPad 及 iPhone 设备显示情形。
  • 可依照需求调整不同屏幕尺寸大小。
  • 产生后的截图可下载,或打包批次下载所有画面。

「2017年1月-10月的设计圈干货大合集」

================明星栏目推荐================

优优教程网 UiiiUiii.com 是优设旗下优质中文教程网站,分享了大量PS、AE、AI、C4D等中文教程,为零基础设计爱好者也准备了贴心的知识树专栏。开启免费自学新篇章,按照我们的专栏一步步学习,一定可以迅速上手并制作出酷炫的视觉效果。

设计导航:国内人气最高的设计网址导航,设计师必备:http://hao.uisdc.com

优设大课堂

非特殊说明,本文版权归原作者所有,转载请注明出处
本文地址:https://www.uisdc.com/urban-image-responsive-web

发表评论 加载中....

评论加载中....

uisdc

评论区都快饿瘪了,看看我期盼的小眼神...

sketch 转场动效 优设大课堂 设计师 扁平化设计 交互设计师 界面设计 排版布局 职场 平面设计 配色 设计师专访 视觉设计 素材下载 设计流程 web前端开发 AI教程 用户体验设计 设计理论 神器下载 字体下载 海报设计 设计趋势 设计规范 psd下载 动效设计 图标设计 产品设计 logo设计 ICON 神器推荐 职场规划 App设计 字体设计 酷站推荐 交互设计 ui设计 设计师职场 优秀网页设计 用户体验 ps技巧 酷站 PS教程 网页设计 经验分享
wechat

优设官方微信

50万设计师关注

微信号:youshege

把好文章收藏到微信

打开微信,扫码分享
学设计 优设网 在这里