SketchCode
从手绘线框图生成HTML代码
SketchCode是一个深度学习模型,它将手绘的网页线框图转换为可运行的HTML代码。它使用一种图像字幕架构,从手绘的网站线框图生成HTML标记。
更多信息请查看这篇文章:使用深度学习自动化前端开发
这个项目基于Tony Beltramelli的pix2code项目中合成生成的数据集和模型架构,以及Emil Wallner的Design Mockups项目。
注意: 该项目旨在作为概念验证;该模型尚未能泛化到实际线框图中的多样性,因此其性能依赖于线框图与核心数据集的相似性。
设置
先决条件
- Python 3(不兼容Python 2)
- pip
安装依赖项
pip install -r requirements.txt
示例用法
下载数据和预训练权重:
# 获取数据,1,700张图片,342mb
git clone https://github.com/ashnkumar/sketch-code.git
cd sketch-code
cd scripts
# 获取数据和预训练权重
sh get_data.sh
sh get_pretrained_model.sh
使用预训练权重将示例手绘图像转换为HTML代码:
cd src
python convert_single_image.py --png_path ../examples/drawn_example1.png \
--output_folder ./generated_html \
--model_json_file ../bin/model_json.json \
--model_weights_file ../bin/weights.h5
常规用法
使用权重将单个图像转换为HTML代码:
cd src
python convert_single_image.py --png_path {path/to/img.png} \
--output_folder {folder/to/output/html} \
--model_json_file {path/to/model/json_file.json} \
--model_weights_file {path/to/model/weights.h5}
将文件夹中的一批图像转换为HTML:
cd src
python convert_batch_of_images.py --pngs_path {path/to/folder/with/pngs} \
--output_folder {folder/to/output/html} \
--model_json_file {path/to/model/json_file.json} \
--model_weights_file {path/to/model/weights.h5}
训练模型:
cd src
# 从头开始训练
# <augment_training_data>为训练图像添加Keras ImageDataGenerator数据增强
python train.py --data_input_path {path/to/folder/with/pngs/guis} \
--validation_split 0.2 \
--epochs 10 \
--model_output_path {path/to/output/model} \
--augment_training_data 1
# 使用预训练模型开始训练
python train.py --data_input_path {path/to/folder/with/pngs/guis} \
--validation_split 0.2 \
--epochs 10 \
--model_output_path {path/to/output/model} \
--model_json_file ../bin/model_json.json \
--model_weights_file ../bin/pretrained_weights.h5 \
--augment_training_data 1
使用BLEU评分评估生成的预测
cd src
# 评估单个GUI预测
python evaluate_single_gui.py --original_gui_filepath {path/to/original/gui/file} \
--predicted_gui_filepath {path/to/predicted/gui/file}
# 使用预训练模型开始训练
python evaluate_batch_guis.py --original_guis_filepath {path/to/folder/with/original/guis} \
--predicted_guis_filepath {path/to/folder/with/predicted/guis}
许可证
MIT许可证
版权所有 (c) 2018 Ashwin Kumar<ash.nkumar@gmail.com@gmail.com>
特此免费授予任何获得此软件及相关文档文件(“软件”)副本的人使用、复制、修改、合并、出版、分发、再许可和/或出售软件副本的权限,并允许向其提供该软件的人这样做,但须满足以下条件:
以上版权声明和本许可声明应包含在软件的所有副本或重要部分中。
软件是“按原样”提供的,不提供任何形式的明示或暗示担保,包括但不限于适销性、特定用途的适用性和非侵权性。在任何情况下,作者或版权持有人均不对因软件或软件使用或其他交易中的行为引起的任何索赔、损害或其他责任负责,无论是在合同诉讼、侵权或其他方面。