最新消息:

版式设计图大全(界面设计中的那些版式)

媒体模版 admin 浏览 评论

[关键词]静态版式;动态设计;第一时间一张优秀的报纸必须是既好看又好读的。好看,是指报纸的版面设计所形成的整体视觉感觉,包括文字、图像、标志、插图以及线性的空间分割等重要元素构成的视觉形象,能给人带来美的享受;好读,是指报纸所刊发的内容贴近生活、贴近读者,具有警示作用和给人启迪与思考的力量。

报纸的版式设计应服从于报纸的整体气质与基本风格,对于不同内容的板块和叠次,在版式设计上应体现出相应的风格特色,并从全局角度把握设计的强弱、轻重、疏密等等,形成层次分明、节奏有致的版式风格。细致完善的版式细则和严谨到位的执行力是确保一份报纸能形成鲜明风格、整体气质的根本保证。优秀的版式设计是用编者魅力吸引读者去领会作者魅力。

一个没有个性的版面是绝对失败的,就像一张毫无个性的面庞,在视觉不会给人留下什么印象。每张报纸都要拥有自己的个性,才会具备吸引读者的魅力。人们在浏览报纸版面时,在看到形式上的独特性的同时,也就能感受到内容上的独特性。下面就版式设计应注意的几个问题做简单论述。

一、静态版式需动态设计

版式设计不仅仅是吸引读者眼球的编排方式,更为重要的是体现报纸发展策略、办报理念和独特品位。新兴报纸大都在成立之初就制定版式大纲确立基本风格,即采用静态版式的编排风格。

静态版式有明显的易读性特征,各条新闻成方成块,可以一览无余,便于读者轻车熟路地获知信息。就如新闻摆上了橱窗,阅读时像进超市,在固定的位置找到自己所需,长此以往较易形成认同感。静态版式实际上把编辑从版面上解放出来,淡化了“划版”的功能,强化了“编辑”的功能。另一大好处就是,它有效避免了传统版式操作中因编辑原因造成版式的良莠不齐,十分有利于一张报纸统一风格并形成相对固定的形象。

有一点需强调的是,静态版式并非一成不变,也就是静态版式也需动态设计。版式设计在整体风格固定的前提下,要以读者易读、悦读为首要标准,随时了解、洞察目标读者的阅读情境、习惯、喜好变化,有计划有步骤地丰富发展新的设计手法。

二、让读者第一时间找到感兴趣内容

版式设计就是对文字和图片进行整合,调动点、线、面以及所有科技设计手段强化阅读效果和视觉冲击力。在这个过程中,人们视觉感受的规律性法则,如对称、平衡、和谐、对比、统一、整体等将起到重要作用。不同的报纸会以版式信息的侧重点不同来凸显媒体性质,同时,不同的版式设计和色彩运用也表现着不同的编辑思路,这些都有助于形成不同的报纸风格。无论具体表现形式如何,成功的版式都会具有以下几种通性:

1.易读性。编排依据内容的主次从左到右,便于阅读。一个缺乏设计的版式大多是缺乏整体感和悦读感的。因此编辑的第一职责就是按照视觉习惯的需要组织好文章,使版面流畅大方。报纸是大众化的文化快餐,因此,报纸版面应条理清晰、简洁单纯,形成整体节奏和美感,让读者在第一时间里找到感兴趣的阅读内容。

《家报》自2011年11月起对一版版式做了很大的改动,由原来的新闻版改成了大标题导读版。六七条导读,配上夺人眼球的图片,将重要新闻所在告知受众,极大地活跃美化了版面,使头版更加生动形象,充满活力。

2.差异性。在新闻资源日渐趋同的情况下,版式风格的差异性正是区别于竞争对手的一种特殊的优势。

3.稳定性。版式风格的稳定有利于培养阅读习惯和风格的形成,一般不做大的调整和变化,这是一张报纸走向成熟的体现。但在发展过程中力求适当的补充和创新。

三、广告与版面设计相融合要有科学性

任何一块报纸广告版面中,都包含着诸多构成因素,这就要求版面设计者要有统领全局能力,力求做到主次分明、突出主体。如果不突出主体,那就极易导致读者视线的流动,偏离设计的诱导路线。在设计版面时,通过设计各种标志的办法来引导读者阅读。报纸版面和新闻版面有相同之处。在新闻版面中有“主题”“腰题”“倒头题”之分。而广告版面也有“异曲同工”之处。所以要把读者最想看到的,也最能体现产品特点和个性的内容放到醒目位置。可根据广告创意,有意把读者最想知道的内容或要素安排在比较小、但非常好的位置上,吊足读者胃口,达到广告效果。一块报纸广告版面是否能得到读者认可,以至达到较理想的宣传效果,版面的艺术质量占很大比重。因此,在版面设计时,要把握“主次分明”原则,充分安置好素材,做到灵活调配。

四、用版式设计展露编辑智慧

1.在策划中激发再创造意识。打破以往策划、采访、编辑的界限,编辑直接参与报纸各方面的总体策划,各负其责,又密切配合,参与对报纸编辑发行、读者需求、稿件定位、市场预测、竞争举措等总体策划。这样报纸编辑就会在全面了解战略目标的前提下,胸有全局,进而产生大思维、新创意,才能从大处着眼,小处着手,严谨细致,精益求精地进入报纸编辑具体的再创造活动。

2.从版面上再现再创造意识。报纸版面的内容编辑和版式设计是编辑展露智慧、驰骋才情的场所,是再创造意识全面价值的最高体现。编辑根据总体策划的大思路,对自己所主持的版面从内容到形式进行具体策划,然后有目的、有重点、有针对性地编排文稿、图片等,并把自己多方面的新创意渗透到版面编辑中。报纸编辑的再创造意识,集中体现为用美学和技术创造出内容和形式双重美的和谐统一。可以说,版式设计是美的追寻与创造,比如统一中的整体美、配置中的组合美、比例中的差异美、对称中的平衡美、节奏中的韵律美等等。在此过程中,编辑的主体价值将在从内容到形式的再创造中得到充分发挥。□

(编辑/刘佳)

小编话:界面美不美,除了构图之外,另一个重要手段的就是如何处理留白,也可以理解成版率。留白就是为了凸显层次、突出内容。当然除了留白还有什么方法让界面高大上和达到一定的视觉效果呢?让我们跟着作者@王铎(micu设计)一起来看看吧!

作者:王铎(Micu设计)

这篇主要说一下版面和图形使用,对高手来说可能有些老生常谈,但对移动端界面设计或许会有点参考价值,用几分钟看看吧。

界面美不美,除了构图之外,另一个重要手段的就是如何处理留白,也可以理解成版率。留白就是为了凸显层次、突出内容。

手持设备屏幕较小,决定了信息显示是有限的。用户有效接受信息并不与界面内提供的信息量成正比,有的时候提供的越多,用户反而真正接受的越少。妄想满屏都是信息是不可能的。用户越来越受不了满屏的信息了。

让用户接受该接受的有效信息,是关键。

在设计界面的时候,因为内容和页面都比较多,为了保证页面与页面的统一性,首先需要设定页面内容四周的留白。在设定页面的间距后相应的内容图标,图片等的安排就确定下来了。用这样的方法能使调整出来的页面更为条理化。

红色色的部分就是内容。在页面中一般会有导航的存在,那么内容区的版面是从导航下面计算的。

界面四周增加留白。这样的界面很容易集中用户的视线到少数的内容上去,突出了焦点,整体给人一种典雅高级的感觉。

反之,缩小留白或者不留白,页面会显得更丰富更充满活力。而图片的展示空间会增加,冲击感增强,让界面更显得富更有张力。

根据页面的内容不同和功能点,适当的调整界面周边的留白非常重要。一般图片本身比较有意境,可以直接采用“出血”的方式,不留白或者少留白。

下面介绍一些版面的小规律、小技巧。

1.取其精华,一块颜色也能定天下!

提取主要的信息,通过对整个页面的颜色进行调整,从而提高版面使用率。将一个或多个功能点作为主信息,提到首页中进行设计,从达到想要的视觉效果。这样处理后的界面设计不仅能显得大气有张力,而且展现出来的信息聚合度高。

在缺少图像素材的情况下,如何让界面显得有张力,整体感强,呈现出来的版面率高。

单色背景留白,凸显主要信息。要求图标或者文字,相对简洁,能够很好地和背景色融为一体。再通过线条和规则的图形来分割留白区域,增加层次感。

做好这些的前提是,设计师要明确主要信息,以及它们之间的关系。

结合产品特点巧妙的运用大色块,将变化的信息用颜色区分出来。让用户最直观的感知信息的变化。

2.多色块灵活分割,加强内容使用率

图片素材少,还可以采用多色块进行分割,让界面显得不那么单调。

加强内容使用率可以通过色块(临近色或是互补色)的延伸或是图像的重复来组织页面版式。将图片和色块进行统一化排版布局,整体基调能使页面丰富化。图片与相同大小的色块可以保持界面的统一性与简洁性,色调的一致的统一性和连续性使页面更为整体,这样看起来的页面就像一张图片一样有张力。并且这种方式让用户感觉点击的区域也会增加,从而操作也变得便捷起来。

3.构图不拘一格,找到最合适的内容版率。

横向和纵向分割,使界面显得整齐、稳定,而斜向分割让界面冲击感强。

使用不同的构图方式,穿插性地将少量的图片整合在构图的形状中,能让界面变得活跃而富有活跃性。这样的表现方式还能将产品的气质融入进去,淋漓尽致地展现。有节奏感的设计更为取巧地加强了版式率。在界面设计中,图文的穿插可以引导用户的视线,让原本简单的内容变得有趣。在层次上,也可以区分内容的主次性,让阅读更加的轻松。

4.简约化桌面或主页,让界面越近越美

常用方式:图标、加大文案字号、序号、数字等来达到加强版式率的运用,提高视觉上的丰富性。

图标表达

人们越来越认同扁平化,一方面是因为扁平化的图标看上去清新简洁,用户理解快。另一方面,与图标搭配的背景更加单纯,要么留白,要么炫简,尽可能减少给用户在视觉上干扰。好的扁平化图标不是简单地删减细节,而是着重凸显有效的信息。

图标是最为直接的表达方式,简单明确的图形,能让用户通过对图标的认识快速找到想要的功能和需求点。图标与文案的搭配有效的降低了阅读时候的疲劳感。从而加强了界面内容的节奏。运用图标的设计条理清晰,功能明确。

信息化图标能给产品增色。有趣的图标设计不仅能很好的将功能点进行区分,也能好的将软件的特性和品牌展现出来。

把图形融入到界面中,可让内容更为丰富,层次更加的分明。

5.突出重点文案,调整版面率,让信息更清晰。

调整文字大小将调整版式的使用率,使原本空的界面内容显示的更为饱满,用户阅读起立更为直接。使用较大的字号进行加强页面使用率能让页面显得更为信息。突出重要的引导文案,加强了软件的情景感和带入感。快速引导了用户对功能的理解,从而准确的使用。

在页面中我们可以强调重点数据或功能词等来区分界面中的层次感。让用户的视线更为集中。

6.串联图片,让它们讲故事,视图化版面。

这种设计方法更多的是将文案用图形或插图展现出来。在数据页面和引导页中最为常见。

一段文案一副插图的引导页更为有特色,给用户的情怀感更强。这种设计手法也是最容易体现产品特质和吸引眼球的。图案的易读性高,能在极其短暂的时间内快速传达给用户信息。用图像来讲故事,是设计中最根本的表现方法,也更是最为受欢迎的表达方式。

图在界面中的运用

三种方式:抠,边界关系,残缺

1.切抠弄,制造纯色留白!

在处理图片素材的时候,常常会碰到图片背景杂乱,产品不够突出的问题。在设计之前我们可以对素材先进行处理,将产品直接抠出来。利用这种方式可以找到产品的形状,越明确的形状越能反映用户对产品的认知度。产品的独特性能快速明确的表达给用户,用户从潜意识第一时间的判断到产品的类型和使用特性。

下面是一个曲奇饼干的网站,将主饼干的勾出来,进行层次感的区分。在产品介绍中采用了侧面的实物抠图,体现出了曲奇饼干最为真实的厚度。运用碎落的饼干块虚化拉开产品的层次。深色的背景与饼干对比强烈,直接凸显了实物的形状。让用户一目了然,食欲大增。从而增了用户的购买欲望。

在很多的电商APP中也常采用抠图,去除多余杂乱的信息,利用产品的形状直接体现不同商品的特点。这样的界面用户阅读起来轻松愉悦。

2.建立边界,再打破边界,破出重围

如果需要展示的信息较多,采用分割区域的方法,可以使界面显得整齐干净。而当信息较少时,设计师可以大胆选用“局部出血”的方式,建立边界,再突破它,增加层次感和冲击力,以凸显主题。

一定要记得设定好的内容范围是为了让页面显得整体化,而不仅仅是摆放和拼图。

在网页设计中有时候会见到这种方式,其实在手机、平板等UI设计中我们完全可以套用。

运用图片的穿插来区分背景和产品或形象的层次感,处理完的界面更加富有生命力。放大需要突出的主形象,把它作为第一焦点展现在用户的眼前,有种强烈的“面对面”感受。

在APP中采用将图片局部突出出来,能拉开信息的层次,将需要突出的图片信息第一时间展示给用户。一方面可以方便和引导用户点击,另一方面在上下滚动的长副瀑布流里,适当地打破平衡,可以丰富页面的节奏感。

在ICON的设计中我们也常用到破图的方法。在统一的圆角矩形中,将表达寓意的图形局部超出,使图标更为有空间感和灵活性。

采用这种方式设计的图标空间感强,层次感强烈,能使产品形象显得更为突出。

在字体中也经常运用到破图的方法,让字体更为生动。在破字的过程中也能引发出不同的创意点。

大美青海字体设计我把数字9破出了方块。而在优车尚品字体的设计中,我通过品字的破图找到了车的联想,让整个字体设计的更为贴切灵动。

3.冲出画面,只保留局部,让产品再大一点!

有时候,我们拿到素材,在处理后发现,图片比较平常,用户一眼就知道是什么。这个时候,可以考虑保留局部的方式,营造残缺美,增加时尚感。不要小看用户的的脑补能力,当然,这种方案还是要与客户或者产品经理及时沟通,残缺美不是所有人动能接受的。

我们将图片进行放大,找出产品特点。选择能撑起整个页面构图的位置,切除不必要的图形,让图片冲出画面!这样处理后,页面显得非常富有张力,激发了用户想看到产品整个形象的欲望,起到产品预热的效果。

在WATCH的预热官网中,设计师将图片放大,裁取有特点的部位进行展示,引导了用户点击观看产品的整体形象,激发了用户更多的去了解产品的特性。

从版面角度看,局部放大裁切图片,增加了留白,增加了版式率,让整个页面显得饱满,微距的效果使用户与产品更贴切。

这一篇主要理顺了一下版面和图形使用知识,并不全面,大家还是以欣赏为主。看完了能有个留白、破图的印象就不算白看。

设计大方向上的东西终于絮叨得差不多了,我知道其实大家都懂,就是不知道从何下手而已,下一篇来点小方向的实用东西,欢迎大家留言。

原文作者:micu设计

站酷

分割式排版海报怎么做

分割式排版海报怎么做?1、首先,确定版式,将字体弄成白色,或者是其他颜色的背景,字体不用太花哨,只要跟海报的主题相符,就好。2、找一种字体样式比较简约,有设计感,有层次感,不用太复杂,不会让人看不清楚,不要太花哨。3、根据主题选择合适的字体,根据海报文案内容,找出产品的一些关键词,如:经典、女性、温馨、亲爱、亲近、温暖等。4、确定主色调,我选择的色调,可能有一种颜色比较显眼,有一种稳重,有感觉的,所以我选择比较轻质感,也有厚度感的颜色。5、对页面进行简化,把产品的核心内容,优化到极致,用色统一,不会造成视觉设计的混乱。6、给整个页面增加一种特殊的氛围,感受这个页面背后的灵魂。7、给背景增加一个简单的几何。

这张海报的优缺点在哪?

优点在于简单明了,缺点在于重点缺失,不美观。

在视觉上用两个不同颜色的爆炸框着重突出促销信息,让消费者看一眼就能感受到有两大福利,并给福利二配上一张比较大的食物图片,增加指向性和视觉冲击。

上图这种海报似乎也满足了设计中所需要具备的很多原则,比如对比,该海报中有大小对比、字体对比、图文对比、色彩对比、

点线面

对比等。

再比如平衡,该海报的构图也是平衡的;信息清晰易读,在

排版

上有清晰简单的视觉流程,信息层级也很分明,阅读起来很轻松;然后整体也算干净简约,甚至还有些不错的细节处理。

海报这一名称,最早起源于上海,是一种宣传方式。旧时,海报是用于戏剧、电影等演出,活动的招帖。上海的人通常把职业性的戏剧演出称为“海”,而把从事职业性戏剧的表演称为“下海”。

作为剧目演出信息的具有宣传性的招来顾客性的张贴物,也许是因为这个,人们便把它叫做“海报”。

正规的海报中通常包括活动的性质、主办单位、时间、地点等内容,多用于影视剧和新品宣传中,利用图片、文字、色彩、空间等要素进行完整的结合。

海报设计是

视觉传达

的表现形式之一,通过版面的构成在第一时间内将人们的目光吸引,并获得瞬间的刺激,这要求设计者要将图片、文字、色彩、空间等要素进行完整的结合,以恰当的形式向人们展示出宣传信息。

海报这一名称,最早起源于上海。海报一词演变到2013年,范围已不仅仅是职业性戏剧演出的专用张贴物了。

同广告一样,它具有向群众介绍某一物体、事件的特性,所以又是一种广告。海报是极为常见的一种招贴形式,其语言要求简明扼要,形式要做到新颖美观。

如何设计一张高品味的海报?

做版式,做平面设计,一点一点知识的理解都是构成一个版式的基础。所以我会先从一小点一小点小知识讲解,之后再把小的知识点整合在一起,排出来的版面思路自然就很清晰、大气。版式就是整个版面看起来的整体效果。

以前自己是做广告平面设计的,我很多时候会根据这个思路来做一张图片:

首先需要百度了解要设计的东西

1.文案主题(做一张海报,你首先要知道它主要表达的是什么意思,然后再来选择你要的素材与及想要表达的主体)

2.确定版式形式原理(当你选择了想表达的主体,你需要选择一种想要表达的版式设计的基本类型如:骨骼型、满版型、上下分割、左右分割、中轴型、曲线型、倾斜型、对称型、重心型(聚拢)、离心型(扩散)、三角型、四角型、并置型、自由型)

3.排版四大原则(确定好文案与及想要编排的主体素材时,便需要按照排版的原则来进行有规律的排版,四大原则:对齐,对比,重复,亲密)

4.运用点线面(排版的过程中便需要了解什么是点线面,然后我们要怎么来运用它们来达到我们想表达的画面效果)

5.运用字体选择及排版(排版的过程中,我们需要提炼出主体文案,字体的类型,来表达画面需要突出的属性,想要表达的意境,字体的排版也影响到了想表达的效果,所以字体上的排版方式也是多样的,这个需要后边细讲!)

6.颜色选择(颜色是整个主体表达的重要部份,六种色相分别代表着两种气质冷暖,也分为四种色调明色调,淡色调,灰色调,暗色调)

7.颜色搭配类型(颜色选择后需要进行配色,从而达到画面平衡,突出主体,突出想要表达的画面意境)

8.纹理(纹理是一种很好的表达方式,比起颜色更是一种比较具像的表达)

转载请注明:片头模版 » 版式设计图大全(界面设计中的那些版式)

发表我的评论
取消评论

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)

网友最新评论 ()