网页大图片应用技巧浅析 - 腾讯ISUX

用图像创造场景感,增强用户的真实体验,近些年来,图片作为背景填充整个屏幕的设计越来越广泛,曾经只有时尚潮流网站或者摄影类站点才会特别依赖富有冲击力的图像,但是现在几乎任何类型的网站都有可能采用这种大图片作为背景,特别是企业品牌宣传、产品介绍等等。

在设计网页过程中,需要用到大量的图片,而且找到的图片大多风格迥异、无品牌感,那么如何找到合适而又能正确地应用图片呢?

如何正确应用图片

整理了一些经验总结供大家参考:

1.提炼关键词寻找图片

首先需要提炼产品特性关键词,通过关键词的形式寻找合适的图片。

上图是google云盘官网banner背景为一张在飞机向外看的图片,不难发现用这种比拟手法来表现云盘的口号“随时随地使用”,在任何时候、任何地点都可以使用文件。换位思考,假如我们来设计google云盘官网,首先提炼出关键词:随时随地、自动同步、超大空间等等,用最能突出特点和有代表性的关键词来寻找合适的图片。

上图是IBM旗下的MobileFirst产品,其主要为用户移动应用从创建到维护推出的一体化解决方案为广大用户提供更便利服务,那么根据项目提炼出关键词:手机、用户,该网站用了一张人拿着手机进行使用的图片,目的是为了突出项目的业务特点。

上图分别为苹果官网、研究无线电技术企业——高通的网站中运用的图片同样也是通过产品特点提炼的关键词来完成图片的选用。

2.图片品牌化

什么是图片品牌化?通过关键词寻找到的图片进行深度加工处理,使之在项目中运用到的图片都是一整套的、风格统一的,比如可以在图片的色调、色彩饱和度与特色风格上做调整等等,下面举几个案例。

Google Drive官网摘取出来的图片,这些图片不难发现无论在色调、色彩饱和度上是一致的,特点是低饱和度、颜色深沉和图片噪点,颜色上新颖有特色、风格上具有明显的品牌统一性。

上图为SAP公司官网的系列图片,作为全球最大的B2B企业为各行各业、不同规模的其他企业提供解决方案,正如它运用不同行业场景的图片一样:色彩丰富、但色调又不过于鲜艳,它们所有用到的图片都有这些特点。

美国高通网站的品牌宣传图片让人印象深刻,品牌特点独树一炽,颜色上运用冷暖搭配,加以渐变效果巧妙地叠加于图片上,虽然颜色种类不多,但能在风格、品牌上具有强烈的统一性,让人对品牌辨识度有更加深刻的记忆性。

项目实践

去年做了几个腾讯云的项目改版,尝试新的风格探索,排版上采用了大图片为背景。设计过程中考虑到产品的长远发展,通过研究后发现图片统一风格在产品品牌推广上有着非常重要的作用,通过几经打磨快速整理了实现方案。腾讯云线上新版本的页面图片已经实现了统一风格。

总结

大图片作为背景的设计风格,这种设计方式虽然非常强有力地抓住用户的注意力,能准确应用图片而达到更大的体验效果是非常重要的,如果去掌握,了解项目背景,利用关键词的方式寻找更合适的图片,此外还需关注用户对产品的印象程度,那么图片的品牌化就显得格外重要,把产品所用的图片设计为一整套统一的风格出来的效果是不可估量的。

感谢你的阅读,本文由 腾讯ISUX 版权所有,转载时请注明出处,违者必究,谢谢你的合作。

注明出处格式:腾讯ISUX (http://isux.tencent.com/image-application.html)

原文发布于微信公众号 - 腾讯ISUX(tencent_isux)

原文发表时间:2015-03-20

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏企鹅号快讯

小程序运营的六大基础能力

很多自媒体运营,对小程序的使用,以及结合公众号的引导成交做的还不够好,小程序上线已经快一年了,各种能力的开放,也极大方便了自媒体运营,尤其是自媒体电商的转化。今...

2596
来自专栏互联网杂技

真心的说几句

很多人说“我准备做一名前端开发工程师了,web前端”, 我不管你是专业的科班出身,还是出于兴趣,或者为了找工作什么的选择这个方向。 尽管都是写代码,开发前端页面...

3266
来自专栏人工智能的秘密

给大家介绍一系列适合个人使用的AI产品

我认真查阅了几千个网址(大概6000多个链接),花费几周时间之后带给大家最好最全的AI产品和业界最有前途的AI公司介绍。今天我们带来了的是第一篇产品分享!—适合...

2590
来自专栏Java学习网

写代码时你可以听听这些音乐

写代码时你可以听听这些音乐  不知道大家在写代码有没有听音乐的习惯,一般都听什么类型的音乐呢?我自己在这方面的经验不多,不过今天正好看到了一个网站专门精选推荐写...

2147
来自专栏知晓程序

用小程序发的群公告被刷走了,还能找回来吗?| 小程序问答 #56

如果用过「群里有事」、「群空间助手」这类针对群聊天的小程序,没准会遇到一个问题:在群聊里分享一张小程序卡片,很容易被群里其他人的聊天刷走。想要在聊天里找回这张卡...

783
来自专栏非著名程序员

开发者必知的8款App快速开发工具

“我有一个好创意,就差一个CTO……” “原生APP开发难度大,周期长,成本高,还没上线市场已经被占领了。” “APP版本迭代更新,都是企业的一道难关,没有一个...

2165
来自专栏软件技术

UI界面清晰最重要

界面清晰是UI设计的第一步,要想让用户喜欢你设计的UI,首先必须让用户认可它、知道怎么样使用它。让用户在使用时预期会发生什么,并方便地与它交互。

4139
来自专栏知晓程序

首个微信小程序「插件市场」将诞生!

2018 年 3 月 13 日,微信团队针对小程序开发再次释放出两个重磅新能力:小程序「插件」功能、开发者工具新增「代码片段」功能。小程序的开发门槛由此进一步被...

1127
来自专栏SEO

「知识」SEO+UX=成功

3469
来自专栏企鹅号快讯

分享前端大佬是怎么练成的呢?

Web前端开发是现在非常热门的一个互联网技术,同时,相关Web前端开发的技术知识也是在不断的更新,致使Web前端开发工作已经变的越来越复杂,Web前端工程师想要...

20110

扫描关注云+社区