写给大家的设计书_橙子解读.pptx

橙子教程（设计篇） 写给大家看的设计书（书籍） 讲解人：chenjunliang Content 目录 Part ONE 界面设计 Part Two Part Three 需要缴费 出现Bug. . . 四大原则 颜色运用 字体设计 项目分析 界面设计 Part ONE Part ONE 界面设计 百度百科： 人与机器之间传递和交换信息的媒介，FaceUI称包括硬件界面和软件界面，是计算机科学与心理学、设计艺术学、认知科学和人机工程学的交叉研究领域。（扯得你更晕了） 问问大神： 宇超、邱越、祥神 我的理解： 汉字 什么是界面设计 案例： 不好意思没有案例（现阶段我的例子） 为什么挨踢狗要了解界面设计？ 四大原则 Part Two Part two CARP 基本思想是，避免页面上元素太过相似。如果元素，如字体、颜色、大小、线宽、形状和控件等不相同，就让他们截然不同。 对比（Contrast） 每个元素都应与页面上另一个元素有某种视觉联系。在对齐很明显的基础上，可以偶尔打破对其规则。 对齐（Alignment） 可以重复颜色、形状、材质、空间关系、线宽、字体、大小和图片等，增加条理性和加强统一性。 重复（Repetition） 彼此相关的项应当靠近，归组在一起。若多个项之间存在很近的亲密性，它们会形成一个视觉单元，而不是多个孤立的元素。 亲密性（Proximity） 亲密性 四大原则 Part Two 这是一张名片 大家觉得怎样？ （亲密性：彼此相关的项应当靠近，归组在一起。若多个项之间存在很近的亲密性，它们会形成一个视觉单元，而不是多个孤立的元素。） Part Two Part Two One 识别关联视觉单元 Two 陌生社交关联视觉单元 Three 适当的留白界面更有条理性和组织性 Four 以上的视觉单元存在有哪些信誉好的足球投注网站关联所以放到发现页面形成一个大的视觉单元 One 识别关联视觉单元 Two 识别关联视觉单元 Three 识别关联视觉单元 Four 识别关联视觉单元 Part Two 亲密性小结 1.不要因为空白就把元素放到角落或者中央。 2.避免一个页面太多孤立的元素。 3.不属于同一组的元素不要建立关系。 要避免的问题 实现组织性。利用亲密性原则，可以自动的实现条理性和组织性，更容易阅读，易记住。 还可以使用空白（设计者喜欢）更美观（有条理） 根本目的 就是微微眯一下眼睛，统计页面上多少个元素。如果超过5个元素（取决具体情况），那就看看那些时孤立的元素，建立亲密性。 如何实现 彼此相关的项应当靠近，归组在一起。若多个项之间存在很近的亲密性，它们会形成一个视觉单元，而不是多个孤立的元素。 核心 对齐 四大原则 Part Two 这是数值展示 大家觉得怎样？ （对齐：任何元素都不能在页面上随意安放，每一项都应当与界面上的某一内容存在某种视觉联系。ps:亲密性） Part Two Part Two One Two 图片对齐、文字对齐（左对齐符合阅读习惯，更能便捷找到阅读的起点） Three 外观更清晰、效果跟分明 One 左对齐 Two Three Part Two 对齐小结 1.避免在页面上混合使用文本对齐。 2.避免居中对齐，除非需要正式、稳重的效果。 要避免的问题 使界面同意而且有条理。 根本目的 特别注意元素放在的位置。应该在界面找出与之对齐的元素。 如何实现 设计中，统一性是一个重要的概念。各个元素中彼此关联。 核心 重复 四大原则 Part Two 这是个人简历 大家觉得怎样？ （重复：可以重复颜色、形状、材质、空间关系、线宽、字体、大小和图片等，增加条理性和加强统一性。Ps：对齐、亲密性） Part Two Part Two One Two Four Three Two 左对齐的重复 Three 字体样式的重复（大小颜色等。） Four 线条重复(重复的根本目的是统一，并增强视觉效果) One 亲密性的重复 Part Two 重复小结 1.避免太多的重复一个元素。(喜欢红色) 2.结合对比使用重复（等一下讲解） 。 要避免的问题 为了统一，并增强视觉效果。更易于阅读。 根本目的 将一些元素（如标题）作为一个统一的元素，规定字体，颜色，大小，以及下面加一条线。 如何实现 视觉元素重复可将左瓶中各部分连在一起，从而同意并增强整个作品。重复不仅只针对一页的作品，对于多页文档的设计更显重要。（保持统一） 核心 对比 四大原则 Part Two 这是广告 大家觉得怎样？ （对比：基本思想是，避免页面上元素太过相似。如果元素，如字体、颜色、大小、线宽、形状和控件等不相同，就让他们截然不同。Ps：对齐、亲密性、重复） Part Two Part Tw