设计规范+切图命名

用户头像
南京/UI设计师/8年前/819浏览
设计规范+切图命名
用户头像
徐臻茵
切图规范
设计规范+切图命名(图ZMTExMDE5MDIw) - 其他UI - 站酷设计师徐臻茵原创素材 - 站酷ZCOOL
一、 切图命名英文缩写的3个原则

1. 较短的单词可通过去掉“元音”形成缩写

2. 较长的单词可取单词的头部几个字母形成缩写

3. 还有一些约定俗成的英文单词缩写



二、命名规则

模块_类别_功能_状态.png

U妹举个栗子:nav_button_search_default.png

释义为:导航_按钮_搜索_默认.png



启动界面:

启动图片 default.png

启动logo default_logo.png

如:default.png\defoult@2x.png\defauLt-568@2x.png



登录界面(login)

登录背景 login_bg.png

登录logo login_logo.png

输入框 login_input.png

输入框选中状态 login_input_pre.png

登录按钮 Login_btn.png

登录按钮选中状态 Login_btn_pre.png



导航栏按钮 (nav) 命名

nav_功能描述.png

如:nav_menu.png\nav_menu_pre.png(同按钮选中前后两种状态命名 )



按钮命名(btn可重复使用按钮)

一般 normal btn_xxx_normal.png

点击 highlight btn_xxx_highlight.png

不能点击 disabled btn_xxx_disable.png

按下 pressed btn_xxx_pressed.png

选中 selected btn_xxx_selected.png 做为复数选择出现机会不高

Collect
3
Report
|
30
Share
相关推荐
评论
用户头像
in to comment
Add emoji
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
You may like
相关收藏夹
大家都在看
Log in