【愚公系列】2022年10月 微信小程序-电商项目-UI设计之蓝湖的使用
【摘要】 前言蓝湖是一款产品文档和设计图的共享平台,帮助互联网团队更好地管理文档和设计图。蓝湖可以在线展示Axure,自动生成设计图标注,与团队共享设计图,展示页面之间的跳转关系。蓝湖支持从Sketch、Ps一键共享、在线讨论,而且蓝湖只需简单几步就能将设计图变成一个可以点击的演示原型,蓝湖还支持分享给同事,让他也可以在手机中查看设计效果。蓝湖已经成为新一代产品设计的工作方式。蓝湖官网:https:...
前言
蓝湖是一款产品文档和设计图的共享平台,帮助互联网团队更好地管理文档和设计图。蓝湖可以在线展示Axure,自动生成设计图标注,与团队共享设计图,展示页面之间的跳转关系。蓝湖支持从Sketch、Ps一键共享、在线讨论,而且蓝湖只需简单几步就能将设计图变成一个可以点击的演示原型,蓝湖还支持分享给同事,让他也可以在手机中查看设计效果。蓝湖已经成为新一代产品设计的工作方式。
一、UI设计之蓝湖的使用
1.下载插件
网址:https://lanhuapp.com/dds#startuse
点击安装等待安装完成就好了
打开PS软件,选择蓝湖插件,并且上传设计图到蓝湖;如果是 PS 插件上传设计图,记得提醒设计师打开转代码按钮
2.生成代码
1、上传设计图之后,点击“代码” Tab栏,跳转「设计图转代码」页面。
3.配置代码
1、当你进入「设计图转代码」页面后,可以看到设计图和代码运行效果的对比,直观感受设计图转代码的魅力。
2、不同企业对代码语言的要求有所不同,你可以根据需求,选择 Html、Vue、Uni-app 等代码框架,样式代码对应可选 Css、Less、Scss。
3、如果你想要实现自适应效果,可以在样式代码中选择 Rem 或者 Response 。
4、如果你觉得复制代码比较麻烦,想一键导入代码,可以选择「下载代码」,配置代码框架、渲染样式后,导出代码即可;
导出的代码包,包含有代码框架、样式代码(包含 Css、Rem、Response、Common )、切图包。
【版权声明】本文为华为云社区用户原创内容,转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息, 否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱:
cloudbbs@huaweicloud.com
- 点赞
- 收藏
- 关注作者
评论(0)