ui网站设计规范 (apple watch ui设计规范)

做UI规划师的要求
UI规划除了要把握一些根本的操作软件，如PS AI AE AXURE 以外呢，还要把握比方配色，排版，字体规划，三大构成，消费心理学，沟通学，以及思想导图，原型图，还有交互逻辑，标准，切图，了解程序，用户体会，还有营销课程方面的内容。一个合格的UI规划师，不该仅仅一个会运用东西的技能师，还应该具有把控整个项目发展的才能。
UI规划需求包含什么内容
一．开端知道UI：了解UI规划师的人物界说和价值体现，UI的意义、UI规划师的意义
学习内容：学习规划根底、字体、构图、手绘等根底技能。快速培育UI规划师的视觉敏锐度，和绘画才能。
二维造型办法，二维精约图标制作原理与技法，各种原料质感体现。
三维造型办法（物体的体积、结构、透视与光影体现）
颜色原理：颜色特点、比照与谐和、颜色的混色装备、规划颜色的表述系统，颜色的装修美感及颜色的体现办法
二．规划软件运用：以Photoshop软件为东西，解说书本封面规划、海报规划、广告规划、影楼后期处理、包装规划、喷绘规划、画册规划、DM规划等企业实践工作中的详细项目。
以矢量图形制作软件Illustrator为东西，解说标志规划、字体规划、图形规划、企业VI规划、卡通形象规划等企业实践工作中的详细项目。
字体专项规划：字体的分类和品种、字体的知道、各种场合字体的运用、形象时髦字体规划、字体标志及在广告规划中的实践运用
版式专项规划：版式的概念、版式中的颜色运用、版式中的字体运用以及网页、书本、报纸、画册、DM、海报等中的运用。
平面项目规划：结合软件、颜色、字体及版式的学习，针对宣传单、折页、手刺、海报及VI做专题规划，提高归纳运用才能及平面UI规划才能。
三．WUI规划根底：页面规划根本流程与规划标准的概念性解说，要点了解WEB界面规划标准；网页配色技巧、颜色与构图的概念及技巧；网页导航与字版式规划
网页规划软件运用：以Fireworks为东西介绍软件的根本构成、矢量东西和位图东西、WUI用户界面及广告规划。
以Dreamweaver为东西树立站点、增加页面元素、运用CSS款式及交互行为。
以Flash为东西了解动画制做原理与技巧，典型WUI商业广告中的Flash技能与完成。
网页规划要素：学习web网站规划根本要素，网站图标、按钮、广告banner、专题页规划等元素的详细规划办法
Web标准化布局：（X）HTML/HTML5言语：HTML语法与常用标签的详解，包含布局标签，表格标签，表单标签等。
CSS/CSS3层叠款式表：CSS语法与常用特点的详解，运用CSS对网站中各个模块进行润饰美化。
WUI项目实战规划：以企业网站、电商网站及专题网页做实战项目规划，经过全流程规划，到达网页界面规划要求
四．UE交互规划
1. 手机主题、界面与图标规划；
2. 拟物化与扁平化规划；
3. 系统性学习苹果IOS规划标准；
4. 系统性学习Android规划标准。

arizona western college

一、轴

轴在UI规划中是最根本、最常见的概念，也是用来安排界面结构的重要中心。简略说来，轴是在规划的时分安排一系列元素的假象线，鄙人面的规划图中，轴以虚线的方法被标示出来。

1、对齐

轴最常见于对称元素的运用，当元素被安置成轴对称的布局的时分，会给人有序感。就像日子中绝大多数的工作相同，咱们更倾向于享用有序的的东西，它们令人感觉平稳、舒适、和蔼可亲。最简略的一个比如便是iTunes 程序中的专辑列表的规划，一切的专辑列表在界面的左边坚持对齐，环绕虚线轴轴对称。

2、强化

尽管轴是一条设想的线，可是假如周围的元素的边际操控得满足规整，这跳线会在视觉中变得愈加“显着”的。最好的比如是城市中的路灯构成了路途两旁建筑物之间的轴，假如一边有建筑一边没有，那么这种轴线的感觉不会那么激烈。

从产品规划的视点上来看，Twitter 的时间线规划便是一个很好的事例，左边的头像和右侧的推文一起塑造出缝隙中轴线的感觉。

3、运动

当咱们碰到某先线条的时分，视觉会很自然地沿着这些方向运动，就好像咱们站在街上，会自觉地沿着大街的两端走动。两个端点决议了线，界定了开端和完毕的当地，线，或许说轴线的存在会引导和提示运动的方向。

SoundCloud中，音轨沿着一条既定的水平轴线运动，跟着音乐的播映，音轨自然地自左向右匀速运动。

4、连续性

假如结尾是不确定的，那么你一般会沿着轴线的方向阅览/运动，直到你找到感爱好的东西，或许感到厌恶并封闭运用。在建筑学中，未清楚界定的结尾十分罕见，由于建筑的建筑一般无法永久继续下去，可是UI规划则不相同，无限地翻滚下去是无比受欢迎的规划方法。

Pinterest的APP中便是这样做的，继续不断的图片沿着中轴线的方向继续不断地翻滚下去，只需你有爱好一向观看下去。

二、对称

当元素被均匀地放置在轴线的两头之时，他们构成了对称的联系。当元素被精准地在轴线两头一一对应之时，它们就构成了完美对称。

1、平衡

对称令整个规划愈加平衡。当元素与控件在轴线两头处于相同方位之时，会给人以协谐调和的规划感。当咱们在规划大街两头的房子建造的时分，假如左右两头都是5间巨细共同的房子，当你走在街上的时分这种平衡的规划会令人十分舒适，这是平衡给人的感触。

Rdio的APP规划就遵从着这样的规划规矩，屏幕两头的控件是相同的标准，这类布局很适合阅览，用户会自觉地自上到下，从左向右检查。

2、不对称

假如轴线两头的控件安置不再是一一对应尺度附近，那便是不对称的规划。不对称的规划会给人显着的失衡感，可能会令人不舒畅，可是也能造就残损美，当然这要看你详细怎么做。

尽管Pinteret 的APP规划在全体上是沿着中轴线对称的(宽度共同)，可是两头的界面控件并非是对称的，它们的高度并不共同，方位也是参差的。略微一点的落差都会被眼睛捕捉到，而这样的差异让用户无法精确地左右次序阅览。不对称规划打破了规划的平衡性和舒适性，可是也能够缓解了规律性规划带来的视觉疲惫。

三、层级

当某个元素呈现在比其他元素更重要的方位的时分，层级就呈现了。

1、尺度

假如一个规划元素在尺度上比其他的控件更大，就会区别出层级。毫无疑问，咱们检查某个规划的时分，一般会被巨大的元素招引到。假如一个建筑物有5个出窗户，其间一个是其他四个的两倍大，咱们的注意力自然而然会被招引曩昔。

经过尺度来区别文章列表层级的典型便是稍后读运用Pocket。顶部的轮播文章具有更大的图片，它的方位和尺度会令咱们一眼注意到。

2、形状

假如一个控件在形状和形状上同其他的不相同，也能够让它独立出一个层级。不规矩的规划相同会令人侧目。建筑物的正面具有五个相同的窗户和一闪大门，你会马上注意到门的共同之处。

在Instagram的个人信息页中，圆形的个人头像在方形的图片中独具匠心，十分抓人眼球。它会让人意识到，这个共同的东西，更为重要。

3、方位

方位的存在相同能显示层级的不相同。在圆圈之内，中心方位的东西比边际部分的看起来更重要。坐落轴线顶端的控件会显得比其他部分的优先级更高。

以规划运用Path的规划为例，时间轴极点处的用户头像就显着比时间轴上的其他部分更重要，而这个当地正好展现的也是用户头像。

四、韵律

UI规划和建筑规划相同有着韵律之美，重复的形式会营造出共同的节奏之美。

1、形式

了解韵律最直接的方法便是听歌。音乐具有节奏感，绝大多数的音乐遵从着相同的节拍，节拍便是音乐形式的一部分。

这方面最典型的APP是Airbnb，APP列表中每一间房子都占有一个模块，模块中有着巨细相同的图片，价钱、方位和房东信息和图片的相对方位必定，且排版匀称舒畅，两个模块之间的距离也相同，当你阅览的时分，了解的节奏会让你清楚地知道上哪看要害信息。

2、连续

当节奏被距离打断的时分，会构成不同的层级。听歌的时分，均匀的节奏被其他的音乐元素打断的时分，你会意识到这是比较特别的部分。

在Twitter的APP中，推文和推文坚持着相同的款式，均匀的节奏，可是其间的“引荐用户”一项有着不同的款式，它刺进到推文列表中，打破了整个信息流的节奏，凸显出不同的层级，会很快捉住你的注意力。