首页

用设计为你的APP提速的6个方法

蓝蓝设计的小编

D.A:我们都知道不管网页还是移动应用,响应速度都是最重要的体验指标之一,并且移动应用的网络环境不稳定,速度的体验显得尤为重要。其实速度优化不仅是程序员的事,设计,也能够让App变得更快。

1.后台执行

这是一条很通用,也容易理解的方法。用户不会愿意盯着进度条傻傻地等待,除了”取消”没有其他选择。在系统处理一些网络任务的时候,完全可以允许用户做一些其他的事情。

各大平台的发微博,都采用了后台执行。云阅读的离线下载也采用后台执行。

而微博的看长图(或视频),是个反例。网络不给力时,要么等待1分钟让图加载完,要不就只好放弃看图。为什么不能让图加载的同时,用户可以看其他微博呢?


 

2.在载入前显示内容

客户端与web的一个不同点,客户端的显示内容包括本地数据和网络数据两部分。在设计界面时,将更多的信息放在本地,在网络数据未载入时即显示本地数据,让用户产生一种”已经载入一半了”的错觉,即使最终的耗时一样,心理感受也会更快。当然把数据过多地写在本地,会牺牲一些灵活性,需要根据具体情况考虑。

那些不务正业的品牌Apps

蓝蓝设计的小编

那些不务正业的品牌Apps

越来越多的传统企业拥抱移动互联网,以补充完善原有渠道的目标推出自有企业的品牌app,比如传统杂志社设计一款电子杂志app、传统实体店商家推出电子商城app。这些传统的做法已经司空见惯,让我们看看品牌大牛们有哪些不务正业的新玩法。

本文不谈趋势、不谈技术,也不涉及广告营销思路。通过分析研究以下八大品牌app案例的设计表现手法,总结出一些品牌app创新设计要点,希望与大家进行交流探讨。

【案例一】UNIQLO——清新型格的数字化生活工具

UNIQLO是一个拥有出色创新基因的日本服装品牌,UNIQLO品牌所倡导的Life Wear(服适人生)哲学——“Clothes for a better life, for everyone, every day”不是单纯将“衣食住行”的“衣”作为一种时尚,而是创造丰富人们日常生活的衣服,基于这个概念发表的各种数字化生活工具被归类为“UNIQLO LIFE TOOLS”,下面就来介绍一下这些apps——UNIQLO WAKE UP、UNIQLO CALENDAR和UNIQLO RECIPE。
那些不务正业的品牌Apps

UNIQLO WAKE UP

作为一个工具型应用,UNIQLO WAKE UP的欢迎语 “在随着天气而变化的音乐声中开始新的一天,分享您的起床信息” 道出了它与其他闹钟app的不同。它集天气、音乐、社交功能为一体,把起床和天气联系起来,配以的美妙女声播报,原创背景音乐则是由世界知名音乐人Cornelius和菅野洋子合作完成。

小伙伴们可去官网感受下:http://www.uniqlo.com/wakeup/cn/pc/index.html?high=true

打开app默认的是天气/时钟界面,清新明亮的大色块平铺十分迷人,不同天气会自动切换不同背景色和音乐。

怎样在Photoshop中保持像素的完美

蓝蓝设计的小编

设计网页和程序界面的时候,为了确保每一个像素的颜色、纹理和位置都准确地呈现,大多数设计师都会被搞得疲惫不堪。一不小心,一些很常用的操作像移动、旋转和粘贴就会让你的辛勤劳动付之东流。但是,如果能对你的工作流程做些小小的改动,就能在项目中始终保持作品的高质量。

像素完美之旋转

如果你不够小心,那么在Photoshop中旋转图层就会使像素遭到明显的破坏,出现模糊。

使用自由变换工具(或其他工具)把图层旋转90度或270度后,像素最终的显示效果将取决于图层的尺寸。如果图层的宽和高都是偶数,你就可以幸免于难。如果图层的宽和高都是奇数,也不会有问题。但是如果图层的宽是奇数,高是偶数或者宽是偶数,高是奇数,那么你将会看到如下情景:

怎样在Photoshop中保持像素的完美

本例中原始图层的尺寸为20×9像素:偶数×奇数。尽管位图和矢量图层在旋转后的效果不一样,但两者都变得不可用了。这是由于图层旋转的中心点没有落在某个像素边界上导致的。

一种解决方法

当图层的宽高为奇数×偶数或偶数×奇数时,旋转后就会出现问题。因此,我们需要某种方法来保证图层的宽高是偶数×偶数或奇数×奇数。也许你所想到的解决方法就是给要旋转的图层增加一个正方形的位图蒙版或者添加更多的像素。除此之外,你还可以通过在另外一个图层上绘制一个正方形后跟原始图层同时旋转来解决这个问题。

总而言之,只要图层的宽高是偶数×偶数或者奇数×奇数就可以了。

怎样在Photoshop中保持像素的完美

一种更简单的方法

在使用自由变换工具时,把旋转的中心点挪到左上角(或其他任意一个顶角)就能确保它会落在某个像素的边界上,这样便能保证每次旋转后的结果都是完美的。为此,你需要在选择自由变换工具后在参考点设置按钮上单击下任意顶角再进行旋转。这是目前为止最简单有效的方法。

网站如何做关键词评估?

蓝蓝设计的小编

在QQ群与群友交流时,聊到网站如何做关键词评估,交谈中说到关键词的搜索量、商业价值、竞争程度三个方面的评估。关键词评估是关键字进行详细的评估是否具备优化的可行性,并从中选择高搜索量、高相关性、低竞争的关键词。

网站如何做关键词评估

搜索量
搜索量是关键词日搜索的检索量,搜索量的高低决定着竞争度的大小。检查关键词的搜索量常用工具是百度指数、谷歌关键字工具等,如搜索“邮件营销”关键词是181(29/7)。

商业价值
关键词商业价值指关键词在行业中的地位,以及能给商家带来的回报作为衡量标准,通常使用在搜索引擎竞价上。进入百度推广账户,使用估算工具查询关键词预估价格。如预估“邮件营销”排名前三名的价格是7元。

关键词竞争度
关键词竞争是搜索结果中参与优化该关键词的页面有多少,网站有多少。例如搜索“邮件营销”这个关键词,返回的结果有2520000个页面,前三页直接使用首页优化的网站有11个网站,竞争程度是比较大的。

网络上有一个计算关键词竞争度的公式:关键词竞争度=关键词搜索量*10000/关键词相关页面数量。得到的结果越大,代表关键词竞争越不激烈,越容易优化,反之,结果越小,相对竞争度越激烈,越不容易优化。如以“邮件营销”举例,搜索量是181,相关页面是2520000,181*10000/2520000=0.72,该关键词较难优化。

行业观察!FLASH的未来与发展

蓝蓝设计的小编

近几年对HTML5与Flash谁才是未来的发展的争论真的实在太多,也是仁者见仁智者见智,其实什么东西都不是完美的,各有优缺点,并且用户才懒得管你用的是HTML5或是Flash,用户关心的是只是应用与体验。


 

>介绍HTML5与Flash

 

很多人都说有了HTML5,Flash就可以退出了,但Flash还是有其自身的优势,来制作更好的展示效果与交互体验。

>Flash还能做什么,Flash要怎么做

 


AI+PS新手教程:打造童话梦境般的3D字体

蓝蓝设计的小编

PS打造童话梦境般的3D字体

@写说说 :作者系大学学生,给我们分享他的设计文章。大家如果对原作者的作品感兴趣,可到作者的Behance看下。我们直接切入主题~

Dream这个词汇是画布的主体中心,它将控制整个画布的布局空间,我们的其他元素将从这个字体的内部出现,比如生长的树木,字体背后的山,以及山后高高的月亮。

做梦经常把我们带到一个不一样的场景里,我们比喻她为”仙境”好了。实际上这个”仙境”也是由日常的真实元素构成的,在今天的这片”仙境”里,我们利用现实世界里的自然元素,结合AI的3D效果,让这些元素都梦幻般漂浮在空中。

==================开始之前注意以下几点: =================

1、通常人们在夜间做梦,所以我们把主色调调成青色和石灰绿。
2、同时,排版的时候来个完整的氛围,给人感觉像是在讲一个故事。
3、在操作时关于字体、树木、树枝、树叶、山峰、月亮、画布请逐一添加编组以便修改。

PS打造童话梦境般的3D字体

4、本文涉及到的素材和最终的psd源文件,猛戳此处下载Dream Design with 3D Typography.rar。下载完后字体该安装的请先安装好。

5、本文中用到的AI和ps都是英文版,创建3D字体部分比较简单,说说也是直接用中文版的AI做的,相信你也可以~如果您的ps是cc且为中文版,或许改成英文版在本文的学习中会更容易操作一点:

打开你的ps cc安装文件夹,定范到Locales\zh_CN\Support Files,比如我的是G:\pscc\Adobe Photoshop CC (64 Bit)\Locales\zh_CN\Support Files,这里你会看到一个tw10428.dat的文件,把它重命名(比如直接改成tw10428.dat重命名),不要删掉。重启ps就是英文版本的了。要换回中文版就把这货的后缀改回来就是了:)

附:神马?你忘记自己软件装在哪里不知道怎么找路径了?那在开始菜单栏总有她的身影吧!或者桌面上有她的快捷方式吧?鼠标点击”开始”找到这软件(或者直接在桌面的ps快捷方式上右击),在ps cc软件上右击选择”打开文件位置”,毫不犹豫的再嗖嗖嗖几下你就找到了路径。

PS打造童话梦境般的3D字体 clip_image003

=================== 一切就绪,马上出发↓ =====================

一、创建3D字体

打开AI,创建新画布,键入一个大写的”D”字,使用素材里面的字体storybook。字体颜色设为#4C3F38。

 

 

导航设计趋势!关于图标式导航的改进

蓝蓝设计的小编

不知不觉的,很多网页设计中采用了图标式导航(Navigation)——一般使用三道杠作为图标,用以导航。
这种导航的好处是节省空间,让界面更简洁。

图标式导航的案例

这是YouTube的图标式导航(移动版):

为导航瘦身!关于图标式导航的改进

这是Squarespace的图标式导航:

为导航瘦身!关于图标式导航的改进

AWARD的图标式导航不拘一格:

为导航瘦身!关于图标式导航的改进

问题所在

问题在于,点击图标式导航之后,图标本身没有任何变化。也就是说:操作缺乏反馈

 

想让网站动感十足?试试网页设计中的韵律线条

蓝蓝设计的小编

网页设计中,横向和竖向的直线非常常见,利用整齐的线条可以打造出有序的视觉路径以及信息层级。
当然,有些时候,可以不按理出牌,设计一些倾斜的线条,让你的网站不拘一格,更加与众不同。

打破传统布局,创造动态的自由视感,让构成更加复杂——无论是利用简约的几何图形,或是精致的倾斜图像。
让你的设计更具吸引力,不妨试试斜线。

Paseo Itaigara

形状感很强,整体设计的很成功,显得并不杂乱。菱形无处不在,拼嵌式的菱形,装饰性的菱形,按钮的菱形,很好的主题一致性。

Paseo Itaigara
 

Impero

交互式网站,积极的氛围、极简的色彩。设计师利用两组对角线(粗细交织)打造了视觉路径。

Impero
 

Alpina

强烈推荐!利用视觉滚错,加上美轮美奂的照片。来感受这趟视觉盛典吧。流畅优美的照片美景。斜线分割的很巧妙(试想用直线风格,效果不会这么到位)

Alpina
 

android中px、dp和sp,这些单位有什么区别?

蓝蓝设计的小编

相信每个Android新手都会遇到这个问题,希望这篇帖子能让你不再纠结。

px:

即像素,1px代表屏幕上一个物理的像素点;

px单位不被建议使用,因为同样100px的图片,在不同手机上显示的实际大小可能不同,如下图所示。

dp:

这个是最常用但也最难理解的尺寸单位。它与“像素密度”密切相关,所以首先我们解释一下什么是像素密度。假设有一部手机,屏幕的物理尺寸为1.5英寸x2英寸,屏幕分辨率为240x320,则我们可以计算出在这部手机的屏幕上,每英寸包含的像素点的数量为240/1.5=160dpi(横向)或320/2=160dpi(纵向),160dpi就是这部手机的像素密度,像素密度的单位dpi是Dots Per Inch的缩写,即每英寸像素数量。横向和纵向的这个值都是相同的,原因是大部分手机屏幕使用正方形的像素点。

不同的手机/平板可能具有不同的像素密度,例如同为4寸手机,有480x320分辨率的也有800x480分辨率的,前者的像素密度就比较低。Android系统定义了四种像素密度:低(120dpi)、中(160dpi)、高(240dpi)和超高(320dpi),它们对应的dp到px的系数分别为0.75、1、1.5和2,这个系数乘以dp长度就是像素数。例如界面上有一个长度为“100dp”的图片,那么它在240dpi的手机上实际显示为80x1.5=120px,在320dpi的手机上实际显示为80x2=160px。如果你拿这两部手机放在一起对比,会发现这个图片的物理尺寸“差不多”,这就是使用dp作为单位的效果,见下图。

网络营销常用方法及术语

蓝蓝设计的小编

最近看到一些刚接触网络营销的朋友,对于网络营销一些常用的方法以及概念性的东西都不是很了解,在交谈中说到软文营销、IM推广等这些的方法时他们就不知道是什么意思。在此小篇整理一部分常用的网络营销方法和术语,希望对新人有帮助,高手看到就请绕行。

网络营销常用方法

什么是网络营销?以国际互联网络为基础,利用数字化的信息和网络媒体的交互性来辅助营销目标实现的一种新型的市场营销方式。简单的说,网络营销就是以互联网为主要手段进行的,为达到一定营销目的的营销活动。(摘自百度百科)

搜索引擎优化/SEO:利用搜索引擎的搜索规则来提高网站关键词排名的方式。

搜索引擎营销/SEM:利用搜索引擎进行营销推广的,比如SEO、竞价推广等都属于SEM。

百度网盟推广:在百度的联盟网站上以图片或文字的形式展现广告。

软文营销:以文章为主,专门通过文字去宣传推广产品,或以新闻稿来提升品牌知名度。

数据库营销:通过收集和积累会员信息,经过分析筛选后有针对性的使用电子邮件、短信、电话等方式进行客户尝试挖掘与关系维护的营销方式。

邮件营销:在用户事先许可的前提下,通过电子邮件的方式向目标用户传递有价值信息的一种网络营销手段。

IM/即时通信营销:利用QQ、MSN、YY等即时工具营销推广的。

博客营销:利用新浪博客、百度空间等平台进行推广的方法。

日历

链接

个人资料

蓝蓝设计的小编 http://www.lanlanwork.com

存档