高手总结!交互设计基础知识的精华版参考手册

@SophiaZ520 :从业几年,楼主从迷茫不知所措的时期,渐渐度过到现在可以掌控自己生活的状态,很能体会到作为新手在海量的信息中,眼花缭乱,不知道如何选择的感受。于是,自己整理出这几年来,觉得比较不错的网站软件、书籍参考,让大家能节约一些时间和精力。

楼主倾向将信息精简,遵从少即是多的原则,只推荐含金量最高的几处信息来源。

△ 交互设计 知识

这张图几年前楼主见过之后,一直保留到现在。不仅是因为它形象而客观,而是每看一次,它都提醒楼主,作为 交互设计师 ,莫钻牛角尖,综合平衡各方面的信息。

△ 基本功精简版信息

1. 每日必逛

每日必逛的定位在于对一些需要时间比较久地去培养能力的地方,比如审美。或者是同行业人士整理的一些工作上可以用的小tips。

Behance

Behance 是展示和发现创意作品的领先在线平台,同时也是 Adobe 系列的一部分。Behance 的管理团队每天都会从各种领域中的顶级组合探索出新作品。这些领域包括设计、时尚、插图、工业设计、建筑、摄影、美术、广告、排版、动画、声效以及更多。领先的创意公司可以通过 Behance 发现人才,数百万的访客也可以使用 Behance 跟踪最新和最杰出的创意人才.
现在已经推出iOS和支持android4.0版本以上的APP,可以进行使用。

Dribbble

Dribbble 的口号是,你正在创作什么?然后,鼓励创作者上传个人的作品,以及正在创作的作品到 Dribbble 网站上。Dribbble的作品整体质量却非常高,许多摄影师、设计师和其他创意产业人士都喜欢在这里展示其未完成的设计,通过与其他设计师的共同探讨来激发自己的灵感。也有相应的APP。

Dribbble 上的作品以 GUI 设计、平面设计、插画、VI 设计为主,而 Behance 上种类更多,还包括了 广告、建筑、摄影、Motion 等等。从 Popular 榜单上也可以看到,Dribbble 上经常是明星设计师们精美的图标或者界面,而 Behance 上多是一些 Agency 的整体品牌视觉包装。知乎上有位大神的比喻比较恰当,“Behance就像设计师的厅堂,展示大方,井井有条。dribbble就像设计师的厨房,进去问一句「今天打算做点啥?」,瞅见各种半成品跟成品,七嘴八舌,其乐融融”。

Pinterest

Pinterest 采用的是瀑布流的形式展现图片内容,无需用户翻页,新的图片不断自动加载在页面底端,让用户不断的发现新的图片。图片质量都算比较好的。

人人都是产品经理

国内做得比较好的产品经理学习、交流、分享平台,也有设计、运营的知识分享,在互联网业内得到了广泛关注和高度好评。

优设网

一些比较实用的设计类综合信息教程,每天会更新几篇文章,花费时间不太长,值得浏览。

△ 优设网

Google是所有问题的终结者,当我们没法从专业的网站上去获得答案时,就Google吧。

2. 前沿类的网站

Medium

Medium 是一个全新的轻量级内容发行平台,允许单一用户或多人协作,将自己创作的内容以主题的形式结集为专辑(Collection),分享给用户进行消费和阅读。

该网站好文不断,汇聚各行各业的设计大拿,如果关注了对了自己感兴趣的话题,以及优秀的设计师,自己的打怪升级进化之路会变得更加平稳。在这里推荐Medium 《你该认识的64位设计师》 ,唯一不太方便的地方就是,文章是全英文的,对于英文不好的童鞋有点吃力。不过多看一些,进步就会很大,加油吧,童鞋们~

3. 设计规范

1. 《iOS human interface guideline》

2. 《Up and running material design》

市面上平台不仅仅只有iOS和Android,但既然是精简版,在这一步只介绍这两种。单这两个平台的规范,就足以让自己去钻研许久了,有精力的小伙伴也可以再去搜索一下Windows Phone等平台规范文章。

读规范,并不是一步全部读完,需要分好几遍来进行研究。刚开始概览一遍,做到框架的熟悉。然后在做项目的过程中边做边翻阅,又会给自己一些灵感,比如说控件怎样进行统一,同一控件不同的状态怎样表述等等。它们是值得一读再读,反复研究的材料。

△ iOS设计规范

中文版参见:

  1. 《中文版来了!UI设计师必读的IOS 10人机界面设计指南 (一)》
  2. 《中文版来了!UI设计师必读的IOS 10人机界面设计指南 (二)》
  3. 《中文版来了!UI设计师必读的IOS 10人机界面设计指南 (三)》
  4. 《中文版来了!UI设计师必读的IOS 10人机界面设计指南 (四)》

谷歌动效手册:

  1. 《中文版来了!新版Material Design 官方动效指南》
  2. 《中文版来了!新版MATERIAL DESIGN 官方动效指南(二)》
  3. 《中文版来了!新版MATERIAL DESIGN 官方动效指南(三)》

软件学习

软件学习分为三大方向。

第一个方向是专业类的,图形图像的处理用Sketch或者Photoshop。Photoshop擅长图片的处理,这一点它是老大,没人能撼动。但作为流程图的绘制工具,它的效率确实比轻量级的Sketch要来得慢一些。所以定位可以分为Sketchup用来画页面的流程图,表达跳转关系,而PS进行辅助,用来处理一些漂亮的图片。两者进行相互的配合。

专业内的还有原型展示工具。原型展示工具就是将二维平面的设计图,变成动态可以上手进行操作的demo。做这一步是为了检查在跳转过程中是否有存在让用户体验不流畅的地方,避免在开发的过程中才发现这样的问题,浪费大家的精力。

这样的软件主要有AE、Principle、Flinto、Origami等等。现在市面上功能比较晚上的应该算是Origami,不过它学起来思维转换比较大,要有开发思维,所以对于设计师来说上手有点难。比较简单的是Principle、Flinto,AE更像是一个完整的动画,不能鱼人进行交互动作。

第二类是文档的整理。文档的整理主要是项目的进度跟进,资料共享,平时的会议等等。这个比较常见,Mac的keynote、number、Notes或者Windows的PPT、Word、Exce都可以。不过个人比较喜欢Google 云端储存文件,方便团队共享,更改和同步。

第三类是思维的整理。脑图工具会帮助咱们罗列出各种大小事件,然后进行归纳整理,排出优先级。最好用的是MindNode,但只能Mac进行使用。Windows用户可以使用Xmind,颜值稍微低一点。

推荐书目

在推荐书目里面,楼主比较支持一种做法,就是挑一本经典的书,然后反复不停地去读它。理论结合实际地去用,有疑惑的地方再回过头来进行查阅、反思。

所以我推荐的书目,主要是业内耳熟能详的书籍,在亚马逊或者:

《About Face 3 交互设计 精髓》(强烈推荐,时间不够也可以只看这一本)
《设计心理学
《用户体验的要素》
《瞬间之美》

△ About Face 4

相关书籍的读书笔记:

  1. 《设计师读书笔记连载系列之<简约至上>》
  2. 《设计师读书笔记连载系列之<Don’t Make Me Think>》
  3. 《设计师读书笔记连载系列之<设计师要懂心理学>》
  4. 《取其精华!设计师读书笔记系列之<ABOUT FACE 3交互设计精髓>》

实践

关于实践,楼主秉持着一个原则,就是一定要带着自己在工作中遇到的问题,去训练。重要的事情说三遍:带着问题去实践!带着问题去实践!带着问题去实践!

其次,主动地、不断地帮助团队去解决问题,不论大小。

总结一下,在基本功阶段,咱们翻阅各种网站,学习软件,翻阅书籍,目的其实是为了提高自己的审美,用方便快捷的工具将项目的信息传达给团队。也就是说,要培养的是自己对美的追求态度,信息的归纳总结能力,逻辑思维能力。进阶的话,那又是另一个话题,期待和大家的下次分享~

Sophia的tips:

1. 基础扎实,往后才走得稳。
2. 先积累量,量达到一个程度才能引起质变。

作者简介:Sophia的玲珑阁,一枚爱健身的 交互设计师 。

欢迎关注作者的微信公众号: 「Sophia的玲珑阁」

「优设自学指南」

  1. 平面设计: 《超赞!设计师完全自学指南》
  2. 交互设计 : 《交互设计师修炼指南!教你从零开始成为优秀交互设计师》
  3. 抠图技巧: 《从菜鸟到高手!PHOTOSHOP抠图全方位攻略》
  4. 配色方案: 《色彩搭配速成!3个实用方法帮你全面搞定配色》
  5. DPI指南: 《基础知识学起来!为设计师量身打造的DPI指南》
  6. UI 设计: 《超实用新手指南!零基础如何自学UI设计?》

原文地址: jianshu

【优设网 原创文章 投稿邮箱:yuan@uisdc.com】

================ 关于优设网 ================
“优设网 uisdc.com “是国内人气最高的网页设计师学习平台,专注分享网页设计、无线端设计以及PS教程。
【特色推荐】
设计师需要读的100本书 :史上最全的设计师图书导航: http://hao.uisdc.com/book/ 。
设计微博 :拥有粉丝量190万的人气微博 @优秀网页设计 ,欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航 :全球顶尖设计网站推荐,设计师必备导航: http://hao.uisdc.com

相关文章

  • 必读:除了设计!设计师还应该具备哪些能力
  • 尖叫吧!像素完美使用手册(附PDF下载)
  • 速成技巧篇!一个月内如何学习才能应聘交互设计实习生?
  • 毕业季专题第四期!新人的交互设计实习小结(二)
  • 毕业季专题第五期!新人的交互设计实习小结(三)
  • 经验分享:如何快速保存App动效?
赞 (0) 评论 分享 ()