某产品dnf任务完成券100件,完成0.8元/件,超出部分没讲奖励2元,公式怎么设

y上面有个 ^
在图片上看到的位置,^这个符号要使用软键盘里面的特殊符号来填
其他答案(共7个回答)
(点击图片放大更清晰):
答: 把硬币弄潮湿,地上滚一圈,量痕迹~~
一跟细线绕硬币一周,然后把线展开,用直尺测量线的长度~
问造币公司去,他会告诉你准确的数据~~~~
答: 老师主动,多让学生背,思考,不学也得逼着,以后他们就知道对不对了
答: 这叫什么啊,没题目
答: 中国人的数学理应比外国人好! 这是我的个人观点,这在于中国人对数字的发音是单音,因此,对数字的记忆较为简单,提高了学习数学的效率!
而科学的发展,往往受制于社会...
大家还关注
Copyright &
Corporation, All Rights Reserved
确定举报此问题
举报原因(必选):
广告或垃圾信息
激进时政或意识形态话题
不雅词句或人身攻击
侵犯他人隐私
其它违法和不良信息
报告,这不是个问题
报告原因(必选):
这不是个问题
这个问题分类似乎错了
这个不是我熟悉的地区2000件以下1元/件;件1.5元/件;3000件以上2元/件,怎么设公式_百度知道
2000件以下1元/件;件1.5元/件;3000件以上2元/件,怎么设公式
我有更好的答案
用IF函数:在数量所在单元格(以A3单元格为例),在右侧B3单元格内输入:=IF(A3&,IF(A3&*A3,2*A3))回车,再下拉复制即可。
采纳率:58%
来自团队:
x, 2000&x&01.5*x, 3000≧x≧20002*x, x&3000
为您推荐:
其他类似问题
换一换
回答问题,赢新手礼包
个人、企业类
违法有害信息,请在下方选择后提交
色情、暴力
我们会通过消息、邮箱等方式尽快将举报结果通知您。EXCEL中用函数考核任务量达成率低于80%(含),得0分;任务量达成率高于80%按线性计算 120%封顶_百度知道
EXCEL中用函数考核任务量达成率低于80%(含),得0分;任务量达成率高于80%按线性计算 120%封顶
要做考核打分,EXCEL中这个公式怎么写?考核任务量达成率低于80%(含),得0分;任务量达成率高于80%按线性计算,120%封顶,菜鸟求救
我有更好的答案
100%对应100分的话,楼上的公式修改下:=IF(A1&0.8,0,if(a1&=1.2,100*(a1-0.8)/0.2,&超出区域&))(注:0.4-&0.2即可,另外120%封顶,因此应该将 & 1.2修改成 &= 1.2)
采纳率:25%
假如达成率在A1那么公式为=IF(A1&0.8,0,if(a1&1.2,100*(a1-0.8)/0.4,&超出区域&))下拉填充。
不好意思我比较白痴,这上面的数字看来,达成率100%只能得到50分的意思吗?假设满分是10分呢?
您好,您的要求不是,按线性计算,120%封顶么?如果100%是满分,那么120%算多少分呢?如果满分是10分,那么公式改为:=IF(A1&0.8,0,if(a1&1.2,10*(a1-0.8)/0.4,&超出区域&))
本回答被网友采纳
为您推荐:
其他类似问题
您可能关注的内容
excel的相关知识
换一换
回答问题,赢新手礼包
个人、企业类
违法有害信息,请在下方选择后提交
色情、暴力
我们会通过消息、邮箱等方式尽快将举报结果通知您。甲产品本月完工产品产量1000件,在产品200件,完工程度按平均50%计算;_百度知道
甲产品本月完工产品产量1000件,在产品200件,完工程度按平均50%计算;
甲产品本月完工产品产量1000件,在产品200件,完工程度按平均50%计算;原材料在开始时一次投入,其他费用按约当产量比例分配。甲产品本月月初在产品和本月耗用直接材料费用共计72000元,直接人工费用33000元,燃料动力费用89100元,制造费用30800元。
我有更好的答案
1、在产品约当产量=在产品数量*完工程度2、单位成本=(月初在产品成本+当月发生生产成本)/(产成品产量+月末在产品约当产量)3、产成品成本= 单位成本*产成品产量4、月末在产品成本= 单位成本*在产品约当产量因此在产品成本的约当产品产量=200*50%=100件单位成本=(+)/.45月末在产品成本=204.45*100=20445月末完工产品成本=204.45*
采纳率:89%
为您推荐:
其他类似问题
在产品的相关知识
换一换
回答问题,赢新手礼包
个人、企业类
违法有害信息,请在下方选择后提交
色情、暴力
我们会通过消息、邮箱等方式尽快将举报结果通知您。发布者: mobileui
大家好,这个系列打算开始和大家讨论一下SVG。
关于SVG大家应该都有过了解吧?
什么,你不知道什么是SVG?
可缩放矢量图形(Scalable Vector Graphics,SVG),是一种用来描述二维矢量图形的XML 标记语言。 简单地说,SVG面向图形,XHTML面向文本。
SVG与Flash类似,都是用于二维矢量图形,二者的区别在于,SVG是一个W3C标准,基于XML,是开放的,而Flash是封闭的基于二进制格式的。因为都是W3C标准,SVG与其他的W3C标准,比如CSS, DOM和SMIL等能够协同工作。
既然要讲SVG,那从哪里开始呢?
就从PSD开始吧。
1.如何从PS中导出SVG
啊?从这么基础的开始?
要玩SVG,首先需要先有SVG文件。
大部分情况下,我们拿到的PSD是这样子的:
而SVG长这样的:
这就是传说中上天入地无所不能的SVG吗?!!!!
那些跟虫子一样的数字是要一个字一个字写上去吗????要是出错了,还要一个个字符比对过去吗????老师没教过SVG这么恐怖啊
SVG实际应用不多,是有道理的!
好,本文到此结束,大家散了吧
下面开始讲如何将从PS中导出SVG。
首先,SVG当然不用一个字一个字的去填那些虫子一样的数字了啊!真要那样,SVG没写完,人先疯了。
但是我们这样的PSD要怎么转换成SVG?
先看下我们需要的部分
看这边,我们要的是这个彩色带子,不是人物剪影哈
看这边,我们要的是这个彩色带子,不是人物剪影哈
看看图层界面
如果PSD里是这种状态的话,那么由这个PSD得到SVG就只要10分钟。
仔细观察,这种PSD它有我们所需要最重要的元素,路径!
这就是直接生成SVG的核心部件了。
接着我们需要除PHOTOSHOP外的另一个软件ILLUSTRATOR。
网上也有一些其他导出svg的教程,比如photoshop cc,photoshop 导出svg插件,但是目前我并没有实验成功过,总之下载个AI没错的。
现在开始,见证奇迹的10分钟:
嗯哼,现在开始,见证奇迹的10分钟:
邮件复制所有需要的路径图层到新文档中,并进行裁切
另存为EPS文件,EPS选项取默认值就好,其他选项对我们所需要的部分影响不大
在AI中打开EPS,适当的进行缩放,并编辑画板,保证将所有的路径包含在画板中
对齐左上角,另外svg图形大小不影响图片体积,因为svg是矢量图,对齐左上角之后可以随意对SVG进行缩放,以方便输出后的显示。(画板大小就是最后导出的svg的大小也就是&svg&的width和height属性)
另存为svg,选项依然默认
现在,看一下我们得到的SVG
这是SVG?打开SVG文件看下:
好像没啥毛病。代码部分:
实际上这个SVG里只有&path&的部分是我们所需要的,多余的那些jpg也可以删掉。
这里简单的写个过滤path工具,可以快速过滤出&path&标签。
转换后稍微整理一下格式,代码基本上是这样的
很好,看一下结果吧
颜色呢?!!颜色哪去了?!
10分钟好像到了,这次的课程就到这里。
颜色自己去fill啊,10分钟就做完了,不怕需求不饱和吗?
好,在style里加个path{fill:#f00;}就有颜色了
&path&可以使用css来进行控制,想要不同的颜色,可以针对不同的path进行设置。
颜色信息会丢失的确是这个导出的方法的弊端。
可以的话,尽可能使用AI进行SVG绘制并导出。
2.PS导出SVG的另一种方法
如果我们需要的图形的图层并不是路径,该怎么办?
比如这个樱木的人影
先ctrl加左键点击图层,获取图层轮廓
选择线框工具
然后右键选区,建立工作路径,容差可根据实际情况调整
然后直接导出路径到AI就好了,不需要先转为EPS
当然导出的AI一样也是没有颜色信息的
这两种方法的区别是,EPS可以批量导出多个路径,第二种方法一次只能导出一个路径。
最后是AI导出SVG的方法。
3.从AI中导出SVG
从AI中导出在前面已经讲过,只要对齐左上角的点,然后另存为SVG就好了。
而AI中的画板大小决定了导出的SVG的绘制区域大小。
不过如果从AI中直接导出SVG,而不是从PS转换而来,有个点就要注意,那就是AI导出来的SVG图形并不都是&path&
好多不认识的标签呢……
………………
是这样的,你试着右键然后“建立复合路径”,然后再另存为SVG
哎呀妈呀,我那么多图形只剩一个path了!!!!
冷静!!!
要不试试单独对每一个图形进行“建立复合路径”,然后再另存为SVG
好了,都变成&path&了
至于为什么我们要把图形都转为&path&,之后的文章会提到
这节课就到这里……
什么意思,切了一整篇的图就想跑?
好吧,我们来解释一下我们得到的SVG吧。
什么是&svg&
&svg version=&#″ id=”图层_1″ xmlns=”http://www.w3.org/2000/svg” xmlns:xlink=”http://www.w3.org/1999/xlink” x=”0px” y=”0px” width=&#px” height=&#px” viewBox=&# 347 830″ style=”enable-background:new 0 0 347 830;” xml:space=”preserve”&
我们得到的SVG的属性:
version 这是&svg&标签的独有属性,svg的版本,目前只有1.0,1.1两种
id 就是id了,不是特别的属性
xmlns=”http://www.w3.org/2000/svg”
xmlns:xlink=”http://www.w3.org/1999/xlink”
xml:space=”preserve”
这3个是固定值,命名空间,数据单独存在svg文件内时,这3个值不能省略
x svg的左上角x值,默认为0
y svg的左上角y值,默认为0
width svg的宽度
height svg的高度
style 元素样式,从AI导出时,这个值会出错,删掉即可
viewBox 指定一个给定的一组图形伸展以适应特定的容器元素,viewBox属性的值是一个包含4个参数的列表 min-x, min-y, width 和height, 以空格或者逗号分隔开, 在用户空间中指定一个矩形区域映射到给定的元素。
有点抽象哈,用图片来表示下。
单独抽取viewBox时,就是以viewBox为画板的一个正常图形。
而当viewBox的大小和svg不同时,viewBox在屏幕上的显示会缩放至svg同等大小。(高宽非等比例缩放)
(蓝色框代表viewBox大小,黑色框为svg大小,并且两者没有间隔,此处为了查看方便留了空)
更详细的信息可以查看这篇文章
理解SVG的viewport,viewBox,preserveAspectRatio
另外关于用户单位,大家可以看这里
用户单位和屏幕单位的映射关系被称为用户坐标系统。除了缩放之外,坐标系统还可以旋转、倾斜、翻转。默认的用户坐标系统1用户像素等于设备上的1像素(但是设备上可能会自己定义1像素到底是多大)。在定义了具体尺寸单位的SVG中,比如单位是“cm”或“in”,最终图形会以实际大小的1比1比例呈现。
总之viewBox里才是真实图形大小,而svg的宽高决定图形在屏幕上的显示大小。一般情况下,我们从AI中导出SVG时,两者大小是保持相同的。
当然,实际尝试后,有些同学会发现一个问题,有时候我调整svg和viewBox大小,结果内部图形位置偏移并且被裁切甚至不见了……
所以这里还是要再解释一下,viewBox里才是真实图形大小,这话的意思是:内部图形,如&path&里的数值是相对viewBox而定的,也就是说viewBox进行了缩放,那么内部的图形数值也相对应进行了缩放,viewBox缩放至svg大小就停止了,而此时的内部图形并不一定是svg的大小
直接用数值来解释。
svg的大小为400×800,而viewBox为200×400,那么很明显,svg内部图形会放大2倍,而此时内部图形最左边的点不是(0,0)而是(50,300),那么放大后,就变成(100,600)。因此左边那看似空白的距离就是一个宽度为100的偏移量。
讲到这里,就出现另外一个问题,内部图形最左边的点,这个是什么意思?内部图形不是(0,0)点开始的吗?
并不是,内部图形比较复杂,我们下章再讲,这里先告诉大家内部图形画图的原理。
&path d=&#7c-2.076-0.372-1.924-0.242-3-1c2.508-1.579&#z”/&
这里为了方便查看,把中间一大串数字省略了。我们可以看到,AI导出的&path&只有一个d属性。
那这个d到底是什么呢?
d就是图里每个点的位置,配合不同的命令字母实现画图。为了简单理解,大家可以想象成,这是一堆标注(x,y)点的集合。这个也是&path&的重头戏,这里先钓个胃口,我们下一章讲。
作为代替,我们这章可以先看看&path&最常规的玩法。
这涉及到path元素的三个属性:
stroke-dasharray
stroke-dashoffset
stroke就是对图形进行描边的颜色,类似与css里的border-color
与之对应的属性还有
stroke-linecap
stroke-linejoin
stroke-miterlimit
stroke-opacity
stroke-width
这里不对所有属性都进行深入。
关于线条动画可以看下这篇译文
SVG技术入门:线条动画实现原理
stroke-dasharray 值是一组数组,没数量上限,每个数字交替表示划线与间隔的宽度。
stroke-dashoffset 则是虚线的偏移量。
这两个值配合起来最常见的玩法是这样的。
设定stroke-dasharray的值划线与空格均为10,然后增加第二个参数,及空格的值
这种情况下我们改变第一个参数,即划线的值,就会出现“描边效果”
也就是说,一开始划线长度设为0,而空格长度设为path总长即可然后利用js或css即可实现这种效果。path总长度可通过getTotalLength方法获得:
document.querySelector(‘.path’).getTotalLength();
而stroke-dashoffset的作用看图,逆时针方向偏移:
最后,线条动画一般可以配合其他属性使用,比如fill属性(类似于background-color),这部分与一般的js,css动画没太大差别,大家可以自行发挥。
相关链接:
MDN社区SVG介绍:
理解SVG的viewport,viewBox,preserveAspectRatio
SVG技术入门:线条动画实现原理
原文地址:
向您推荐:
经常遇到很多伙伴咨询如何去提升专业、练习应该怎么去做、灵感从哪里来等等问题。结合这些问题总结和梳理了一下自己的点滴经验,希望能帮助到大家,与之共勉。
本文的目的是给刚入行的新人分享个&
每当苹果公布新的壁纸,总会有人或者手机厂商去模仿苹果家的壁纸,因为他家的壁纸是真的好看啊。今天我们来学习一下最新的iPhone8和 iPhone x的壁纸是怎样做出来的?
值得注意的是,&
被iPhone X刷了一天屏,到下午实在受不了各种标题写着“iPhone X 适配、指南、设计稿” 内容却是发布会回顾和手机介绍的标题党。索性自己写一篇只针对iPhone X适配的贴子,与适配无关的内&
@Echo 由于iOS 和 Material Design的组件体系有些不一样,所以关于组件的分类体系我会分iOS篇和Android篇来讲解,本篇文章为iOS 篇。
对于大部分入门设计师及中级设&
如果你关注过一些取得大成就的人,总会在他的成长故事中发现很多传奇的经历,比如少年时代的天赋异禀,或是30、40岁的大器晚成,为了做好某件事的废寝忘食等等…然后摸摸自己的胸脯说,他们是天才,我只是个普通&
@Micu设计你是美工?还是设计师?你是合格的设计师吗? 设计工作中最基础的修图会吗?找素材拼图会吗? 如果这最基础都不会,能称自己是设计师吗?能漫天要价吗? 如果有点职业道德,先学会最基础的修图,再谈设计吧! 一起看看别人是如何将图片合成的! 第1组:采集素材 完成设计: 第2组: 第3组: 第4组: 第5组: 第6组: 第7组: 第8组: 第9组: 第10组: 第11组: 第12组: 第13组: 第14组: 第15组: 第16组: 第17组: @Micu设计投稿,自 weibo
从2011年开始接触APP,到现在为止也做了几个了,发现了一个共同点就是和每一个技术搭档切图的时候,会遇到不同的问题,因为技术的水平高低有限,所以他们要求你给切图的时候也会不一样,针对切图后来我总结了一套规律分享给大家,希望互相学习~ 相关阅读: 设计师需要掌握的图片原理与优化技巧 Android设计中的.9.png 切图小贴士 一.android版 在做android版本设计的时候,尺寸有很多种,这时我们要以一种尺寸为基准,那这个基准尺寸是480px*800px,设计图完成之后就开始切图了,我拿我之前设计的一张图为例子讲解下:
当看到上边这张设计图的时候,我们首先分析下应该给技术切哪些图(为了避免以后少改动,建议切图之前最好和技术先沟通下,怎么切); 1、底部栏目的icon和背景:
这个一般有2种切法:(有默认和选中之后的效果)
2、顶部栏目的背景切图: 由于顶部导航栏的是渐变样式,所以切图只需要切一小条,技术来平铺拉伸就可以~(PS:如果是花纹背景,就必须切整条了,因为花纹切一小条就会被拉伸了~) 3、标注文字大小和行间距:(以这张图为例子,我标注好了,请看下图) 需要注意的: A:android主要有3种屏,即: QVGA和WQVGA屏density=120; HVGA屏density=160; WVGA屏density=240; B:apk的资源包中, 当屏幕density=240时使用hdpi标签的资源 当屏幕density=160时使用mdpi标签的资源 当屏幕density=120时使用ldpi标签的资源; C:我们标注的是PX,但是技术的算法是DP,所以需要PX和DP进行转化,PX和DP的转化主要跟密度有关系,当密度density=160即(屏幕尺寸:320*480)时,1PX=1DP;当密度density=240即(屏幕尺寸:480*800)时,1PX=0.75DP;当屏幕的尺寸大于480*800的时候,密度都按照240计算即可;当密度density=120即(屏幕尺寸:240*320)时,这个现在几乎没有人用了,所以我也不知道转化公式,如果您知道,可以留言告诉我啊~ 注意:因为我们做的是基于480*800尺寸的,大家都知道android的尺寸太多了,要想适配现在流行的尺寸,比如:640*960;720*1280等,唯一的解决办法就是图标可以根据不同尺寸各做一套,也就是图标需要做480、640和720共3套图标,不过如果你们的产品的要求不严格,做一套就可以,只不过是在大于480尺寸的屏幕上有些图标被拉大变虚而已~ 二.ios版 在做ios版本设计的时候,尺寸有3种,分别是:320*480、640*960、640*1136;这时我们要以一种尺寸为基准,那这个基准尺寸是640px*960px,设计图完成之后就开始切图了,我拿我之前设计的一张图为例子讲解下:
当看到上边这张设计图的时候,我们首先分析下应该给技术切哪些图(为了避免以后少改动,建议切图之前最好和技术先沟通下,怎么切); 1、底部栏目的icon和背景:
这个一般有2种切法:(有默认和选中之后的效果)
2、顶部栏目的背景切图:
由于顶部导航栏的是多颜色的,所以只能切一整条给技术,商圈的图标要单独切出来
3、二级标题栏目的切图: &
周陟 (@UCDChina 深圳负责人、交互设计专业委员会(@IxDC)部长) :我发现一个问题,大部分刚入行或者经验不多的设计师在碰到问题的时候都喜欢”索取”,最好有个现成的东西放那儿给他供着。这暴露了我们设计师群体一个严重的现状——自学能力的欠缺。 我上次提到设计师的三大素质(我自己觉得是这样,也是招人的时候重点考察的),这次就专门聊聊自学能力的问题,与各位打拼靠自己的朋友共勉。 作者还有一篇很有意思的分享:普通UI设计师与顶级UI设计师的区别是什么? 什么是设计师的自学能力? 我们对自学能力的理解是从上学的时候建立的,但那个时候的”自学能力”相对单纯,无非也就是如何通过自己看书、做题,复习到达熟练记忆,以便应付各种苛捐杂税式的考试。 但进入设计行业后,这个自学能力不仅仅限制在”了解知识、复述知识”的范围,设计师要学习各种软件,学习如何寻找灵感,学习如何与客户沟通,学习怎样规划自己的行业前景……这种交叉性的自学要求会成为很多人的屏障。并且,很难定义一个所谓的”自学能力”的量化目标。 就我个人理解,设计师的自学能力是使用合适的时间、方法、资源达到独立的、正确的解决问题的能力。 如何才能有效的自学? 你细心的话,应该注意到上面我的用词,这些关键点就是有效自学的途径。在设计这个行当,光努力是不够的,我们不只是要强调效率,也要强调效能。回过来看,你们学校历史中是不是总有那么几个无论如何努力都始终分数不高的货色? 首先是合适的时间; 如果一件需要花时间的学习任务超出了你的时间成本,你就不应该去碰它,或者换一个更好的方式,比如:你现在是一个从事了8年平面设计的设计师,你觉得目前做动画的收入高,你希望通过自学动画,然后跨行到这个领域,那么未必是最好的选择,首先你的8年的平面经验几乎没有再升值的空间,其次作为一个新人,也许你还要3年的等待,好死不死,你的脑子不错,等到你学有所成,动画行业又是另一个新的天地了。 正确的方法是重要的; 方法不仅是你练习的方式,还有思考问题的方式,这里强调的是设计师快速发现问题的能力,只有准确的了解需要自学的领域的难度、行业标准、设计思路、应用形态,你才知道从何入手; 比如:你想自学网页设计,并把网页视觉设计师作为自己的职业发展,你就应该首先了解,一个网站的基本结构,每个结构需要哪些工作岗位,他们的职责有何不同,一个网站视觉设计师应该干什么,抓住重点(而不要一开始去学什么HTML代码,那不是你最该关心的,我这话是说给某个朋友听的)。 资源指的是任何能够让你了解到所需知识的平台; 基础的东西先看维基和google,然后去书店翻一翻行业著作,然后下载一些软件的学习版知道你要使哪些工具,这些都是你的资源,如果凑巧你还能找到一些资深的从业人士咨询就更好了,但是要提醒的是,别人没有义务回答你,所以你先要准备好自己的问题。 独立性决定了你在自学途径中对自己的要求;你善于坚持的品质是你能够成功通过自己的努力达到目标的前提条件,在你周围没有更多的资源可以利用的时候,你只能靠自己不断的练习,思考。我发现要求很多设计师练习没有问题,要求他们思考却很难,自学的过程中,”想”永远是最关键的。 自学不是万能灵丹 你的性格不适合自学。这是正常的,有部分朋友他们的性格天生就是依赖性强,缺乏主见,在遇到困难的时候选择逃避,那么这样的性格想完全通过自学来达到一个”好高骛远”的目标是不太可能的。你需要选择一个付费的培训机构或者老师,通过一些外部的压力,让你有所提高。 除了自学还应该参与交流。交流当然是重要的,通过交流可以达到解惑的效果,有个前提需要注意,你要和别人交流,别人也需要知道值得和你交流,因此你要有所储备,交流既然是平等的也就需要基础,别以菜鸟之心度老鸟之腹,既冷了场又露了怯。 自学的技术必须转化为实际项目。你的自学有可能是为了自我提升,自我积累设计经验,但如果是为了解决实际问题,那么你自学的成绩就必须经过实际项目的检验,比如:你学习了一些新的交互设计的工作技巧,那么在你自己从事项目的时候你就应该争取机会导入进去,否则到头来,你也只是做了一嘴的好交互。 “人一定要靠自己”,说的不是抛弃阶级感情和团队协作,而是面对困难和障碍的时候,往往只有你自己才是靠得住的。缺乏自学能力的设计师,从性格与技能上都会落于下风,因此请不要让自己”被飞”的日子来得太早。 原文出处:《闲言碎语:周陟设计随笔》,感谢作者的无私分享,推荐童鞋们阅读原著,受益无穷 : ) & &
移动app开发中多种设备尺寸适配问题,过去只属于Android阵营的头疼事儿,只是很多设计师选择性地忽视android适配问题,只出一套iOS平台设计稿。随着苹果发布两种新尺寸的大屏iPhone 6,iOS平台尺寸适配问题终于还是来了,移动设计全面进入“杂屏”时代。看看下面三款iPhone尺寸和分辨率数据就知道屏幕有多杂了。 加上Android生态中纷繁复杂的各种奇葩尺寸,现在APP设计开发必须考虑适配大、中、小三种屏幕。所以如何做到交付一套设计稿解决适配大中小三屏的问题?设计和开发之间采用什么协作模式?一个基本思路是: 1、选择一种尺寸作为设计和开发基准; 2、定义一套适配规则,自动适配剩下两种尺寸; 3、特殊适配效果给出设计效果。 & 手机淘宝的iPhone 6/iPhone 6 Plus适配版本即将提交App store审核。先晒一下我们采用的协作模式,再慢慢说明原委。 第一步,视觉设计阶段,设计师按宽度750px(iPhone 6)做设计稿,除图片外所有设计元素用矢量路径来做。设计定稿后在750px的设计稿上做标注,输出标注图。同时等比放大1.5倍生成宽度1125px的设计稿,在1125px的稿子里切图。 & & 第二步,输出两个交付物给开发工程师:一个是程序用到的@3x切图资源,另一个是宽度750px的设计标注图。 & 第三步,开发工程师拿到750px标注图和@3x切图资源,完成iPhone 6(375pt)的界面开发。此阶段不能用固定宽度的方式开发界面,得用自动布局(auto layout),方便后续适配到其它尺寸。 & 第四步,适配调试阶段,基于iPhone 6的界面效果,分别向上向下调试iPhone 6 plus(414pt)和iPhone 5S及以下(320pt)的界面效果。由此完成大中小三屏适配。 & 为什么选择iPhone 6作为基准尺寸? 当面对大中小三种屏幕需要适配的时候,很容易想到先做好一种屏幕,再去适配剩下两种屏幕。第一个决定是到底以哪种屏幕作为设计和开发的基准尺寸。我们选择中间尺寸的iPhone 6(750px/375pt)作为基准,基于几个原因: & 1、从中间尺寸向上和向下适配的时候界面调整的幅度最小。375pt下的设计效果适配到414pt和320pt偏差不会太大。假设以414pt为基准做出很优雅的设计,到320pt可能元素之间比例就不是那么回事了,比如图片和文字之间视觉比例可能失调。 & 2、iPhone 6 plus有两种显示模式,标准模式分辨率为,放大模式分辨率为(即iPhone 6的1.5倍)。可见官方系统里iPhone 6和iPhone &
初涉移动端设计和开发的同学们,基本都会在尺寸问题上纠结好一阵子才能摸到头绪。我也花了很长时间才弄明白,感觉有必要写一篇足够通俗易懂的教程来帮助大家。从原理说起,理清关于尺寸的所有细节。由于是写给初学者的,所以不要嫌我啰嗦。 现象 首先说现象,大家都知道移动端设备屏幕尺寸非常多,碎片化严重。尤其是Android,你会听到很多种分辨率:480×800, 480×854, 540×960, 720××1920,而且还有传说中的2K屏。近年来iPhone的碎片化也加剧了:640×960, 640×××2208。 不要被这些尺寸吓倒。实际上大部分的app和移动端网页,在各种尺寸的屏幕上都能正常显示。说明尺寸的问题一定有解决方法,而且有规律可循。 像素密度 要知道,屏幕是由很多像素点组成的。之前提到那么多种分辨率,都是手机屏幕的实际像素尺寸。比如480×800的屏幕,就是由800行、480列的像素点组成的。每个点发出不同颜色的光,构成我们所看到的画面。而手机屏幕的物理尺寸,和像素尺寸是不成比例的。最典型的例子,iPhone 3gs的屏幕像素是320×480,iPhone 4s的屏幕像素是640×960。刚好两倍,然而两款手机都是3.5英寸的。 所以,我们要引入最重要的一个概念:像素密度,也就是PPI(pixels per inch)。这项指标是连接数字世界与物理世界的桥梁。 Pixels per inch,准确的说是每英寸的长度上排列的像素点数量。1英寸是一个固定长度,等于2.54厘米,大约是食指最末端那根指节的长度。像素密度越高,代表屏幕显示效果越精细。Retina屏比普通屏清晰很多,就是因为它的像素密度翻了一倍。 倍率与逻辑像素 再用iPhone 3gs和4s来举例。假设有个邮件列表界面,我们不妨按照PC端网页设计的思维来想象。3gs上大概只能显示4-5行,4s就能显示9-10行,而且每行会变得特别宽。但两款手机其实是一样大的。如果照这种方式显示,3gs上刚刚好的效果,在4s上就会小到根本看不清字。 在现实中,这两者效果却是一样的。这是因为Retina屏幕把2×2个像素当1个像素使用。比如原本44像素高的顶部导航栏,在Retina屏上用了88个像素的高度来显示。导致界面元素都变成2倍大小,反而和3gs效果一样了。画质却更清晰。 在以前,iOS应用的资源图片中,同一张图通常有两个尺寸。你会看到文件名有的带@2x字样,有的不带。其中不带@2x的用在普通屏上,带@2x的用在Retina屏上。只要图片准备好,iOS会自己判断用哪张,Android道理也一样。 由此可以看出,苹果以普通屏为基准,给Retina屏定义了一个2倍的倍率(iPhone 6plus除外,它达到了3倍)。实际像素除以倍率,就得到逻辑像素尺寸。只要两个屏幕逻辑像素相同,它们的显示效果就是相同的。 Android的解决方法类似,但更复杂一些。因为Android屏幕尺寸实在太多,分辨率高低跨度非常大,不像苹果只有那么几款固定设备、固定尺寸。所以Android把各种设备的像素密度划成了好几个范围区间,给不同范围的设备定义了不同的倍率,来保证显示效果相近。像素密度概念虽然重要,但用不着我们自己算,iOS与Android都帮我们算好了。 如图所示,像素密度在120左右的屏幕归为ldpi,160左右的归为mdpi,以此类推。这样,所有的Android屏幕都找到了自己的位置,并赋予了相应的倍率: ldpi [0.75倍] mdpi [1倍] hdpi [1.5倍] xhdpi [2倍] xxhdpi [3倍] &
今天早些时候,9to5mac最先爆出下一代iPhone的后盖图片。很快,他们又贴出了更多的高清大图,其中包括白色和黑色两种。正如你所见,从图片中可译者:作为一名有逼格的设计师,怎么可以不会制作好看的应用图标呢?今天我为大家带来一篇翻译文章,关于如何制作 iOS 应用图标,教程也比较简前言:photoshop是很多设计师常用的软件,在使用过程中有很多小技巧可以大幅提高工作效率,这里总结几个比较实用的小技巧分享下。
双窗口的应用目前UI设计是一个很火的职业,不少同学都想转去学UI,但其培训费用很高,不是一般用户能承受得起的,其实UI设计并不是想像这么难,只要懂一些规作为行业的标杆苹果对于智能手机的影响无疑是举足轻重的,每次产品革命都推动着行业的发展,牵动着厂商和消费者的心。那么是什么工业革命让苹
Tubik Studio :我们的日常生活中总是面临着无尽的选择,大量的挑战。设计的决策也是如此,一...
在业务迭代周期内,产品经理和设计师对要做的产品需求和功能点进行需求分析和设计讨论的过程中,有时会出现...
在过去的2年当中,设计领域一直在探讨UX写作(UX Writing)这一“新兴”的设计分支。实际上,...
莫贝网(www.mobileui.cn)移动设备界面设计专业网站。为UI设计师提供手机界面设计,移动应用界面设计,平板电脑界面设计,导航界面设计等手持移动设备,移动终端界面设计相关知识的收集分享,共同学习的网站。
关注微博:}

我要回帖

更多关于 完成任务后扩容至2t 的文章

更多推荐

版权声明:文章内容来源于网络,版权归原作者所有,如有侵权请点击这里与我们联系,我们将及时删除。

点击添加站长微信