版权声明:本文为博主原创文章,未经博主允许不得转载。

目录(?)[+]


PxCook 像素大厨

设计师一键拖拽上传后,可智能标注。然后程序员点击pxcp即可生成css xml swift objective-c还有NativeReact的代码了。支持画板解析、项目

字多不看的话

(走心要听: 
这次3.0版本相比于之前更加高效,易用。支持 Win & Mac ,并且是支持PSSketch全平台。

拖拽即用一键流的理念我想都明白它易用性的含义。不但体现在设计稿导入上,智能标注和生成代码也是一样。

开发模式 : 直接生成前端代码

PxCook3.0可以通过的顶部tab切换角色——设计开发两个角色。

 
点击顶部的tab按钮能切换到程序猿模式

在这一模式下,CSS XML Objective-C Swift ReactNative 等前端代码可以点击直接生成。包括多种开发语言下的尺寸文字、阴影渐变等所有元素。

CSS 支持点击生成

XML 点击生成

OC 点击生成

Swift,Yes

ReactNative,生成支持

直接生成代码至少每周为团队节省数小时甚至更多的工作时间。

对项目的支持

什么是项目?

项目是个方便设计管理标注的杂货箱,某个psd/sketch中的某一个画板,某个没有画板的单独psd/sketch,某个老的pxc格式文件或某个和文件没有关联的单独标注png……这些文件类型不同,但是可能和某个界面或某个功能、版本相关,这些都可以整理到一个项目内。 

项目列表展示

智能标注

流畅的智能标注是2016年上线以来口碑最好的功能,他的易用性体现在对于设计师的交互简单 

这回的大版本保留了智能标注,并增加了画板的支持。

画板支持

小解释画板是个什么。PS自2015起推出了画板功能,可以说是ui设计师最常用的分类/汇总功能(Sketch一直支持)。同时也是我们2个种子用户群呼声最高的。 

上图是Ps和Sketch的画板

(而以下,PxCook3.0已经支持导入和分别显示画板了。

PS拖入:直接将psd拖拽进来即可,记得要勾选要导入哪些画板。 

Sketch导入:通过插件快速上传 

角色切换 — 设计师模式

设计模式下可以标注。无论是交互友好的智能标注还是手动加距离/文字/坐标都是可以的。

它主要包括: 
- 元素间的尺寸可以拖动直接生成 
- 元素内间距也能一键生成 
- 字体信息标注(字号字体颜色是否加粗等)一键流 
- ……

设计师想要的,PxCook基本都想了, 毕竟用户反馈收集是一直在做的。

一些使用说明

  • 首先,智能标注隶属于那个像灯泡的按钮,在点击图层元素后,子图标才会置为可点击状态。包括宽高、文字信息等。内间距则需要按住ctrl依次点中两个图层元素后再点。

  • 切图在顶部。

  • 字体单位的显示选择在设计页和项目页顶部,#Hex和ARGB等。


PxCook 3.0 获取途径:

前往官网下载: 
http://www.fancynode.com.cn/pxcook

Sketch上传插件 获取途径:

前往官网: 
http://www.fancynode.com.cn/flavor

其实这个插件也是个大杀器,对效率提升也非常之大叫作Flavor [Flavor - Sketch插件味增,给你的设计加点料]

问题反馈与联系

任何问题反馈欢迎来提

官方微博:@Fancynode

qq用户群:555201284


转载于:https://blog.51cto.com/9095332/1963449

PxCook 点击设计稿即可生成代码前端,高效智能的设计研发工具,智能标注软件。...相关推荐

  1. Deco 智能代码体验版正式上线啦,快来体验设计稿一键生成代码~

    Deco 是什么?- Deco 智能代码项目是我们团队在「前端智能化」方向上的探索,其聚焦设计稿一键生成多端代码这一切入点,实现将 Sketch/Photoshop 等设计稿进行解析并直接生成多端代码 ...

  2. 京东Deco 智能代码体验版正式上线啦,快来体验设计稿一键生成代码~

    点击上方 前端Q,关注公众号 回复加群,加入前端Q技术交流群 Deco 是什么? - Deco 智能代码项目是我们团队在「前端智能化」方向上的探索,其聚焦设计稿一键生成多端代码这一切入点,实现将 Sk ...

  3. 设计稿自动生成可用页面的展望

    这篇文章只打算描述我加入支付宝之后,在设计稿生成代码这个方向上自己做的尝试和看到的团队中的尝试.不谈行业历史,不争论方向.文章以现状的形成和我的想法演进为主脉络,文末会提到我所看到的新契机.所以读者如 ...

  4. 新一代纯前端控件集 WijmoJS 2018V2发布,提供 Web 设计器,可动态设计页面并生成代码...

    概述 作为一款纯前端控件集,WijmoJS 秉承"快如闪电,触控优先"的设计理念,在提供优质服务和产品的同时,专注于企业应用开发,不断优化产品架构,与时俱进.除在全球率先支持 An ...

  5. GPT-4 手画设计稿 直接生成前端页面

    1.演讲者直接手画了一个设计稿 2.输入指令:用html/js把这个原型稿变成彩色网站,填充 2 条真实的笑话 3. 网站代码自动生成 不少所谓的大V在朋友圈噱头喊着前端要失业XX,其实本质上对事物的 ...

  6. [附下载]功能最强、高效易用的AI自动标注软件免费用了,兼容LabelImg格式xml,支持各种yolo、ssd、rcnn已训练模型以及OCR、形状匹配、轮廓匹配等各种定位方式来自动生成标注文件

    你将收获 掌握自动标注软件在Windows下系统配置方法 掌握利用灵活搜索来自动生成标注文件的方法 掌握利用训练好的网络模型来自动生成标注文件的方法 掌握利用OCR文字识别来自动生成标注文件的方法 适 ...

  7. 研发提效:通过设计稿自动生成前端代码

    今天抱着听不懂来见识的心态参加了全球架构师峰会,没想到还是大部分内容还是听得懂的.高手们都是可以用简单的话语讲透复杂的事情. 一天下来听了8位大佬分享,收获很多,今天就给大家分享其中一个(其他的写篇文 ...

  8. idea 2021版本不重新启动项目,点击刷新按钮即可刷新代码

    idea 2021.3版本怎么可以项目利用debug启动,修改代码后,不重新启动项目,直接点击刷新按钮,就可以实现项目的刷新. 步骤: ①:点击下面 ②搜索update,选择Update classe ...

  9. ui设计稿psd文件,前端怎么抠图,怎么高度还原ui稿-- pxcook像素大厨,

    百度搜索像素大厨, https://www.fancynode.com.cn/ 下载一个像素大厨, 并把项目的psd文件拖入pxcook, 如图: 抠图用的是photoshop,photoshop需装 ...

  10. [CodeX] 输入文本即可生成代码

    ★★★ 本文源自AI Studio社区精品项目,[点击此处]查看更多精品内容 >>> 请点击此处查看本环境基本用法. Please click here for more detai ...

最新文章

  1. 微信小程序插件功能页开发详细流程
  2. CIO和CTO到底有什么不同?
  3. MySQL第3天:MySQL的架构介绍之linux版安装
  4. asm和file system之间数据文件的转换
  5. Learning Modern 3D Graphics Programming笔记
  6. Charles4.1最新版破解
  7. con 元器件符号_altium designer常用元件电气符号和封装形式
  8. 如何从零配置腾讯云cdn加速服务?
  9. Intellij IDEA 插件下载慢或无法查询
  10. signature=32d532a97f37c02b1149992578cf4af9,~(11)C-CFT PET功能显像Parkin基因缺陷少年型帕金森病患者脑多巴胺转运体...
  11. 解决双屏切换为单屏,打开的软件窗口无法显示问题
  12. java inputstream read_Java学习之输入输出流
  13. [转载]JS和AS交互 作者:ludanlove
  14. 推荐一个开源低代码开发平台 Corteza
  15. 思科互联网络综合应用课程实验
  16. python 二维坐标多边形 计算多边形中心点,以及距该中心点最远的距离
  17. innoDB可重复读级别是否可以隔离幻行读
  18. 【数据分析报告】中国上海电动汽车行驶和充电行为分析
  19. 台湾新代数控系统数据采集CNC系列
  20. 第三次自考总结——时间管理和学习知识

热门文章

  1. Moldflow 2018模流分析从入门到精通pdf txt mobi读书笔记
  2. 《阿米巴经营》第一章读后感1200字
  3. 计算机主板南桥的作用,电脑主板上的南北桥芯片的位置和作用介绍
  4. am335x LCD调节背光
  5. 0成本开发一个外卖返利领劵小程序|外卖返利系统
  6. js 分析——百度模拟登录(一)
  7. 2020年浙江大学金融考研经验分享
  8. Android 实现远程控制(类似QQ的远程协助)
  9. C++类的声明和类的实现分开写(.hpp和.cpp)
  10. n1怎么进入线刷模式_中国移动N1 M821线刷刷机教程_移动M821线刷包_救砖包