随着互联网的发展，网页设计变得越来越复杂，如今设计的外观和感觉实现网站功能说使用的开发技术一样重要。互联网的功能远远不只是基本的信息共享，现在人们对网站的期望是远远大于几年前的。

　　如今，HTML5 & CSS3 技术的发展，众多强大的新特性和功能带给网页设计领域新的挑战和机遇。同时，网页设计领域也在发生巨大的变化，例如之前流行的扁平化设计伴随着 iOS 7 的发布被带到了新的高度，更多的人了解了这种前卫的设计理念。

　　当设计师们还在讨论这种设计的时候，扁平化的设计又有了最新趋势——长阴影设计（Long Shadow Design）。

什么是长阴影

　　长阴影（Long Shadow）概念来自于最新非常流行的扁平化设计（Flat Design）。扁平化设计趋势影响最大的是用户界面元素和图标，但它也开始蔓延到其他网页设计的其他部分。

　　长阴影其实就是扩展了对象的投影，感觉是一种光线照射下的影子，通常采用角度为 45 度的投影，给对象添加了一份立体感。长阴影快速发展为流行的设计趋势，并经常被应用到扁平设计方案的对象。

　　这些阴影特别之处在于它们也是扁平的。网页设计师使用没有阴影、渐变的颜色来生成阴影。目前，长阴影设计主要用于较小的对象和元素，如图标。

长阴影设计的例子

　　你可能已看到过部分长阴影设计的例子，或者未来几周可能就会突然出现很多这样的设计。下面是长阴影（Long Shadow）设计的示例，帮助你提前了解这一流行设计趋势：

结论

　　长阴影设计似乎是扁平化设计的一种演变。设计师正在寻求途径给设计增加深度，让物体看起来更有立体感，同时遵循扁平化设计的理念。

　　这样的想法是有趣的和用户友好的，并依赖于干净和独特的阴影。长阴影需要有一定的辨识度，同时需要都遵循相同模式的光线，这意味着在设计每一个阴影应该是在相同的方位和角度。

　　你是否已经了解了长阴影设计，并知道如何使用了？不管如何，我敢肯定从现在起，你会看到越来越多的长阴影设计（Long Shadow Design）。

您可能感兴趣的相关文章

本文链接：扁平化设计的新趋势 – 长阴影（Long Shadow）

编译来源：梦想天空 ◆ 关注前端开发技术 ◆ 分享网页设计资源

扁平化设计的最新趋势 – 长阴影（Long Shadow）的更多相关文章

  1. 扁平化设计五大原则（转自CSDN翻译）

    Cousins表示他虽然对扁平化设计的感觉非常强烈,但并没有特别热爱或者特别讨厌扁平化设计.他认为好的设计不应当局限于某种设计风格,而需要更注重可用性.有用性.如果因为时尚的缘故,那就顺其自然吧.但该 ...

  2. 腾讯CDC谈扁平化设计

    扁平化设计无疑是当前讨论最多,最火的设计形式,自ios7面世以来更是将扁平化设计的讨论推向风口浪尖. 在这里我不想分析拟物设计和扁平化设计的优劣,更不想说谁更好!在形式服从内容的今天,我只能说哪种设计 ...

  3. 16个时髦的扁平化设计的 HTML5 & CSS3 网站模板

    创建网站最好办法之一是使用现成的网站模板或使用开源 CMS 应用程序.所以,今天这篇文章给大家带来的是16款基于 HTML5 & CSS3 的精美的扁平风格网站模板,大家可以借助这些优秀的网站 ...

  4. （旧）子数涵数·UI设计——扁平化设计

    一.基本资料 1.由来 扁平化设计这个概念,是由Google(谷歌)在2008年提出的:它的首个实践者是microsoft(微软),microsoft在2012年发行了win8系统,这个系统的外观主题 ...

  5. jquery mobile扁平化设计样式--Jquery mobile Flat UI介绍

    jquery mobile扁平化设计样式--Jquery mobile Flat UI介绍 这几天开发的web app使用了jquery mobile,jquery mobile自带的样式比较适合做企 ...

  6. PPT扁平化设计总结

    注:以下内容基本都来自知乎,由于已经不记得网址了,所以未能附上所有相关链接,抱歉. PPT扁平化设计原则一.亲密:意思相近的内容放在一起二.对齐:页面上的某两个元素之间总是围绕一条直线对齐三.对比:有 ...

  7. 11款扁平化设计的 Twitter Bootstrap 主题和模板

    扁平化设计和 Bootstrap 框架是2013年网页设计领域的两大设计潮流.把这两者集合起来不是件容易的事情,使用下面这些主题和模板将节省我们的开发时间,因为我们可以修改已有的基础代码,而不是从零开 ...

  8. [UWP]使用GetAlphaMask和ContainerVisual制作长阴影(Long Shadow)

    1. 什么是长阴影 前几年扁平化设计(Flat Design)十分流行,后来在扁平化的基础上又流行起了长阴影(Long Shadow).长阴影其实就是扩展了对象的投影,感觉是一种光线照射下的影子,通常 ...

  9. 【UI设计】扁平化设计之流行色值

    收集了一些颜色值 顏色表示方法: 以命名方式定义经常使用的顏色,如color="green".可是自由度较低,何况单词量...... 以RGB值表示.如#FF0000表示red(红 ...

随机推荐

  1. JPA 不在 persistence.xml 文件中配置每个Entity实体类的2种解决办法

    在Spring 集成 Hibernate 的JPA方式中,需要在persistence配置文件中定义每一个实体类,这样非常地不方便,远哥目前找到了2种方法.   这2种方式都可以实现不用persist ...

  2. gpg的一些常用操作

    (1)列出keys # gpg --list-keys /root/.gnupg/pubring.gpg ------------------------ pub   2048R/98681A63 2 ...

  3. Windows 系统下设置Nodejs NPM全局路径

    Windows下的Nodejs npm路径是appdata,很不爽,想改回来,但是在cmd下执行以下命令也无效 npm config set cache "D:\nodejs\node_ca ...

  4. 推荐--《Android深入浅出》

    基本信息 书名:Android深入浅出 作者:张旸 著 页数: 661 出版社: 机械工业出版社; 第1版 (2014年4月17日) 语种: 简体中文 ASIN: B00JR3P8X0 品牌: 北京华 ...

  5. php 方便快捷导出excel

    /** * 导出excel * @param array $column * eg: $column = [ * 'username' => '姓名', * 'age' => '年龄', ...

  6. memcached 源码阅读笔记

    阅读 memcached 最好有 libevent 基础, memcached 是基于 libevent 构建起来的. 通由 libevent 提供的事件驱动机制触发 memcached 中的 IO ...

  7. 【css】ie6 和 ie7 下 position 与 overflow 的问题

    前几天做的项目中碰到这样一个问题,在 ie6 和 ie7 下,给父元素设置 overflow:hidden 不起作用无法隐藏,后来发现是子元素中有设置 position:relative,如果子元素删 ...

  8. 关于在mac 配置eclipse c开发

    新建一个c 项目,如下 勾选hello world ANSL project ,勾选右边的MacOSX GCC 安装插件CDT - http://download.eclipse.org/tools/ ...

  9. Android SDK在线更新镜像服务器大全

    http://www.androiddevtools.cn/ 原文:http://www.jb51.net/article/73732.htm 由于一些原因,Google相关很多服务都无法访问,所以在 ...

  10. 演化理解 Android 异步加载图片

    原文:http://www.cnblogs.com/ghj1976/archive/2011/05/06/2038738.html#3018499 在学习"Android异步加载图像小结&q ...