首页

解客户+说服甲方+面对质疑的方法

涛涛

搞定客户/同事的方法

说服客户的方法

壹周速读:了解客户+说服甲方+面对质疑的方法

大部分客户都是很挑剔的,所以一稿过是很多设计师的梦想,其实客户也不是刻意要刁难设计师,如果你的设计方案能够把设计需求展现出来,同时还有一套正确的设计逻辑,那么客户也是很容易被说服的。这篇文章总结了让客户埋单的设计思路:

找准客户的审美

壹周速读:了解客户+说服甲方+面对质疑的方法

设计师面对的客户千奇百怪,以设计师自身对于审美和需求的理解往往容易产生误解和矛盾,那么要怎么了解客户的审美以及深层的需求?看看高手是怎么做的:

实现「大气」的设计

壹周速读:了解客户+说服甲方+面对质疑的方法

改稿绝对算得上是设计师的一项日常操作,这一点我们都深有体会,至于改稿的原因则五花八门,不是客户嫌弃太小气、没创意,就是上级嫌弃太土、太单薄等等。可是大气的设计可不仅仅是 LOGO 要大、字要大、图要大,那么真正的大气要怎么做呢?看这个:

对抗质疑的方法

壹周速读:了解客户+说服甲方+面对质疑的方法

很多同学可能都碰到过一个很头疼的问题,比如来公司时间不短了,但是在公司毫无话语权可言,不论是所在团队还是业务方,甚至连对接的开发,都可以对他的设计稿提出质疑。而且总是无法顺利得说服对方,导致无穷无尽得改改改。那么这个问题要怎么解决呢?这个套路一定要了解:

UI 设计

UI 的基础概念

壹周速读:了解客户+说服甲方+面对质疑的方法

酸梅干超人的新系列文章来了!这次,他要输出一部完整的 UI 零基础学习指南,根据 UI 新手系统学习 UI 设计的顺序,陆续会输出 12-15 篇不同模块的系列性文章,而这篇是这个系列的第一篇:

UX 设计流程

壹周速读:了解客户+说服甲方+面对质疑的方法

在如今的产品设计团队中,体验设计师需要做的事情已经跨越了职能边界,为了寻求更好的设计方案,常常要承上启下地连接整个团队。这篇文章将设计流程中定义问题、创意发散、原型 & 测试、复盘反思四大设计流程细化为 12 个步骤,详细讲述了每个步骤用户体验设计师涉及的职能任务和思考:

UI 卡片设计

壹周速读:了解客户+说服甲方+面对质疑的方法

很多人对 APP 中的卡片设计习以为常,但对于卡片设计流行的原因、优点,以及如何做好卡片设计却可能不甚了解。这篇国外大佬写的文章,算是从为什么这样做的角度来分析卡片设计,一起来学习吧:

可视化表单

壹周速读:了解客户+说服甲方+面对质疑的方法

这篇文章出自资深 B端设计师 Taras Bakusevych,他深耕 B端设计多年,对于表单、可视化设计、UI/UX 都有着丰富的经验。这篇梳理了 20 个可视化设计的常见技巧,实用性和指向性都非常强:

产品交互

百度大字版设计

壹周速读:了解客户+说服甲方+面对质疑的方法

当下移动 APP 产品缺少对老年人体验的深层次关注与设计,只通过单一加大字号与简化功能等解决基础体验,缺乏通过新技术应用和更全面的适老化设计服务老年群体,老年人的需求依旧未得到关注和满足。百度基于自身的 AI 技术和精细、系统的适老化设计,适时推出百度大字版,使老年人更平等地获取信息和服务、获得情感陪伴:

交互说明文档

壹周速读:了解客户+说服甲方+面对质疑的方法

怎么样的交互说明才是最好的,是大家都喜欢的?这个问题想必很多同学都想知道,因为不少同学将写的交互说明文档提交给需求评审会的成员审核时,总会碰到「写的更合理些」的建议,这确实让人透了脑筋。来看看高手是怎么解决问题的吧:

社交 APP 趋势报告

壹周速读:了解客户+说服甲方+面对质疑的方法

移动互联网在悄然改变着用户的社交方式和社交需求,这篇文章根据近一两年技术创新和用户代际更迭导致的用户需求差异化,来探索社交的设计趋势,帮助我们应对变幻莫测的互联网:

视觉设计

酸性设计风格解析

壹周速读:了解客户+说服甲方+面对质疑的方法

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码ben_lanlan,报下信息,会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

文章来源:优设   作者:陈子木

分享此文一切功德,皆悉回向给文章原作者及众读者.

免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务



f

el-date-picker时间插件获取值格式问题

前端达人

最近在使用vue el-date-picker时间控件,发现直接获取的时间是日期格式,而我需要的格式是

yyyy-MM-dd HH:mm

那么如何转换时间控件格式呢

<el-date-picker 
v-model="selectDatetime"
 type="datetime" placeholder="选择时间"
 @change="dataSearch" value-format="yyyy-MM-dd HH:mm" 
format="yyyy-MM-dd HH:mm"> </el-date-picker>

在日期控件中,加入上述加粗格式即可




分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。
来源:csdn

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务

Vue实现ul中item 删除

前端达人

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Todolist</title>
    <script src="./js/vue.js"></script>

</head>
<body>
<div id="app">
    {{msg}}
    <div>
        <input v-model="txtValue">
        <button type="button" @click="handleSubmit">提交</button>
        <ul>
            <li v-for="(item,index) of list"
                :key="index"
                :index="index"  @click="deleteItem(index)" //传递下标值 >
                {{item}}
            </li>
        </ul>
    </div>
</div>
<script>
    new Vue({
        el: '#app',
        data: {
            msg: 'hello Vue!!',
            txtValue: '',
            list: []
        },
        methods: {
            handleSubmit: function () {
                this.list.push(this.txtValue)
                this.txtValue =''
            },
            deleteItem: function (index) {
                //alert(index)
                this.list.splice(index,1) //通过下标删除 }
        }
    })
</script>
</body>
</html>




分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。
来源:csdn

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务

阿里腾讯晋升潜规则,是什么?

seo达人


01.展示核心能力而不是项目  

图片

好多同学的PPT更多像项目汇报,一般都是去年一年做了什么项目,大的项目小的项目,打大修翱翔的罗列。做述职或者汇报一定不是项目汇报,这样做最大的问题是目标不清楚,答辩或者晋升核心不是PK项目,框架很多面试官对你项目未必感兴趣。更多他们的角度是看你做事情思路,你这个人的价值。到没到下一层级,去承担更多的责任。

那么问题来了,能力怎么在PPT展示?我觉得对于设计师来说,你需要挑选一些黄金项目去说。黄金项目而不是普通项目,你做了哪些黄金项目,取得了什么成绩,往往决定了你的能力。

做的过程中,遇见了那些阻碍,你是如何思考的,如何去解决这些阻碍的,有没有沉淀出一些方法论出来。做完这个项目,有没有能够沉淀的项目经验给其它同学。

在做晋升答辩上,千万不要沉到项目的细节里面去,要跳出项目。仔细考虑你的核心能力有哪些提升,怎么才能把核心能力表达出来。

常见的设计师核心能力有:设计驱动,突破业务,主动推动,项目某些价值因为何而不同等等。

s

02.目标完成得很好,更要知其所以然  

图片

目标完成得很好,更要知其所以然,虽然你的目标完成得非常好,但是你对问题本质的认识,对知其所以然可能还不够。

第一个公司领导层比较关注的价值是系统化不够,你做项目只看到几个点,如果能看到整个面,这件事可能会做得更好。

第二个是你做的事情专业纵深不够,对于你的临近团队、下游或上游团队,对他们最终要达成目标的技术或者产品的理解还不够。

做了很多事,结果也不错,但是对于为什么这样做,能不能做得更好,缺少足够的思考和总结。晋升评审不是结果好就行,今天你是基于什么样的业务技术场景,基于什么样的判断,做了什么样的决定,拿到了什么样的结果,带来了什么样的客户价值,要把这些过程和思考想清楚。

a

03.深度思考,项目因为你而不同  

图片

设计晋升面试,被问的最多的一个问题是,这个项目哪些地方因为你而变的不同。我身边很多成功晋升的同学,他们对自己项目有深度思考。

这些深度思考的同学,比纯做执行的设计,平时能够承担更大的责任。特别我们做互联网产品,更需要把业务当自己孩子,能够深入思考。很多设计师做设计只关注体验,陷入到自己专业细节。

但是今天互联网环境变了,设计师要做突破业务的工作,要跳出你当前做的设计,要思考整个用户场景,考虑整个产品链路和对用户的价值。如何去挖掘用户价值,传递产品价值。以及通过设计创新去打通业务。

所以,在面试表达的时候想清楚你设计的价值,产品的价值洼地,想清楚以后再去通过合适的设计手段解决产品问题。这也是要求我们做设计,需要站在更高的角度和格局去思考问题。

q

04.绩效好就不一定能晋升成功  

图片

很多同学以为自己绩效很好,做的项目结果也不错,就觉得晋升是理所当然。其实不是,绩效和晋升不是对等的。绩效是你设立的KPI,但晋升是判断你的能力是否达到下一层级,有的人很好的完成工作做到了非常优秀,但是他只是执行,没有去思考是否可以有更大的通用,更大的影响力,没有想得更长远,这时候是没有满足下一层级能力要求的,晋升也就很困难了。

一个岗位晋升,不只有结果,还要有背后的思考和沉淀做了很多事,结果也不错,但是对于为什么这样做,能不能做得更好,缺少足够的思考和总结。晋升评审不是结果好就行,今天你做的好是基于什么样的业务用户场景,基于什么样的判断,做了什么样的决定,拿到了什么样的结果,带来了什么样的客户价值,你的设计主张是什么,要把这些过程和思考想清楚。

w

05.拿结果的能力强,也要能挑更大的担子  

图片

很多有人会说,我拿结果的能力很强,做的项目数据效果都不错,只是PPT或者现场临场发挥不好。我之前和阿里的一些评委聊过,他们除了看结果,更多会去识别面试的这个人他的思维框架、达到结果的路径,是否可以挑更大的担子,判断他到底是临场发挥的问题,还是这个临场发挥也代表着他对过去做的业务所思所想不够清晰,没有提炼,沉淀还不够厚,思考的维度通过几次问答就被混乱了,打破了。

所以,关键还是在平时,面试那个场子其实影响并不大,并不会因为你今天讲的好,就面试成功,要知道那些评委都是有经验的人。

w

06.需要用多重视角看待问题  

图片

相信大家平时都挺忙,做的项目也很多,但是在写晋升PPT,或者总结时候没有任何思路,还有救么?其实本质上要训练自己看问题的角度和高度,训练自己跳出来看,不断训练自己的思维高度和角度。那么问题来了,做设计如何提高自己看问题的高度和角度,这里分享3个小技巧。

d
01.首先培养客户视角

图片

虽然我们平时都说自己去用户设计,但是有多少同学有去关注我们的用户。客户视角,是站在自己的客户角度去看客户价值。

我们做的这个需求,从用户角度看,它有没有价值,一般来说可以通过电话回访,问卷去了解我们用户对于我们做的事情建议。提高看问题高度第一步就是培养客户视角。

r

02.其次培养团队视角

图片

团队视角,就是你现在做的事情,站在自己合作方的角度去看团队协同。比如你在做设计语言这个事情,从开发的角度去看这个事情怎么看?有没有价值,对于研发团队有没有价值?从产品角度去看,价值是什么?设计师你能不能说清楚?从运营层面看,价值是什么?

很多时候,晋升答辩,其实就是面试官从他的角度去看你这个事情是不是有价值,所以做PPT时候,思路可以多从他人视角去看,不容易陷入到自嗨里面。

f

03.最后,屁股要大,站在主管视角去想

图片

相信大家职场经常听见这句话,至少我在阿里经常听见,就是「屁股要大」,我们做的项目,要站在自己主管视角上去想,他会怎么看待这个问题。怎么看自己和其它小伙伴,要学会看全局。

最后,不断培养自己视野,自己做的事情,把视野拉高两个层次,站在自己主管的主管的视角上去看前面的问题。

做晋升PPT也是如此,面试官都是比你高两个层次的,你的事情怎么去表达,在他们看来是有价值的,你的设计方案对于客户,对于合作团队,对于整个部门来说,价值大不大。

g

07.如何优雅地面对晋升结果  

图片

晋升就会有成功或者失败,如何让自己面对结果不那么难过的,我觉得就把它当一次照镜子的机会,重塑自己。

晋升不是门坎,而是阶梯。成功了不会怎么样,失败了也不必当成打击。把它当作一次照镜子的机会,重塑自己的机会。哪怕即使第一百次跌倒还可以第一百零一次站起来。经历了,回首去看,一个更强大的自己就站在那里。你和自己对比的永远是自己的成长。

晋升失败很痛苦,原因可能不是接受不了结果,而是接受不了旁人的眼光。但说白了,如果你能够把这件事情放下,你就会发现别人根本不在意。

有一句话叫做:在其事,不在其位。如果你真正想做这件事情,你不会在意你在哪个位置,但是你真的把这件事做好,这个结果迟早是你的。

晋升是一个水到渠成、自然而然的过程,你如果没有这些想法、心态的积累,你只是为了那个结果,其实你会变形。

晋升本质目的,不是那个结果,它是一次对焦,去看看你们公司需要你有什么样的特质,你需要继续提升自己的是什么。

所以有时候讲梦想在前,足迹在后,不管你这次晋升通过还是没有通过,只要你努力去追求这个梦想,那么晋升和成长一定是自然而然的事情。扎实的做好自己,一步一步往上走,比那个标签能给你的多得多。

g

08.路上的风景远比今天的结果更重要  

图片

最后我想说,其实设计师的职业路很长,晋升不是一个结点,也不是一个终点。把晋升作为一个和评委或者导师的一次很好的沟通机会,反观业务上的思考,反观自己成长的思考。路上的风景远比今天的结果更重要。扎实的做好自己,一步 一步往上走。

你努力的样子,就是你最好的模样。无论成功或是失败,我们一起装下世界,看见未来。

希望这篇文章对各位有帮助。

 

原文地址:我们的设计日记(公众号)

作者:sky

转载请注明:学UI网》阿里腾讯晋升潜规则,是什么?

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码蓝小助,报下信息,蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

截屏2021-05-13 上午11.41.03.png

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务




一文读懂业务数据分析思路

seo达人



一、充分利用可获得数据

在开展一个调研,执行数据分析的阶段,我们可以首先去思考下,除了我们调研中设置的数据以外,还有哪些数据我们是可以获取并进行分析的。从便于理解数据分析思维的角度,我们把数据类型可分为:用户数据、行为数据、态度数据、产品数据。

用户数据:是指用户本身的属性和基本情况,比如:性别、年龄、身份、职业、地区等,了解用户数据便于我们在后续的分析阶段更好的对用户进行细分和拆解。

行为数据:是用户与产品交互过程中产生的数据,即记录用户做过什么的数据,常通过产品埋点等方式记录收集,比如:用户点击酷家乐设计入口的次数、在某个页面的停留时间、查看过的页面类型/数量、使用过哪些工具类型等,行为数据主要包括用户做了哪些行为、发生行为的时间等。

态度数据:是用户对于某个事情或者观点的态度,通常是通过我们在研究中设置好的问题来获取,比如常见的:用户的满意度、NPS、某个问题对用户的影响程度等。

产品数据:是产品本身属性或者具备的数据,例如:产品名称、产品价格、产品种类、功能个数、产品评论、产品销量、产品满意度等。

图片

不同的数据类型可能来源于不同的获取渠道,有些来自公司内部数据库,有些是通过自己主动投放获取,在实际进行业务问题分析时,要有充分调用不同渠道、不同数据类型的意识,不仅关注同一类型数据的表现,还可以分析不同数据类型之间的关联,从而对业务问题背后的原因进行更深层次的洞察。

 

二、基础的数据分析思路

数据分析的目的是为了回答某个业务问题,通常来说,常见的业务问题主要有两类:

一是业务现状分析(即通过业务数据分析,来发现当前业务问题)

二是业务问题原因分析(即在发现某个业务问题后,层层深入挖掘问题背后的原因)。

例如,我们在工作中面临着这样的业务诉求:当前产品用户NPS如何,是高还是低?是升了还是降了?产品NPS上升/下降的原因是什么?

 

1、对比分析法:绝对数据意义不大,要看相对数据

对比分析法是进行业务现状分析和发现问题最基本的方法,单一的数值并不能说明什么问题。比如,了解某产品NPS达到30%,只了解这个数值是没有太大意义的,因为并不能判断这个NPS是高还是低?是升了还是降了?所以只有通过对比分析,才能让数据变得有意义。

常见对比分析思路:

和行业比:想知道NPS是高还是低,可以和行业的平均水平进行对比,或者和行业内的标杆进行对比。

和目标比:与既定的目标比,来了解当前NPS的距离目标的差距。

和同类/同级比(横向对比):和同一行业内/生态内的其他产品水平,找到相对更高或者更低的答案。

和不同时期的自己比(纵向对比):可以从时间维度来看数据随着时间发生的变化,也称为趋势分析,用来追踪业务动态是否有异常。

图片

在使用对比分析时,需要注意的是:如果是对总体数值进行比较,那么各对比维度的规模需要一致。

因此,在数据分析中,通常会使用比例或者平均数作为指标来进行对比。例如,对比A地区的总销售额高于B地区,但并不能直接得到A地区的销售业绩更好,有可能A地区的销售门店数量远多于B地区,因此此处用平均销售额会更合理。

 

2、多维度拆解对比法:结构化&公式化

(1)结构化拆解:不只对比整体,还要看内部的构成差异

结构化拆解对比,是对业务问题进行原因分析过程中最常用的分析方法。只对比数据整体,无法注意到数据内部各个部分构成的差异。如果忽略这种差异进行比较,就有可能导致无法察觉该差异所造成的影响。比如,某产品销售额下降20%,背后的原因是什么,该如何分析?

从用户角度来拆解:例如,该产品用户由新用户和老用户构成,可以拆解为新用户销售额和老用户销售额,来看销售额下降是否跟用户类型有关。还可以把用户拆解为不同年龄组、不同的性别、不同地区、不同等级等属性,可参考数据类型中的用户数据包含内容。

从产品角度来拆解:例如,该产品的销售包含了不同的产品版本,可以拆解为不同的版本对比销售额,来看销售额下降是否跟产品版本有关。当然还有其他产品相关的属性,可参考数据类型中的产品数据包含内容。

从数据结构角度来拆解:例如,某产品销售额按照一定区间分组对比,某产品满意度按照不同满意层级拆解对比,来了解不同结构数据下的用户占比分布。

图片

图片

交叉分析也是非常常见的对比分析方法,就是将拆解后的多个维度结合进行对比,从而发现更深层次的差异。

图片

 

(2)公式化拆解:对数据指标进行拆解

结构化的拆解可以帮助我们得到一个有逻辑的分析框架,在具体执行原因分析时,我们还需要对变量进行层层拆解才能找到问题产生的根源。例如在上述销售额下降的案例中,通过对用户类型进行结构化拆解对比,发现新用户的销售额明显下降,那么如果业务继续追问:为什么新用户的销售额下降了呢?

此时,我们就可以把销售额(数据指标)进行公式拆解,拆解成多个细分指标后,再针对细分指标进行对比分析。

比如,销售额=销量×客单价,在拆解之后就可以再从客单价和销量两个角度去进行对比分析,深挖销售额下降的原因。是新用户的销量变少了,还是新用户的客单价变低了导致新用户销售额下降的?

假设对比后发现客单价没有变化,主要是销量变少导致销售额下降。还可以继续对销量进行拆解:销量=人均购买数×购买人数,进而分析是购买人数下降了,还是人均购买数下降了呢?通过公式化的对指标剥离拆解,就可以实现层层深入到问题本质。

图片

结构化和公式化拆解还可以应用在我们对业务进行分析时的思路梳理中,比如当我们要去对某个业务的的GMV为什么高或者低进行原因分析时,我们可以对GMV进行公式化拆解,分别从流量×转化率×客单价三个具体的方面着手,去罗列出影响这些指标的因素,逐渐完善我们的数据分析网络。

图片

 

三、常见的数据分析技巧

1、对比分析法

在前文业务现状分析中,已经有详细阐述,是描述现象和发现问题最基本的分析方法。从对比对象上来看,可以和目标比、和同类比、和不同时期的自己比;从对比方式上来看,可以整体对比,也可以通过变量拆解后分组对比、多维交叉对比。

 

2、象限法

象限法常用在需要进行落地推动的策略分析上,是通过将多个因变量进行不同属性的划分,生成多个具备不同价值的象限,通过考察对象在象限中的位置来明确进一步的业务策略。象限分析法举例:

RFM模型:把客户按照不同的维度进行划分,区分出不同价值的客户,从而针对不同价值的客户进行精细化运营。

图片

(图片来源于网络)

 

行动优化矩阵:对多个待优化模块的具体优化优先级进行评估时,可以结合两个关键变量来构建出4个不同象限以进行优先级的区分。常用的变量有满意度和重要性,当然也可以根据具体的场景选择其他合适的变量(如下图选择了满意度和优化意愿两个变量)。

图片

 

3、漏斗分析法

漏斗分析主要应用在一个有起点和终点的业务流程分析中,用来定位问题发生的具体环节,分析指标一般为转化率或者流失率,转化率=某环节的用户数量/上环节的用户数量;流失率=1-某环节的用户数量/上环节的用户数量。单看漏斗分析各环节的数值是没有意义的,需要将这些数值与历史数据或者目标数据进行对比,定位到哪一个环节转化率/流失率表现出异常。

图片

(图片来源于网络)

 

业务数据分析的关键,是需要将零散的想法按照一定的逻辑进行梳理,有逻辑有依据的对问题进行剥离和分析,进而探寻问题的本质,这是数据分析最具有挑战性也是最有价值的环节。本文仅介绍了一些基础的分析思路,希望能为一些入门者提供一些参考。

 

参考资料:

《数据分析思维:分析方法和业务知识》

《商业数据分析与可视化》

 

原文链接:酷家乐用户体验设计(公众号)

作者:墨一

转载请注明:学UI网》一文读懂业务数据分析思路

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码蓝小助,报下信息,蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

截屏2021-05-13 上午11.41.03.png

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务



用户体验 |(附文件)我用这个表格,跟产品经理“讨价还价”!

seo达人



00.【前言】

图片

现在我们在目标导向流程的第一个部分:研究

我是从0开始、系统讲解用户体验设计方法的CC~

 

01.【同步背景】

首先,我们需要召集研究的所有人员一起沟通想法,并且将目的的范围缩小,从而规划主要问题。

与这群领域专家沟通的时候,我们第一件事情是同步各自的访谈背景

也就是为什么我们要进行本次访谈。

比如说:大家的目的都是“因为我们的2.1版本新上线,想要知道用户在使用我们新功能的时候有没有出现什么问题以及需要优化的部分,所以我们要对用户进行访谈。”

那我们本次访谈目标的中心点则是围绕2.1版本的新功能来进行的。

 

02.【拆分模块】

其实我们大多数访谈目的都是围绕新功能、或某老功能的用户体验来进行的。

主要的访谈重点是侧重于用户的功能诉求,这就需要我们将用户能够使用到的功能进行拆解。

规划预期用户的行为习惯会产生什么结果,确定用户在工作流程中会遇到的核心页面,将每一个可能的操作节点进行记录,从而从这些页面寻求关键点,剖析出需要进行提问的重点功能。

大概就是这样的分析逻辑。

图片

整体操作流程是这样:

  1. 预判用户在某一环境下会做出什么操作?
  2. 用到的功能模块是哪一个?
  3. 这个模块包括哪些主要页面呢?
  4. 进入这个页面,用户需要点击哪里完成操作?
  5. 这个操作的优先等级是什么样的?

等这几个答案都明确,想必大家都能明确这次的访谈目标,和具体要问的重点问题了吧。还能帮助我们在前期避免处于被产品经理牵着走的尴尬境地,“讨价还价”能力见长!

 

03.【整理表格】

我们将这些模块拆分后填入表格。

  • 用户行为
  • 涉及模块
  • 涉及页面
  • 关键操作
  • 优先等级

就得到了我们下面这个表格,这个表格还可以帮助我们在访谈结束后对产品模块的优化紧急程度作出判断。平时我在整理需求的时候就会用到这个表格,优化需求也可以用到,总之复用性很高。

图片

最后福利福利!关注公众号“达芬奇的火柴盒”,点点“在看”,回复“访谈目的表”,免费领取源文件~

 

原文地址:达芬奇的火柴盒(公众号)

作者:CC本人

转载请注明:学UI网》用户体验 |(附文件)我用这个表格,跟产品经理“讨价还价”!

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码蓝小助,报下信息,蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

截屏2021-05-13 上午11.41.03.png

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务



文本设计的小诀窍

seo达人


01.文本宽度不要超过800px

在进行长篇幅文本设计时,要注意本文宽度不要过长,千万不能铺满整个屏幕。

微信公众号的文本宽度660px,知乎的文本宽度654px,google搜索结果页的本文宽度600px,百度搜索结果页宽度560px,百度百科的文本宽度790px。

总之,成熟产品的文本宽度几乎都不超过800px,其中600~700之间最为合适。

图片

02.左对齐长文本

当文本超过3行或4行时,慎重使用文本居中对齐。

因为文本居中对齐时,不可避免地存在两侧参差不齐,这会导致用户在阅读两侧内容和换行时,导致额外的眼球运动,这会造成眼睛疲劳,阅读困难。

左对齐的长文本就在一侧形成看不见的直线,引导用户阅读,具有更好的可读性,因此书籍、网站等都在使用左对齐。

图片

《写给大家看的设计书》中提到,居中对齐会创建一种更正式、更稳重的外观,这种外观显得更为中规中矩,但通常也很乏味。我敢保证,大多数看起来精巧的设计,都没有采用居中对齐。

图片

03.标题或短文本使用居中对齐

如果标题和文本都比较短,例如一行到两行,可以使用居中对齐。再多的话,可以尝试左对齐是否更有利于阅读。

图片

04.借助元素区分文本层级

当我们需要区分不同权重的文本时,除了采用字体大小、字重等调整外,还可以尝试借助目标、项目符号或引号等其他元素建立清晰的视觉层次。

图片

05.充分利用空白间距

我个人在进行文本排版时会尽量避免使用线条或背景颜色,因为在大部分场景下,利用空白间距便可以将层次划分清晰,并且可以使整个界面保持干净整洁。

图片

原文地址:栗子设计喵 (公众号)

作者:栗子

转载请注明:学UI网》文本设计的小诀窍

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码蓝小助,报下信息,蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

截屏2021-05-13 上午11.41.03.png

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务



github 22个优秀的React项目

前端达人

React Native :

  1. https://github.com/fbsamples/f8app
  2. https://github.com/iSimar/HackerNews-React-Native
  3. https://github.com/catalinmiron/react-native-dribbble-app
  4. https://github.com/FaridSafi/react-native-gifted-messenger
  5. https://github.com/7kfpun/FinanceReactNative
  6. https://github.com/race604/ZhiHuDaily-React-Native
  7. https://github.com/lwansbrough/react-native-camera
  8. https://github.com/xiekw2010/react-native-gitfeed
  9. https://github.com/wwayne/react-native-nba-app
    10 . https://github.com/akveo/react-native-reddit-reader
    11 . https://github.com/faridsafi/react-native-basketball

React :

  1. https://github.com/andrewngu/sound-redux
  2. https://github.com/benoitvallon/react-native-nw-react-calculator
  3. https://github.com/casesandberg/react-color
  4. https://github.com/gatsbyjs/gatsby
  5. https://github.com/getsentry/sentry/
    6 . https://github.com/gpbl/isomorphic500
    7 . https://github.com/insin/react-hn
    8 . https://github.com/fatiherikli/fil
    9 . https://github.com/khan/perseus
    10 . https://github.com/BinaryMuse/imgsible
  6. https://github.com/skidding/flatris
    12 . http://www.amazon.com/gp/product/1491929006?ie=UTF8&camp=1789&creativeASIN=1491929006&linkCode=xm2&tag=mybridge-20



蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码ben_lanlan,报下信息,会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。
作者:吴博
链接:https://www.jianshu.com/p/2dc805c6c007
来源:简书

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务

CSS3实现自定义Checkbox和Radiobox

前端达人

我们知道浏览器自带的Checkbox复选框不怎么美观(这或许是我们看习惯了的缘故),而且复选框在不同的浏览器上显示的样式又有很大的差异,由于目前越来越多的人开始接受支持CSS3的现代浏览器,所以今天就简单的用一些CSS3代码来自定义Checkbox的显示方式,个人觉得比浏览器自带的Checkbox美观不少。

下面先来看一下最终实现效果

效果演示地址

效果图如下

 

下面来分析一下源代码,原理很简单,先把页面上<input type="checkbox" />的display设置为none,从而把它隐藏掉,然后利用CSS3代码来绘制与checkbox邻近的label元素:

HTML代码:

<input type="checkbox" id="checkbox-1-1" class="regular-checkbox" /><label for="checkbox-1-1"></label> <input type="checkbox" id="checkbox-1-2" class="regular-checkbox" /><label for="checkbox-1-2"></label> <input type="checkbox" id="checkbox-1-3" class="regular-checkbox" /><label for="checkbox-1-3"></label> <input type="checkbox" id="checkbox-1-4" class="regular-checkbox" /><label for="checkbox-1-4"></label>

CSS3代码:

复制代码
.regular-checkbox + label { background-color: #fafafa; border: 1px solid #cacece; box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05); padding: 9px; border-radius: 3px; display: inline-block; position: relative;
}
复制代码

下面的CSS代码可以让checkbox选中后出现阴影的效果,主要利用了box-shadow属性:

.regular-checkbox + label:active, .regular-checkbox:checked + label:active { box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);
}

radiobox的实现也是同样的原理,具体实现方式大家可以在线演示研究,也可以下载源码,非常简单实用。

分类: HTML5/CSS3



蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码ben_lanlan,报下信息,会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务

这么好看还免费?还能商用? 刚开始我是不相信的!

seo达人


图片

我随便下了两张:

图片

图片

往上随便加点文字排版:

图片

图片

那效果也是杠杠的!

再看看别人用的效果,网页头图啥的:

图片

图片

也是相当强。

这图的质量那也是非常高清,6000px的大小:

图片

 

最最最关键的是,完全免费并且可商用,看看官网上的说的:

图片

够意思!

这个网站的网址如下:https://gradienta.io/

需要科学上网,如果不会的话,可以找我领取,我帮大家下载了一部分,获取方式:点个在看,后台回复ppt封面,即可获得。

 

原文地址:菜心设计铺(公众号)
作者:菜心设计铺

转载请注明:学UI网》这么好看还免费?还能商用? 刚开始我是不相信的!

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码蓝小助,报下信息,蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

截屏2021-05-13 上午11.41.03.png

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务



日历

链接

个人资料

蓝蓝设计的小编 http://www.lanlanwork.com

存档