宁波IT培训
美国上市IT培训机构

0574-87236644

设计师须知的图片设计那些事儿(一)

  • 时间:2019-06-04 10:26
  • 发布:宁波达内培训
  • 来源:网络


在设计中的定位就如同一个人的衣着品味,不同的穿衣风格会使别人对你作出不同的判断,为你打上不同社会属性的标签。随着用户对各类体验的不断升级,商家也在各种细节上面不断优化,对于图片的要求也不断加以重视。今天给大家分享的就是关于图片的那些事儿,希望可以带给你更多帮助。

 

本文将从图片在设计中的重要性开始解析,加强大家对图片的认知;再从图片比例、后期处理技巧、设计中的运用须知等方面分享关于图片在设计中的处理经验;最后也会分享一下我们在寻找合适的图片过程中的方法与后期图库的管理经验。

 

 

相信图片在设计中的重要程度对于设计师来说已经了然于胸,虽然大家都会选择更好的图片资源来进行设计,但是依然还有很多需要设计师注意和把控的地方,下面我们一起来看看。

 

 

1.1、提高图片的质量

越来越多的产品对图片质量开始加以重视,比如网易严选对产品图片的拍摄与处理都有严格的规范,目的就是为了提升产品气质和在用户心中的印象。我们在设计的时候更要以最佳的图片来烘托我们的设计稿,图片的质量影响着整个设计的格调。

 

 

 

在产品设计中,很多伙伴儿会觉得图片都是后期运营上传的,我设计稿做得再精美最终也是没用的。对于这个问题我的观点是这样的:

a. 最佳的设计输出是设计师专业的体现;

b. 把最好的效果呈现给决策者,增加他对你设计能力的印象;

c. 通过制定运营视觉规范来把控图片质量,是可以严格把控你对图片的视觉追求;

d. 你的态度会给你带来好运。

 

 

1.2、图片的真实还原

虽然前面提到图片质量的重要性,但是我们不能为了视觉效果选择一些与主题无关的配图,这样也会给决策者一种误导。我们可以提高配图的质量,但是需要保证图片的真实还原,这样才能让你的设计作品更加真实合理。

 

在一些本土的产品设计中,对于国外图片素材的运用,需要谨慎对待。如案例中的模特形象,文案信息的传达更加偏向于国内的场景,如果运用一张国外的模特素材也许逼格更高,可是却无法真实的还原产品场景,会给决策者传达一种错误的认知。

 

 

 

1.3、图片版权须知

关于版权这个问题往往还有很多设计师不以为然,要嘛是压根就没注意这个问题的重要性,要嘛就是抱着侥幸心理。我们在工作中作为专业的设计师,不仅需要保护和维护自身权益和公司利益,对于作者的尊重也是基本的职业素养。

 

在项目中面对图片版权问题我们要主动告知需求方,这样我们尽到了职业义务,也让需求方能够做出正确的判断。

 

 

在对产品界面进行布局的时候,图片的比例往往被大家所忽略,凭着自我感觉任意选择一个整数数值进行设计,在多个地方出现相同内容图片的时候候也会尺寸混乱,这样无形中增加了前后台的规范性和存储压力。

 

下面从项目中常用的图片比例和需要注意的地方给大家进行分析,也给大家分享一下图片比例的选择方式,在整套产品设计中需要保持的一致性等方面。

 

 

2.1、图片比例有什么讲究

不同比例的图片所传达的信息主体不尽相同,根据产品属性我们会选择与之相符的图片比例进行整体的界面布局。

 

通过体验一些主流的产品,我们会发现一些比较常用的图片比例,如 1:1、2:1、3:1、3:2、4:3、16:9、16:10 等等;也会发现一些打破常规比例的设计,我们需要分析它们的性格,结合自身产品的特点,才能在自己的产品设计中合理的加以运用。

 

 

下面选择几个常用比例进行分析,希望抛砖引玉,带给大家更多的思路。

 

1:1 强调主体的存在感

1:1 的图片比例是比较常见的一种设计比例,利用此长宽比更容易将构图归整得简单,突出主体的存在感。常用于产品展示、头像、特写展示等场景,在电商类产品中尤为常见,如:淘宝、网易严选、网易考拉等。

 

在产品设计中通常以两栏或以上为主,通栏展示的情况一般用于商品详情页头图部分展示居多,其余界面布局较少利用通栏展示。

 

 

 

4:3 图像紧凑、更易构图

4:3 的图片比例可以使图像更紧凑,更易构图,方便设计师进行发挥。由于手机屏幕容量较小,作为全屏展示时,该比例在产品设计布局上面占用空间较大,通常我们作为分栏来进行界面布局。

 

作为设计师来说,这个比例经常接触,UI中国、Dribbble 等的作品封面,在携程、厨房故事等产品中也均有采用这个比例。

 

 

16:9 电影场景般的效果

16:9 的图片比例可以呈现电影场景般的效果,多用于横向构图,是应用非常广泛的尺寸比例之一,能给用户一种视野开阔的体验。在很多影视娱乐类产品设计中运用广泛,如腾讯视频、网易云音乐等。

 

 

16:10 拥抱黄金比例

黄金比例就像金字塔上的明珠,越接近她越有魅力,反之会魅力减弱,16:10 的图片比例最为接近。设计没有绝对的标准,我们可以遵循一些优秀的经验规则,但是也要敢于突破规则,尝试更多的可能性。

 

 

X:≤Y 瀑布流设计

X:≤Y 代表宽度固定,高度在最大值之间自定义的瀑布流设计,在一些用于用户没有很明确的目的,只是喜欢获取尽量多的信息的情况下采用这种设计方式。X:≤Y 的图片比例要注意高度的控制,最大值不要超出屏幕可显示区域的范围。

 

 

以上列举的仅为部分常用比例的分析与说明,还有更多的比例这里就不一一演示,分享的目的是让大家养成分析的习惯,结合自身产品特点选择适合的图片比例。

 

 

2.2、图片比例选择方式

a. 以商品展示效果为准,选择能够充分表现商品特点的图片展示比例;

b. 以产品气质为准,选择符合产品内容气质的图片展示比例;

c. 结合产品特点选择合适的常用比例;

d. 根据版面布局灵活的自定义特殊的比例值;

e. 分析→打破→创新,创造出符合某种规律或者美学概念的比例值。

 

 

2.3、图片比例的一致性

当我们结合产品特点确定合适的图片展示比例以后,需要针对整体的布局与图片分布情况,规范出那些布局可以采用相同的图片展示比例。在保障视觉效果与交互形式的情况下,相同的主体,在不同的页面中最好采用相同的比例呈现,这样的好处不仅可以保持视觉表达的一致性,也能给后期运营维护带来便利。

 

 

 

预约申请免费试听课

怕钱不够?就业挣钱后再付学费!    怕学不会?从入学起,达内定制课程!     担心就业?达内多家实践企业供你挑选!

上一篇:达内教你留白技巧(三)
下一篇:设计师须知的图片设计那些事儿(二)

UI设计师常犯哪些错误(一)

UI设计师常犯哪些错误(二)

为什么UX开始被重视

UI和UX到底有何不同

选择城市和中心
江西省

贵州省

广西省

海南省