推荐阅读
法国设计师菲力浦B斯达克
小到牙刷，大到建筑 法国设计师菲力浦·斯达克（phlllipe starck）是20世纪末西方最有影响的设计师，同时也是一个发明家、思想家。 他的作品涵盖了建筑、室壬杓啤⒒车、家电、家具I域，从食品、刀叉餐具、厨房用品、沙发座椅、摩托，一直到餐要、宴会展示场和建筑。不论小到清洁口腔的牙刷，或是尺度巨大庞然的建筑物，他都可以显F出对细节的同样执着。 艺术经历 Philippe Strack于1948年一月十八日在巴黎出生，父亲是一名飞行员及飞机工程师，他是在满室设计蓝图的家庭中长大成人的。在父亲的设计桌上乱画，拆开家里的电器来研究，都是S track童年时的主要消遣，这些启发了他对建筑和设计的兴趣。 其后，Philippe Strack考进巴黎的Ecole Nissim de Camondo学院，主修建筑。毕业后Strack有感读书时过分用功，决定到世界各地去旅行，环游世界后，Philippe Strack在皮尔.卡丹担任艺术指导一职，不久他便成立自己的公司，这时他设计的三脚椅子和Cafe Costes内的布置，使他逐渐受到人们的注意。 真正令Strack声名大噪的，当然是1982年负责法国总统密特朗新居的设计工作，之后的Nani Nani大厦、Royalton和Paramount两间酒店，更令Philippe Strack成为名闻全球的名字。 幽默与设计 像很多天才一样，斯达克小时候既不是好孩子也不是好学生，他的调皮似乎随着年龄的增长而有增无减，成为他形象的一部分。这种儿时的顽皮，慢慢演变为成熟的幽默，渗透在他的设计当中。他的幽默感，从他让事务所的工作人员戴上斯达克脸孔面具可见一般，他在嘲笑自己的同时，也嘲笑了这个端庄做作的世界。尽管斯达克现在已经是设计界少数少年得志的明星，但外表还是一副标新立异、吊儿郎当的模印
关于“层”定位的问题的解答
一. 常出现的问题 当你的表格选居中的时候又插入了层（插入层方法1：object->draw layer）的时候（800*600），分辨率一旦变大、窗口最大化之后，层就错位了，而如果使用菜单(插入层方法2：Insert->Layer)插入层的时候，这个层就会与它的上级元素相对定位，但是一旦在Dreamweaver中用移动工具动了它，它就会马上变成绝对定位，不会再与上级元素相对定位了。 二. 思想： 通过object面板置入的层是绝对定位的层，这个绝对定位指的是层的左上角与浏览器窗口内部的左部、顶部距离，代码中的写法是left与top。 通过菜单置入的层是相对定位的层，这个相对定位指的是层与它的上级元素的距离（它的上级元素的左上角），由于这个div中不再有left与top的属性，所以浏览器把它的位置定为与它的上级元素相同 （总结一：只要去掉层的left与top属性就可以相对定位！） 例图： 三. 深入思想： 现在层已经相对定位了，可是只是这样还完全不能满足要求，因为很多时候不能把表格设定得那样准确，否则会把表格搞得很麻烦，把代码搞得很大很大。 如果在上面说做出的相对定位的层的基础上再做一个层对它相对定位，不就解决问题了吗？ 这就涉及到了父层与子层的问题（由于它是层的基础，在书与网上教程中就可以看到，这里不再阐述），父层相对于某点定位，而子层相对于父层定位，就可以达到层的相对定位这个目标了 四. 具*作（只介绍最简单的方法，对代码熟的朋友可以手敲的）： 先在页面内插入表格（可以设居中，表格就居中了，否则几乎无意义），鼠标在某单元格内点一下，让光标在此闪动，然后通过菜单插入一个层，这个层就相对与这个单元格定位了。插入一个层之后，不要动它，而且也永远不要动，但是可以更改它的大小，比如把它的高与宽都改成"0"，让它不再影响你对其他内容的编辑，否则，这个层的left与top属性出现之后就成了绝对定位了，变成绝对定位后你可以把它的left与top属性去掉，就恢复成相对定位了。变成"0"之后，有时子层会看不见，可以按[f11]键点它恢复编辑。 现在光标在这个层内闪动，再通过菜单插入子层，这时子层与父层重叠，你可以随意移动它，不管怎么动，它都是相对与父层定位。 好了，一个相对定位的层（子层）做好了，你可以在里面随意添加内容了，也可以改变它的尺寸、位置、背景等所有属性，但是不要动left与top属性，因为它是相对于父层的左上角定位的。 下面给出父层与子层在Dreamweaver中的属性面板： 父层： 子层： 五. 技巧： 先插入一个表格,在其中一个单元格中插入父层，可以把它定得小一点，比如说20象素宽、10象素高，这样它就不会盖住下面的链接，也不影响子层的相对定位。 如果要用778象素宽定义表格，可以把父层插入到表格的第一行第一个单元格中，这样就可以在所有层制作完后插入父层了！对代码熟的朋友就可以手敲父层而不必再去调整子层的位置了。
XHTML基础教程(二)
合理的添加图片可以使一个网页更加的美观。<img>标签用于在网页里插入图片。<img>标签有一个重要的属性"src"，它的属性值就是图片的地址。下面我们就在我们的index.html里插入一个图片。打开”index.html“文件，在</body>前加上如下代码： 保存后浏览网，请确认您的网页与该页面相同。 我们注意到<img>是一个空标签，需要在结尾加上一个"/"以符合XHTML的要求。这里的例子除src外还有一个属性alt，我们把它叫做做替换属性，当图片由于某种原因而无法显示的时候，alt的属性值就会代替图片出现；而当图片正常显示时，只要把鼠标停在图片上就会看到alt属性的属性值。 我们在之前的教程中曾经学习过创建超级链接，下面我们打开“index.html”并且将刚插入的代码改为下面这段：
最新发布
详细解析交互设计师应该具备哪四个素质
从今年4月份开始，我被安排负责一个直播项目，设计之路可谓曲奇坎坷，难得的设计经验让我对交互设计本身有了一些新的认识。结合自身的感悟，我自认为交互设计师除了专业能力的要求外，还应该具备以下素质：1，业务深度带来业务驱动力在工作之初，我认为无论负责什么项目，交互设计都是一种解决复杂问题的能力，从设计分析到设计产出是具有绝对的普适应;而且随着设计能力的提升，经验的积累，这种普适性更加凸显;这一层我并不否认，但交互设计师只聚焦于普适性可能永远都处于门外汉的水准;有机会专门负责直播项目，让我不得不接触和使用各种直播App，不得不和很多专门做直播的人合作，在这过程中，让我对于直播业务有了深入了解。举个栗子，比如设计一个直播的发布流程。通过简单的竞品分析，相信任何交互设计师都能交付出一个流程完整且合理的设计，这是交互的普适性;但实际上，直播却分为很多不同属性，比如资讯直播、秀场直播、体育直播、节目直播等等，不同属性的直播有着不同的业务需求;资讯直播性质敏感，有着非常严格的审核制度，所以如何方便审核才是关键，而且主播往往赶赴现场，多在户外，所以为了保证在弱网情况下的流畅度，切换画面清晰度成为发布直播的必备环节;秀场直播注重个人包装，多处于网络稳定的室内环境，所以发布流程不为高效只为华丽;节目直播时间固定，内容可预估，所以直播预告的提前发布是别的直播类型所不需要的;再比如，资讯直播内容严谨，主播提前试镜是刚需。诸如以上的知识，当你了解越多，你的设计才越接地气，这不是单靠普适性就能获得的。再举个栗子，频繁的使用各种直播app能够第一时间掌握竞品的动态，甚至比产品经理更早的知道竞品推出的新玩法与新设计，从而予以借鉴主动的去推动项目，而不是单方面的接收产品需求，这种业务驱动力慢慢的就转变为设计师的影响力。说白了，便是干一行爱一行的思维，不是说现在负责新闻App的交互，好像只琢磨资讯领域，业务变窄职业发展就会受阻，而是说无论你现在负责哪个模块哪个项目，都应该有迅速深耕业务的能力，而且这种素质应该是交互设计师必备的。正是因为自我驱动，才能让自己变得与众不同，在团队中不可获取;不过话说回来，业务深耕也需要有条理系统化的积累，此一节，也是我今日努力的目标。
5个专门写给UI设计师的创意训练方法
如果大多数竞品的UI 设计和交互方式都差不多，设计师如何才能突破限制，表现出独特的创意和技法？今天小乖乖老爸 这篇好文结合了自己的实战案例，来聊聊做出与众不同产品的5个方法。每一位 UI 设计师，都希望自己的作品是与众不同的，表现自己独特的想法和技法。当你看到那些巧妙的设计，会忍不住惊叹，「太赞了，为什么我想不到呢?」。如果只是模仿，或者「照着xxx抄一下就行了」，那我们的工作还有任何意义吗?所幸薄荷是家鼓励创新的公司，可以给到设计师比较好的氛围，去尝试和探索。我们宁可为了创新而创新，因为，刚需都被巨头们牢牢抓在手里了，你只有与众不同才会有机会，平庸的产品只会平庸的死掉。要做出创新的产品，做出与众不同的设计，有什么方法呢?接下来我们一起来探讨下。一、先来个套路「套路」这个词现在有点贬义了，的确，做人不要有太多套路，但是做事得掌握套路。想想职场上你敬重的前辈们，他们凭什么赢得你的敬重的?不就是因为在你手足无措的时候，他们掌握了一些套路，教你轻松化解了吗?今天跟大家分享的套路，是我在《从0到1》这本书里学到的。在这本书里，彼得 • 蒂尔提到，每次面试应聘者他都会问一个问题：在什么重要问题上，你与其他人有不同看法?这真是非常棒的问题，你可以用这个问题来问一个企业家、问一个产品经理，也可以用来问一个设计师，而且从他的问答中，你能看出他对这件事的思考。套路相当深啊!
优秀的交互设计有哪些主要评判标准
这可能是UX领域没有人能真正全面回答的问题，我也只是根据经验给大家分享一下自己的看法。主要想从几个方面来说：1. 什么是UX;2. 什么是好UX; 3. UX界的一些新观点1. 什么是UX首先，人机交互不是UX。虽然有很多的重合，但是并不是一回事。详情请见下图：从图里就能看到，其实UX是个非常大的范畴，不是大家所说的只有一个界面。你可以看到，视觉的部分，也就是visual design只是UX中的一部分。你和一个系统发生交互的时候，你内心的感受，你对系统的认知，你看到的视觉，你看到的文字，你听到的声音，到你对这个系统产生的认识(mental model),都是你体验的一部分，也是UX所应该关注的领域。其实想做一个好看的系统是不难的，但是想做一个好用的系统却不然。为什么呢?就是因为整个系统的设计架构会很大程度的决定你的体验。举一个很详细的例子吧。其实你和任何一个系统交互的过程就像是你到了一个新的城市，一开始你什么也不知道，你对城市没有你的认知和mental model，你在逐渐探索的过程中了解了这座城市，知道了不同的餐厅街道商场都在哪里。用户对于系统认识的过程也是这样的。你从一无所知，到熟悉一个系统，是通过与系统的交互逐渐熟悉起来的。你可以用路牌用地图让用户知道如何在一个城市里穿街走巷，可是你很难通过直观的让用户有归属感的来真正了解你的城市，这要是做UX最困难的地方，给用户提供良好的记忆辅助和对你的系统全局的认知。而以上说的这一切，都是UX的范畴。2. 什么是好UX
9个初级设计师应该掌握的工作习惯分享
刚迈入设计领域新人，除了学习专业知识，坚持正确的工作习惯也很重要，比如马良重生这篇文章提到的9个设计习惯，都是简单但长期坚持后能看到效果的，建议新人阅读。1，养成随改随存的好习惯谁敢说自己的电脑不会卡机不会死机?所以建议大家经常保持Ctrl+S的标准手势。2，对图层进行整理为主要的图层命名以及建立图层组，将源文件整理的“干净、整洁”是每个设计师应该养成的良好习惯，这样在你过了很久再回来修改文件，也不会浪费更多的时间。3，画矢量图形就用形状和路径工具通常大家在绘制矩形的时候会怎么绘制呢?其实好多种方法，个人觉得这里使用形状工具是最上上的选择。路径和形状工具的好处在于，你在经历了各种修改之后，图形依然不会损失质量。
13个设计方法设计真正轻量化的移动APP
无论是扁平化还是Material Design，简化图标元素都只是触及表象，想创造出本质上轻量化的设计，界面细节和交互上的考量也非常多，今天这篇好文，总结了13个帮你做出轻量化设计的方法。1. 创造更轻的设计（Lighter Design)什么是轻设计扁平化设计不再使用各种斜度和阴影，让app有了更轻盈的美感。这意味着通过运用负形空间来取代斜度和阴影，创造出一个只关注核心信息的、更为简洁的界面，从而摒弃那些对app本身和用户流程来说都很低效的设计元素。如何更轻较轻的设计舍弃掉了那些分散人们注意力的元素，以引导用户去关注屏幕上有意义的内容，使得导航更简单，同时又塑造了一种极简、现代的高大上品牌形象。2. 一种字体用到底什么是只用一种字体减少屏幕内所使用字体数量能最大限度地表现字体设计的张力。因为当你少用不同的字体、不同字号还有像斜体、黑体、半黑体等字形样式时，内容之间留白的级别差异才能更好地被区分开来。为什么只用一种字体
6个方法设计出实用美观的风格指南技巧
统一的风格让用户觉得有信赖感，也能将服务和用户连接起来。无论是Dropbox 或者 Google、Twitter，都有属于自己独特的设计风格。这篇文章，总结了设计风格指南中所记载的6个要点，供同学们参考。参考这次介绍的样本和要素，并在今后的设计项目中尝试着加入这些，让设计变得更有趣吧。在你制作风格指南之前，首先需要注意这几点。首先在设计商品与服务之前，让我们创建一个风格指南。然后找出哪些设计要素是适当的，这你得有一套自己的标准。风格指南完善是没有终点的，这也是没办法的事。利用万能的设计语言所制作完成，互动也是非常必要的。在风格指南制作完成之后，我们还必须想清楚，是不是能很好的将商品里的信息传递出来，让人能够轻松的理解。01. 基本原�使用风格指南来创建设计中的一些基本原则。设计的基本原则指的是，在开发商品或服务时，设计师是基于哪些标准来解决这些设计的问题的。
从iOS10的交互设计中学到的3个设计启示
本文用交互设计的思维对iOS 10的新特性进行分析。撇开平时我们考虑的界面排布，页面元素等问题不谈，将视角转移到屏幕外的东西：如时间维度的，空间维度的，手势操作等等，以提升我们的用户体验。先上iOS 10 官方指南的原地址：https://developer.apple.com/ios/human-interface-guidelines/本文作者是蘑菇街的设计团队，欢迎大家关注他们的追波地址哟：https://dribbble.com/mogu背景前段时间被一篇名为《从iOS 10设计指南变化看设计的新趋势》的文章刷屏，文中从UI设计的角度分析了iOS 10带给我们的设计新趋势：“大而简，简而精”。文中指出，未来的设计将更注重产品的内容和操作体验，降低其他因素对用户使用上的干扰。设计师则需要在界面设计中去把握「大」和「简」的程度，以及思考如何通过更有限的手段和空间来传达更多的信息和指引用户来达到「精」的目标。iOS 10于一周前正式推送更新，相较于前几代的系统，他在交互方式上有了比较多的改变，在很多细节设计上，更是值得我们把玩和品位。正如苹果官方在他的更新说明里所描述的：“iOS 10是iOS发布史上的重磅之作”。所有iOS 10新特性罗列的文章网上已有很多，这里就不赘述了，本文则将从交互设计的角度出发，聊聊iOS 10的变化带给我们设计上的启发和借鉴意义。一、基于行为的设计著名的交互设计专家Jon Kolko在他的《交互设计沉思录》中指出：“行为是发生在第四个维度(时间维度)上的，而交互设计的目标是试图随着时间的推移，逐渐理解并进而塑造人的行为”。举个例子，iOS 10最明显的细节之一：拿起手机就亮屏。
如何解锁优秀电商Banner广告的新姿势
在我看来，电商设计师是应该要保持一个比较宽的可超控阈值的，就比如说你要能既做的了小清新也做的了重口味，玩得起高冷大牌也受的了特价清仓大甩卖，再一个很多人表示不知道如何动手开始做一个Banner，于是就有了这篇文章，哈哈。写在前面写这篇文章的意义在于，很多人表示不知道如何动手开始做一个Banner，拿到需求脑袋里是懵的，那么归根结底还是看的太少做的太少了，所以今天我就给大家总结梳理一下我们目前市面上的Banner有哪些品种(表现形式和手法)好了，因为在我看来，电商设计师是应该要保持一个比较宽的可超控阈值的，就比如说你要能既做的了小清新也做的了重口味，玩得起高冷大牌也受的了特价清仓大甩卖。开始这个话题之前呢，我先给大家列个提纲：1、目前主流的Banner表现形式有哪些？2、如何在实际需求中运用这些Banner形式？3、每种形式的Banner都需要掌握哪些知识点？4、我写这篇文章的意义是什么？5、总结接下来，我一条条地给大家讲解咯(文章越到后面会越精彩，所以耐心点咯～)：
7个提高无线端表单可用性的设计原则
用户在填写表格的时候可能会犹豫不决，所以你应该让这个过程变得尽可能容易，这篇文章中的7个设计原则可以显著提高表格的可用性。无线端用户使用移动应用程序或网站都有一个特定的目标。通常情况下，站在用户和他的目标之间都会有一个交互形式 – 表单。实际情况中，表单被认为是用户使用链路中达到目标的最后一步，这就是为什么它是如此重要。所以用户填写表格尽可能快，没有任何疑虑，是表单交互设计的重要考虑要素。无线端表单设计需注意的原则有如下7个：原则 1：表单的交互设计应与用户输入数据的行为强兼容确保表单所有字段没有被界面中的任意元素遮挡，例如键盘唤起时。当用户完成输入表单的某一字段，页面位置自动往下前进至下一个字段更好利用有限空间。原则 2：减少输入字段和用户打字的交互成本表单越长越复杂用户完成整体表单的意愿就越低 – 尤其是在小屏幕上。最大限度地减少输入字段数，使你的表单载入更快速，尤其是当您向用户索取大量信息的时候保持表单越简短越好。但只减少输入字段的数量是不够的 – 交互设计师还应该注意用户输入成本，无线端打字有较高的交互成本。相信大家都有体验，手机打字很容易出错即便使用PC键盘也很难避免(触屏输入更是如此)。因此，尽量减少打字和防止用户输入错误，下面是几个小技巧：
4个设计建议让你的轮播图点击率更高
轮播图(Carousels)这样的交互方式，在web时代似乎已经司空见惯。当一群人在会议室里争夺首屏焦点图的优先级时，使用轮播图，似乎能够不费吹灰之力地解决这场争端，没有人是输家。然而，轮播图这种方式真的有效吗?如何设计才能带给用户更好的体验呢。事实上，“万能和事佬”轮播图的点击率通常都很低，转化效果也并不好，却往往占用了页面最抢眼的大面积位置。想象这么一个场景：当你走进图书馆想找一本特定的书阅读时，一个销售员挡在你面前让你先看一个大广告图，然后等你还没读完具体讲了什么内容时，他又突然换了一张，是不是很惹人厌呢?大部分轮播图的设计也是如此。确保你真的需要使用轮播图首先，设计不当的轮播图容易被用户当成与他想浏览的内容不相关的广告图片而直接无视。在各种网页中早以身经百战的用户，会选择最快速的方式找到和浏览他们想要看的内容。把精力放在翻看没有预期的轮播图上显然是低效的，一上来就自动进入了用户的视觉盲区。下面的热力图展示了用户的浏览行为习惯：快速扫描找到想要阅读的区域，然后再进行有序的沉浸式阅读，毫无例外他们都忽略了看起来像广告的图片部分。(以上热力图源自 James Royal-Lawson)(以上热力图源自 Nielsen Norman Group)除此之外，在2013就有研究结果表明，轮播图的交互效果十分不理想： 只有 1% 的用户点击了轮播图上切换按钮，其中 84% 的用户只在首屏点了1次。