作为一个全栈程序开发人员，感觉有时候真的很心累呀，因为既要满足后端程序的实现，还要理解我们客户爸爸的独特见解。入行两年，个人对于移动端界面的书写渐渐找到了一些适合自己的东西。1、我们单位UI小姐姐推荐的“蓝湖”是真的的好用，设计师需要安装PhotoshopCC2015以上版本（这里传送一个我弄到的 photoshop cc 2018 版本 ，网
转载
2024-06-13 20:35:12
219阅读
安装插件点击首页右上角的【下载】图标，打开后，即可下载蓝湖 Photoshop 插件安装成功后，请重启 Photoshop★ 注：蓝湖 Ps 插件仅支持 Photoshop CC 2015 及以上版本?(下载蓝湖 Photoshop 插件地址)插件下载页登录打开 Photoshop【窗口】→【扩展功能】→【? 蓝湖】?image.png输入蓝湖帐号、密码登录?登录页面选择设计图要上传的团队与项目，
转载
2024-08-28 22:19:34
309阅读
目录1.npm2.Express3.BootCDN4.mongoose5.Vue.js6.React7.BULMA8.RAP29.Swiper中文网10.Animate.css11.Vant-UI12.xiaopiu13.Element14.Iconfont15.favicon16.GitHub17.蓝湖18.CSDN19.Moment.js20.React Router21.Mint UI22
原文链接： ://note.noxussj.top/?source=51cto介绍前面已经介绍了如何使用 git 来管理我们的项目代码。这里顺带介绍一下，在企业实际开发中，基本上都是有设计图的存在，前端是按照设计图去开发实现，并不是自己凭空想象页面长什么样子。蓝湖就是目前比较主流的设计图网站。在设计图上面可以方便查看任何一个元素的尺寸大小、间
原创
2023-03-14 21:19:02
960阅读
蓝湖： 第一步：通过蓝湖插件在PS中标记你需要生成的切图 第二步：通过蓝湖插件将页面上传至蓝湖 第三步：在蓝湖Web端，双击设计图查看标注和切图 在这里，你家的工程师可以： ①查看所有元素的尺寸、字号、距离等信息，并可直接复制相应代码 ②一键下载切图文件 Sketch用户 第一步： 通过蓝湖插件在Sketch中标记你需要生成的切图 方法①： 用export标记切图 （忽略透明区域） 方法② ：用切
转载
2023-12-15 13:12:41
314阅读
用好蓝湖，提升开发效率我们都知道，蓝湖是UI设计当中得力的软件助手之一，那么在我们灵加的UI课程当中呢，对于蓝湖这款软件的应用，一定也是必不可少的。下面我们先来了解一下这款软件的优点第一，首先呢，我们在完成一个成熟的项目过程中呢，必然少不了各个部门的交流合作，有时候会存在：“需求交代不清晰，开发效果差”的问题。那么在蓝湖这款软件中啊，就巧妙地避免了这个问题。蓝湖做到了在线沟通协作，360° 无死角
转载
2024-01-30 19:26:38
93阅读
画好的app原型如何在手机上体验？网上有很多方法，但很多都是收费的！分享一下我遇到的问题和解决方法~温馨提示：一定看完再做，跟着我的步骤会生气哈哈哈哈原本，我的目的是将原型做成二维码，这样别人可以扫描一下就可以在手机上运行起来~思路：将原型上传到网上——生成网址——网址转换成二维码一、画出适配手机屏幕的app原型 这部分内容可以参考“PM浪子”的文章为什么375x667是移动端原型设计的最佳分辨率
转载
2024-02-05 20:47:52
187阅读
小编尝试过2种屏幕适配方法：1.PX适配使用PXGenerator代码生成各种分辨率的文件夹以及文件，以某分辨率比如480x800为基准，1px=1px,按比例生成其他各种分辨率的dimen文件，会有1px=4px,1px=3px之类的情况，以次达到屏幕适配的目的<dimen name="py11">14.7px</dimen>
<dimen name="py
无论你从事任何工作，团队协作的能力都是一个现代职场人所必备的底层技能。软件设计厂商们也都看到了职场人的这一需求，也明白传统软件无法满足这类需求的痛点，因此，越来越多的在线协作软件问世了。 下面要介绍的这6款和UI设计有关的团队协作交付软件就是为此而生的。 1.蓝湖 在蓝湖，你可以无缝产品、设计、研发的流程；设计师能更快交付设计图，产品经理能更直观地展现需求，工程师能省时省力高效编程；因此，使用
转载
2024-01-31 10:34:17
20阅读
还在寻找自动标注切图的skrtch插件吗？今日小编推荐的蓝湖sketch插件Mac中文版是一款自动切图sketch插件，支持共享 Symbol、同步 Sketch Prototyping 及共享、自动标注与多倍切图、设计图在线评论、设计图历史版本管理、快速制作原型等功能于一身， 在Sketch插件栏中即可找到！ 蓝湖sketch插件 mac破解版功能介绍简单好
程序猿与UI设计妹讨论设计稿和切图的时候，经常会因为dp和px的问题搞的不愉快，这里可以分析出两个原因： 1，程序猿原因，不懂dp和px的换算关系。包括我，以及我见到的大多数开发，更多的时候其实不是很关心dp和px是如何来的，以及如何转换的，只知道掌握一般情况用dp，字体大小用sp，画线用px。 2，设计妹原因，设计不出dp标注，或者甚至就不懂dp是什么东东。大多数公司并不会为Android专门
转载
2024-05-20 11:14:23
25阅读
标注内容：1、文字：大小、字体、粗细、颜色、不透明度2、布局控件属性：控件高度、背景色、透明度、描边和圆角大小3、间距：图标文字列表等都间距、控件之间都距离和左右边距4、列表：列表都高度、颜色、内容上下间距等5、段落：行距6、全局属性：如导航栏文字大小、颜色页面左右边距、默认间距切图无法用代码实现的内容需要切图，主要切@2x和@3x图注意：1、切图输出格式：png24位、png8位、jpg3种格式
转载
2024-05-17 19:31:39
1116阅读
1、架构设计图1.1、系统架构特点微服务设计、前后端分离、高可用、易扩展、易维护、统一配置、令牌限流、服务熔断、链路追踪、docker容器部署、rancher容器管理、自动化运维1.2、系统架构图1.3、总设计思维图1.4、后端架构图2、产品UI——蓝湖2.1、简介蓝湖是一款优秀的产品设计写作平台，实现了一张画板展示页面跳转逻辑、设计图历史版本管理、打点评论、自动标注、制作高保真交互原型、团队共享
转载
2024-07-05 16:33:00
596阅读
我经常能在各大网站看到有互联网从业者发问：现在产品经理有什么好用的原型工具推荐吗？作为一名有着多年从业经验的产品经理，这个问题我有十足的发言权。当前互联网产品原型工具比较常见的有Pixso、Axure、XD、sketch、墨刀和摹客等软件，其中有专注于做原型的——比如蓝湖，也有提供产研一体化解决方案的——比如Pixso。这么多软件，到底应该如何选择呢？听我仔细分析一波~Pixso：从原型到设计到交
蓝湖使用规范一、蓝湖插件下载及安装二、团队项目建立流程1、新建团队(横琴人寿)2、新建项目在对应的团队下新建项目例如官微项目，官网项目，i保项目，哆来咪项目3、新建分组在相应的项目下按照功能模块进行分组，例如：投保、家庭权益、服务大厅4、在相应的分组下上传文件文件命名规范：对应的具体页面描述+版本信息例如：尊贵服务-4.2版本(如果没有版本号可用具体上线日期)同一张设计图有可能有多种状态，需要上传
转载
2023-08-03 14:12:00
295阅读
一、Adobe Photoshop二、Adobe Fireworks三、Sketch（Mac版本电脑前端程序员最喜欢的切图工具）四、插件：Cutterman（早期程序员最爱用的插件）蓝湖（现在企业最流行的插件）蓝湖地址：蓝湖 - 高效的产品设计协作平台首先我们访问蓝湖协作网站，初次使用我们需要注册一个账号，并登录。蓝湖是一个团队写作工具，我们可以再注册的时候看到如下提示框，选择您的岗位角色。可以邀
以前前端都是拿到psd设计图，需要自己用ps切图，需要自己在psd上面一个个去量设计的大小和间距，而现在一般都是要求设计师把设计稿直接上传到蓝湖上面，通过蓝湖的标注来写出前端代码。要做到还原设计稿，主要要解决下面这三个问题：元素大小元素与元素之间的间距元素在页面的位置字体元素大小先关注设计图是PC还是移动端，移动端看设计稿是以375px为标准还是以750px宽为标准的设计稿，pc端基本上尺寸144
相信各位UI设计师们都知道给设计稿标注是多么痛苦的一件事。将尺寸，间距，大小一个一个手动的画出来，耗时耗力不说还搞得自己两眼昏花。如果有一处标错了前端会一次次的来找自己，和自己确定。这种低效的协作方式，造成了大多数互联网产品设计团队普遍的悲剧：明天要上线，通宵抠细节，吐血调界面，加班今天周老师给大家介绍一个神器，完全释放你的双手。 有一款软件叫“蓝湖”，可能有些还没工作过的小伙伴们还没有听
转载
2024-01-04 09:16:55
210阅读
作为多年生程序员，因为工作需要也经常需要绘制原型图。于是尝试使用各种原型工具。平心而论原型设计在产品开发非常重要，可以有效的避免无效工作量。 这几年用过的原型工具如Axure、墨刀、还有什么xiaopiu、AD、蓝湖、visio、摹客等。比较好用的算是axure和墨刀。最终在收费越来越高的情况下放弃了
转载
2023-10-03 19:39:14
28阅读
以
蓝湖设计图 尺寸宽度750px为例：//选中icon
蓝湖尺寸162px*162px<img src="../assets/icon.png">//外边距20px；字体12px<p class="fs12">字体</p><style> html{ font-size: 50px; } .fs12{ font-size: .24rem; } img{ w...
转载
2021-08-12 14:13:37
1461阅读
