推荐阅读
精选国外非常吸引人的旅游门户网站设计欣赏
其实酒店和旅游类的网站最能体现多媒体内容和文字的搭配技巧了，这类网站通常需要营造氛围，展现美感，体现吸引力，优秀的案例比比皆是。今天我们就来看一组优秀的案例。现如今的旅游和酒店类网站设计的越来越带感了，壮美的风景和精致的界面融为一体，优质的服务和梦幻般的界面让用户在网站中流连忘返。这些网站以惊艳的图片和视频立足，配合以突出的现代网页设计技术，结合当下的设计趋势，视差滚动、全景图片、响应式布局、动态图片一个都不缺席。这些网站巧妙地将多媒体技术、文字排版和特效平衡为一体，为用户提供了身临其境的体验。>Pygmy ElephantPygmy Elephant 是一个旅游机构，网站为用户提供了逼真而难忘的视觉体验。其中涵盖的多媒体类型丰富，通过丰富的视觉体验鼓励游客踏上旅程。网站使用了视频背景，漂亮的图文混排，精致的交互细节。>Cruise Me为了让项目效果突出，设计和开发团队使用了诸多先锋的技术。当用户打开网站的时候能够看到首页上交互性极强的地图，每个地标都能够为用户提供丰富的信息以便浏览和了解。再向下，用户可以翻看不同主题不同旅游项目的卡片，有目的和针对性地了解具体信息。整个网页的设计友好而令人愉悦。>Bird Luxury Travel PR
PHOTOSHOP绘作逼真蕃茄
4.画个大椭圆，羽化20，反选，增加亮度30。 5.取消选择后，用加深和减淡工具处理周边，上面和两边减淡，底部加深。使用加深和减淡工具的时候，需要不断的尝试，这时最好给图像做个历史快照，或是复制一层来做，这样便于修改，涂抹时次数是很多的，不一会就数十次了，在历史记录中可恢复不了。 6.蕃茄有几个瓣，现在来做这几条陷下去的纹。画个椭圆，用选择-变换选区旋转和移动到适合的位置，羽化1，在凹纹的位置用减淡工具檫。 7.反选后用加深工具檫。 8.同样方法做出余下的陷纹。观察整体，再对局部作一些加深增强立体感，可加轻微杂色，数量约1。 9.给这个层命名“蕃茄”，新建一层，在上部画个小椭圆，羽化3，填充灰白性线渐变，将图层模式设为“颜色加深”，作为蒂部位下陷的暗调。向下合并到蕃茄。 10.新建一层，命名“茄蒂”，用钢笔仔细钩出蒂的形状，填充绿色（46/77/27）。 11.绘画实物时，离不开我们的好帮手――加深和减淡工具。刚接触时，我也是极为头痛的，它们不象图层样式那样，调节参数就可以得到效果的，不容易掌握。但只要经过耐心的练习和尝试，你会发觉它们实在是可爱极了。处理茄蒂时可用钢笔辅助钩出叶瓣，也需要载入茄蒂的选区，用轻移、旋转、羽化、反选等动作来得到我们需要的工作选区。完成后加杂色1.5%。
Photoshop打造斑驳压纹镂空文字效果
简 介】 利用PS可以打造出各种各样奇特的文字效果，下面我们来制作一款压纹镂空文字…… 先看一下效果： 效果图 制作工具：Photoshop CS 制作过程： 1、新建一个宽度为100像素，高度为100像素，分辨率为350像素的文件。 2、新建图层1，单击工具箱中的“自定义形状工具”，在其属性栏中单击路径按钮，并在形状下拉面板中选择五角星图案，然后在窗口中拖拽创建一个五角星路径，如图01所示。
自己动手用Dreamweaver制作活动菜单条
用QQ聊过天的朋友都对它的自动隐藏窗口功能爱不释手，它可以使窗口显得清爽整洁而且富有动感，笔者的几个朋友都想在自己的网页中加入类似的东东，经过共同摸索发现用Dreamweaer就可以实现这种效果，下面我们通过一个活动菜单条的制作来看看吧。 第1步：制作菜单外貌 图1 在Dreamweaer中新建一个文件，绘制一个层，在该层中插入一个表格(如图1)，对该表格进行修饰，然后加入菜单项并建立各项的超链接，为了去掉超链接的下划线，可以编辑超链接的CSS样式，在CSS样式面板中通过CSS选择器将“Link”和“Hover”的“Decoration(装饰)”均设置为“None(无)”，将“Hover”的“Color(颜色)”设置为红色，最后将设置好的样式应用到各个菜单条中(可按“F12”键预览效果)。 第2步：设计菜单的动态效果 1、选定层面，当鼠标变成“十”字形时按住左键将层面拖动到页面右上角(使整个菜单条完全露出但上边缘正好靠拢页面上边界)，在窗口菜单中打开时间线面板，选定层面将其拖动到时间线上，Dreamweaer会自动产生一个长度为15帧的动画对象，拖动该动画对象的最后一个关键帧到第30帧，将其长度设置为30帧。然后在第15帧处单击右键，在弹出的快捷菜单中选择“添加关键帧”选项插入一个关键帧，并将层面拖动到适当位置(如图2)。在时间线窗口中的第15帧处再次单击右键，在弹出的快捷菜单中选择“添加动作”，为该帧添加一个交互行为，Dreamweaer将自动打开行为面板。单击行为面板中的“+”按钮，从弹出的菜单中选择“Timeline/Stop Timeline”，打开“Stop Timeline”对话框，选择“Timeline1”后单击“确定”按钮关闭该对话框。交互行为的事件为“onFrame15”，动作为“Stop Timeline”，这样当时间线运行到第15帧时，动画将停止播放，这样就实现了菜单条弹回的功能。图2 2、用同样的方法在时间线的第30帧处也添加一个“Stop Timeline”的交互行为，这样就实现了菜单弹出的功能。添加了这两个交互行为后，在时间线窗口的相应帧上面都出现了一个蓝色方块，它代表一个交互行为。选择“自动播放和循环”复选框，使动画能够自动循环播放(如图3)。图3
最新发布
4个替代方案替代传统的汉堡图标设计
越来越多的用户抱怨网页设计已经变得无聊无趣了。高端的技术和流行的趋势已经为网页设计构建起了一套约定俗成的规则，而开发者和设计师在社区中依然不停地探索新的可能性，寻求下一个病毒式流行的新热点。虽然新设计和新界面层出不同，但是许多看起来和之前流行的设计大同小异。说道UI界面，这几年最深入人心的应该就是汉堡图标了。前年，对于汉堡图标是否会成为大势所趋的撕逼一直没停过，而在去年，针对汉堡图标的讨论核心就变成了使用汉堡图标的技巧有哪些。现在，汉堡图标已经谈不上是“热潮”了，说它是使用过度也不为过。汉堡图标的优势很明显，它紧凑，直观，便捷。它的“缺陷”也相当突出：太熟悉，“无聊”。我的意思是，每一个APP都有三条横线在UI的顶端告诉你“我是菜单”，有没有更加有趣，让人眼前一亮的替代方案呢?有。今天我们就聊四种不错的汉堡图标替代方案。1、垂直字母纵向导航将整个导航连同字母方向都翻转90度，这样的设计比起汉堡图标看起来要新鲜得多。这种设计占用的空间更少，它看起来更像是一条纵向的线，在视觉上，它几乎和屏幕等高，视觉形式感上也很强，结构紧凑，内容也足够丰富，可以说，它是一种非常符合现代设计风格的一种呈现形式。这种设计对于绝大多数的用户而言，都没有识别度上的问题，如果说它真有什么缺陷的话，大概就是治好了我多年的颈椎病吧……VR Sessions 这个网站就选取了这种导航设计。他们将这种纵向的导航和他们的LOGO排布在了一起，看起来漂亮又精巧。你刚刚打开 Snake River Interiors 的网站的时候，它的导航看起来相当普通，可是当你向下滚动的时候，整个导航会变成纵向排列的，并且悬浮在屏幕左侧，随时待命帮你导航，这种设计思路非常有趣。
4个方法帮你从零开始进行用户招募
提到用户招募，你的眼前可能马上浮现出一个麻烦熊孩子的形象。假如你采纳了定性研究方法，它几乎就无法躲开。它令人疑惑，一开始你可能一头雾水，不太清楚要找怎样的用户;它让人着急，你计划在4天内找到合适的用户，在多个渠道发放了招募信息，却只收到少量回应，不得不将整个调研项目的时间往后推;它不让人省心，用户也许表示只在某个特定时间段有空，可是这个时间段已经被另一位用户占用了……你来来回回地调整时间表，既尴尬又心累。怎样才能让这位“熊孩子”听话些?今天笔者就来简要说说用户招募的步骤和其中的一些技巧。一、确认用户招募标准一般而言，在了解调研背景和目的，决定调研方法后，我们面临的第一个问题是：究竟哪些用户适合参与调研呢?“具有代表性的用户”、“产品的目标用户”似乎是标准答案，然而它们未免过于抽象，难以捕捉。怎样才能得到具体的标准呢?首先，有一个重要原则：被招募的用户要有能力参与访谈/测试。具体而言，他们当中的绝大多数，应该是对调研的领域、产品或功能相对熟悉的人。假设我们在对某款手游进行改进，招募一位从未接触手游的用户就不太合适。恰当的人选应该是：该款手游的用户，或同类型竞品手游的用户。接下来，我们要找到那些影响用户行为或认知的关键因素，基于这些变量进一步细化招募标准。在常见的移动产品调研中，手机系统(iOS/Android)的差异是必须考量的因素，毕竟两种用户群体有着不同的操作习惯，对产品的认知可能存在较大差异;使用年限有时也会影响用户对产品的认识，对比新老用户的反馈，经常能得到有价值的发现。最后，为了样本的覆盖性和平衡性，我们在招募标准中加入人口统计学的变量，如性别、年龄、职业、收入等。如果是成熟的产品，可以参考该产品用户的人口学特征，决定用户招募的比例。例如：产品使用者中，80%都是男性，那么八位用户中找六位女性就不太合理。在调研新产品时，我们可能无法准确把握目标用户的特征分布，这时可以将该产品所在领域的市场报告作为参照。制定用户招募标准时，还要注意尽量不要找以下两类用户：半年内参加过同类调研的人。因为之前参与调研的经历可能会影响用户的行为和认知，造成本次调研结果产生偏差。用户体验行业，和与被调研产品/功能密切相关的从业者。不难想象，一位交互或用研很难摆脱职业视角，站在普通用户的角度完成调研。
优秀网页设计师用实战案例解读内容化设计
什么是内容化设计?设计师为什么要关注内容?如何通过设计的手段提高内容体验?阿里设计师用一个手淘的实战案例，帮你掌握内容化设计的精髓。前言如果说好的产品是运营出来的，那么内容作为用户体验中的重要部分不容忽视。然而我们在设计中经常缺乏内容体验的意识。借着第十三届用户体验大会User Friendly 2016的分享，手淘的设计师和业内的同学们一起做workshop，探索如何进行行之有效的内容策略脑爆，以及思考内容产生、组织到流转分发的设计策略和用户行为数据验证。希望能让大家对无线端导购的内容化设计有所启发。以下是对大会相关内容的整理。在探讨内容化设计是什么之前，或许有人奇怪：设计为什么要关注内容呢?内容一直是设计缺少关怀的“冷门”，一直以来内容似乎是运营的事儿，设计更多是参与到产品、技术的流程中。那么，大家觉得作为设计师的我们是否要管内容的事儿呢?要关注!为什么?因为交互设计是一门关注人(people)、产品(product)、情境(context)的科学。我们平时在工作中最多关注的是用户，也就是人和产品之间的交互。但情境也是重要一环，除了具体场景化情境，设计师也要关注当前的时代环境。内容为王的时代决定设计要关注内容以淘宝导购的历程为例，一起来看下当下我们处在一个什么样的时代情境之中。阿里CEO张勇曾这么描述过：在PC时代，在淘宝上非常重要的两条消费者的动线，第一是搜索，第二是分类导航。这个在PC时代大家都知道，大家做很多事情最后都希望在搜索里面排位更靠前。PC时代淘宝以搜索、分类导航为方式的中心化流量分配的方式。运营做的最多便是招商、盘货排楼。所谓流量运营的模式。而不久之后便遭遇到无线时代的挑战：无线时代有一个弱点就是屏幕那么小，但更聚焦，可以更针对消费者个体和他的偏好。同时消费者通过手机回访的频次和停留时间比PC时代大大增强。只要能够提供好的内容，用户就可以非常顺利地提起他的兴趣，这是在无线时代淘宝经营非常重要的一点。
设计师解析四个界面设计规范的经验
最近为了设计提高效率和质量，我开始研究如何做规范。看了一圈别人做的设计规范，又回想了一下自己以前做的，总结了以下几个经验。说到设计规范，这里有一篇绝对不能错过的：《内部教程!超实用6步透视网易设计规范(附完整PDF下载)》设计规范的共性不同的规范虽然内容差别很大，但是对比一下它们的目录，却又很多相似之处，通常包含：布局、组件、配色、图标这四部分。组件里的分类无非是导航、菜单、表单、列表、表格、按钮、弹出框诸如此类，我就不一一列出了。设计规范有哪几类总体看来，我发现这三类设计规范出现概率很高：1、给产品经理看的IOS和早些年的Android(现在已经统一改用Material Design)设计规范就属于给产品经理看的，里面写的东西大多围绕如何选择大的方向、哪种处理方式更加合理展开的，界面细节却没有详细介绍。这种规范适合用来做演讲，内容不多，都很有道理，参杂这很多创新的功能。而拿着它做设计却很痛苦，因为它不告诉你如何才能达到理念中所勾勒的那个目标，图标、尺寸、陪色、字体……很多东西都不明确。2、给设计师看的
详细解析当下泛滥的移动产品设计模式
如果你是一名移动产品设计师，你可能会同意这样的观点：参考借鉴别人的设计不算抄袭。这不仅是最佳的练习方法，也是一种设计模式，而且还符合业界主流的设计趋势，同时还能确保在用户熟悉的模式下来创建可用性的界面。有人可能会说，坚持设计规范和跟随其他人的步伐会扼杀创造力，而且时至今日，所有的APP看起来都是大同小异。从用户体验的角度来看，我看到了一个不一样的问题。你相信Google、Facebook、Instagram永远是正确的，所以习惯于采用他们的做法，因为他们的设计目标与你的设计目标相同，所以你不会对此产生质疑。我还总结了一些设计模式，在过去可能被认为是最佳的实践方法，但结果可能不如你想象的那么美好。1、隐藏导航在业内各大热门设计社区，至少有数万篇的相关文章分析汉堡包菜单(是指把菜单折叠隐藏在抽屉，因菜单图标像汉堡包得名)，但现在反对这种设计模式的人也越来越多了，我想这并不是因为大家都审美疲劳了。简单来说，我们要讨论的不是关于图标本身，而是隐藏在图标后面的导航。幻灯片菜单灵活，方便使用汉堡包导航非常易于设计，你不必担心屏幕空间放不下那么多内容，只需将整个导航藏到左侧，导航内容超出一屏的时候滚动叠加。然而，实验表明，以更可见的方式露出菜单选项，可以提高用户的参与度和满意度，甚至能提升整体的转化率。 这就是为什么现在大家都从汉堡菜单转向易于发现的标签菜单。
通过电影海报实例解读组品构图技巧
这并不是一篇教程，也算不上是个人的经验之谈，构图方面的知识大家上网都可以找到，但是有一个问题，很多理论知道的人很多，真正会用的很少。这正是我为什么要写这篇文章，就是通过对生活中见到的案例的分析来巩固我学到的理论知识，本篇只是个试验，以后应该还会继续写下去。如果有大家喜欢和支持，我会更有动力的!同时也希望大家可以尝试着运用所学的知识，学而不用，等于没学。好了，言归正传，下面就是我对电影中一些画面的构图分析。您请上眼。
Illustrator用字体组成的怪物来袭海报实例教程
本教程主要使用Illustrator用字体组成的怪物海报效果，在这篇中我将教你如何使用字形面板中的字型来创造这个怪物。之后用它来做什么完全由你，本篇中你要学会如何使用字形以及如何配合轮廓化、缩放、旋转字体做出这个怪物等。如果还要更多，那么可以试试路径查找器或者其他工具。先看看效果图
详细解析平面设计中的魔力数字3
“道生一，一生二，二生三，三生万物。”——老子《道德经》3仅仅是一个数字吗?3还能代表更多!?数字3推动着摄影、设计、建筑和自然规律的发展?我们一起来看一下数字3的魔力。来了解为何网页设计、印刷广告、Logo设计都和数字3息息相关。设计中的三实际上，数字3是设计师的亲密朋友。3是一种设计手段，一种设计模式。3是美丽的，3是对称的,3是一种设计思维。我们来一起看一下 TheBorsky.com 你会发现数字3有多重作用。三栏或者说三张卡片，标题+内容+详细信息=3水平上的三栏布局，垂直上采取堆砌。 Vizzuality.com这种三栏布局对于图库、文章为主的博客来说非常奏效。
CorelDRAW制作道旗海报实例教程
这篇教程像思缘的朋友们介绍使用CDR制作道旗的方法和具体过程。教程主要介绍的是使用传统图案来制作商业设计中挺常见的道旗广告。教程挺不错的，讲解思路比较清晰，推荐到思缘和正在学习CDR的朋友们一起分享学习了。最终效果：具体的制作步骤如下：新建页面，绘制矩形设置属性f11,填充渐变颜色
浅谈更优雅的微信第三方设计技巧
最近比较忙，整理作品的速度明显放缓了许多。今天总结些前段时间做的微信第三方网站。要清楚，它是网站不是单独的一个网页。需要考虑更多是整体性的问题。在拿到项目时，首先需要冷静下来。而不是急着去动手，大部分同学肯定都理解了解其缘由。这边要说的更多是前期先看看相似对手的情况。因为视觉设计相对于产品功能，是最容易拉开差异感的部分。或许一套不同的视觉策略就能让产品迅速脱离大部分同类作品走出来。大部分的普遍大部分的微信第三方，和似乎都不太注重展示部分。即视觉部分，隐隐有些暴发户的感觉。而且现在做这块的公司似乎已经有当年做团购的景象。多，十分多，最后迷失在一片片营销的海洋里。做为设计师，先跳出来观察下。其实我们会惊讶的发现，这些站的普遍性都是为你做个微信mini站，就是所谓的新时代营销。最核心的功能基本也是一致，如下：智能导航(调用地理位置地图接口)在线支付全景看图(自由图片组合)抽奖营销活动随便打开搜索”微信 营销 专家”，一堆类似微信第三方网站。现在很多的创业者也在做类似的项目，总之，就是很多很多公司做着类似的尝试。当然，国内任何的领域基本都是同时存在上百个同类的项目，能真正运营下去到最后也只有3-4家而已。