罗胖：“直面挑战,躬身入局,皆为我辈中人。” for循环-普通循环for循环在Swift中是非常常见的循环。 12345let count = 1...10for number in count { print("Number is \(number)") } 你也可以循环数组等。如果你不需要创建类似上面例子的number数据，可以使用下划线代替，这样swift就不会创建这个多余的数据了，例如： 12345let albums = ["Red", "1989", "Reputation"]for _ in albums { print("Play in Apple Music.")} while循环-条件循环while会一直循环到满足条件为止不再循环。 12345678var number = 1while number <= 20 { print(number) number += 1}pri ...

目前我是一个Sketch的深度使用者，最近Figma非常火，很多设计的公众号文章都是在推他们。不知道是不是没什么可写了随便找的题材。但是它确实带动了一批。很多文章和视频的各种吹Figma吊打的，所以我也抱着试试看的态度去简单尝试了一下。 总结起来就是 1.Figma具备了难以置信的远程协作能力、跨平台能力、分享能力。 2.Figma有的功能Sketch几乎都有。很多功能确实Figma用户体验会更好，问题是差距还没有大到让Sketch用户转型的能力。对比Photoshop和Sketch的做UI的差距，Figma和Sketch也就是一个锦上添花。 3.对于高阶使用的用户而言Figma比Sketch更贵，对于简单使用的用户而言，Figma更便宜。 4.Figma组件库搭建需要收费（跨项目使用组件）。因为我在本地有着自己维护的Sketch Symbol（组件库）和Sketch Data（内容填充库），是个组件库重度用户，不付费的Figma对于我可能是无法使用的。 5.如果团队对协同要求很高，团队很多设计师维护一个sketch文档的情况比较多，强烈建议使用Figma。 6.如果团队设 ...

快捷键：cmd+shift+. 创建隐藏文件夹就在文件夹/文件最前方添加.

tags下本来有个javaweb，但是强迫症的我想改成JavaWeb（图片中的是后来改好的）。直接把markdown文件中的标签改了并没有用。访问的时候tags/JavaWeb报404。 本文为转载文章，以下内容来源于 利用hexo在GitHub搭建博客改变tag因为大小写问题而404的解决方法 轨迹 解决方法将博客根目录下的.deploy_git/.git/config文件改一下（.git是隐藏文件夹，记得调一下显示隐藏文件夹 ），默认的忽略大小写改成false。

始终看目标，并不遥远。加油！ 算数运算符在Swift中可以使用算数运算符。 123456789let firstnum = 12let lastnum = 2let othnum = 13let finnum = firstnum + lastnum //计算和 结果为14let fin2num = firstnum - lastnum //计算差 结果为10let fin3num = firstnum * lastnum //计算乘积 结果为24let fin4num = firstnum / lastnum //计算除 结果为6let fin5num = othnum % lastnum //计算余数 结果为1 当然，也可以多次运算，例如： 1let result = 1 + 1 + 1 //结果为3 要注意输出的数字为整数(Int)还是浮点数(Double)，例如： 12let num = 5 * 1 //整数let num2 = 5 * 1.0 //浮点数 运算符重载在Swift中运算符的作用可以取决于你给予的值，例如： 1let num = 12 + 12 你也可以连 ...

选择需要作为一个单元的图层，在工具栏中选择“制作网格”，输入行数列数间距等数值确认即可。 在Sketch中我们经常需要将一个元素复制成多份，并且这些元素还具备着相同的间距。这个时候我们可以使用Sketch的制作网格功能。 1.选择作为单元的图层/画板 2.在工具栏中选择”制作网格“ 3.进入网格工具，输入行数列数和边距 4.完成！ 注意：1.如果选择多个图层，那么会自动将选中的这些图层进行布局。 2.如果选择多个图层，会出现一个选项”复制图层以填充缺失的单元格“ 意思就是你设置的行列数所需要的单元数大于你选中的图层数。这个时候会复制你所选中的图层中层级最高的图层进行复制，来填充你所规定的网格。

将文字组件宽度设置为一个文字的宽度，这样每行为一个字，可以模拟垂直排版。字间距为行间距。 有的时候我们需要一些垂直排版的内容，这富有年代感气息的文字排版方式显得非常的古朴和文雅。常用在海报或者一些平面视觉作品之中。很难会用到UI作品中，但是一旦用到就很尴尬。专业的平面设计工具比如Photoshop、Illustrator等都有着直排文字工具，但是Sketch没有，怎么办呢？ 在Sketch中，将一段文本的适应性更为范围适应，然后将宽度设置为只能容纳一个字的宽度即可。例如： 我们可以将这段文字的行高作为垂直排版的字间距： 唯一的缺陷就是不支持换行，换行其实就是添加了一个文字罢了。所以在Sketch中做垂直排版的文字那么每一行都需要一个单独的文字组件。

选中文本，点击菜单中的字符→路径文字。之后将文字图层放到目标路径图层上部，移动文本图层接近路径。 虽然现代设计我们很少会用到路径文字，但是在用Sketch做一些视觉设计的时候我们偶尔会用到路径文字，那么怎么使用呢？ 1.首先我们先创建一个对应路径： 2.创建一个文本控件 3.点击菜单中的字符→路径文字 4.将鼠标拖拽到路径上 注意：文字图层必须在路径图层的上方。

万事开头难，加油！ 数组在Swift中数组可以用变量和常量，例如 1var city = ["Beijing", "Shanghai", "Guangzhou"] 如果标记了数组类型，那么就需要加方括号来标记数组的类型。 1var city: [String] = ["Beijing", "Shanghai", "Guangzhou"] 当然，常量也可以作为数组 1let city = ["Beijing", "Shanghai", "Guangzhou"] 调用的时候用方括号从0调用 1city[1] 对应的是Shanghai 注意： 1.如果你阅读不存在的项目，Swift就会崩溃。例如，尝试阅读beatles[9]不是一个好主意。 2.如果你使用类型注释，阵列都写在括号：[String]，[Int]，[Double]，和[Bool]。 3.在使用数组时，数组的名称后最好带s例如cities` ...

本文为转载文章，以下内容来源于 Pliary - Plant Care Service behance Pliary - Plant Care Service플리어리는 식물의 성장을 관리할 수 있는 서비스 입니다.식물을 기르는 방법에 있어 중요한 3대 요소 중 하나인 물주기를 사용자가 직접 설정하고다이어리를 작성하여 실질적인 관리에 도움이 될 수 있는 식물 관리 서비스입니다.자세한 제작 과정은 Medium을 통해 확인하세요!iOS App Download > l Android App Download > l Pliary Medium >UX DesignJaehee Shin · Jiun UWireframeZookie LeeUI DesignJiun U · Jaehee ShinBrand Identity DesignJaehee ShinIllu ...

逛追波的人都会知道，很多人在评论UI设计作品的时候经常用clean（干净）来给予评价。UI作品干净会拉高设计感和档次感（所谓的‘高大上’）。 干净的设计主要用两种方法配合优秀的选图来完成。两种方法分别是阴影、留白。阴影和留白为卡片式APP设计带来了更多发挥的空间，过渡较好较浅的阴影给人干净的印象。 让我们来对比一下几种常见的设计方式 很普通的简约风格设计，将底部tabbar移到侧边的实验设计。页面有横划手势方便切换顶部tab。 如果配合了阴影+留白呢？ 仅仅增加了阴影，整个页面就有了空间感，相当于【三维留白】 留白过少会显得更加单调和拥挤，利用之前期刊提到的单侧大圆角和侧边导航来增加二维和三维的留白。 几乎所有的卡片式设计都运用了阴影感觉，增加三维留白的控件。注意，阴影边缘离卡片越近、不透明度高，说明卡片与底面越近。为了增加三维留白的控件，一般将阴影的不透明度调低、阴影模糊值调高、距离卡片的距离增大来保证三维留白的空间。但是注意不要留的太远，不透明度和距离之间的关系应接近现实。如果实在把握不了，Google的materialdesign可能会帮到你。 留白+阴影会给人乳化的感 ...

这周整理一下音乐类的产品设计。音乐类是几乎每个设计师都会尝试的产品（就像天气app等等）有很多有趣的设计可以用来分享。 这个设计打破了播放条只是直线的限制，并且通过上下滑动可以切换歌单等等的方便操作将专辑中的各个歌曲联系在一起。非常有创意的设计，但是没有歌词的显示，落地恐怕有点困难。但是这不妨碍他的创新点，非常令人震惊的进度条设计。 美观6分 实用4分 创新7分 入选 同样令人震惊的进度条设计，不仅是打破了常规和横向进度条，还将音频频谱放在进度条上，让用户更容易找到副歌部分。得益于纵向的进度条设计，进度条的可操作性就变得非常强。很棒的设计。同样没有歌词显示。但是整体画面使用了卡片阴影效果，这个效果的好处你会发现整个界面更加的简洁干净。十分喜欢这个作品。 美观7分 实用6分 创新6分 入选 常见的客户端的音乐类app设计稿都是采用大卡片设计，在国外这些作品之中很少能见到像国内大杂烩一样的界面设计。这个界面会有一点干净的效果，但是整体界面的信息密度还是比较弱，控制只有进度条和播放暂停可以控制，感觉不是很好。底部封面图的展示形式类似于几年前的win7效果，有点老套。 美观2分 实用1分 ...

首页的设计是用户除了开屏以外的直观印象，一个好的首页会让用户产生对该软件调性的直观认识，设计首页对于一个APP尤为重要。 我们在中国常见的APP都是那种堆叠和紧凑，每个点都要博眼球，每个颜色都是「不要像上吊似的」的老板喜好（上吊这句话来自得到）（据说容易过稿，后来跟风者认为别人都这么搞，还以降低用户学习成本为借口）。令人头大。上次看一篇文章说中国的APP普遍追求「大而全」国外的追求「小而精」，不否认环境的不同所造就的特色主义挨屁屁，但是作为一个对设计有追求的App，在头部市场已被占满的情况下，小而精的App才是新产品所应该做的。 那么在2019年7月，首页设计大多采用了banner改造+内容feed的搭配方式。这种操作是较为新颖的操作方式（至少在国内是这样）。有着不俗的界面视觉表现能力，并且界面逻辑清晰。我个人来讲非常喜欢。 人们已经看了太多的线性布局，看了太多了纵向滑动了。设计师在寻找突破的过程中找到了新颖的交互方案，在前沿领域不断探索。 （图片来自于互联网，版权归原作者所有。作者信息详见我的 Pinterest，仅供学习使用，请勿转载和商用。Hoocan 仅提供作品 ...

黑暗模式在mac10.14中开始普遍铺开，凭借苹果设备出名的开发者的跟进能力，很快，大多数常用应用已经支持了夜间模式。在不久的将来，黑暗模式将很快在ios新版本上线。黑暗模式不仅很受男性受众和工作者的喜爱，而且因为厂商采用AMOLED屏幕黑色不发光可以节约电能消耗。下面就来赏析一下黑暗模式的设计。相信能给你带来一些启发。 黑金配色有着高端、奢华的感觉。该配色用得类似金属色感觉，并且在右侧柱状图的数据可视化上还添加了光源反光效果，将现实感融入到黑暗模式的设计中。 同样做数据可视化，这个作品采用了常见的线性+渐变的方式。用alpha蒙版塑造高饱和度高亮度颜色的渐变显得更具夜光、时尚、魅力。 采用了令人惊叹的拟物开关方式。将电灯的灯绳和开关结合在一起，非常巧妙的界面设计。出乎意料，还有温情和深度。 常见的背景模糊的毛玻璃效果，一般用于娱乐性强的媒体app。毛玻璃给人一种魔幻和虚幻的感觉。但是最近我们看mac10.14中正减少对毛玻璃的使用，可能这也是一个信号。 现在设计稿也越来越多的向黑暗模式适配了。我们可以在UI中国、站酷上看到很多UI作品都对黑暗模式进行了设计。 （图片来自于 ...

在商业化比较严重和开发能力的多重考验、时间的限制下，现有市场的APP总是以相同的框架、相同的结构出现。说的好听是为了减少用户的学习成本，说的难听就是不愿意花更多精力去创新。但是现在已经有越来越多的APP已经意识到了创新给产品带来的用户粘性，我相信不久的未来创新将会是产品的核心竞争力。 我非常喜欢的微信读书APP首页 在本期主要介绍几个我非常欣赏的创意布局，它们给我带来了很多灵感。相信下次我做的APP作品（提前透漏一下还是社交产品）不只是在产品功能上有足够的创新点，还一定会有更多的界面创意。我在这里面就不说过多的文字了，相信这些界面只要对于UI有一定敏感度的人都能发现属于自己的亮点。 标注「实验设计」说明这个界面是我特别推崇的实验性界面，可能浸淫了很商业化环境很久的老UI或开发会嗤之以鼻的界面。 左时间右内容 侧边留白的不对称设计（实验设计） 侧边留白的阅读类应用设计（实验设计） 横纵结合feed（我都想将我的新人人换成这类交互，当时可能没有这么大胆） 气泡蒙版设计 tabs按钮点击扩展（实验设计） 左侧留白不对称式设计（实验设计） ...

最近在设计APP的logo标志，所以将Appstore排名靠前的app图标都截了下来，方便参考和设计。 刚开始是靠着进入Appstore的网页来截图，但是有些图不能截图必须要进iTunes，但是最新版的还不支持应用预览。。。凉凉，所以另辟蹊径，找到两个Appstore图标的下载地址。 plafer iOS icon官网地址： 引用站外地址，不保证站点的可用性和安全性 icon-finder plafer iOS Icon Gallery官网地址： 引用站外地址，不保证站点的可用性和安全性 iOS Icon Gallery iosicongallery

在设计界面的时候为了将主界面更加简单易用，经常会需要隐藏一部分内容或者有组织的划分这些复杂内容。今天这篇文章主要分享的是通过层级隐藏的界面方式。 这是一个非常流行的隐藏方式，甚至动效都非常容易完成。 视觉表现方法就是使用大圆角为底部。但用户触发入口时将画面上移，露出在“底部“隐藏的二级内容。二级内容主要是用用黑色/亮度低的背景。 无论是功能组件还是列表都可以采用层级式隐藏的表现手法。 这样做的好处主要是在于每一个功能切换一个页面会让用户操作起来变得复杂，每加载一个页面不仅需要时间，而且体验会出现断层，不够流畅。使用这种层级式隐藏用户只需要使用上滑手势就能够看到隐藏的功能。 这种方式还会给人一种真实的错觉。让人感受到第一个接触的一级框架是在高处、点击之后就会展现低处的东西。这和我们拉开抽屉的现实行为和视觉刺激相同，人们很乐意接受这种交互方式。 现在手机屏幕大多采用圆角设计，那么将带有圆角的整体屏幕上移会让这种体验更加真实和惊艳。 当然，有高层级点击展开低层级这种，也有低层级点击展开高层级悬浮窗。这种就比较常见了，现有的商业化app基本都会考虑过这种方式。已经见怪不怪习 ...

是的，我们真的需要傻大黑粗。 很多设计师知道傻大黑粗是设计趋势，但是只是知道它的空壳而不懂内涵和灵魂。只能照搬照抄，结果却差强人意。 首先为什么“傻大黑粗“成为了趋势？ 傻大黑粗的核心目标就是增强对比。人们在越来越浮躁的社会。时间很紧，几乎没有时间去享受生活，那么路边的广告、海报、网页的匆匆一瞥如何能让他们印象深刻？ 人们的记忆始终保持4个左右的工作记忆内容（其实低于公认的7个），那么简单粗暴的一句话、一个单词、一个词语对人的记忆远超于一个段落（即使是内容丰满、跌宕起伏、引人入胜的段落）。 段落写的再好，只是能增加转化率。但不得不面临的问题是，你已经将近九九成的用户拒之门外，即使转化率超高，也不会超过百分之一。（指海报等） 但是超短的短语、一句话即使没有造成转化，也进入了人们的记忆中。然后通过高频率反复出现、反复洗脑，那么就完成了从工作记忆到长期记忆的转化。人们会下意识的将你的产品作为优先选择。 这种设计已经成为趋势，人们被抖音、快手等产品不断刺激着并寻找刺激点。当网站使用这种所谓“傻大黑粗“的形式，无非增强了用户的视觉刺激。一时刺激一时爽，一直刺激一直爽。 在版式方面，大多数设 ...

对于设计与艺术的界限我们很难去清晰界定，但是艺术是设计的探索方向，算是先行者。类似于实验电子的感觉。所以我将这类还没有被市场所认同的探索性设计叫做 实验设计 这周介绍的实验设计方式就是大圆角设计了。据心理学实验表示，人们对于圆弧的东西更加喜爱，所以圆角矩形比矩形更讨喜我们就见怪不怪了。那么在最近这段日子突出视觉张力的时候，强烈的大圆角自当应走入人们的视野中来。 为了追求个性，人们渴望打破长期以来设计对对称的崇尚，用打破对称来表达自己对对称时代的不满，充分的表达了年轻一代设计师对于张扬的热忱。我对这种采用大圆角非对称的UI组件称之为： 单侧大圆角设计 我们很少见到现有app通过对与屏幕横向做文章的，因为碍于手持抓我的原因，一般手机的横向像素寸土寸金，所以一般采用市场上较为普遍和安全的feed流设计，这样做的好处就是能够在纵向添加内容。但是导致了市场上普遍app的设计趋同。 针对有艺术渴望的UI设计师来说，在横向像素做文章意味着大量的留白（在纵向滑动的情况下留白的面积依然用百分比来形容，而不是单独的像素数了）。所以如何把握留白的尺寸，既能增强设计感，又能保证空间资源不浪费。 当然， ...

通过抠图的方式在app展示内非常出效果，抠图可以在二维扁平化的UI稿中体现出空间感，让人爱不释手。 公众号内原文标题： Hoocan 01 | 趋势设计-抠图大法好，突围设计方式的运用 我称这种设计方式为：突围 人们越来越渴望跳出扁平化这个行列，但是仍然想保留扁平化所带来的高效率更清晰直观的优点，如果想让你的作品更加出彩，可以尝试抠图展示这种方式。做动效的时候可以做一些视差效果。 抠图大法的首个要素就是出画框，抠图的内容一小部分（约4分之一到3分之一）突破了界限，让人有一种从矩形（圆角矩形）的束缚中脱离的感觉。非常有设计感。 这种方式也有一定的局限性，在视差效果的落地上对开发要求比较高。虽然有很高的视觉效果但是牺牲了一定的操作便利性和效率。如果在交互上使用突围方式很可能违反了用户的使用习惯，用户需要适应。并且突围在交互上的效率不如直接的瀑布流形式，占用空间大、浪费的空间比较多。所以这种方式是一种设计感很强但是实用性一般的设计方法。 所以看你所做的app类型。如果是公司官方商城、文学、音乐、影视、设计类的应用可以推荐应用这种方式作为一个提案，一定会让大家眼前一亮。 抠图 ...