百独托管7500 紫田网络超高转化播放器收cps[推荐]速盾CDN 免实名免备防屏蔽阿里云 爆款特卖9.9元封顶提升alexa、IP流量7Q5团队
【腾讯云】中小企福利专场【腾讯云】多款产品1折起高防 随时退换 好耶数据小飞国外网赚带你月入万元炎黄网络4H4G10M 99每月
香港带宽CN2/美国站群优惠中客数据中心 服务器租用联盟系统移动广告平台 中易企业专场腾讯云服务器2.5折九九数据 工信部正规资质
腾讯云新用户大礼包代金券高价收cpa注册量高价展示【腾讯云】2核2G/9.93起租服务器找45互联 随时退换阿里云 短信服务 验证秒达

[交流] 针对 Retina 显示屏设计的时候,怎么处理原图片的阴影和边线? [复制链接]
查看:829 | 回复:1

6

主题

80

帖子

47

积分

落伍者(一心一意)

Rank: 1

贡献
11
鲜花
1
注册时间
2009-4-19

QQ绑定落伍手机绑定

发表于 2013-3-11 16:02:50 | |阅读模式 来自 中国江苏淮安
首先,「适配 Retina」这种观念要尽早转变,因为 Retina 早已是一种常态,它才应该是你的「原图」,不要再从 1x 开始设计了。所以,问题应该反过来:如何处理非 Retina 下图片的边线和阴影?这就更简单了。

在 1x 和 2x 并行的尴尬时代里,设计师都应该养成两个习惯:
使用双数的值,无论控件尺寸、间距还是样式值
使用矢量图层,保证每一个元素的可重复编辑性
做到这两点,你便可以通过改变大小来输出 1:2 的两份图片资源了(样式数值也会自动随比例改变),当然更可以直接使用 Slicy 或 Cut&Slice me 这样的工具帮助你自动输出。

回到你的问题,不一定要在设计上(比如阴影、边线等)保持 1:2 精确对应。

这里说「不一定」,是因为技术上没有任何限制。iOS 对图片尺寸的识别是以图片实际边缘为准的(包括 alpha 通道),也就是说,你只需要保证两张图片的尺寸是 1:2 就可以了,而图片里的内容,可以按你的需求来任意发挥。
有 Facebook、Instagram、Directr、Dcovery……(我手机上一眼看到的)很多很多,都有采用类似的设计。

评分

参与人数 1积分 +15 鲜花 +1 收起 理由
topsky天极者 + 15 + 1 辛苦了

查看全部评分

1797

主题

1万

帖子

1万

积分

落伍者(四季发财)

哥哥(请读第二声)

Rank: 4

贡献
28
鲜花
306
注册时间
2011-8-6

技术小组

发表于 2013-3-11 16:28:29 | 来自 中国广东深圳
不知道楼猪在说些什么,看起来好历害的样子
论坛客服/商务合作/投诉举报:2171544 (QQ)
落伍者创建于2001/03/14,本站内容均为会员发表,并不代表落伍立场!
拒绝任何人以任何形式在本论坛发表与中华人民共和国法律相抵触的言论!
落伍官方微信:2030286 邮箱:(djfsys@gmail.com|tech@im286.com)
© 2001-2014

浙公网安备 33060302000191号

浙ICP备11034705号 BBS专项电子公告通信管[2010]226号

  落伍法律顾问: ITlaw-庄毅雄

手机版|找回帐号|不能发帖?|Archiver|落伍者

GMT+8, 2024-5-29 01:17 , Processed in 0.124241 second(s), 39 queries , Gzip On.

返回顶部