首页

10张图让您读懂什么是UI、 UX?

清阳

什么是UI、 UX?或者说它们之间有什么不同?说句实话早几年我连UI都不是很明白,说出来都有一点不好意思了……

Ok…让我们用图片的形式来看一下UI与UX的不同之处吧。

图一:倒过来的蕃茄酱瓶设计,考虑到番茄酱快用完时很难倒出来的使用情境

 

image.png

图二:从定义来解释UI与 UX之间的差异,两者定义有很大的不同。

  • UI定义:UI是网站页面是如何物理布局。一个UI设计师会和你谈东西应该放哪里,用什么颜色。UI是负责网站的创意和视觉作品。

  • UX定义:UX专注于网站,它的行为与互动,比如一个盒子滑出,以及人们如何与它进行交互,比如他们会点击或输入进行交互。UX处理的内容和网站地图的结构。

image.png

图三:从专业分工的角度来说明差别,可以看出负责的部份有哪些相同,哪些不同。

image.png

图四:这张图比较复杂,但是基本上还是看得出差异。相同之处很明显,都有大胡子,但是装扮上就有很大的区别。为什么?你们可以根据定义思考一下……

image.png

下面的这张图跟上面的那张是同一张,只是风格不一样,从设计师的角色转变成很酷的时尚年轻人。

 

图五:从工作职责来解释差异, UX的范围很广,很少人可以精通全部,可以说几乎没有。

image.png

image.png

图六:这张图的表述可能并不全面或清晰,但可以做为一个参考。

image.png

图七:UI、 UX基本的工作项目来区分的话,UI没有品牌推广这个职位。

image.png

 

图八:从产品的角度看UI与UX,UI是产品的一部份,UX是使用产品的体验。

image.png

图九:UI Design:功能;Usabilitydesign:动作;User Experiene Design:情感;

image.png

图十:UI是用来取内容的工具,使用者使用UI吃完东西(内容)的体验是UX。

image.png

总结:UI设计是展现视觉层面的(界面),而UX是使用过程中的情感(互动与体验)。UX设计师不仅关注界面的设计,更关心所有会影响使用者体验的一切。如架构、互动、内容与及使用者对象、需求、价值观。

有人会说设计UI不就是在设计UX吗?如果用户的体验只注重视觉界面的美观,或许可以这么说。但是使用者手上拿的不是UI,而是产品,UI只是产品设计的一部份,体验不仅受到产品的影响,还会受到使用产品体验过程中的情境及使用者对品牌印像等等其它体验相关的事影响。

转载:微信公众号UI设计

UI欣赏:大圆角 UI 设计:从功能妥协到美学符号的演进

清阳

大圆角设计并非凭空出现,其起源可追溯至早期图形界面时代。在 CRT 显示器时代,像素密度低且显示边缘易出现锯齿,设计师通过圆角弱化视觉毛刺,这是基于技术限制的功能妥协。随着显示技术升级,圆角逐渐从 “必要修正” 转变为 “美学选择”,2013 年 iOS 7 的扁平化革命中,大圆角首次大规模应用于图标与控件,打破拟物设计的硬朗边界,开启现代 UI 的柔和风格浪潮。

在应用方案上,大圆角设计需结合场景平衡功能性与美观度。在移动端界面中,卡片式布局常搭配 16-24px 大圆角,如微信读书的书籍卡片,既通过圆角区分内容模块,又降低手持设备的视觉压迫感;针对儿童应用或生活服务类 APP,32px 以上的超大圆角能传递亲和力,例如美团 APP 的功能入口图标,圆润形态更易吸引用户点击。

在桌面端设计中,大圆角应用需考虑屏幕尺寸差异。Windows 11 的窗口采用 28px 圆角,在大尺寸显示器上营造轻盈悬浮感;而设计软件 Figma 的工具栏按钮则采用适中圆角,避免过度圆润导致的操作辨识度下降。此外,大圆角还可与阴影、渐变结合增强层次感,如苹果 macOS 的控制中心,通过 24px 圆角与柔和阴影,打造出符合物理直觉的 “半透明毛玻璃” 效果。

下面来欣赏一组优秀的大圆角UI设计。

 

640.png
by @ Budiarti R.

 

 

640 (1).png
by @ Budiarti R.
640 (2).png
by @ Afterglow
640 (3).png
by @ Budiarti R.

从技术妥协到设计语言核心,大圆角的演变折射出 UI 设计 “以人为本” 的趋势 —— 它不仅是视觉风格的迭代,更是对用户心理舒适度与交互体验的深度考量。

转载:UX设计便利店

告别平淡!4 大维度解锁设计形式感,让作品瞬间出彩

涛涛 设计思维

做设计时总陷入这样的困境:界面元素齐全却毫无记忆点,视觉表达单调乏味,精心打磨的作品依然抓不住用户目光?其实,设计的 “质感” 往往藏在形式感里。无需复杂的创意构思,只要掌握一些实用小技巧,就能让普通设计摆脱平淡,快速提升视觉吸引力。下面为你拆解四大核心维度,手把手教你给设计注入形式感,轻松打造出有记忆点的界面!

不止于好看:UX 视角下的视觉设计验证方法论

涛涛 设计思维

在视觉设计领域,我们常常陷入这样的争论:“这个版本更高级”“那个设计更有品牌感”“我觉得用户会更喜欢这个风格”。这些基于设计师专业审美和经验的判断固然重要,却往往带着主观局限 —— 设计师终究不是用户,我们眼中的 “完美设计”,未必能被用户理解、接受并产生预期行为。

组件库设计核心:Tag 标签变体组件的规范化实践

涛涛 B端ui设计文章及欣赏

在数字化产品的界面设计中,Tag 标签作为高频使用的基础组件,承担着分类标记、状态提示、筛选导航等关键功能。从 NFT 平台的资产状态标注,到日常应用的内容分类,Tag 标签的设计直接影响用户的识别效率与操作体验。作为组件库中的重要组成部分,变体组件的规范化设计能大幅提升团队协作效率,保证产品界面的一致性。本文将结合实际设计经验,从设计原则、组件构成、参数规范到应用场景,全面拆解 Tag 标签变体组件的设计逻辑。

UI/UX 设计:让任务流程成为用户体验的加分项

涛涛 交互设计及用户体验

在数字产品的使用场景中,用户的每一次操作本质上都是在完成一项任务 —— 从修改个人资料到下单购物,从家电报修到优惠券使用,任务流程的设计直接决定了用户的使用效率与体验感受。对于 UI/UX 设计师而言,任务处理不仅是一项基本功,更是平衡效率与体验的核心能力。好的任务流程设计能让用户在不知不觉中完成目标,而糟糕的设计则会让用户陷入迷茫、烦躁甚至放弃。那么,如何打造既高效又贴心的任务流程?关键在于抓住 “用户核心需求” 与 “流程逻辑合理性” 两大核心。

书法字体在海报设计中的应用:国潮美学的笔墨新生

蓝蓝设计的小编 行业趋势

当毛笔的笔锋与海报的视觉张力碰撞,书法字体便成了当代设计中 “传统意境” 与 “现代表达” 的纽带。从国潮品牌到文化海报,书法不再是单纯的文字载体,而是以笔墨韵律、文化符号、视觉层次三重身份,重塑着海报的审美语言。
 

一、笔墨韵律:用线条讲 “情绪故事”

 
书法的笔势、墨色本身就是 “情绪容器”——
 
  • 狂草的张力:像图 4 “创享” 海报,飞白的笔触、大开大合的结构,将 “创享的热烈” 直接通过线条的动感传递,黑底白字的对比更放大了这种酣畅感;
  • 行楷的温润:图 7 “静” 海报中,行书的婉转笔锋搭配水墨晕染,把 “宁静自在” 的意境揉进笔画的起承转合里,让观者从字形中感受到松弛。

二、文化符号:让文字成为 “信息锚点”

 
书法字体自带文化基因,能快速锚定海报的主题调性:
 
  • 节气 / 传统主题:图 5 “立秋” 海报,将 “秋” 字塑造成木雕质感的羽毛形态,既保留书法的笔意,又以 “秋雁” 的意象呼应节气,让文字成为 “节气文化” 的视觉符号;
  • 国潮品牌主题:图 9 “仙” 字海报,把书法笔触与山水纹理结合,搭配 “Chinese Tea” 的英文标识,让 “中式茶” 的文化属性通过书法字体自然流露。

三、视觉层次:以字形造 “空间节奏”

 
在海报构图中,书法字体是天然的 “视觉核心”,同时能构建多层节奏:
 
  • 立体塑形:图 1 “周” 字海报,将书法转化为浮雕质感,搭配背景的山水楼阁,让平面海报生出 “中式器物” 的空间纵深感;
  • 虚实叠加:图 8 “童真” 海报,把书法字体与英文单词(“ZHEN”)拆分融合,水墨肌理的实与文字拆分的虚形成对比,让 “赤子之心” 的主题更有设计张力。

从笔墨情绪到文化符号,再到视觉节奏,书法字体让海报跳出 “文字 + 图形” 的常规框架,成为承载中式美学的 “移动意境”。

 

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

 

image.png

 

导航设计终极指南:让用户不再迷路的核心逻辑与实践

涛涛 系统UI设计文章及欣赏

在产品设计中,导航就像一张隐形的地图,它承载着用户定位、路径选择与目标抵达的核心功能。一个优秀的导航设计,能让用户在复杂的信息架构中轻松找到方向,而糟糕的导航则会让用户陷入 “找不到、回不去” 的困境,最终导致产品使用率下降。导航设计的本质,是通过清晰的规则与人性化的交互,让用户明确 “我在哪、能去哪、怎么去”,这需要设计者兼顾逻辑性、高效性与用户习惯,构建全方位的导航体系。

藏在日常里的温柔:7 个让人惊艳的人性化设计

涛涛 设计思维

在设计领域独树一帜的日本,用四十余年构建起与欧美比肩的成熟体系。从平面设计之父龟仓雄策,到无印良品创始人田中一光,再到享誉全球的原研哉,日本设计师始终秉持着 "重视自然、简约朴素、以人为本" 的理念,将贴心细节融入生活的方方面面。在东京生活的两年间,这些日用产品中的巧思让我真切感受到:好的设计从不是刻意张扬,而是于细微处滋养生活。

反叛与复兴:新粗野主义设计,数字时代的 "反主流" 美学革命

涛涛 行业趋势

在追求精致渐变、极简留白的主流设计语境中,一种带着粗犷质感、强烈对比的设计风格正悄然崛起 —— 它就是新粗野主义(Neo-Brutalism)。这种脱胎于 20 世纪建筑粗野主义的设计流派,在数字时代以反叛姿态打破审美惯性,用 "不修饰的真实" 和 "功能至上" 的理念,成为独立创作者、创意品牌追捧的视觉语言,掀起一场关于设计本质的重新思考。

日历

链接

个人资料

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

存档