首页

提升品质!丰富APP动态效果的六点原则

蓝蓝

如果想让你的移动界面设计应用更活泼更灵动,丰富的动效是不可少的,丰富的动效可以让你的应用更具活力,充满生机;丰富的动效可以让你的应用彰显效率,提升品质感;丰富的动效可以让你的应用充满魅力,引人探索;丰富的动效可以让你的应用减少焦虑,消除等待感;丰富的动效可以让你的应用充满韵味,有节奏感;丰富的动效可以让你的应用有出奇的信息组织,整洁。

蓝蓝设计这里主要介绍六种简单通用的方式 ———— 转场、邀请、过渡、反馈、缩放、吸附。

原则一:转场

zhuanchang 移动应用丰富动效的六点原则

提高网站可用性的经验指南

蓝蓝

我想每个人都会赞成,网站设计的可用性是它能否受欢迎的一个重要方面,无论你进行的是公司网站、在线商店还是其他,让你的界面变得容易操控,使用时令人舒服是关键,近几年已经有很多针对网站界面设计优化的研究,而且这些研究的成果对于提高网站可用性是非常有价值的。现在这里有10个超实用的经验分享,相信蓝蓝设计,这些建议会极大地提高你那个网站的用户体验,让用户爱上你的网站界面设计! 

一、善用人物配图,使用户专注于你想呈现的

当进入你的网站,我们会本能地关注网站上人物图片中的脸和眼睛,这倒是为我们提供了一个想法,是不是可以用人物配图吸引小伙伴的注意力呢?当然,但这仅是第一步,我们还可以这样做,你瞧,是不是大不相同!(见下图)

这是第一步:

20090316 dmwcj8wqr8egihdihssm4xm517 You look where they look

华丽丽的导航设计PSD下载

蓝蓝

在2014年涌现了许多有视觉吸引和创造性的导航界面设计,她们不仅身段妙曼富有美感,而且传承了整个网站设计的导航指引,让浏览者轻松愉悦的访问网站。她们会温馨的提醒你在哪儿,还会体贴的带你获取到想要的东西。别等了,现在就去寻找你喜欢的导航下载它吧。下面请欣赏蓝蓝设计精心收集的华丽丽的导航设计PSD,希望对朋友们的ui设计能力有所帮助!

Simple Navigation Menu

漂亮的APP应用网站

蓝蓝

如果我说很多iPhone应用网站的界面设计都颇为精美,相信筒子们不会有什么意见的。看来那些ui设计师们都敞开胸怀迎接“苹果style”,创造出干净简约又优雅的网站设计。可不嘛,作为一枚合格的设计师,他们才不会随随便便弄个网站展示他们的app设计呢,都卯足了劲设计出新颖的版式,配上美美的图片、大量留白和恰当的字体。那么今天呢蓝蓝设计将要带给你的这份灵感清单就是一些绝赞的iPhone应用网站啦,切克闹~

Wedding Party

与你的客人一起,通过这简单有趣的app捕捉并分享你婚礼中的美好瞬间。

21 Beautiful iPhone App Websites

时尚创新的侧边栏菜单网页设计

蓝蓝

信不信由你,侧边栏菜单将会是2014的一个新趋势!实际上,菜单已经有相当长的一个历史,最开始它只被用在计算机应用程序上,后来逐渐流行到社交媒体网站设计。现在很多单页界面设计的网站菜单都非常精美而便利。那么请欣赏一下蓝蓝设计收集到时尚创新的侧边栏菜单网页设计

Wanda Print

网站设计导航也采用了双重菜单,而且篇幅很广。菜单如此宽广,排版如此简洁,加上导航和背景产生的强烈对比,使得整个网站显得非常微妙而自由。

6

无法忘怀的色彩:移动界面设计中的渐变

蓝蓝

今天蓝蓝设计要探讨的可不是渐变,要探讨的是移动界面设计中的渐变。我们来一起学习、感受一下现今移动界面设计中最流行的渐变吧。

推荐阅读:
《一枚app图标的设计文化》 
《超赞!高大上的动效设计方法及流程总结》

一、渐变作为界面的背景

iOS7 Lockscreen by Michael Shanks
神秘、优雅、颇具吸引力、简单、只包含必要信息,半透明的解锁条让我们感受到细腻的质感。

iOS7 Lockscreen by Michael Shanks

超酷的饮料类网站设计欣赏

蓝蓝

经常在电视上看到各种饮料的动感广告,但作为多媒体推广最重要的一环,饮料自身的官方主题网站界面设计必然是很有看头的:动感激情或优雅宁静,通过明艳的视觉和新鲜的交互将产品推销给顾客。那么朋友们和蓝蓝设计一起欣赏下面这些超酷的饮料类网站设计吧!

更多饮料类网站欣赏http://www.lanlanwork.com/

KOA Water

KOA Water

如何设计新闻类型的门户网站

蓝蓝

最近,一个朋友建议我写点关于新闻类网站界面设计的分析:什么是正确的新闻类网页设计,什么是错误的。他认为现今的线上新闻用户体验非常落后,让人感到厌倦无比,而且只是他们不用心做罢了,采用AJAX或者类似的技术就能把内容呈递的完善,而且导航做得十足精美。

一开始我非常赞同他的观点。蓝蓝设计认为新闻类网站的约束在于:过去传统的报纸以及杂志均为纸媒,动辄就在页面里融入了那些根深蒂固的惯例。因此用户在浏览时会发现,这类网站的感觉很熟悉,但是却限制了视觉表现。与此同时大部分新闻类网站的用户体验设计非常差,经常会出现令人阅读困难的小文本。

从《互联网设计之道》开始,我知道这句话已经别人重复无数次了,如果把网络比作一种媒介的话,那么网络是流动的,是复杂的,也是美丽的。而且网络的威力超出了大多数人的意料。
所以我们一起来看一下这些国际知名的新闻类网站,看看他们的优点与缺点。

归根结底是移动端的用户体验

其实,主要还得是移动端用户的体验。然而很多新闻类网站并没有将此类用户纳入考虑。当然,确实很多新闻网站已经出了iOS或者Android版本的原生应用,可惜效果并不理想,大部分的用户下载完之后,用几次就基本废置到一旁了。

我们获取信息的途径是什么?因为太过官方,内容太过常规,现在的用户很少主动浏览新闻类网站。他们通常是通过点击朋友、亲戚、网友的分享来得到信息。通过社交网络,E-Mail,RSS Feed以及新闻源中的链接来得到信息。而链接导向的往往是网站,而不可能是应用。因此,每个新闻类网站都必须要注重移动端的用户体验。现在用手机浏览消息的人实在是太多了。

那么问题又是什么?为什么新闻类网站不改进呢?
路很漫长,前方有两块绊脚石有待清除。

网页设计中优化图片的6大技巧

蓝蓝

平面设计网页设计是两个截然不同的领域,这两个领域有不同的设计需求、设计实践和设计方法。

例如,在网页设计中更常使用基于像素或栅格的文件格式,诸如JPG、GIF或PNG。相反,在平面设计领域像logo这样的图形可能会用到不同尺寸,因此使用最多的格式则是EPS和AI这样的矢量格式。然而,用于网页界面设计的矢量格式,如SVG或HTML5 Canvas则不能广泛应用,也不会被所有浏览器所支持。

另外,用于web端的图形有基于它们自身的相关处理方式。其中一条便是你要时刻注意文件的大小,因为你需要使你的网页加载越快越好。作为一名网页ui设计师,你应当尽量减少HTTP对图像的请求次数——无论通过减少图片的使用数量还是将它们整合成CSS sprite——以及确保你选择了正确的图像格式,使其在图像大小和质量间得以平衡。

Photoshop是平面设计师和网页设计师使用的行业标准工具。以下是你在创建web端使用图像时的一些简单的小技巧。

1. 将图片保存成Web所用格式

在网页设计中,你必须确保你的图像大小越小越好。当然,当你想要图片完好显示时可以抛弃这条原则。
在Photoshop中创建图像的完美方法便是平衡质量与文件大小。
网页设计师经常犯的一个错误便是使用“另存为”命令,而不是使用“存储为Web所用格式”。

2702d5d227fdbb0be2cd35ac6a37f76f 网页设计师必须知道的6个小技巧

向优美交互致敬!移动端APP动画设计总结

蓝蓝

扁平化界面设计越来越火爆,那么在弱化视觉效果的情况下,有ui设计师提到该从交互方面使体验更加愉悦,现在很多App界面设计也在努力朝这一方向发展,例如最近火遍全球倍受好评的 《FACEBOOK PAPER 中23个的设计细节》,还有《设计师新宠!交互神器ORIGAMI》等都足以让人期待交互的未来。

今天蓝蓝设计收集总结了一组移动端的App动画设计,朋友们可以学习一下。

百度云UE负责人@elya妞也分享了一篇App动态设计的好文,基础不行的同学可以补补:
提升品质!丰富App动态效果的六点原则

1、flipboard:

利用上下动画来切换到下一个界面(由于网慢数据没有加载出来);

flipboard:刚毅的上下动画来切换到下一个界面(由于网慢数据没有加载出来);

日历

链接

blogger

蓝蓝 http://www.lanlanwork.com

存档