创意十足的GOOGLE SEARCH APP动态设计

2016-02-16 23:12 16 1 收藏

想要天天向上,就要懂得享受学习。图老师为大家推荐创意十足的GOOGLE SEARCH APP动态设计,精彩的内容需要你们用心的阅读。还在等什么快点来看看吧!

【 tulaoshi.com - 平面设计 】

可能你对Google Search的使用频率远没有YouTube或者Gmail高,但是谷歌出品的Google Search在设计方面也有很多值得我们借鉴的地方。在最近几年,谷歌在设计语言方面取得了很大的进步,比如Google Search中出彩的设计细节。

一、翻转的logo

从屏幕底部向上推动卡片,Logo通过微妙的折叠翻转渐渐进入视野。还有一点,在动画刚开始的时候,屏幕底部有堆叠的卡片,随着逐渐向上推动卡片,堆叠的卡片逐渐单个排列在页面上。

创意十足的GOOGLE SEARCH APP动态设计,PS教程,图老师教程网

二、logo翻转和弹跳效果(Night)

该图片展示了翻转操作–下拉search bar,从屏幕顶部进行翻转,展示头图背后的内容,轻弹的logo是一个非常清晰的视觉元素,而屏幕上的状态栏也准确地在动画完成的时候被覆盖。

创意十足的GOOGLE SEARCH APP动态设计,PS教程,图老师教程网

三、翻转和弹跳效果(Daytime)

同样的动画效果,找找日间头图背景与夜晚时候的区别。

创意十足的GOOGLE SEARCH APP动态设计,PS教程,图老师教程网

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/pmsj/)四、逐渐消退的logo

Google Search使用了logo渐渐淡出的设计,并准确在背景图片具有足够视觉反差的时候让文本颜色过渡至白色。

创意十足的GOOGLE SEARCH APP动态设计,PS教程,图老师教程网

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/pmsj/)五、轻微的弹动效果

打开浏览页面,点击See more movies,搜索结果会从屏幕右侧滑出,当新页面滑动至屏幕最左侧时会有轻微的弹动效果。

创意十足的GOOGLE SEARCH APP动态设计,PS教程,图老师教程网

六、关闭浏览器的搜索结果窗口

关闭搜索结果窗口时,Google Search没有采用常见的解决方案–页面从右方退出视线范围,而是选择了从屏幕底部掉落,并带有微妙的消褪效果,给app增加了轻盈的感觉。

创意十足的GOOGLE SEARCH APP动态设计,PS教程,图老师教程网

七、移除卡片

这是Google Search app中优秀的交互设计之一,当用户第一次看见该视图时,这种交互设计可以向用户展示如何移除单个的卡片。同时给用户增加了简单、无重量感以及更加直觉的体验。

创意十足的GOOGLE SEARCH APP动态设计,PS教程,图老师教程网

来源:http://www.tulaoshi.com/n/20160216/1576293.html

延伸阅读
大多数传统的网页都是直愣愣的竖直水平的设计。不过现在,斜线网页设计与视差滚动设计(译者注:一种特殊的网页形式呈现形式,其基础原理是让多层背景以不同的速度搬动,形成立体的感觉,带来卓越的视觉体验)正在挑战这一传统。倾斜的设计构图与之前我们接触的各种理论背道而驰,将人们的注意力从网页内容中吸引到这些不规则的图形设计上。 一...
一个好的个人展示网站可以向外界展示自己最好的一面,包括技能天赋和职场阅历。设计师们会把网站做得非常简约唯美,来引导访客一步步观赏他们的作品和经历。下面有30个超棒的个站,小伙伴们一定会非常喜欢的。 Marco Simonetti The Brave Man Antoine Wodniack Christian Kapke Henry Saiz Kevin Lagier Jean-Christo...
最近大家伙越来越关注视差滚动的网页了,很多同学都在四处寻找相关的案例来赏析学习。此前我们也分享过相关的制作教程及文章。那么今天我们继续推荐20个创意十足的视差滚动酷站,希望能为你的案例带来灵感,强烈推荐收藏。 Beatbox Academy Discover Shadow This is Now Sam Markiewicz Erős Balázs Le Tour ...
近年来,网页页眉(Header)的概念逐渐被重新定义,从单纯用来放置一个标准logo和简单菜单的空间变得越来越受网页设计者的重视。页眉设计依靠独特的设计手法,搭配上创意优秀的图片,可以让网页突破空间界限,给人留下深刻的印象。这里有50个赏心悦目的国外网页页眉设计,以供欣赏借鉴。 因为是图老师小编日常整理收集的网页截图,所以没有相关...
在网页设计中自然图案的展示是很常见的一个手法。设计师通常喜欢用各种景观照片、风景插图或者乡村风格的视频来增加网站自身的自然度。现在我们把思绪聚焦在航海主题上。海洋并不缺乏强大的情绪,相反它能够激发一系列积极的感受,在网站设计中见证这样一个骇俗的场景足以让我们感受到它戏剧性的效果,在心中刻下明显的印记。 展示海洋有多种...

经验教程

990

收藏

60
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部