网站建设中如何能让你的Gif图设计得更秀

栏目:网站建设 发布时间:2020-01-18
颜色创建图像应使用RGB模式,而非用于打印的模式。不必考虑浏览器安全色,因为几乎不再有人使用8位的显示器。

      颜色创建图像应使用RGB模式,而非用于打印的模式。不必考虑浏览器安全色,因为几乎不再有人使用8位的显示器。颜色的选择应当参照统一的标准,如视觉识别(VI)系统。颜色的数量和效果是决定图像格式的重要因素,如色彩渐变往往产生大量颜色,如果保存为GIF则会产生失真,文件大小也大幅增加
一、在Gif图中建立一致的视觉
     Gif图是世界上短的电影。你可以借助它来进行品牌化的传达。你可以在设计的时候使用品牌的配色来对它进行设计,将品牌的形象、LOGO和其他元素在 Gif图中呈现,让品牌、企业和产品以更加富有活力的方式呈现出来。而用户则能够借助这些元素,来和品牌本身产生关联。在特定的情形和需求之下,Gif图能够帮助用户了解产品的功能和其他的信息,而品牌化的配色则能够强化这种关联。
二、不要提供多余无效的内容
     虽然设计师会在自己所热爱的项目中投入更多,但是在做 Gif动态图的时候,在传达信息的同时,要尽量简化其中的内容,一般而言,更少的信息能够让你在制作动画的时候获得更多的自由和可能性!一定要克制住加入大量内容的冲动。用户在观看你的 Gif图的时候,很容易被过多的内容所淹没,尤其是当你想要借助 Gif图来传达特定的情绪和感受的时候,多余的色彩和内容很容易弱化它们。不要过度设计。围绕着核心的元素和调色板来设计,让它们足够独特和诱人。
三、在上传Gif图的时候,保持良好的可访问性
     作为设计师,你应该熟悉用户群体,并且将 Gif图中可能会分散精力的视觉内容给去掉。不断移动的 Gif图会很大程度上转移用户的注意力,在一屏当中使用多个 Gif图的时候,尤其要注意这一点。如果有大量文本内容的时候,Gif图中的色彩和特效尽量控制数量,因为它们可能会过多抓取用户注意力。避免 Gif图自动播放,这样让用户感到可控,并且可以节省流量。
四、删除Gif图中所有的额外帧
     当你在设计 Gif图的时候,无论你使用哪种类型的动画,Gif图中,总会有某些时刻是状态停止的,创建好 Gif图之后,应该通过调整,删除掉额外的、停止不同的帧。删除额外的帧,仅保留其中一帧,并根据动画的状态和节奏来调整该帧的时长,可以缩减 Gif图的大小和播放时候的压力。这样的调整不仅能够让 Gif图整体质量保持不变,而且同时可以减少不必要的空间占用。
五、如果你使用PS来制作Gif图,请务必保持整洁简练
     在设计 Gif图的时候,很多设计师会选择使用 PS 来制作。一方面是足够习惯,足够顺手,但是另外一方面,PS 本身的图层管理和制作机制还是很容易导致混乱的。PS 中元素和图层管理需要兼顾的太多,以至于在制作 Gif图的时候,稍微增删或者移动一些内容,就很容易输出一个不理想、不可控的 Gif图。同时,如果没有正确地标注图层,之后又进行了相对复杂的操作之后,很容易导致多米诺骨牌一样的错误。更令人头疼的是,修改一个地方之后,后续很多图层都需要进行调整和修改,终会带来大量的重复性的工作。所以,在 PS 中制作 Gif图,要尽量保持整洁,条理清晰。
六、借助故事板来梳理Gif图的内容
     很多时候,Gif图本身的简单形态使得它看起来不复杂,但是这其实使得很多设计师因此而出错。通常,Gif图本身迷人之处就是在于它的故事性,即使再短,它当中也包含着叙事,故事性,甚至复杂的转折和多变的转场。基本的故事变化和元素,这些是 Gif图制作的基础。在设计动画的时候,我们很容易忘记这些东西,借助故事板,可以帮你更好地梳理故事的走向,镜头的变化,情节的走向,值得注意的关键情节和转折。尤其是当你不是一个人来制作 Gif图的时候,整个团队可以借助故事板,将进度统一起来,极大的改善沟通和统一的问题,加快创作过程。
七、运动状态要保持模糊效果
     Gif图当中的模糊效果,其实和老式相机中的运动抓拍效果是一致的,很多处于中间态的运动,其实是不那么清晰的。而这一点和我们的视觉是保持一致的。如今相机的成像质量越来越高,但是我们的眼睛并没有随之快速的进化。在 Gif图当中,帧数通常不会太高,如果图片的细节始终保持清晰则容易呈现出跳帧,运动状态的物体适当保持模糊效果,则更接近我们日常观察的细节,从而让 Gif图带来接近视频拍摄的效果,用户也会因此感到真实和精彩。
     对于已有的位图和照片,应先使用软件调整好尺寸后再插入到网页中,而不应使用HTML语言中的width和height属性改变图像尺寸。直接使用HTML语言控制图像尺寸可能会使图像失真严重。通常,放入网页中的图片应控制到一个比较小的尺寸。

网站建设中如何能让你的Gif图设计得更由同信长春网站公司为您提供,更多内容:http://www.480w.com
同信长春网络公司为您提供:长春网站建设  长春网络公司  长春手机网站