首页

一招教会你页面分割怎么用

博博

作为一名合格的UI设计师,用好留白分割、线性分割、卡片分割,你的页面即成功了一半!

留白分割≧线性分割≧卡片分割

留白分割定义:指的是只通过增加间距的方式,利用人的视知觉原理(接近法则:人的大脑会倾向于把彼此靠近的元素视为一组),自然的将信息分组。(如上图)

间距留白是区隔单一信息元素的默认选择。(如下图)

使用原则:建议在不影响核心数据指标的前提下,条目之间尽可能采用留白分割,会让界面更清爽,浏览更沉浸。

留白分割的分类及适用场景:当条目信息层次较少(≦2)时,留白分割是比较合适的,当信息层次较多(≧3)时,留白分割既会浪费空间,也难以达到一目了然的分割效果。

线性分割定义:用线来分隔不同的信息内容。(大部分APP的分割线是1px粗细,黑色,不透明度12%)。

使用原则:分割线可以帮助用户理解页面是如何组成的,但过度使用分割线会造成视觉干扰,影响页面信息传达。

Android系统明确规定了分割线的使用原则:
1、微妙的:分割线在布局中应该很容易被注意到,但又不凸显。
2、次要的:只有当留白不能起到分割作用时,才采用分分割线。
3、少用的:谨慎使用分割线,用它来创建分组而不是分割条目。(如下图)

分类及使用场景:
1、通栏分割线:用于分割彼此完全独立的内容。
2、内嵌分割线:用于分割有锚点(头像或图标)的相关内容。
3、中间分割线:用于分割无锚点(头像或图标)的相关内容。

如果为了提高屏效,希望在一屏内尽可能多的展示信息,那么同样的信息布局,分割线带来的效果会更清晰(如下图)

卡片分割定义:卡片是一个由内容和操作组合而成的独立主题的面性容器①,它可以包含缩略图②、标题③、副标题④、副媒体⑤、文本⑥、问文字按钮⑦和图标按钮⑧,除了卡片容器本身,其他元素都是可选的,所有元素都以易于扫描和操作的形式放置在卡片上。

使用原则:
1、包含的:卡片是一个可识别的,单独的、包含内容的单元。
2、独立的:一张卡片可以独立存在,而不依赖于上下文环境。
3、不可分割的:一张卡片不能与另一张合并,也不能拆分成多张卡片。
分类及适用场景:
卡片根据左右是否有边距,可简单分为通栏卡片和非通栏卡片(如下图)。

从视觉效果上来看,由于圆角的聚焦效应,非通栏卡片对于凸显单个卡片的独立性和内容的效果都更好,画面的分割感会更强。
1、当这个主题内部的内容已经有分割线时,建议采用卡片分割,让主题信息层次更加清晰。
2、当单个主题内部的内容类型较多,上下所占空间较大,建议采用卡片分割,以更好的圈定该主题的内容范围,给用户明确的内容边界感。
3、当需要扩展页面的横向空间时,暗示页面可以横向滑动时,需要采用非通栏卡片,利用横向内容连续性原则,帮助用户建立可以横向滑动的意识。

小结:

  • 当信息条目复杂度较低时,优先采用留白分割,视觉清爽无干扰。
  • 当信息条目复杂度增加,只利用留白分割效果不明显时,建议引入线性分割,让信息层次更清晰且屏效高。
  • 当信息条目复杂度进一步提升,(比如已经有了线性分割,或者有更多操作),需要进一步强化信息条目本身的边界感,建议引入卡片,以强化条目信息的视觉层次和可操作性。

信息分割本身不是目的,分割方式的选择是为了让版面产生清晰的条理性,用悦目的信息秩序来更好的突出内容,达成最佳的信息传达效果,所以决策时,除了上述细节考虑因素,还要考虑整体版面效果和信息传达效率。


作者:是一颗李子
来源:站酷

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司

银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计

软件qt开发软件wpf开发软件vue开发

 

设计灵感来源于“善于发现”

博博

一、表情化反馈设计
 
通过用户反馈可以让产品的服务和体验做得更好,因此获取反馈的设计变得至关重要。
 
在饿了么 App 点餐,完成订单配送之后,会以弹窗的形式采集用户反馈。通过表情化的设计让用户完成选项,情感化的表达可以提高用户的参与度,进而达到获取反馈意见的目的。
设计灵感来源于“善于发现”
 
 
二、灵动可爱的动效表达
 
动效的表达相较于静态而言更有吸引力,可以让画面更有视觉张力。
 
饿了么在 0 元夺宝活动设计中,以 3D 动效的形式展示灵动可爱的小鱼吐泡泡的画面,瞬间让场景变得更有趣味性。吸引用户关注度的同时,也让活动氛围感十足。
设计灵感来源于“善于发现”
 
三、突出品牌主题的轮播设计
 
轮播图的设计样式丰富多样,设计师都在不断探索更新颖的表现形式和互动玩法。
 
最近在体验芒果TV 时,在好物栏目中的轮播图布局设计中,结合了品牌主题进行轮播切换。不仅强化了品牌主题,新颖的样式表达也使得栏目更有设计感。
设计灵感来源于“善于发现”
 
四、收缩式导航栏设计
 
通过交互形式可以让静态布局有更多灵活性,方便用户在不同操作场景中享受更好的体验。
 
作业帮 App 首页默认状态突出搜索功能,当用户滑动浏览内容时,顶部导航栏和搜索功能会收缩展示。简化部分功能和适配导航栏布局,提高当前界面的利用率,带给用户更好的浏览体验。
设计灵感来源于“善于发现”
 
五、通过动效强化按钮关注度
 
微动效越来越普及,不仅可以让产品变得更有趣味性,也能通过动静对比突出功能关注度。
 
进入作业帮 App 个人中心时,会员开通按钮会通过一圈光效动效进行强化,吸引用户关注到开通按钮。左上角的每日签到图标也会以 3D 动效的形式循环播放,以此吸引用户进行签到操作。通过动效强化功能的吸引力,提高用户的操作概率。
设计灵感来源于“善于发现”
 
六、可视化设计强化任务流程
 
生硬的文字表达无法打动用户的参与度,图形化、趣味性的可视化表达更能打动用户。
 
One More App 通过对选项内容进行图形化表达,让用户更直观地判断,可视化的设计也让任务流程的选择变得更轻松。不仅让选项内容更直观,也能提高用户的参与度,达到采集数据的目的。
设计灵感来源于“善于发现”
 
七、动态封面更吸引人
 
封面设计是吸引用户点击栏目的关键,通过丰富多样的设计表达逐步拉开差异,而动态封面变得尤为重视。
 
天天跳绳 App 首页中,趣运动栏目的活动主题封面进行了动静结合。相较于静态封面而言,动态封面不仅更吸引人,也显得很有趣味性。
设计灵感来源于“善于发现”
 
八、赋予功能营销属性
 
挖掘营销点是提高产品变现力的关键,如何在用户体验和营销曝光度中做平衡,需要我们不断思考和探索。
 
微博 App 内的营销布局点很多,在发现栏目中进行下拉刷新时,有时也会结合活动或者品牌广告。在不改变功能属性的基础上,融入营销属性,是一个不错的尝试。
设计灵感来源于“善于发现”
 
九、趣味性的设置按钮
 
通过设置按钮/开关等进行选项或者功能切换,一枚小小的按钮也可以进行更好的设计发挥,往往细微之处才能体现出产品的体验。
 
进入腾讯动漫 App 在“我的”版块,进行性别设置和夜间/日间切换时,按钮设计结合趣味性的动效表达。小小的按钮变得更加形象可爱,更能吸引用户进行设置和体验。
设计灵感来源于“善于发现”
 
十、细微动效让图标更精致
 
微动效在图标设计中的运用非常普及,通常是为了突出点击状态或者重点功能,而用于所有图标的案例相对较少。
 
最近在体验马蜂窝 App 的时候,发现首页金刚区图标全部都带有微动效,动效表达不会很夸张,都是细微的点缀。不仅点缀了图标设计,也让图标显得更精致和趣味,细微的动效不会使得整体互相干扰,是一个非常不错的金刚区图标设计方案。
设计灵感来源于“善于发现”


作者:黑马青年
来源:站酷

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司

银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计

软件qt开发软件wpf开发软件vue开发

探索web端和移动端的差异和解决方案

博博

市面上主流的界面设计主要包括移动端、web端、桌面端、硬件、插件等,app和网站设计是大部分设计师最常见的设计需求,这两个也是最核心的设计端平台,所以明白web端和移动端设计的相似和差异并且知道如何应对是至关重要的。
整体来说,移动端的设计是更可控的,web端的设计难度实际更高,上限也更高。但是想要做好web端的设计并不难,只要明白web端设计时需要考虑的因素和解决办法,那么所有问题自然迎刃而解。
 
一、文本
 
1. 大小
总体上,移动端和web端的字体规范是一致的,同一套字体大小都可以在双端有好的识别和视觉效果。唯一细微的区别是浏览器支持的最小字体大小是12,所以在web端要摒弃12以下的字号。实际上这并不会增加你的web端设计难度,因为web端的设计空间是足够的。
 
2.长度
设计中往往需要考虑文案长度的问题,移动端受到屏幕空间的限制往往更容易遇到问题,你需要考虑当前文本段是否能在你所预留的空间放得下,对此可以参考以下几种解决办法:
  • 高度自适应:也就是换行显示,大部分的文本段不可能无限换行,也应该有字数限制,所以选择这一个解决办法,正常也需要设定一个高度极限值。
  • 超出省略:当文本段的完整性不是那么重要,且需要漏出,那么这是一个不错的方法
  • 字号自适应缩小:这正常用在金融类产品的数字显示中,比如余额等,当小数点过多或者金额过大导致的数字文本端过长时,数字是无法换行或省略的,所以你可以选择字号自适应缩小。
二、屏幕大小
移动端和web端最直观的差异就是屏幕大小的差异,移动端小,且各设备的差异化细微,web端的空间大,且不同设备的屏幕差异大,所以就有了几点主要差异:
 
1. 布局
移动端整体上是自上而下的设计布局,宽度受限比较严重,所以除了一些左滑手势带来的横向空间拓展,布局的变化上不大。
web端因为空间大,所以就有了更多的布局可能性,例如左右布局,居中布局,左中右布局,或是全屏自适应布局。这些布局方式也各有各的优缺点。
所以设计一个网站时,往往需要多个布局配合使用,能让你的网站视觉感受更舒适,利用率上更合理。切忌为了美观或者方便等原因死磕一个布局方式。当然,居中布局是最万能的一个布局,如果你暂时没办法掌控多个布局,那么居中布局是你最佳的选择。
 
2. 适配
前文说了,因为web端的设备差异大,所以你需要在设计时考虑小屏笔记本和大屏显示器的适配问题,甚至是用户手动拉动浏览器宽度时所得到的适配反馈也需要考虑其中。
适配不是必须的,因为适配的成本较高,复杂的页面往往需要设计出多个断点页面去让开发根据页面宽度重新适配内容。所以大部分的居中布局的网站,是不做适配的,因为你只需要控制你的内容宽度能在13寸笔记本完整展示,其他的就是极小部分用户的需求了。
web端到移动端的适配往往需要重构,也就是把当前网站的内容,重新在手机宽度下做设计,结合上文文本部分的内容,请不要想当然的把字号缩小。只需要考虑排版和功能是否需要删减的问题。 
 
3. 弹窗
移动端受到屏幕限制,弹窗的更多是banner的弹出,提示的作用,或者是个别简单筛选操作,在移动端很难在弹窗上放置很多的输入等复杂操作
在web端的设计中,一定要巧用弹窗,简单的编辑或着创建等操作都可以用弹窗代替,不仅可以使操作更聚焦,也可以减少页面跳转来缩短路径。
 
三、交互手势
由于操作媒介的不同,导致移动端和web的操作手势有很大的区别,移动端是用手指操作,web端是鼠标操作,手指操作决定了手势的多样性,鼠标的操作决定了点击的精确,并且由于鼠标的操作反馈是分阶段的,需要在每个阶段都给予用户相应的反馈来打造更好的用户体验。
 
1. 状态
移动端中对于操作的反馈主要聚焦于手指点击后的反馈,悬停态往往被长按代替。而web端鼠标操作存在三个状态,一个是正常状态,一个是悬停状态,一个是按下状态,这三个状态需要在设计师考虑并设计来向开发说明。web端中不同元素的常见状态(主要为悬停态)区分方式需要明白:
  • button:用颜色区分,常见的方式是改变颜色的明度,悬停增加明度,按下降低明度
  • icon:icon的状态区分更多是在悬停状态上,常见方式有:改变颜色;改变icon形态(如线性变面性);为icon添加背景色块(如圆形灰色背景)。
  • 文字:文字的状态区分除了颜色之外,可以利用文字自带的属性,如字重,字体大小,甚至可以在个别海外产品中看到通过改变字间距来表示悬停状态。
  • 卡片:卡片的悬停设计更加的多样,如改变填充色;改变描边颜色;增加投影,比较有趣的有改变卡片大小;轻微改变卡片透视;改变卡片的位置,如悬停时卡片向上轻微移动。
 
由于web端独有的悬停手势,你可以在悬停这个手势大作文章,如果你了解linear风格的话,或者经常浏览国外产品的话,许多网站会在鼠标悬停卡片时产生动效,动效不限于卡片元素(插画、图标、可视化表格等)的动画;光影描边的循环。悬停按钮时,箭头的位置变动,或者其他动画效果。更酷炫的还有鼠标与卡片透视的交互,甚至与鼠标与全局页面的交互,如水波纹等。
 
2. 操作按钮
整体来说,web端基于屏幕大小的优势和状态的多样,在操作按钮漏出数量和方式上会更加的多样。
移动端独有的是长按手势和左滑右滑手势,所以移动端会把一些操作放到左滑手势中,最常见的如消息列表的置顶、删除等。长按手势更多的是弹出更多操作,或是产生可拖动效果。
web端拿列表举例,基于屏幕的大小的优势,可以将更多操作直接在列表右侧直接漏出,用户的操作路径更短,触达率自然就更高。拿卡片举例,button的存在有的时候会影响到卡片的大小和美观,所以有些操作往往可以藏到悬停状态里,悬停操作不需要学习,所以用户不会为此感到疑惑,也可以保证功能的完整性。
 
四、设计思路
关于各个模块如何设计并不在这里展开,我想表达是在设计稿设计时的一些操作思路,或者说是组件的搭建思路。
 
1. 盒子思维
如果你对前端开发有一定的了解,那么你一定懂得盒子套盒子。设计也是如此,需要给你的每个设计模块建议一块独有的盒子。这是区别于间距或分割线的区分模块的思路的。
举个例子,你有图片,主标题,副标题三个元素形成一个小模块,那么你在确定好排版之后,你需要一个盒子将他们装起来,那么这个模块必须有它自己的宽度,高度。换个角度理解也就是它需要有一定的上下左右间距,在figma中,这个盒子就是你的frame,高级一点就是你的自动布局。这个盒子的大小就决定了这个模块的操作热区,这也方便你在设计做出你的悬停效果。
这个设计思维适用于web端和移动端,且十分重要,所以尽量避免在设计图出现各个元素分别散落的情况,这不仅不利于你的设计稿管理,也不利于开发的查看。
 
2. 新手如何参考
在进行web端设计时,如果你对web端设计一无所知,也无需惊慌。你可以找到合适的参考网站,并且分析它每个模块的高度,间距等,去模仿他,并且从中得出规律。
拿web端的导航栏举例,假设你纠结于web端的导航栏高度设置多少,你可以找到参考的网站,使用检查功能(F12)去查看高度,或粗暴的截图查看高度即可。当然,在此之前,你需要确定这个模块的高度是不会随屏幕大小改变而改变的。
 
3. 自适应布局
无论是web端设计还是移动端设计,当你在设计模块或搭建组件时,善用自动布局,这不仅有利于你设计图高效率修改,也能应对你的web端可能出现的适配情况。这需要考验你的figma能力,如果大家有兴趣,后续我可以出一些figma基础、组件、自动布局等相关教程同大家探讨。

作者:PONEPENG
来源:站酷

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司

银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计

软件qt开发软件wpf开发软件vue开发

穿越界限:深度解析UI设计的灵魂与创新

前端达人

在数字时代,UI设计早已超越了简单的界面布局,它是数字产品与用户之间互动的桥梁,承载着用户体验的方方面面。这篇文章将深度挖掘UI设计的本质,剖析其灵魂,探索其背后的深刻创新,以期领略UI设计的真正魅力。

1. UI设计:数字产品的灵魂

UI设计不仅仅是美丽的外表,更是数字产品的灵魂。它融合了设计、心理学、用户体验等多个领域的要素,通过巧妙的布局、色彩、交互,引导用户进入无缝的数字世界。设计师的任务不仅是创造视觉吸引力,更是在细微之处体现人性关怀。

2. 艺术与技术的交融

UI设计是艺术与技术的完美交融。设计师不仅需要精湛的设计技能,还需要对前沿技术的深入了解。从色彩心理学到最新的交互设计趋势,设计师们运用技术作为创作的工具,打破常规,创造独特的用户体验。

3. 创新:突破边界的力量

UI设计的魅力在于创新的力量。设计师们不断挑战传统,突破边界,探索新的设计语言。响应式设计、微交互、动效设计等概念的不断涌现,为用户带来更自然、更智能的界面体验。

4. 用户体验的艺术

UI设计旨在创造卓越的用户体验。这不仅仅包括直观的界面操作,还包括用户与产品互动的情感体验。通过深度了解用户需求和行为,设计师们打造出贴心、富有情感共鸣的设计,让用户在每一次触碰屏幕时都感受到独特的艺术之美。

5. UI设计的未来探索

随着技术的不断演进,UI设计也在不断探索未来的可能性。人工智能、增强现实、虚拟现实等技术的融入,将为UI设计带来更加丰富多彩的表现形式。未来的UI设计将更注重个性化、智能化,为用户提供更贴合需求的个性体验。

结语:穿越数字的画布

UI设计是数字时代的画布,设计师们在其中留下的不仅仅是视觉的痕迹,更是用户体验的深刻印记。穿越界限,深度解析UI设计的灵魂与创新,我们能够更加欣赏到这门艺术的无限可能性。

 

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司

银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计

软件qt开发软件wpf开发软件vue开发

突显创新之美:探索UI设计公司的视觉奇迹

前端达人

在数字化时代,UI设计公司扮演着塑造用户体验、打造品牌形象的关键角色。这些公司的设计师们通过创新性的思维和前沿的技术,为用户呈现视觉奇迹。本文将深入探讨UI设计公司的重要性、创新实践以及其对数字领域的影响。

UI设计公司的关键作用

UI设计公司不仅仅是提供美观界面的机构,更是负责连接用户与技术的桥梁。一个出色的UI设计不仅仅是漂亮的外观,更是对用户需求的敏感洞察。这些公司致力于通过设计来提升用户体验、提高用户参与度,从而构建积极的品牌认知。

创新实践的引领者

突显创新之美的UI设计公司通常注重不断挑战常规、追求技术的最前沿。他们通过不懈的创新实践,引领着设计行业的发展潮流。响应式设计、材料设计、暗黑模式等设计趋势,都在这些公司的努力下得以推广和演变。

技术与艺术的完美结合

UI设计公司的设计师们既是技术领域的专家,也是创意艺术的倡导者。他们精通各种设计工具,如Adobe XD、Sketch、Figma等,并深谙用户心理学、交互设计原则。这种技术与艺术的完美结合,使得他们能够创造出令人惊艳的用户界面。

在数字领域的深远影响

UI设计公司的影响不仅仅局限于单一应用或网站,更是深远地影响着整个数字领域。通过他们的设计,用户能够更直观、更便捷地与数字世界互动。这不仅提高了用户对技术的接受度,也推动了数字化社会的发展。

未来展望

随着技术的不断创新,UI设计公司将迎来更多机遇和挑战。人工智能、增强现实、虚拟现实等技术的崛起,将为设计师们提供更广阔的创作空间。个性化设计、无界面交互等趋势也将成为未来设计的热点。

结语

UI设计公司是数字时代的创意引领者,他们通过对技术和艺术的深刻理解,不断挑战创新极限,塑造出一个个视觉奇迹。在未来,我们可以期待这些公司将继续发挥重要作用,引领着数字化时代用户体验的风向标。突显创新之美,UI设计公司将继续为我们呈现出更为精彩的数字未来

 

 

创新设计之旅:探索UI设计公司的独特艺术与科技融合

前端达人

在当今数字化的时代,UI设计公司正日益成为创新和用户体验的关键推动者。这一领域融合了独特的艺术表达和先进的科技手段,开启了一场令人深思的设计之旅。

设计的独特艺术之美

UI设计公司不仅仅是技术的实践者,更是艺术的创作者。他们通过精妙的图形和色彩搭配,打破传统的设计框架,创造出令人惊叹的用户界面。每一个设计元素都经过深思熟虑,反映了设计师对美感和情感的独到理解。这是一种艺术,是对设计的深刻思考,使用户在与数字世界交互时感受到无尽的美妙。

科技的前沿突破

UI设计公司在设计中不仅仅注重外观,更在技术上追求前沿的突破。从人机交互技术到响应式设计,科技的引入使得用户体验更加智能化和个性化。这种深思熟虑的技术融合,使得UI设计公司成为数字创新的引领者。在这个过程中,我们看到了科技如何推动着设计的边界,让用户在数字化的世界里获得更加丰富和深刻的体验。

用户体验的核心

UI设计公司深知设计的终极目标是为用户提供出色的体验。通过深入研究用户行为和需求,他们不断地优化设计,使其更符合用户的期望。在这一过程中,设计公司思考着如何在独特的艺术表达和先进科技的背后,创造出一个能够贴近用户生活、引导用户思考的数字化空间。

深思设计的未来

在设计的深思过程中,UI设计公司不仅注重当下的需求,更着眼于未来。他们思考着数字化时代的发展趋势,预判用户的未来需求,并在设计中留有创新的空间。这种深思,推动着设计公司走向前沿,成为未来数字化社会的契机之一。

结语:设计之美,艺术与科技的共舞

在探索UI设计公司的独特艺术与科技融合时,我们发现设计不仅是表面的美感,更是深思熟虑的过程。这是一场关于艺术与科技共舞的旅程,让我们在数字化的时代感受到创新的力量。深思设计,是对过去的反思,对当下的挑战,更是对未来的期许。在这个设计之旅中,UI设计公司成为了引领者,他们的作品不仅仅是数字的呈现,更是关于人与技术、美与思考的深沉对话。

 

 

 

 

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司

银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计

软件qt开发软件wpf开发软件vue开发

 

深入探讨UI设计的艺术与科学

前端达人

UI设计是一门既富有创意又注重用户体验的艺术与科学相结合的领域。在当今数字化时代,用户界面不仅仅是应用程序或网站的外观,更是用户与技术互动的窗口。本文将深入探讨UI设计的重要性、创意灵感的来源以及关键原则,以期帮助读者更好地理解和应用UI设计。

1. UI设计的重要性

UI(用户界面)是用户与应用程序或网站之间进行交互的媒介。一个出色的UI设计不仅仅美观,更关乎用户的体验。良好的UI设计能够提高用户满意度、降低学习成本,并在竞争激烈的市场中赢得用户的青睐。通过直观的设计和流畅的交互,用户能够更轻松地理解并使用应用程序,从而提高整体用户参与度。

2. 创意灵感的来源

创意是UI设计的灵魂,而灵感来源广泛。设计师可以从日常生活、自然、艺术、流行文化等各个方面汲取灵感。观察周围的环境、倾听用户的反馈,甚至从其他设计领域汲取灵感,都能够激发设计师的创造力。同时,不断学习新的设计趋势和技术也是保持创新的重要途径。

3. 关键原则与最佳实践

  • 用户中心设计(UCD): 将用户置于设计的核心,理解用户需求,以确保设计满足用户期望。

  • 一致性: 保持设计元素和交互的一致性,使用户能够更容易理解和预测界面的行为。

  • 简约性: 简化设计,去繁就简,使用户界面更直观,减少混淆。

  • 可访问性: 确保设计对所有用户都可访问,包括视觉和听觉障碍者。

  • 反馈机制: 提供明确的反馈,帮助用户理解他们的操作是否成功。

4. 工具和技术

UI设计离不开各种工具和技术的支持。Adobe XD、Sketch、Figma等工具为设计师提供了创建、共享和测试设计的平台。响应式设计、动效设计、原型设计等技术不断推动UI设计领域的进步,提供更多可能性。

5. UI设计的未来趋势

随着技术的不断演进,UI设计也在不断变革。人工智能、增强现实(AR)、虚拟现实(VR)等技术的融入,将为UI设计带来更多可能性。个性化设计、暗黑模式、自然交互等趋势也将在未来引领设计的潮流。

结语

UI设计是一个不断演进的领域,它需要设计师不断学习、创新和适应变化。优秀的UI设计不仅仅是漂亮的外观,更是对用户需求的深刻理解和艺术与科学相结合的表现。通过关注用户体验、追求创新,我们能够共同塑造数字时代的精彩用户界面。

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司

银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发

 

logo设计全流程及案例分析

博博

作者:阳阳设计师
来源:知乎

一、前期调研

作为设计团队,我们知道一个品牌的诞生与发展,每个公司都投入了巨大的资源和心血。logo设计就像父母给孩子起名,被企业寄予了太多的期待与美好的祝愿,它不仅仅是一个图形一串文字,更代表了企业的形象和深厚的文化。因此我们在提供设计方案时,也同样肩负着品牌价值和品牌责任传输的职责,在接到设计任务之后,并不会漫无目的的就开始投入到logo设计之中。而是要对服务的公司进行充分系统的调研。

研有助于我们对企业的文化、核心、价值观、产品等方面进行全面的了解。根据企业客户的消费行为、喜好,竞争品牌进行分析总结,有针对性的制定创意和设计方案,避免与其他品牌“撞脸”。

给大家介绍几个我经常会遇到的研究方法:

1. 用户采访

通过对客户的了解,团队预先准备一些问题,把那些重要的信息进行记录汇总,这样可以得到第一手的客户需求。客户是很愿意跟设计师进行品牌分享的,但是聊天式的采访往往达不到设计预期,因此我们一定要引导客户进行阐述,一点点把品牌最重要的信息和关键词梳理出来,这个过程对把握设计概念十分重要。

客户案例

2. 领域调研

很多客户表示不了解,为啥设计师可以设计各个行业的logo,甚至很多客户只找做过他们这个行业设计的设计师,其实大可不必这样,因为一个成熟的设计团队,做设计前都会对这个企业进行系统的领域研究,况且任何一个团队也不可能做过所有行业的设计。所以我们常常通过调研系统的了解企业及其上下游的品牌特征,并对此进行拓展梳理,而设计语言与方法是相通的,越成熟的设计师越能进行精准的设计。

(如该领域的视觉偏好是什么,对企业环境及产品进行实地考察,其他竞品的品牌符号有什么共性和区别,企业符号可以从哪些视觉方面进行表达等等)

3. 关键词头脑风暴

以最近给客户做的一个项目“食品加工器械”的logo设计为例,针对这个关键词我们可以想到什么?“机械、科技、食品、高端”等等,根据这些词汇,我们再次联想,拓展出二级、三级的词语,最终找出整个思维导图中最具创新性并符合客户定位的关键词。

客户案例

4. 其他方式

其实可用的方法还有很多,如:实地调研法、抽样调研法、统计调查法、文献调研法等,在这里就不一一列举了。

俗话说:“知己知彼,百战不殆”,我们在了解客户的基本诉求,深度挖掘企业核心价值与内涵之后,才能对企业进行明确的定位。基于此,产出最能代表企业的超级符号。

5. 案例分享

民宿品牌爱彼迎在升级品牌形象时便做了大量的设计调研,为了更好的理解与传达爱彼迎的经营理念,设计工作室Design Studio横跨4个大洲,往返13个城市,试住了18间房子,并与不同国家的爱彼迎员工进行交流。甚至深入爱彼迎公司内部,与工程师、设计师一同工作,共同交流,只为呈现出更完美的爱彼迎品牌视觉。通过长达数月的工作,最终完成了这一设计。

进行了大量调研,我们才有足够的话语权进行创作。我们根据调研的结果,找出最能体现品牌价值的创新点,再开始进入设计过程。

二、绘制草图

调研完成后,为得到最适合的设计方案,我们常常会使用头脑风暴的方式获得设计初稿。在一个集中时间段内,将之前的提取的关键词进行草图创意绘制,使用图形打散、重组的手法,将抽象思维用图形语言表达出来。要求既符合品牌行业属性,又具有创新突破的元素。

草图绘制完成之后,我们会对草图进行筛选,过滤掉实施性弱、美观性差、不够深刻的创意点。挑选出最适合客户需求的方案进行深入。大量的创意会在这一阶段经历打破与重塑,推倒与重来,优中选优,只为呈现最好的方案。

挑选最优方案后,我们才开始进行Logo的下一个阶段——成稿制图,而且会推进几个可行性较高的方案,这样在提案时,方便客户进行选择。

三、成稿制图

成稿制图通常被甲方理解为logo设计的主要部分,因此会觉得设计只是做图,却忽略了设计师在前期投入的大量时间和深度思考,还容易给人产生Logo设计十分简单的错觉。我们也经常遇到这样的客户“logo不就是做个图么,怎么这么贵?”这个时候,一定要跟客户进行沟通,让他们了解到logo设计的全过程是什么,为什么需要花费大量时间,如果客户知道你为此付出了这么多的经历,就会得到他们的理解。

实际制图只是将我们头脑中的想法表现出来,因此这一步骤仅占设计过程的十分之一。

四、细节优化与调整

经过之前的努力,到这时,基本设计方案已经完成。这一阶段主要针对Logo的细节、外形、颜色等方面进行调整。力求设计感、艺术感、实用性相统一。

案例分析

我们来看看苹果公司是如何做的:苹果公司在Logo设计时,将图形定义为一个苹果。但当Logo制作出来以后,图形的辨识度并不高。为了增强图形的识别性,避免让消费者误认为是“樱桃”,设计师决定在Logo图形上增加更多的趣味性,于是“被咬了一口的苹果”应运而生,可见细节修改至关重要。

另外,在基本方案完成的基础上,设计师会制定Logo使用规范,确保Logo在延展应用过程中能够保持高度的品牌辨识度。

以麦当劳为例,在品牌升级前,麦当劳长久以来并没有制定一个严格统一使用规范,不同国家地区的麦当劳Logo也并不相同,这对于麦当劳塑造品牌形象是非常不利的。

因此,麦当劳制定了一系列的标志应用规范,此后视觉上,统一规范的麦当劳变得更加具有辨识度。

为使Logo更具形式美,我们会对logo进行视觉优化。例如黄金分割比例是我们在这一阶段比较常用的手法。

为使Logo设计更理性、科学、美观,我们常常通过黄金分割比例来构建Logo。当事物之间各部分的比例呈现1:0.618的比例时,最能引起视觉上的美感,这一比例充满了理性与感性的统一。良好的比例关系在复制和传播的过程中更加方便快捷,也使后期的加工制造过程更加精准。

以上是我对logo设计流程的介绍,而这些其实也只是logo设计过程中的比较重要的步骤,一些具体的设计细节会根据每个不同的方案也会不同和更加深入,这样大家就明白了,为啥logo设计这么贵了吧,可不是单单一个图例制作那么简单

接下来再给大家分享一些经典的Logo设计案例,一起更加深入的理解那些著名的Logo设计背后的故事,一定对你有所启发~

五、Logo案例分享

1. 百事可乐logo

2006年,百事可乐花费100万美元升级了logo。当品牌视觉手册发布之后,甚至有网友调侃“看完百事的logo设计,终于明白logo的设计费为什么这么贵了。”

新的logo图形不再对称,字体也去掉边角变得纤细。与之前相比,现在的Logo更加扁平,便于记忆。

两条曲线,似是流动的液体,也像是微笑着的人。可别小看这简单的两条曲线,弧度细微的变化都会产生不同的效果。百事可乐还加入了几何角度的思考,通过几何学解释了Logo的原理。

在logo比例关系的处理上,也融入了对哲学问题的思考,从古代阴阳五行说到黄金分割比例,最后到地球能量磁场,小小的Logo蕴含了太多。

但是,Logo还存在一些不足之处,如:单色应用时缺乏辨识度、需要增加边框线使用等问题,导致Logo在具体使用时,会有一定的局限性。


2. 苹果logo

初代的苹果logo描绘了“坐在树下看书的牛顿”这样一副图案。相比于追求简约、便于记忆的Logo,这个图案无疑太过复杂,在传播上也有很大的劣势。可能是意识到了这一点,新logo进行了突破性的改变。

除了图形上创新之外,颜色上也采用了丰富的彩虹色。它标志着第一台支持彩色电脑的诞生。整个Logo营造出了温暖、积极的氛围,为企业注入了旺盛的生命力。

作为一个科技公司的logo,极具科技感的蓝色与边角处高光、阴影等细节为Logo营造出了立体感。

在追求极致简约的时代,纯黑的logo更便于识别记忆。

取代经典纯黑logo的,是具有光泽感的苹果Logo。与之前相比,Logo图形更为流畅、水润。在保持识别性的基础上,整体造型与材质也更加饱满。

随着iphone的推出,高光版本Logo被镀铬效果所取代。

简约、易记的logo图形,也向我们展示了近年标志发展简约化的设计趋势。时至今日,苹果仍延续这一Logo。

去年,苹果公司更是把Logo玩出了花样,动态的、静态的、丰富的材质,让苹果logo“多到用不完”。

因此一个好的logo设计是一定要给logo预留足够多的延展空间的


3. 腾讯logo

在成立20周年之际,腾讯更新了logo。仔细观察字体的笔画,我们会发现,Logo整体倾斜了。7度太小、9度太大,倾斜8度的腾讯字体自带科技感与运动感。

与logo一同发布的,还有一套定制品牌字体“腾讯字库”,这套字体包含了中英日文拉丁文多种类别,通过统一的字体,更好的传达了腾讯的企业个性,强化了企业形象的塑造。

由于汉字都是方正的,因此,在汉字的世界中,斜体汉字的概念闻所未闻。由于斜体的汉字很难依靠传统的字体结构。在文字的正负形、笔画、空间美感方面,设计师需要把握平衡与速度之间微妙的制衡。

在字体的笔画末端进行切角处理。使文字更具力量感与速度感。“腾讯”两字也做出了细微的调整,从笔画、间隔到转角弧度都发生了变化。

腾讯旗下产品众多,但风格形式都各不相同。“腾讯字库”有助于这些项目在视觉形象上的统一。

Logo整体颜色也变成了高明度的蓝色,这个颜色是与色彩机构潘通合作,定制了品牌标准色。蓝色取自海洋与天空,蕴含着极致的理性,体现了对技术精益求精的追求。

来自彩通的国际色彩大师Leatrice Eiseman,也是腾讯蓝的开发者之一介绍道:“它可以非常好的体现出腾讯的原则和哲学,也就是技术方面的精益求精对技术的追求,以及会不断地去追求新的创新。”

由此,还进行了一系列应用部分的延展。


4. 小米logo

小米斥资200万邀请日本设计大师原研哉操刀设计新logo。小米logo刚一发布,便引起了热烈的讨论,只不过是由方变圆,凭什么值200万?

 

我们知道,品牌Logo的升级换代,往往要考虑辨识度对品牌的影响。一旦失去了辨识度,相当于抛弃了原有几十年积累的品牌资产,相当于重新认识品牌。因此,近年来的品牌重塑,都是在保留了原版Logo的识别性的基础上,融入了更具价值的品牌理念。

作为设计行业的领军人物。原研哉致力于在设计中融入东方美学的概念,将复杂的事务化繁为简。深度理解小米“以科技创造美好生活为使命”的品牌理念后,原研哉提出“探索科技与生命的关系”融入“ALIVE”的概念,即接近生命的形态。

Logo中融入最具中国特点的“人情味”,整个logo历时三年,让小米的Logo具有了烟火气息,这也符合小米致力于发展一种高品质、常态化生活的品牌调性。

不仅如此,这个外形还运用到一个数学公式:|x|^n+|y|^n=1,通过“n”的变化来推算Logo进行由方至圆的演变,经过多种对比,最终选择了当n=3时,形成集美感与寓意于一身的Logo图形,也是最具“ALIVE”内涵的代表图形。

小米logo的英文字体也变得更加灵活圆润,而“ALIVE”的理念也贯穿了整个视觉系统,不论是产品展示还是品牌宣传,新Logo都变得更加灵活生动。(视频)

在沿用橙色作为品牌标准色的基础上,融入了具有科技感的黑色与银色作为辅助色,保持识别性的同时也注入了新的活力。

 

5. 麦当劳logo

看到这张图片,第一时间便能联想到麦当劳,在消费者心中,亮丽的金拱门早就形成了视觉符号。作为一个餐饮品牌,麦当劳的视觉设计也不甘示弱。由于疫情,为鼓励公众用餐卫生,麦当劳将自己的logo一分为二拆分成了两个分开的门。

 

通过分解Logo的“M”,在品牌延展上,同样也和其他品牌区分开来,将logo极致符号化。

明亮积极的“M”提高了麦当劳的品牌辨识度,红黄配色与字母“M”深入人心,哪怕只是局部,也能被一眼认出。这得益于麦当劳对于自身品牌的坚持塑造,通过不断的品牌价值输出,来影响消费者的心理。

时至今日,麦当劳形成了强大的品牌识别符号。简约的“m”更具记忆点。

 

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司

银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发

探索设计的奇妙世界:从理念到现实的创造之旅

前端达人

在我们生活的每个角落,设计都扮演着无比重要的角色。从家居摆设到科技产品,设计以其无穷的创造力和深远的影响力,影响着我们的感官、情感和体验。本文将带您踏上一场探索设计的奇妙之旅,从理念的萌发到设计的实际呈现。

设计的背后故事

每个设计都有一个独特的背后故事,是设计师对世界的独特视角的表达。无论是一座建筑的线条,一幅画的色彩,还是一款应用的交互,设计师们通过精妙的构思和创意的组合,将理念转化为可见的形式。设计不仅仅是为了功能,更是为了传达情感、激发思考,是创作者与观者之间的默契交流。

设计的多元领域

设计无处不在,覆盖着多个领域。从平面设计到工业设计,从数字界面到时尚潮流,每个领域都是设计师们施展才华的舞台。设计的多元性让我们能够在各种场景中感受到创意的火花。无论是一个品牌的标志,一本书的封面,还是一台汽车的外观,设计都是赋予物体灵魂的力量。

设计的影响力

设计不仅仅是美的追求,更是对社会、文化和环境的积极影响。好的设计能够改善生活质量,激发创新思维,引领时代潮流。通过独特的设计语言,我们能够更深刻地理解不同文化,感受到设计带来的情感共鸣。设计如同一面镜子,反映着社会的价值观和思考方式。

设计的未来展望

设计领域正不断演变和发展。科技的进步为设计师们提供了更多可能性,虚拟现实、人工智能等技术的应用将开辟出新的设计前景。设计不再局限于二维的平面,而是融合了更多的元素和交互方式,成为未来数字化世界的引领者。

在这个设计的奇妙世界中,我们深感设计的力量和美妙。从理念到现实,设计是一场无尽的创造之旅。让我们怀揣着好奇心,敞开心扉,一同探索设计的无限可能性。


蓝蓝设计:引领设计创新的先锋

作为设计领域的开创者,蓝蓝设计以其独特的设计语言和创新的理念,一直引领着设计潮流。我们相信每个设计都是一次与用户深度互动的契机,是为了创造更美好、更富有意义的体验。蓝蓝设计,是设计之旅中不可或缺的伙伴,与您共同开创设计的未来。

 

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司

银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发

 

探索无限创意:深入UI设计的艺术与科学

前端达人

在数字时代的潮流中,用户界面(UI)设计已然成为引领用户体验(UE)的关键。深入探讨UI设计的本质,我们发现它既是艺术的表达,也是科学的探索,是创意与技术完美交汇的领域。

UI设计的双重本质
融合艺术与科学

UI设计不再仅仅是功能的展示,而是一种对美学与人性认知的深刻理解。蓝蓝设计的团队将艺术和科学相结合,用色彩、形状和动效,打破创意的边界,创造出超越期待的用户体验。

用户体验至上

无论设计多么美观,如果用户体验不佳,设计就难以称为成功。蓝蓝设计将用户置于设计的核心,通过深入研究用户行为,创造出贴近用户需求的界面,使设计成为用户生活中不可或缺的一部分。

UI设计的实际应用
品牌塑造的艺术

蓝蓝设计曾与多个企业合作,通过UI设计重塑品牌形象。通过深度挖掘企业文化,我们不仅为品牌注入新的活力,还助力企业在市场上树立了更现代、更引人注目的形象。

移动应用的科学

在移动应用设计中,我们注重科学的用户研究。通过深入了解用户需求,我们打造直观、灵活的用户界面,提高用户的满意度,使应用在市场上脱颖而出。

UI设计的未来愿景
超越期望的创新

UI设计的未来是无限创意的时代。蓝蓝设计将继续超越期望,成为项目的战略合作伙伴。我们不仅关注设计的瞬间美感,更关注设计在未来的持续创新和演进。

蓝蓝设计:引领创新的UI/UE设计公司

作为UI/UE设计的佼佼者,蓝蓝设计以独特的视角和对用户体验的执着追求,引领着设计的潮流。我们深谙设计对品牌的关键性影响,通过融合艺术与科学,为客户创造引人入胜的数字化体验。

让蓝蓝设计成为您项目中的合作伙伴,一同探索无限创意,将设计提升到一个新的高度。我们不仅是UI/UE设计公司,更是创新之源,与您共同构建未来数字体验的辉煌。

 

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司

银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发

 

日历

链接

个人资料

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

存档