如果您想订阅本博客内容，每天自动发到您的邮箱中， 请点这里
图片三个网站的图片搜索结果进行爬取和下载。
首先通过爬虫过程中遇到的问题，总结如下：
1、一次页面加载的图片数量各个网站是不定的，每翻一页就会刷新一次，对于数据量大的爬虫几乎都需要用到翻页功能，有如下两种方式：
1）通过网站上的网址进行刷新，例如必应图片：
url = 'http://cn.bing.com/images/async?q={0}&first={1}&count=35&relp=35&lostate=r
&mmasync=1&dgState=x*175_y*848_h*199_c*1_i*106_r*0'
2）通过selenium来实现模拟鼠标操作来进行翻页，这一点会在Google图片爬取的时候进行讲解。
2、每个网站应用的图片加载技术都不一样，对于静态加载的网站爬取图片非常容易，因为每张图片的url都直接显示在网页源码中，找到每张图片对应的url即可使用urlretrieve()进行下载。然而对于动态加载的网站就比较复杂，需要具体问题具体分析，例如google图片每次就会加载35张图片（只能得到35张图片的url），当滚动一次后网页并不刷新但是会再次加载一批图片，与前面加载完成的都一起显示在网页源码中。对于动态加载的网站我推荐使用selenium库来爬取。
对于爬取图片的流程基本如下（对于可以通过网址实现翻页或者无需翻页的网站）：
1. 找到你需要爬取图片的网站。（以必应为例）
2. 使用google元素检查（其他的没用过不做介绍）来查看网页源码。
3. 使用左上角的元素检查来找到对应图片的代码。
4. 通过观察找到翻页的规律（有些网站的动态加载是完全看不出来的，这种方法不推荐）
从图中可以看到标签div，class=’dgControl hover’中的data-nexturl的内容随着我们滚动页面翻页first会一直改变，q=二进制码即我们关键字的二进制表示形式。加上前缀之后由此我们才得到了我们要用的url。
5. 我们将网页的源码放进BeautifulSoup中，代码如下：
url = 'http://cn.bing.com/images/async?q={0}&first={1}&count=35&relp=35&lostate=r&mmasync=1&dgState=x*175_y*848_h*199_c*1_i*106_r*0' agent = {'User-Agent': "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/31.0.165063 Safari/537.36 AppEngine-Google."}
page1 = urllib.request.Request(url.format(InputData, i*35+1), headers=agent)
page = urllib.request.urlopen(page1)
soup = BeautifulSoup(page.read(), 'html.parser')
我们得到的soup是一个class ‘bs4.BeautifulSoup’对象，可以直接对其进行操作，具体内容自行查找。
首先选取我们需要的url所在的class，如下图：
波浪线是我们需要的url。
我们由下面的代码得到我们需要的url：
if not os.path.exists("./" + word):#创建文件夹 os.mkdir('./' + word) for StepOne in soup.select('.mimg'):
link=StepOne.attrs['src']#将得到的<class 'bs4.element.Tag'>转化为字典形式并取src对应的value。 count = len(os.listdir('./' + word)) + 1 SaveImage(link,word,count)#调用函数保存得到的图片。
最后调用urlretrieve（）函数下载我们得到的图片url，代码如下：
try:
time.sleep(0.2)
urllib.request.urlretrieve(link,'./'+InputData+'/'+str(count)+'.jpg') except urllib.error.HTTPError as urllib_err:
print(urllib_err) except Exception as err:
time.sleep(1)
print(err)
print("产生未知错误，放弃保存") else:
print("图+1,已有" + str(count) + "张图")
这里需要强调是像前面的打开网址和现在的下载图片都需要使用try except进行错误测试，否则出错时程序很容易崩溃，大大浪费了数据采集的时间。
以上就是对单个页面进行数据采集的流程，紧接着改变url中｛1｝进行翻页操作继续采集下一页。
数据采集结果如下：
有问题请留言。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务。
如果您想订阅本博客内容，每天自动发到您的邮箱中， 请点这里
如何从众多的设计点中找到一个清晰的设计主线呢？只需从3个方面切入。小明的设计故事：身为设计师的小明，刚刚遇到下发的设计需求，看了半天需求，无从下手。于是疯狂寻找竞品去借鉴，去素材网站寻找素材拼凑。
如果在设计工作中遇到与小明相同的情况：没有设计头绪，大脑一片空白，画着不一定能过审的草稿时，请继续阅读下面的文章，希望大家能从作者的设计总结中有所启发。
目录：
什么是设计点？
设计点是设计师通过设计手段介入设计任务的一个节点，比如：设计目标 、设计风格 、用户行为 、用户情绪 、信息表达等都是设计的切入点，设计点能够影响设计的风格走向和设计师的创作思路。
那如何从众多的设计点中找到一个清晰的设计主线呢？只需从3个方面切入。
下图是阿里巴巴UED 的设计理论，同程序员提倡的「不造重复的轮子」一样，设计理论也没有必要去反复总结类似的。目前阿里的这个设计理论，很好的支持了包含大型项目到中型项目的各个环节，易于理解，且和我们的工作认知贴近，是一个很好的入门方法。
我们通过定义业务目标和聚焦设计目标，来最终实现设计的产出。
下图是平台营销活动的设计5个要义，其核心也是业务目标。
通过几个的设计方法的展示，我们可以看出，处于上游业务目标的重要性。
只有业务目标和设计目标一致的时候，我们的设计工作才有意义。当我们评判我们的设计结果时，除了设计的数据指标外，能快速判断设计方案比迭代之前更优的指标就是是否符合业务目标，是否更贴近用户的诉求。
1. 切入模型
根据工具模型我们从业务目标出发，去定义设计目标从而得出设计方向。
2. 明确业务诉求
3. 得出业务目标
用分享讲义的策略给用户带来学习交流机会和学习成就感，达到拉新和活跃用户目的。
4. 视觉推导
5. 案例
视觉设计师，尤其是运营设计师一定要具有交互思维，作为全链路设计目标的我们，掌握交互思维，能更好的理解产品文档和规避更多的设计错误，从而准确引导用户操作路径。
方法：了解页面中的功能交互流程，梳理用户操作行为路径，可以对行为步骤中的信息内容进行归类分组提供依据。
切入模型：
常见的方法有：情感化、原子化、组件化、游戏化等等。
方法：分解设计需求，归纳设计模块，运用已知的设计类型进行视觉化设计。
1. 提取仪式感设计点-晒成绩项目
仪式感的作用：通过用户在体验过程中由产品功能实现—交互操作—体验心理变化建立，形成对价值观的建立，是给用户带来更高层次的享受。
从四个层面理解仪式感：权威感、尊重存在感、期待感、荣誉感的意义。通过分解设计内容来发现机会点，插入仪式感设计方法。
视觉推导：
案例：
2. 提取情感化设计点
情感化设计3要素：
案例：
3. 提取游戏化设计点
将游戏机制运用于非游戏场景。比如：要想鼓励用户多参与交互，你可以在 APP 加入「挑战」这类的游戏元素，用户可以参与挑战，通过连续抽奖，并获得相应奖赏，从而达到预期目的。
案例：
寻找设计点就是拆解与分析的过程。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务。
如果您想订阅本博客内容，每天自动发到您的邮箱中， 请点这里
专注于做好一件小事，哪怕是做不好也用心去做，小到搭建一个精美的网格系统，做好一个字体的拐角……先看一下我的往期设计案例。
对于很多刚接触字体设计的同学经常会遇到一种情况那就是想法高大上，结果很悲伤，为什么会造成这样的结果？归根结底是对字体设计本身了解还不够细致就照葫芦画瓢直接上，为了避免这种尴尬的结果，我们应该在开始着手做字体之前要做好各项准备工作，不断去浏览优秀的字体设计从中寻找设计的感觉，确定感觉后建立网格系统，开始逐步设计字体。我在做字体设计的时候会把握几个步骤「建网格」——「选字体」——「拆字体」——「绘笔画」——「绑骨架」——「粗与细」——「取与舍」——「磨细节」——「去感受」。
下面我们就以大家最常见的矩阵字体为例来给大家分享如何制作字体。
1. 建网格
建立网格系统，万丈高楼平地起，要做一款扎实的字体离不开网格系统的规范。
2. 拆字体
以「燃」为例——选取一个默认字体，按照字体结构对笔画进行拆分。
3. 绘笔画
将拆分出的笔画用横线和竖线在网格系统里进行笔画重绘，此时不要做细节，撇、捺和点根据自身走向和结构特点也归属为横竖线。
4. 绑骨架
拆分绘制的字体笔画就是字体的骨骼，笔画间的连接处可以理解成是人体的关节，关节的意义在于保证字体稳固的同时又灵活多变，字体的笔画可以根据视觉需要围绕关节在一定范围内做活动，也可调整长短比例。
5. 粗与细
笔画的粗细与硬度由你想要的字体气质来决定，细笔画与曲笔画柔美气质，粗笔画与直笔画沉稳大气，虽说设计是一种感觉，但是这种感觉对于初学者来说很难把控，所以跟大家共享一下常用的几种笔画的粗细，在1000PX*1000PX画板里采用6px，10px和20px为基础笔画粗细，根据想要的业务气质选取即可。
6. 解与构
常见的字体结构有「上下结构」「上中下结构」「左右结构」「左中右结构」「半包围结构」和「全包围结构」。其中「上下结构」中着重强调占比较小的那部分笔画，进而达到字体本身的平衡，例如「感」字着重设计心字；「上中下结构」中一般会在不影响识别性的前提下去掉中间部分横行笔画，进而达到字体本身的平衡，例如「享」字着重设计口字；左中右结构中在不影响识别性的前提下会简化左边部分笔画，进而达到字体本身的平衡，例如「燃」字着重设计火字。
7. 取与舍
笔画变粗后整个字体笔画间的空间比例会受到一定影响，因此为了字体的美观度和透气性我们会对字体结构进行一些取舍和整合。
8. 磨细节
为了让字体看起来更加舒适，我们将字体的拐角做圆，做圆角的同时也要根据网格系统来调整圆的度数。
9. 去感受
打磨整体字体，继续刻画细节。
注意：在一组字里，每个单字的结构都存在差异，适当调整字体内部的比例，形成感官上舒适的笔势，对保持视觉上大小一致很重要。汉字字体类型繁多，但是如果我们用几何法则来划分字体类型其实大致可以归纳为三种：方形，圆形和三角形，从面积上来看方形和圆形的面积最大，三角形次之，所以我们为了保持字重大小的一致性需要调整他们之间的大小比例，做到大小均匀，笔画一致，结构严谨和间隙适中。
△ 图源：ElethomHunter
为了拉出字体的气质，一般会把字体做的稍微偏瘦长一些。
字体设计的手段是多种多样的，每个设计师都有自己擅长的切入点，最后的结果是自己想要的就好。上述的分享希望能给字体设计初学者一点帮助，也欢迎各位同行大神交流切磋。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务。
如果您想订阅本博客内容，每天自动发到您的邮箱中， 请点这里
JS页面代码段：
-
const app = getApp()
-
let goodsList = [
-
{ actEndTime: '2018-07-21 21:00:34' },
-
{ actEndTime: '2028-07-17 21:00:37' },
-
{ actEndTime: '2018-09-21 05:00:59' },
-
{ actEndTime: '2018-08-19 07:00:48' },
-
{ actEndTime: '2018-08-28 03:00:11' }
-
]
-
Page({
-
-
data: {
-
countDownList: [],
-
actEndTimeList: []
-
},
-
-
onLoad: function () {
-
let endTimeList = [];
-
// 将活动的结束时间参数提成一个单独的数组，方便操作
-
goodsList.forEach(o => { endTimeList.push(o.actEndTime) })
-
this.setData({ actEndTimeList: endTimeList });
-
// 执行倒计时函数
-
this.countDown();
-
},
-
-
//当时间小于两位数时十位数补零。
-
timeFormat: function (param) {//小于10的格式化函数
-
return param < 10 ? '0' + param : param;
-
},
-
-
//倒计时函数
-
countDown: function () {
-
// 获取当前时间，同时得到活动结束时间数组
-
let newTime = new Date().getTime();//当前时间
-
let endTimeList = this.data.actEndTimeList;//结束时间的数组集合
-
let countDownArr = [];//初始化倒计时数组
-
-
// 对结束时间进行处理渲染到页面
-
endTimeList.forEach(o => {
-
let endTime = new Date(o).getTime();
-
let obj = null;
-
// 如果活动未结束，对时间进行处理
-
if (endTime - newTime > 0) {
-
let time = (endTime - newTime) / 1000;
-
// 获取天、时、分、秒
-
let day = parseInt(time / (60 * 60 * 24));
-
let hou = parseInt(time % (60 * 60 * 24) / 3600);
-
let min = parseInt(time % (60 * 60 * 24) % 3600 / 60);
-
let sec = parseInt(time % (60 * 60 * 24) % 3600 % 60);
-
obj = {
-
day: this.timeFormat(day),
-
hou: this.timeFormat(hou),
-
min: this.timeFormat(min),
-
sec: this.timeFormat(sec)
-
}
-
} else {//活动已结束，全部设置为'00'
-
obj = {
-
day: '00',
-
hou: '00',
-
min: '00',
-
sec: '00'
-
}
-
}
-
countDownArr.push(obj);
-
})
-
//每隔一秒执行一次倒计时函数， 渲染
-
this.setData({ countDownList: countDownArr })
-
setTimeout(this.countDown, 1000);
-
}
-
})
wxml页面代码段
-
<view class='tui-countdown-content' wx:for="{{countDownList}}" wx:key="countDownList">
-
距结束
-
<text class='tui-conutdown-box'>{{item.day}}</text>天
-
<text class='tui-conutdown-box'>{{item.hou}}</text>时
-
<text class='tui-conutdown-box'>{{item.min}}</text>分
-
<text class='tui-conutdown-box tui-countdown-bg'>{{item.sec}}</text>秒
-
</view>
-
wxss页面代码段
-
page{
-
background: #f5f5f5;
-
}
-
.tui-countdown-content{
-
height: 50px;
-
line-height: 50px;
-
text-align: center;
-
background-color: #fff;
-
margin-top: 15px;
-
padding: 0 15px;
-
font-size: 18px;
-
}
-
.tui-conutdown-box{
-
display: inline-block;
-
height: 26px;
-
width: 26px;
-
line-height: 26px;
-
text-align: center;
-
background:#ccc;
-
color: #000;
-
margin: 0 5px;
-
}
-
.tui-countdown-bg{
-
background: red;
-
color: #fff;
-
}
-
-
.container{
-
width: 100%;
-
display: flex;
-
justify-content: center;
-
}
-
.backView{
-
width:690rpx;
-
background: #fff;
-
display: flex;
-
flex-direction: column;
-
margin-bottom: 30rpx;
-
}
-
.createDate
-
{
-
background: #f5f5f5;
-
padding:15rpx 15rpx 10rpx 15rpx;
-
line-height: 50rpx;
-
font-size: 28rpx;
-
color: gainsboro;
-
text-align: center;
-
}
-
.backViewitem1{
-
-
display: flex;
-
flex-direction: row;
-
height: 55rpx;
-
align-items: center;
-
padding:8rpx 40rpx;
-
border-bottom: 2rpx solid #f5f5f5;
-
}
-
.ico
-
{
-
width:35rpx;
-
height:35rpx;
-
}
-
.name
-
{
-
color: #c13176;
-
margin-left: 20rpx;
-
font-size: 28rpx;
-
}
-
-
.details
-
{
-
font-size:24rpx;
-
letter-spacing: 2rpx;
-
-
}
-
.backViewitem2{
-
-
display: flex;
-
flex-direction: row;
-
line-height: 35rpx;
-
min-height: 70rpx;
-
padding: 15rpx 40rpx 10rpx 40rpx;
-
border-bottom: 2rpx solid #f5f5f5;
-
}
-
.details1
-
{
-
color:#888;
-
font-size:23rpx;
-
letter-spacing: 2rpx;
-
-
}
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务。
如果您想订阅本博客内容，每天自动发到您的邮箱中， 请点这里
一、什么是跨域访问
举个栗子：在A网站中，我们希望使用Ajax来获得B网站中的特定内容。如果A网站与B网站不在同一个域中，那么就出现了跨域访问问题。你可以理解为两个域名之间不能跨过域名来发送请求或者请求数据，否则就是不安全的。跨域访问违反了同源策略，同源策略的详细信息可以点击如下链接：Same-origin_policy；
总而言之，同源策略规定，浏览器的ajax只能访问跟它的HTML页面同源（相同域名或IP）的资源。
JSONP(JSON with Padding)是JSON的一种“使用模式”，可用于解决主流浏览器的跨域数据访问的问题。
由于同源策略，一般来说位于 server1.example.com 的网页无法与不是 server1.example.com的服务器沟通，而 HTML 的<script> 元素是一个例外。利用<script>元素的这个开放策略，网页可以得到从其他来源动态产生的 JSON 资料，而这种使用模式就是所谓的 JSONP。用 JSONP 抓到的资料并不是 JSON，而是任意的JavaScript，用 JavaScript 直译器执行而不是用 JSON 解析器解析。更具体的原理需要更多篇幅的讲解，小伙伴可以自行去百度。
JQuery Ajax对JSONP进行了很好的封装，我们使用起来很方便。前端示例：
$.ajax({
type:"GET",
url:"http://www.deardull.com:9090/getMySeat", //访问的链接 dataType:"jsonp", //数据格式设置为jsonp jsonp:"callback", //Jquery生成验证参数的名称 success:function(data){ //成功的回调函数 alert(data);
},
error: function (e) { alert("error");
}
});
需要注意的地方是：
后端要配合使用jsonp，那么首先得了解Jquery Ajax jsonp的一个特点：
Jquery在发送一个Ajax jsonp请求时，会在访问链接的后面自动加上一个验证参数，这个参数是Jquery随机生成的，例如链接
http://www.deardull.com:9090/getMySeat?callback=jQuery31106628680598769732_1512186387045&_=1512186387046
中，参数callback=jQuery31106628680598769732_1512186387045&_=1512186387046就是jquery自动添加的。
添加这个参数的目的是唯一标识这次请求。当服务器端接收到该请求时，需要将该参数的值与实际要返回的json值进行构造（如何构造下面讲解），并且返回，而前端会验证这个参数，如果是它之前发出的参数，那么就会接收并解析数据，如果不是这个参数，那么就拒绝接受。
需要特别注意的是这个验证参数的名字（我在这个坑上浪费了2小时），这个名字来源于前端的jsonp参数的值。如果把前端jsonp参数的值改为“aaa”，那么相应的参数就应该是
aaa=jQuery31106628680598769732_1512186387045&_=1512186387046
知道了Jquery Ajax Jsonp的原理，也知道了需要接受的参数，我们就可以来编写服务器端程序了。
为了配合json，服务器端需要做的事情可以概括为两步：
根据与前端Ajax约定的jsonp参数名来接收验证参数，示例如下（使用SpringMVC，其他语言及框架原理类似）
@ResponseBody @RequestMapping("/getJsonp") public String getMySeatSuccess(@RequestParam("callback") String callback){
将接收的的验证参数callback与实际要返回的json数据按“callback(json)”的方式构造：
@ResponseBody
@RequestMapping("/getMySeat") public String getMySeatSuccess(@RequestParam("callback") String callback){
Gson gson=new Gson(); //google的一个json工具库 Map<String,String> map=new HashMap<>(); map.put("seat","1_2_06_12"); return callback+"("+gson.toJson(map)+")"; //构造返回值 }
最终，前后端的相应代码应该是这样的：
前端
$.ajax({
type:"GET",
url:"http://www.deardull.com:9090/getMySeat", //访问的链接 dataType:"jsonp", //数据格式设置为jsonp jsonp:"callback", //Jquery生成验证参数的名称 success:function(data){ //成功的回调函数 alert(data);
},
error: function (e) { alert("error");
}
});
后端
@ResponseBody
@RequestMapping("/getMySeat") public String getMySeatSuccess(@RequestParam("callback") String callback){
Gson gson=new Gson(); Map<String,String> map=new HashMap<>(); map.put("seat","1_2_06_12");
logger.info(callback); return callback+"("+gson.toJson(map)+")";
}
需要注意的是：
完整的示例就是上面两段代码，这里就不提供Github连接了。上面的示例亲测有效，如果有遇到问题的，欢迎留言提问。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务。
对于大部分的射击湿以及设计团队来讲，都会遇到如何提升设计效率的问题；尤其是在创业公司，最浪费时间的莫过于：永远撸不完的图及与开发中的设计反复；接下来我将通过自身的一些设计管理经验，从工具使用提升工作效率的角度，跟大家分享下我解决这两个问题的方法。
撸不完的图-处理各方设计需求
1、设计的需求方在不断增多：产品、运营、市场、地推、策划等等；
对于大部分的射击湿来说，设计的需求都是越来越多的；尤其是中小型公司由于发展的的需要，公司的人员及部门会越来越多；也就导致后期的设计需求慢慢增加；我们公司就是酱紫的，原来只要考虑产品需求的，现在要考虑运营日常海报、活动设计、市场推广素材、线下门店品牌视觉系统、还有老板的PPT等等。
2、需求不清导致变动频繁：没有目的下需求，缺少需求细节；
在日常的工作中，最麻烦的就是跟需求方确认需求；尤其是口述的需求，没有文案、时间节点及具体的需求描述；比如，我要“五彩斑斓的黑”或者“字要大”这种奇葩需求想一出就是一出的随性需求。
3、对接、确认流程不清晰：没有一套完整有效的对接流程，导致双方扯皮；
二、产生的问题？
1、设计效率及产出质量不高：需求方不满意，然后设计反复浪费时间；
2、项目推进速度变缓：有限的时间达不到设计要求拖慢项目进度，影响业务目标；
1、建立和规范有效的需求对接确认流程：从制度层面解决跨部门协调问题；
首先，对内规范接收和分发需求的流程；将原来粗放的接收方式改为协作工具接收分发需求；其次，对外规范需求下方的格式规范。
2、使用“团队协作工具”统一输入/输出需求：运用工具解决需求接收下放问题；
3、规范需求方下需求的格式：需求包含的各项要点：
时间节点：最好提前几天；
需求描述：需要什么样的；
文案描述：传达什么内容。
1、工具不统一，协作较难：PS与Sketch混用；
我刚进公司的时候，设计团队的三个人用的设计工具和设备都不一样；有的用PS，有的用Sketch，这就造成设计协作难而且设计稿输出格式不同意，开发抱怨的情况，工作推进艰难。
2、标注切图耗时太长：页面中的各个元素都要进行大小、颜色、间距及格式的标注；
设计给开发的输出物有三种：视觉稿、标注及安卓、IOS不同尺寸的切图；以上是保证上线效果的关键；但是传统的手动标注和切图是很浪费时间的。
3、IOS、安卓设计规范差异：两个平台系统差异，有时候要输出两套设计素材；
1、统一设计工具：移动端的设计统一Sketch输出；
2、利用第三方工具Zeplin自动标注设计稿：工具代替原来的手动标注；
3、工具zeplin工具的优势：
自动匹配IOS及安卓平台设计单位、颜色及字体大小等；
设计一套搞定，减少设计师工作量；
设计沟通的效率和质量大大提升；
以上就是我在做设计管理过程中摸索的一些的经验，无论是跟需求方的设计沟通还是和开发的协同配合，都非常的和谐；希望通过此次分享能给遇到相同困惑的小伙伴们一些启发~
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
夜月薰衣茶 PMIP
如何处理需求，是产品经理的基本功，不管是来自老板还是客户的，亦或来自企业内部（运营、业务）及产品本身的发展，产品经理都需要把需求的收集、分析、管理做到有效进行。
一、需求收集
用户调研
运用场景：
产品规划初期或者遇到重大版本迭代，需要重新架构设计时，将会进行用户问卷、用户访谈的方式去挖掘用户的真实需求。
基本方法:
用户问卷-定量研究的方法，问卷问题一般为15个左右，包含用户基础资料信息（包括年龄、收入、教育水平等人口统计学范畴信息）和主观性的信息（包括用户做这项活动的态度、行为、目的等方面的信息）两大部分，收集到这些数据后进行分析并得出一定结论。
用户访谈-定性研究方法，访谈问题分类包括开放性的问题和专业性的问题。问题尽量从简单到复杂，由较宽泛趋于精细；访谈的过程中的问题尽量说的简单易懂，避免专业词汇，让回答问题的用户清楚明白你说什么；避免问一些引导性的问题；不要因为冷场而尴尬过多，多次重复进行讲解，留有一定的时间让用户思考如何回答；尽量问用户一些开放性的问题让用户进行思考回答；用户描述的过程中尽量描述真实使用场景与案例。
两种方法基本为相互补充进行的一个方法，对于不熟悉的业务，问卷编写初期不知该如何进行挖掘用户的问题，寻找五个左右的用户进行相关业务及主要业务用户使用场景访谈，将会总结出一些问题然后加入你要调研清楚的问题包括客观问题和主观问题进行用户问卷编写、发放与收集。
用户反馈
运用场景：
产品专家用户的反馈，包括运营、客服直接获取用户的反馈，通过从微博、论坛、贴吧、软件用户评论等方面寻找用户的反馈。
基本方法：
市场反馈 做运营、客服、市场等人员和用户进行产品销售推广、运营活动的过程中和用户直接交流，一些专家用户直接反馈出来的需求。具体也要根据产品是直接面向c端客户还是企业级别的客户，两者有很大差异。
访谈 在和用户进行访谈的过程中，一些专家级别的用户直接反馈对现有产品在使用过程中的一些不满和改进的建议等。
查询相关网站 比如产品下载市场、百度贴吧、微博、论坛、微信群、QQ群等各种用户有自由发表言论及感受的地方，用户的直接反馈。
用户直接反馈的信息，需要进行分析其需求的真伪性。
产品定位发展
运用场景：
产品最终要帮用户解决一个什么样的问题，市场发展环境和公司可支配资源等方面进行综合评估产品的前期、中期、后期的目标定位。
基本方法：
相关行业专家询问 在发觉一个新产品及市场时，不明确当前市场状况可直接找行业内的一些专家进行聊天交谈，他们对于市场的现状很熟悉，可向该类专家询问产品的定位与发展方向问题。
投资行业的专家交流 最了解市场、发觉市场前景行业及创业想法的投资者，他们对于市场发展的方向及敏感度有一定的专业看法，可与其交流产品的发展方向性的问题。
相关行业专家、投资专家给予的建议和方向最终还需要结合本身公司的定位发展与界定产品的发展定位。
商业画布 一种能够帮助处于高层决定者激发创意、降低猜测、明确目标用户、合理解决其问题的工具，可直接判断出公司产品发展的的优势、资源等最直接有效的方法。
以下为商业画布九宫格主要内容：
数据分析
运用场景：
产品或运营人员对用户操作规律，用户流失查询等方面进行查看分析，决定产品功能优化迭代最有效直接的证明。
基本方法：
数据埋点 第三方数据服务平台或者用自己平台后台注入相关代码进行统计。程序员在程序编写时将主要操作、按钮进行数据埋点，通过网站即可查询相关数据。
第三方数据平台 专业做数据的网站会定期进行相关行业数据的发布，查看专业的报告即可获取一些相关数据。
结论
针对收集的需求，大致可分为以下几类:
产品运营类—某项调研结果直接反应出一种现象，将会指导产品运营人员的运营方向朝着这方面努力。比如一款产品预约功能，从团队做用户问卷的结果反馈中，用户更偏向于用微信公众号进行预约，运营团队需要相对在微信公众号预约增加相对的运营的投入。
功能优化类—用户使用某款产品的某个功能目的就是为了达到其某个目的，对于功能效率或用户体验上满足，将会直接影响用户的去留，优化该功能的用户体验满意度及效率将会提升用户的留存量。
新功能—产品功能的延伸或新增，通过用户研究，发现用户针对某个需求的实现很迫切，该需求就算新功能，可评估该功能紧急程度及效果进行功能设计满足。
二、需求分析
重要度、频率二维度
运用场景：
当接到多个需求，因为时间原因，只能进行个别需求满足，评估优先级时，可用该方法进行简单需求评估分析。
基本方法：
将功能需求按照重要度和频率进行四象限划分，重要高频象限中的需求要首先进行解决。重要度和频率如何进行衡量，频率衡量即使用的频次，重要度衡量判别是否会因为该需求的缺少而影响用户使用。
KANO模型分析
运用场景：
产品重大版本迭代，因为时间等问题，只能选择个别两三个功能进行优化，但是优化的需求点比较多，可以直接向用户进行问题编辑，查看用户满意度选择进行优化。
基本方法：
(1)从顾客角度认识产品或服务需要；
(2)设计问卷调查表；
(3)实施有效的问卷调查；
(4)将调查结果分类汇总，建立质量原型；
(5)分析质量原型，识别具体测量指标的敏感性
二维属性归属分类
场景化思维
运用场景：
通过模拟或发现真实场景，预测用户行为从而进行设计。
基本方法：
从交互五要素考虑，人、目的、行为、环境、媒介几个关键点去创造用户真实的使用场景。在什么地方，哪个人做了什么事，运用了哪些东西，达到了什么样的目的，遇到了什么样的问题，怎么进行处理解决。例:在淘票票购买电影票后，付款时推荐购买零食信息。
用户体验地图
运用场景：
适用于任何场景，更适合在可能存在问题或者改进机会的事件上。
基本方法：
归纳用户该使用场景下的触点
画出情感坐标
寻找用户进行触点体验情感、意见描述
归纳用户体验意见
绘制情感曲线
标注用户重要性意见
需求分析的方法很多种，以上仅列出部分，方法只是分析的一种工具，最主要还是通过方法分析需求得出的解决方案。
三、需求管理
需求提交
简单来说，就是将收集到的需求，在评估完优先级，确认做具体需求功能时将该需求开发计划告知相关开发、测试等人员，让其明确即将完成的功能需求。如功能需求相对应的方案设计、业务流程等内容提前与开发总监沟通好上传至公司统一管理文件处，具体根据不同公司的实际情况。
需求评估
需求功能的相关开发者、测试针对该需求达成统一认知和开发周期认定，使得相关开发人员在开发周期内有效配合开发，测试人员明确该如何进行有效测试，针对同一需求能够有效推进实现。
需求跟踪
在开发过程能够及时跟进开发，一确保其开发功能达到预期效果，二有任何异常情况的发生能及时进行处理解决，三有效把控需求的开发周期，保证需求按期交付。
需求变更
当需求提出方提出需求变更或者在内部评审、开发过程导致需求变更，做好相关需求变更的把控，以防需求变更后导致项目无法执行。
a.评估需求变更与原需求的差异
首先，明确需求变更的原因—是需求提出方进行需求变更还是内部原因导致需求变更。其次，需求变更后与原先需求定义是否有较大冲突，如有较大冲突，评估变更前后的利害关系，哪个更能有效达目的/效果，按评估结果执行；如无较大冲突，评估与原需求的紧急程度及时间安排，进行需求变更解决。最终，有效记录需求变更计划及原因，定期进行总结，评估相关解决方案。
b.评估需求变更导致的结果
如需求变更后，利大于弊，允许变更，但需按照需求变更的规程执行，以防出现意外情况产生不必要的责任，失去相关控制。如需求变更后，利小于弊，拒绝变更.
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
优作|南非开普敦MUTI工作室设计赏析
BIGD
MUTI是一家位于南非开普敦的创意工作室，他们的业务范围非常广，为许多品牌企业都提供过服务，运动品牌如耐克，服装品牌如优衣库，手机品牌如三星，杂志如Monocle 杂志、西捷航空杂志等等都有过他们的影子，同时他们的设计能力综合，从插画到字体设计再到Icon图标设计都十分强大。
WestJet Magazine
The Hound and The Hare
Brown Coffee & Bakery
World Wildlife Magazine
John Hopkins Magazine
Knight Time
Forbes Japan
Georges Magazine
WestJet Magazine
Lonely Planet Magazine
Flying High
Lonely Planet Magazine
一定会成为优秀设计师的朋友们！
最近剧真的太多了，
小编还没从卫龙女孩的队伍里脱离出来，
如懿传就已经安排上了。
而且小编最近又发现一部新剧！
《天盛长歌》
对比《如懿传》大红大绿的配色
（虽然浮夸的色彩更符合乾隆时期的蜜汁审美）
它的配色和画风简直良心的不要！
而且官宣也很佛系，
总之就是没见着过啥大动静，
可是豆瓣评分居然比《延禧攻略》还要高
虽然凭借“IP+超级卡司+大制作”
获得了较高的评分，
但《天盛长歌》自播出后就反响平平，
收视一度扑街，
虽然小编还没看剧不知道它扑街的原因，
但单单从剧照和海报就能看出
剧组是真的下功夫了！！
服装精致，布景豪华，
还专门使用了电影的宽画幅比
场面变得更加宏大更有代入感！
官方发布的色卡看起来也很高级
海报也值得一看~
主题海报
- 壁影成双版海报 -
这世间自有百态浮生，千种际遇，万般辽阔山河。
看似光影阑珊，皆在你我眸间。
微雨细语版海报
感谢这亭外风雨漫天，你我才能在这亭中独处片刻。
此爱隔山海，山可平，海可越；
此义重天地，天有道，地有情。
家国在心，苍生在肩，不敢忘，莫能负。
眸绘天光版海报
天高地阔，可纳日月山河于怀，可藏情深意笃于心。
此念，不灭。
丹心一片，不曾忘情忘恩忘前尘，惟愿守己守家守苍生。
此意，可鉴。
风霜不顾，只求守得云开；此身不吝，但求所愿得偿。
此途，不忘。
趁年华岁月，追随不弃；经世事不易，伴君功成。
此生，不枉。
愿安一隅，享人世繁华；纵有风雨，念郎君顺遂。
此求，可得。
扎心剧照海报
在光影间蓬勃而生，于明暗外纤毫毕现。
君有箴言相赠，吾自铭感于心。
开播倒计时海报
圆融不争，锋霜无畏。一方明镜如水，此情，不负。
距离相遇，还有3天
善恶得报，世存公道。一盏心灯如旧，此志，不改。
距离相识，还有2天。
六合既定，共享安宁。一卷长书如悟，此意，不移。
距离相知，还有1天。
热点节点借势海报
- 七夕 | 天盛七夕节 -
看完这些海报和剧照之后，
你们有没有被吸引到呢？
留言告诉小编吧~
当我们看的PS教程越来越多、掌握的PS技巧越来越多的时候，可能就反思最初看到的教程到底是不是正确的。而今天国外精品翻译教程就跟大家一起来看看Photoshop高手分享的10个Photoshop心得，妥妥的干货！
1.在背景图层上直接编辑
由于PS初学者总会犯些小错误，所以大多数的Photoshop教程都会要求创建副本，然后在副本上进行操作，即使出错都可以迅速回到原点，再次进行操作。不过，如果你已经意识到自己的每一步操作都能令作品更加完美，那就没有需要再回到原点了。
选择“图层>新图层>复制创建新图层”，或者使用快捷键Ctrl+J，就可以很简单地创建副本。但是过多的图层会让图层管理变得困难，特别是要从众多图层中找出目标对象的时候，很费时间。因此，如果有人说创建副本或者弄多几个图层时，其实你需要想想再进行操作。
如果只是对单一背景图层进行操作，就可以完全不管图层面板，以及担心创建副本影响PS运行速度的事情。当然，这听起来很简单，但要改变长期形成的操作习惯以及知道什么时候需要创建副本却不是那么容易的。所以操作前，先想想接下来的动作，尽量避免无用功。
2.用好橡皮擦工具
橡皮擦与图层蒙版的功能比较类似，通过“擦掉”和“遮蔽”，就能将不想要的像素不显示出来。而图层蒙版的优点在于通过改变蒙版颜色的不透明度，达到不同程度的遮蔽效果。所以在大多数情况下都比较建议选用图层蒙版，因为蒙版下的图像仍在，只是被“遮蔽”，只要改变黑色的深浅就将图像显示出来。
图层蒙版的广泛应用例子很多。比如，在使用新增调整图层时，也会发现选择“图层>新增调整图层>”，然后随意选择其中一种调整图层，都会附加一个图层蒙版。
但是，对于橡皮擦来说，它的功能更加直接。想象一下，当你拿着一支笔和一张纸，如果想去掉某些图案，最直接的想法就是擦掉，而擦掉的后果就是原来的图案将永不存在。而在Photoshop中，橡皮擦事实上就延续着我们在实际画画过程中的习惯。
从上面的比较中可以看出，橡皮擦和图层蒙版最大的不同点在于橡皮擦是真实地去掉图像，而蒙版只是遮蔽图像。而蒙版的灵活性同时也是缺点之一，一旦黑色的深浅没有控制好，不能完全遮蔽图像，就会影响整个作品，而橡皮擦是百分之一百去掉的。所以当确定需要完全去掉图像时，请勇敢地选择橡皮擦。
3.不要忘记魔棒工具
关于创建选区，很多人第一时间都会想到钢笔工具、快速选择、套索工具等等，而魔棒工具往往被人们忽略掉。魔棒就如它的名字一样，充满魔力，轻轻一点击，就会自动将与点击位置颜色基本相同的区域选择起来，并且可以通过设置容差值，调整选择范围。在图像存在明显边缘的情况下，魔棒工具可以说是最佳选项。
为了抠图或者创建蒙版，往往需要创建选区，不需要局限在某种抠图手段，根据图像实际情况，选择自己拿手的是最优选项。
4.键盘快捷键会让人错过一些发现
在Photoshop教程中，时常提及通过使用键盘快捷键进行操作。比如，通过复制目标图层来创建新图层，快捷键是Ctrl+J，菜单选择是“图层>新建>通过拷贝的图层”。
使用快捷键的确能提高操作效率，但同时也会让你错过一些学习的机会。当你使用快捷键进行操作的时候，就不会想从主场单中选择“图层>新建”，然后就不会知道存在另外一种方式：“通过剪切的图层”——原图层选区内的像素剪切到新图层中，这里包含了剪切和创建新图层两步操作，而“通过剪切的图层”一步就能完成。
并且Photoshop中还提供了自定义键盘快捷键的功能，选择“编辑>键盘快捷键”，所以不让只是遵循教程提供的一种方法，尝试一下别的，可能会更加有趣。
5.图层样式按需设置
在应用图层样式的时候，会注意到图层样式已经具有默认设置，而且这些默认设置通常“也不差”。因为这些默认设置是Adobe经过长时间研发和改良，并且随着时间的发展也在逐步完善。图层样式中，描边的默认颜色是红色，而现在的颜色是黑色。其实默认图层样式是相对的，它是Adobe长年累月的应用积累得出的。而对于Photoshop使用者，可以在各种教程的指导下，尝试各种设置选项，调试各种效果。
就如下面的文字的投影效果都很漂亮。单从效果是不知道这些漂亮的背后是怎么操作，如果点击打开图层样式就会发现，这些投影都有各自的角度。所以，下次应用图层样式的时候考虑一下实际应用需求。
6.名字只是唤起记忆的符号
在处理数量不多图层时，我们可以不用怎么注意命名。当图层数量越来越多的时候，可以通过删减不必要的图层数量，简化图层结构，然后结合适当的命名方式，进一步优化对图层管理。对于图层命名可能会存在一个误区，就是命名描述得越详细越好。要记住，命名只是一个符号，主要区别于其他图层，具有大致的特征就可以，不然混含颜色、内容描述的命名组合会让人看到发晕。
在Photoshop中，当对一个图层进行命名的时候，按着Tab键就可以对下个图层进行命名，可以说对每个图层命名是很容易的，但并不是没创建都要花一番心血弄个命名体系。就如图层不多的时候，采用默认命名方式“图层1”、“图层2”或者“图层2副本”，就可以满足需求。如果是头条文字图层，可以考虑命名为“背景文字”。当选用素材时，就不用将素材的引用名称都包含到图层命名中，相反可能命名得奇葩一点，可能效果会更加好。
7.PS离不开鼠标
现在你们在用什么滚动翻阅着这篇文章呢，是手机的触摸屏还是鼠标滚轮，或者笔记本上的触控板？在任何情况下，都需要清楚知道屏幕翻动的方式。如今随着输入设备的发展，越来越多教程在推崇试用数位板等压力感应式输入设备。
压力感应式输入设备与鼠标各有各优点。使用触控板或者数位板时，就像画画一样拿起画笔，在Photoshop上画出来。而鼠标虽然已经发明使用很长时间了，但对手掌来说，仍然是最完美的定点设备。如果拿起触控笔，操作方式将会完全跟鼠标不同。
图像是由一个个细小像素组成，在精细度控制方面鼠标具有无与伦比的操作特性，也是触控类输入设备所难以比拟的。因此，在选用输入设备方面建议优先选用鼠标。
8.不要怕高分辨率
有时候我们会听到说图像的分辨率很重要，太小就会显示不清楚，必须采用高分辨率，然后就开始听到关于DPI、PPI的各种解释，就会相信不能随便使用从网上下载的图像，因为它们的分辨率都太低或者尺寸太小。
图像分辨率是指单位英寸中所包含的像素点数。随着图像技术的发展，理论上图像分辨率会越来越大。但是为什么一定要采用高分辨率呢？显示设备的日渐发展是一个原因，另一种结论是网络资源输出的控制。我们都知道图像素材作为一种网络资源，具有它的使用价值。当市场的使用要求比较高的时候，先抛出低质量的资源，再通过一些手段控制高质量资源的输出。
我们不用太多理会策略的东西，只要知道怎么解决就行！下面将会介绍怎么通过Photoshop来克服低分辨率的问题。
Step 1
打开Photoshop，选择“图像>图像大小”，设置图像各自增大200%，勾选重新取样，设置保留细节（扩大）。
Step 2
选择“滤镜>锐化>USM锐化”，设置数量、半径、阀值，将放大产生的模糊或者失真尽量消除。这样图像尺寸就是原来的两倍，并且不需要高分辨率。学会了赶紧试试吧。
9.控制Photoshop的内存使用空间
我们都知道Photoshop对电脑性能要求比较高，对CPU、内存的占用率也是比较大的。在之前的学习中，大家可能也知道一些关于优化性能、提高Photoshop运行效率的技巧。
但是，为什么Photoshop需要占用这么大的CPU和内存呢？除了处理图像之外，Photoshop还可能利用额外的内存或者CPU性能进行画面捕捉、记录行为等。但是这些与我们使用Photoshop基本无关，选择“编辑>首选项>性能”，在内存使用情况的设置框中调节让Photoshop使用的内存空间。让Photoshop使用的内存空间越少，可让PS进行额外记录捕捉的空间就越少。
PS：Photoshop是否进行额外的画面捕捉或者记录就不得而知，但是有个秘密画面可以看一下：关闭PS重新启动，然后按着Ctrl，点击“帮助>关于Photoshop”，这时会出现一个秘密画面。
10.合并图层节省空间
使用Photoshop过程往往会产生巨大的PSD文件。这些PSD文件包含非常多的图层，常占用超大的硬盘空间，如果想将这样的超级文件发送给其他人，基本上不用考虑E-mail，如果扔到U盘或者移动硬盘传输，就要慢慢等着进度条爬满。
合并图层工具作为一个不完全的解决方案，可以将PSD超级文件缩减为小文件。要注意合并过程会将隐藏图层扔掉哦。
下面是一个简单的例子：原PSD文件399MB，经过合并后，体积缩小至27.8MB，缩减比例达到93%，并且出图质量与原文件相差无几，有需要的朋友要记住了哦！
小结
本期的国外精品PS教程就到这里结束啦。文章提及的小技巧虽然比较简单，但是对我们拓展Photoshop使用思路是有一定的帮助，特别是对一些PS工具的使用方法上也会有新的了解。感兴趣的朋友可以记录下来，一一练习吸收。希望大家能通过这次的PS教程进一步提高PS技能，打造出更加出色的作品。
图00
图01
图02
图03
图04
图05
图06
图07
图08
图08
图09
图11
图12
图13
图14
图15
图16
图17
图18
图19
图20
图21
图22
图23
图24
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务
蓝蓝 http://www.lanlanwork.com