-
界面平淡无亮点?掌握这 3 招,轻松打造高级感界面
工作中,咱们每个人或多或少都会碰上极简风格的设计,但很多朋友都会有一个疑惑:为啥别人的界面舒服又高级,但我却做不出人家的感觉呢? 其实,极简风格也有一定的套路,今天我会以一套手表 UI 为例,从造型、色彩、排版 3 个点与你分享。 一、造型 1. 造型简洁,以基础型为主 画面中的图形元素,不要选太复杂的造型,咱们优先挑选一些偏基础型的图形作为主视觉,这样能保证咱们的页面风格不会出现大的问…- 11.9k
-
面试官说UI界面没亮点?试试这3个方法!
UI 设计界面不像运营视觉的页面,它没有那么多强视觉、花里胡哨的东西,我们大多时候需要在排版上发力,整合组织信息,只为了能更好地服务用户使用页面中的功能。 当然在页面上还可以增加更多的设计细节,那怎么去丰富这些特别的设计细节呢?这里就跟大家分享三个方法,分别是异形、破界、分割。 一、异形 将常见的图形做一些变换,让它的形状不常规,是丰富页面设计细节快速又有效的方式。 这里分享四种异形卡片的做法: …- 2.7k
-
设计被说不够精致如何提升?实战案例第二弹!
关于精度优化的小技巧,今天又来啦! 咱们继续这个硬核又实用的系列。 直接开整!优化狠活来了! 一、数据卡片 数字卡片1 当你的数据展示做成这样被老板说没有设计感,该如何优化呢? 先看看优化前后对比图吧 步骤如下 ⬇️ ① 分析问题: 我们首先要搞清楚老板说的没有设计感,是形式感不够?还是信息排版出了问题? 这里不难发现卡片是一个纯白色的矩形,过于普通;而信息排版的大方向 OK,但是数据这块儿,因为…- 5.2k
-
提升作品集最快的方式:5个要点帮你选好配图
APP 配图的选择逻辑 APP 的配图首先要遵循一些基本原则,保证其可看性,主要有下面这些要求: 比例正确:置入进画布比例是正常的没有被拉伸 内容相关:画面内容和应用场景是关联的,不是宠物照片用了双鞋子特写 画面完整:内容能展示全,而不是主体残缺,比如证件照人脸鼻子上方被截断 画质清晰:画质能达到展示要求,而不是网上被 “盘包浆” 的低质图片 前后关联:指向同一个对象的图片就应该统一,而不是一个用…- 11.2k
-
全面解析!移动端「个人中心」界面设计趋势和思路解析
一、我的页面的基本分析 我的页面就是大多数应用底部导航中的最后一个选项,是个人中心的板块,用于管理你的账号信息、数据、服务,以及实现对应用本身的相关设置。 我的页面通常在具有账户系统的应用中才会使用,如果没有账户系统的基础应用(如天气、日历工具)就没有使用它的必要。 而还有两个类似的页面类型很容易和我的页面搞混,一个是用户个人主页,一个是系统设置页面,在这里我们做个简单的区分。 用户个人主页是用户…- 12k
-
如何专业的搭建色彩系统?6个步骤讲清楚
今天和大家聊聊颜色系统,在做一套新产品的色彩体系时,大家常常需要解决一个问题,那就是颜色梯度,也就是色卡制作。如何从品牌色开始建立一套科学的调色板?这篇文章尝试解决这个问题。 无论你是一位需要从 0-1 制定色彩系统的品牌设计师,还是在一个已有设计系统的产品设计师,都需要掌握如何更加专业的创建设计系统中的颜色梯度。 一、什么是色彩梯度? 一个色彩梯度,可以理解为一个色彩范围,指的是颜色如何以平滑和…- 10.2k
-
UI设计师必看!5个章节教你系统掌握Toast设计
在数字化产品的交互体系中,Toast 作为一种轻量级反馈组件,如同用户操作旅程中的“耳语提醒”——它不打断主线任务,却能在恰当的时机传递必要信息。Toast的设计绝非简单的“弹出提示”,而是需要融合场景逻辑、认知心理学与交互美学的系统工程。以下将从定义、核心设计原则、场景应用到未来发展方向几个方面,全面解析这个“小而美”的组件如何撬动用户体验的大价值。 一、Toast 的定义 一位前谷歌微软员工被…- 13.2k
-
动效设计不够流畅?收下这份超全面的实战宝典!
「关于动效节奏的问题,有什么好的方法可以提供吗?」 这算一个常见疑问,我总结收到的问题反馈,基本都是「动画节奏应该怎么做呀」「做完的动效一卡一卡的感觉不流畅怎么整」,索性借着今天的契机,我整理了这样一篇主题文章,分享我对于动效节奏的一点经验与思考,仅代表个人观点,欢迎交流探讨~ 在当今数字时代,动效设计已然成为了产品和服务中不可或缺的一部分。 无论是手机 APP、网页界面还是智能设备,动效设计或是…- 5.3k
-
为什么你画的图大厂看不上?聊聊UI设计审美的真相
前阵子方法的首页设计分析里有个很有意思的回复,认为我发的大多数线上首页截图都是反面案例,只有中间的某个电商应用是有设计感的。 之所以有意思,是因为这组电商应用图是我们自己做的“飞机稿”,是对某个学员作业的优化演示,可以回顾之前的这篇分享。 这个演示只是给大家提供视觉层面优化的一些入门的知识和实操逻辑,虽然肯定能比原图好,但不代表它在专业性、完整度上能比肩这些线上案例。以我的经验来下结论的话,面向大…- 3.7k
-
5个章节掌握标签 Tag 设计方法
一、标签是什么 在日常生活中,“标签”通常指的是贴在包装或产品上的贴纸,上面写有相关产品或物品的具体信息。而在界面上,标签则是指用于标识、分类或描述界面上各个元素或内容的简短文本或符号。 二、标签的发展 标签的起源可追溯到互联网的早期阶段,当时博客和新闻网站的开发者们借助标签来标记网页中的关键信息,以提升用户的搜索效率。 随着社交媒体的兴起,标签开始流行起来。Instagram、Pinterest…- 15.8k
-
除了选择蓝白配色,健康和医疗类APP你还可以怎么深入设计?
编者按:如果你是医疗和健康相关的 APP 的设计者,你要怎么来设计?除了可以立刻想到的蓝白配色,你会怎样去构建整个产品的视觉、感官和体验?今天这篇来自 Mary Borysova 的文章,会详细分析不同医疗、健康类的 APP 的设计细节,完整地总结你还可以怎样去构建体验和感知。 2020 年 3 月美国热门健康与健身 APP 下载量排行榜 对于经常使用移动端健康类 APP 的人来说,64% 的人用…- 5.8k
-
6个产品细节剖析,看看高手是如何做设计的!
1. 大众点评-榜单入口的巧妙设计 大众点评首页榜单入口巧妙运用动画,在有限的区域内强化了用户对必吃榜的品牌认知。 动效吸引:首页榜单入口使用翻页动画,吸引用户注意。翻页效果及标签出现的动画一气呵成,翻页的过程能够激发用户的期待感,提升他们对榜单内容的兴趣。 品牌感知强化:通过动效效果,在有限的区域内展示大众点评必吃榜品牌,有效强化了用户对必吃榜的品牌认知。 2. 腾讯地图-美观与实用兼得的动效设…- 2.1k
-
UI设计缺乏细节?一个实战案例教你提升界面吸引力!
这次需要优化的案例是打卡页。打卡页的设计需要给用户提供满满的情绪价值,所以丰富的视觉元素必不可少。 来看看优化前的页面: 再来看看优化后的页面: 来看看,具体怎么实操的吧。 一、给头部增加视觉亮点 第1步 加入IP 本次的案例是运动赛的打卡页,所以我们可以加上符合运动主题的IP形象,形成差异化的设计: 第2步 设计标题 首先,主标题的字体当然要选用运营类的字体啦,如果没有复用的需求就去找AI生成一…- 3.9k
-
移动端表格页如何设计?给你5个解决思路!
如何在移动端设计表格?这似乎是一个设计难题。 对于表格来说,它本身需要大量的空间,需要大范围地滑动查看详细的信息。但在手机这样狭小的空间当中,我们真的很难进行操作。 但产品提出各种需求就是“我要我要”,那今天给大家分享一下移动端表格的设计思路。 首先我们先说说移动端表格的痛点。 因为手机本身是以竖屏为主,而对于表格这类数据形态时是以横屏为主,所以在内容呈现上就会存在明显的差异,就像横屏长视频与竖屏…- 23.1k
-
保姆级教程!总结AI产品的5种界面布局设计
哈喽,这里是设计夹,今天分享的是「AI 产品界面布局分析」。 当下,AI 已经融入到我们生活的方方面面。每个人都在使用 AI 服务,所有的公司都在尝试将自家产品与 AI 相结合。 本次通过整理分析各家 AI 产品的交互方式和展现形式,将 AI 助手界面总结为五类 UI 布局,并总结每种类型的特点、适用领域。 生成式 AI 界面通常围绕两个核心要素运行: “输入内容”和“微交互(视觉反馈)”。虽然每…- 11.9k
-
保姆级教程帮你掌握「用户体验要素」
一、什么是<用户体验要素> Jesse James Garrett 在 2007 年出版了《用户体验要素》一书,提出了从 5 个要素自下而上的建设用户体验。五要素分别为:战略、范围、结构、框架、表现。 战略层关注的问题是为什么做?—— “我们为什么要开发这个产品?” 范围层关注的问题是做什么?——“我们要开发的是什么?” 结构、框架、表现层则需要解决怎么做?——“我们如何达到上述抽象层…- 6k
-
谷歌都在推荐!为什么 GenUI 才是AI时代该有的设计形式?
最近 NNG Group、Google Design 等设计团队都不约而同地提到了一个关于 AI 时代的用户体验设计变革的新概念:Generative UI(GenUI),生成式 UI,并称为是 AI 时代的用户体验交互形式,深以为然。本文就来为你详细拆解下这个概念,并聊聊为什么这将成为交互设计发展的新趋势。 全文速览图 一、什么是 GenUI? GenUI 官方定义是: 由 AI 模…- 5k
-
如何正确使用设计规范,提升界面设计水平?
在前面的 C 端行业分析说过,当前的 C 端 APP 界面为了抢夺用户的注意力,设计越做越花哨,运营、国潮化的风格越来越浓烈。 所以,现在的作品集项目设计和准备都无可避免的要有所涉猎。对于初级设计师来讲,“模仿(致敬)”一两个成熟案例没什么问题,但要做出一整套,就驾驭不住了。 而关键的问题,就出在平面四要素的 —— 重复性上。 一、学员案例分析 “重复”是四要素中最简单的一个原则,即在画面中对设计…- 4.7k
-
3分钟快速搞懂!导航栏/标签栏/应用栏的区别和设计规范
例如在谷歌的Material Design 3设计指南(MD3)中,①为导航栏,用于切换应用内3-5个核心功能版块;②为顶部应用栏,③为底部应用栏,聚焦当前页面的导航控制(如返回)、功能操作(如搜索)与信息展示(如标题)。 但在苹果Human Interface Guidelines设计指南(HIG)中,将①定义为标签栏,将②定义为导航栏。 为什么HIG中对导航栏的定义不同呢? 我认为iOS中的②…- 5.8k
-
如何打造品质感的UI界面?
前段时间做了张黑金页面,整个过程可概括为起起落落落落落起。 从「纠结颜色如何选取」 到「画面没有精致感」再到「觉得没有品质感」,整个过程中都在不断地自我审视以求达到最佳。现在就请大家来看看最后产出的效果: 黑金风格的页面往往用在 VIP、榜单、颁奖类的页面,主打一个尊贵、精致、高端、荣誉…… 怎么在页面中打造这种尊贵、精致、高端、荣誉……的感觉呢? 我有几个点可以跟大家分享一下: 黑金页面颜色选取…- 5.5k











