UI 设计 - JavaScript.net.cn 「线球实验室」

AI 制作的图标上传到 iconfont 以后丢失描边，就是描边不见了，只剩下填充色。解决方法就是选择描边对象，然后在菜单栏选择“对象- 扩展- 确定”，就可以把路径转换成形状。

设计的四个基本原则

（1）对比（Contrast）对比的基本思想是，要避免页面上的元素太过相似，如果元素（字体、颜色、大小、线宽、形状、空间等）不相同，那就干脆让它们截然不同。要让页面引人注目，对比通常是最重要的一个因素，正是它能使读者首先看到这个页面。（2）重复（Repetition）让设计中的视觉要素在整个作品中重复出现，可以重复颜色、形状、材质、空间关系、线宽、字体、大小和图片，等等。这样一来，既能增加条理性，还可以加强统一性。（3）对齐（Alignment）任何东西都不能在页面上随意安放，每个元素都应当与页面上的另一个元素有某种视觉联系。这样能建立一种清晰、精巧而且清爽的外观。（4）亲密性（Proximi

如何使用 Photoshop 设计 APP UI

如何使用 Photoshop 设计APP 页面，只要熟悉Photoshop 的常用操作就可以。使用 Photoshop 适合设计高保证的APP UI，适合设计师使用。偏向产品经理的化，应该使用墨刀、Axure、Adobe XD 或 Sketch 等。1，了解设计稿尺寸规范更多设计尺寸细节可以参考：https://javascript.net.cn/article?id=6712，使用 Photoshop 设置APP画板创建移动设备 iPhone 6 750x1334像素创建相关的参考线，视图新建参考线也可以使用矩形工具创建线框图。智能对象的混合选项颜色叠加改变图标颜色。 4，APP 首页

移动端UI设计规范「小白干货」

从事UI设计，一直没看到完整版的UI设计规范学习资料，特此总结整理方便大家学习交流~一，关于UI规范的理解很多新人在开始做移动端UI设计的时候，往往对界面的一些尺寸规范不是十分清楚，对做UI设计的基础概念也没有清晰的认识，很多时候都是凭借自己的感觉和经验去绘制界面，心里并没有一个清晰的概念，导致做出来的页面总是不那么尽如人意。本文整理汇总了一些界面设计（iOS系统）中常用的一些尺寸规范和方法，如控件间距、适配、标注、切图等，设计师在设计时并不一定要严格遵守，但对这些规范应有所了解，并融会贯通。二，本文从八个方面全面阐述 UI 规范01.UI基础概念02.UI元素设计规范03.UI版式设计规范0

使用 Photoshop 创建矢量图标库 Iconfont

如何不用 Adobe Illustrator 做字体图标，这是个问题。1，首先使用 Photoshop 的矢量工具和布尔运算绘制闭合的图形。2，复制图层面板中的 SVG 样式，保存为svg文件，上传到阿里巴巴 iconfont.cn。3，然后按照 https://www.iconfont.cn/help/detail?helptype=code 就可以使用了。@font-face { font-family: 'iconfont'; /* project id 1557805 */ src: url('//at.alicdn.com/t/font_1557805_4c

NETFLIX纪录片: 设计的艺术 - 平面设计

https://www.bilibili.com/video/av11019747

LOGO设计的时候为什么要画那些圈圈？

你们知道Twitter的小鸟logo是由13个圆圈套合而成的吗？这个经典的小鸟logo是2012年更新之后的成果。记得Twitter当时说，这个logo由13个重叠的圆圈组成。不管怎么说，这种用正圆卡出来的弧形确实让人看着很舒服，比随手画出来的弧线要好很多（大神的随手画除外）。下面这组图来自网络，是很久以前小编在网上看到的。当时最让我惊讶的不是画面上有颜色的主体部分，而是背后那些复杂的辅助线。这些辅助线让小编想到当初高考时候的那道圆的平面几何题。在那之前，小编从来没想过能用数学画出这么感性的东西。后来，就慢慢看到很多logo都是用这种方法画出来的。下面这组图是设计师 Dor

Photoshop创建金属质感文字

1. 创建文字，选定颜色 2.图层样式 3. 在需要比较亮的地方，画笔画白色类型为叠加参考：https://www.bilibili.com/video/av15022596/?spm_id_from=trigger_reload

企鹅直播品牌Logo提案，流程很好

参考了企鹅电竞和09UI的腾讯视频品牌提案，尝试着去理解系统的设计思路和方法。来源：https://www.zcool.com.cn/work/ZMjIxMDgwODQ=.html

物理对齐和视觉对齐

视觉对齐：用最简单的文字来举例—————— 这两行字，左边对齐了吗？是否会有第一行偏右了一点的感觉。实际上这两行文字已完全对齐，这叫物理对齐，视觉不齐。而做设计当然是追求视觉上的，人的眼睛很容易产生错觉，大部份时候要避免，有时候要利用。把第一行左移一点：这样，左对齐的感觉更明显，实际上金字的边已往左超过了D字的边。为达到视觉对齐的目的，而实际是不齐的，原因是因为边界面积。大标题与小字，艺术字与黑体，不规则元素与方块……随时都出现这种情况。来源： h

一个LOGO的设计过程

我们在做LOGO设计的时候往往都是两组或两组以上的元素相互堆叠后，进而设计出新的图形。在设计LOGO之初，我们往往会根据甲方或客户的信息，针对品牌进行市场调研，分析公司资料，服务体验，竞争对手，品牌市场认知等，对企业的用户人群定位和品牌概念：提炼几组精准关键词（品牌灵魂所在），然后根据几组关键词进行头脑风暴。头脑风暴过程：收集想法——产生联想——进入创造——联想图案在头脑风暴的时候，针对关键词任意联想相关的词语，可以多级层次的联想，不在乎质量，达到足够多的数量，也不要带批判性的去评价联想词语。比如

《一个APP的诞生》：APP设计流程

在目前的APP产品设计中大部分都是采用小团队作业的方式，关于流程等通常很少关注与规范，所以导致产品在进一步发展壮大的过程中很容易就乱套了。一个产品的研发流程大致为：基础调研→产品分析→交互设计→视觉设计→研发→测试→交付。其中需要三次评审，分别为产品需求评审（需要产品＋设计＋研发人员参与），原型评审（需要产品＋设计＋研发＋市场等人员参与），最后是开发评审。设计师在制定需求的环节加入是最为理想的状态，这个阶段加入可以更利于理解需求的起源并省去后期重新沟通的成本，还能为产品带入更多设计层面的思考，将用户体验注入到产品的基因中去。而通