中文字幕一区二区三区在线中文-日本中文字幕 在线观看-欧美日韩国产亚洲综合-性色AV一二三天美传媒

廣州總部電話:020-85564311
20年
互聯(lián)網(wǎng)應(yīng)用服務(wù)商
廣州總部電話:020-85564311
20年
互聯(lián)網(wǎng)應(yīng)用服務(wù)商
請輸入搜索關(guān)鍵詞
知識庫 知識庫

優(yōu)網(wǎng)知識庫

探索行業(yè)前沿,共享知識寶庫

UI設(shè)計規(guī)范的理解與搭建

發(fā)布日期:2025-01-03 10:52:57 瀏覽次數(shù): 1295 來源:CppTeam


什么是ui设计规范?为什么要搭建ui设计规范?相信这是很多ui新手都会面对的问题。

那么接下来,就让我们一起解开疑惑吧!


什么是UI设计规范

01

UI设计规范(User Interface DesignStandards)是指在设计用户界面时需要遵循的,能显著提高作品质量,设计效率的一系列原则和最佳实践。

换言之,就是设计合格UI作品所要遵循的最基本的原则。

根据搭建对象和使用对象的不同,用通俗的话来讲,ui设计规范可以大致分成大品牌的设计规范(品牌视觉识别系统)和个人及团队搭建的设计规范两类。

“大品牌的设计规范”通常是由大型公司等制定的,用以确保产品设计一致性的规范。(例如苹果公司的设计资源库Apple 设计资源 - Apple Developer

而这些设计规范,可以通过登录各大公司设计官网获取,或者在figma等设计软件的资源社区explore community进行获取。

对于ui设计师而言,这无疑是一份宝贵的学习资源~

示例:figma资源社区入口

 “个人及团队搭建的设计规范”则是一种根据不同需求搭建的“个性化”设计规范。这些规范能够更加灵活更新迭代,快速响应市场变化。

想要学习如何搭建这样的规范吗?

那就让我们一起看看下面的内容吧!


如何搭建UI设计规范

02


1. 分析需求,确定风格

分析项目实际设计需求,确定整体设计原则和设计风格,确保设计作品的不同部分在颜色、字体、按钮样式、图标和布局等方面保持风格一致。

为此,我们可以适当使用情绪板等工具作为风格指南。示例:



2. 定义配色

即通过前面的风格分析,搭配合适的主色,辅助色和中性色。


3. 定义字体

规范字体大小尺寸,样式,标题层级,打造清晰的层级结构 。


4. 搭建组件库

定义按不同种类按钮,对话框,输入框,导航栏,表格等的样式和状态 ,创建基础组件;

设计一套风格统一的图标,作为图标组件;

运用栅格系统等辅助整体空间布局的系统,创建布局组件;

基于团队实际需要,使用适当的方式将各种组件抽象整合在一起,搭建组件库。

示例:



5. 更新迭代

在设计规范使用过程中,收集使用反馈验证使用效果,综合团队成员使用意见,对现有设计规范适当进行更新迭代。

这是搭建一个基础的ui设计规范的基本步骤,用于加深大家对其的理解。想要搭建更加完整的,实用的ui设计规范,还需要根据具体的使用场景做不同的精进和调整。

END


優(yōu)網(wǎng)科技,優(yōu)秀企業(yè)首選的互聯(lián)網(wǎng)供應(yīng)服務(wù)商

優(yōu)網(wǎng)科技秉承"專業(yè)團隊、品質(zhì)服務(wù)" 的經(jīng)營理念,誠信務(wù)實的服務(wù)了近萬家客戶,成為眾多世界500強、集團和上市公司的長期合作伙伴!

優(yōu)網(wǎng)科技成立于2001年,擅長網(wǎng)站建設(shè)、網(wǎng)站與各類業(yè)務(wù)系統(tǒng)深度整合,致力于提供完善的企業(yè)互聯(lián)網(wǎng)解決方案。優(yōu)網(wǎng)科技提供PC端網(wǎng)站建設(shè)(品牌展示型、官方門戶型、營銷商務(wù)型、電子商務(wù)型、信息門戶型、微信小程序定制開發(fā)、移動端應(yīng)用(手機站APP開發(fā))、微信定制開發(fā)(微信官網(wǎng)、微信商城、企業(yè)微信)等一系列互聯(lián)網(wǎng)應(yīng)用服務(wù)。


我要投稿

姓名

文章鏈接

提交即表示你已閱讀并同意《個人信息保護聲明》

專屬顧問 專屬顧問
掃碼咨詢您的優(yōu)網(wǎng)專屬顧問!
專屬顧問
馬上咨詢
聯(lián)系專屬顧問
聯(lián)系專屬顧問
聯(lián)系專屬顧問
掃一掃馬上咨詢
掃一掃馬上咨詢

掃一掃馬上咨詢

和我們在線交談!