关于前端:利用Zeplin从设计图自动生成CSS提高前端样式开发效率

37次阅读

共计 627 个字符,预计需要花费 2 分钟才能阅读完成。

明天要给大家安利的一个软件是 zeplin,用于连贯设计师和前端开发者,同时对于独立开发者,这也是一个神器。这个软件有 web 版本和客户端 (mac/win)。有了它,利用 Zeplin 从设计图主动生成 CSS,进步前端款式开发效率,升高前端款式入门门槛,像我一样的开发小白,学习前端开发的门槛又升高了 1 厘米。

Zeplin 工作流

能够从 sketch 十分不便导入到 zeplin,装置插件之后,你能够在 plugins-zeplin 插件找到对应的导入办法。无缝导入,对 sketch 用户十分不便。

在导入 zeplin 之后,你能够针对不同的组件,间接查看和复制对应的 CSS 代码,疾速复制到你开发中的代码,对于前端开发者能够进步从设计到前端代码的过程,同时也升高了信息沟通中的乐音,进步了效率,你不须要设计师去切图、标注色值,所有的信息你都能够从设计原图无缝进入到 CSS 款式阶段。

.Rectangle-Copy-3 
  {  
    width: 1125px;  
    height: 319px;  
    margin: 135px 0 0;  
    padding: 85px 57px 0 58px;  
    box-shadow: -5px -5px 50px 0 rgba(123, 123, 123, 0.25);  
    background-color: #ffffff;
}

多说一句,对于很多的独立开发者敌人,这样的工具无疑在降低生产的难度,让产品设计到开发过程丝滑适度。值得体验领有。

对于骇客白专访 hackerby.com
开发者、设计师、产品的 1v1 深度交流平台。

正文完
 0