首页

交互设计师的核心能力

蓝蓝设计的小编

1.png


交互设计师的核心能力其实是三者的交集,这个也很容易看到,为什么交互其实是易学难精的,也就是你每放大一点点,你需要在每个维度上都放大很多,产品维度而言,如果你知道商业目标,产品功能,运营策略是如何制定出来,那你从源头上就找到了和产品经理对话的能力,开发维度而言,核心来讲,是你得知道技术的约束边界,知道可行性把握有多大,如果你还知道实现机制,,那你也能就找到了和开发工程师愉快合作的基石,设计维度,不多讲,具备足够的设计美感和设计品味是应该的,对设计规范、用户习惯了解越多,越能知道设计不应该做什么,不干舍本逐末的事,从这个模型上,这也很容易解释,为什么一个好的交互设计师要涉猎产品,开发,UI知识,做到最好比较全面的知识结构,我们经常讲用户体验,讲体验设计,其实有句话我一直很认同,谁讲的不记得了“体验是个人的,体检设计不是”。

顺便讲讲我觉得重要的交互设计师好习惯。

html5动效系列二十六:分享几款HTML5 动画图表

蓝蓝设计的小编

一款基于HTML5 Canvas的折线图表,这款HTML5折线图表的特点有两个,一个是图表是有动画效果的,即在图表初始化的时候带有动画;第二个是这个HTML5折线图表可以让你动态添加数据节点,并且用折线平滑地连接,Canvas是这款折线图的一个画板。

html5-canvas-animated-line

html5动效系列二十五:纯CSS3响应式分页插件

蓝蓝设计的小编

这次我们要来看一款纯CSS3实现的响应式分页插件,对于分页插件,之前我们也分享过一些,都是基于jQuery分页插件。这款CSS3分页插件可以完全自定义分页条的样式,包括鼠标滑过时的背景颜色、页码的数量以及前后翻页的按钮。

css3-responsive-paging

html5动效系列二十四:分享几款CSS3菜单导航

蓝蓝设计的小编

这是一款基于纯CSS3的菜单导航,这款菜单非常有个性,菜单背景是一页古老的笔记本纸张,菜单项像是浮动的文字一样嵌入在纸张上。鼠标滑过菜单项时会出现不同的背景线条,显得相当可爱。这款CSS3菜单导航非常适合在个人博客中使用。

css3-menu-personal

html5动效系列二十三:基于HTML5 Canvas的图表插件Chart.js

蓝蓝设计的小编

chart.js是一款基于HTML5 Canvas的图表插件,chart.js的功能非常强大,它不仅提供了常见的柱形图、折线图、饼状图,而且还提供了环形图、雷达图,样式外观多样,图表的色彩搭配也比较清新。chart.js还有一个特点就是图表在初始化的时候有弹性动画,这也是HTML5 Canvas的一大功劳。

chartjs-html5-canvas

html5动效系列二十二:HTML5 Canvas折线图表和柱形图表

蓝蓝设计的小编

今天要分享的一款HTML5 Canvas图表应用提供了折线图和柱形图两种,这款HTML5图表在初始化数据的时候有一种渐现的动画,我们可以将这款图表应用在统计页面上。

html5-line-and-column-chart

html5动效系列二十一:CSS3 3D旋转下拉菜单

蓝蓝设计的小编

这是一款带有3D动画的CSS3菜单,该菜单有以下几个特点:首先是菜单时基于CSS3的,因此浏览器兼容性都还可以;其次这款菜单支持二级下拉菜单,功能上也基本能满足大部分开发者;最后这款菜单最大的亮点在于展开下拉菜单时,子菜单可以旋转的展开和收缩,给人3D的视觉效果。

华为设计总监为您讲述产品的设计逻辑

蓝蓝设计的小编

老婆说,和我结婚两年了,才大概知道交互设计是做什么的。(我还经常给她讲我在做什么设计)

老爸前几周把我介绍给他朋友,说我是做人机智能的。(HCI和AI还是有点远好吧lol)

所以,对家人和朋友,做设计的人经常讲不清楚自己是干什么的。……

以前雅虎的老大说过一句话:

When I worked at Apple, I remember the panic Steve Jobs inspired simply by walking the halls & asking "What are you working on?"

也是这个意思,其实很多人不能用一句话讲清楚自己是做什么的,价值是什么。

我觉得设计师一定要在这个点上没有问题,因为简短的语言归纳能力对设计师太重要了。

我之前写过一些设计准则、设计思辨的文章,很多朋友问我,有点复杂,有点专业,能否简单明白地说一下。的确,对于设计师本来的圈子来说,这些思路可能不是难题;但是对于设计师面对的广大群体来说,很多设计的话题需要有一种更简单的说话方式来概括。

试想下这样的场景:

一个技术人员问:这个产品为什么要做专家访谈?

一个市场营销人员问:设计中的品牌性到底如何体现?

一个朋友问:你明明是理工科毕业,不是学美术的,为啥要做设计?

一个业务线领导问:这个产品设计的统一性做的如何?哪儿有问题?

一个产品经理问:老听你说Affordance,到底是什么意思?

html5动效系列二十:HTML5 SVG世界地图 地图可拖拽和缩放

蓝蓝设计的小编

前我们已经向大家分享过一些基于HTML5的地图应用,比如jQuery矢量SVG地图插件JVectorMap,以及这款HTML5/CSS3带区域地图的联系表单。今天要分享的这款HTML5地图应用是一张世界地图,地图元素是使用SVG绘制的,并且地图可以拖拽和局部缩放,效果非常不错。

html5-svg-world-map

html5动效系列十九:纯CSS3实现质感发光动画按钮

蓝蓝设计的小编

之前我们分享过很多漂亮的网页按钮动画,大家可以移步至CSS3按钮分类下查看各种各样的CSS3按钮。这次要分享的这款CSS3按钮有着质感的背景,并且鼠标滑过按钮时按钮边框还会发光,呈现出3D立体的视觉效果。

pure-css3-texture-shine-button

日历

链接

个人资料

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

存档