SketchCode手稿生成 HTML 代码-技术圈

SketchCode是一种深度学习模型，它采用手绘的Web原型并将其转换为有效的HTML代码，使用图像字幕体系结构从手绘网站线框生成HTML标记。

注意：此项目是概念验证；该模型性能依赖于类似于核心数据集的线框。

依赖

Python 3 (not compatible with python 2)

安装依赖



pip install -r requirements.txt

用法示例

下载数据和预训练的权重：



# Getting the data, 1,700 images, 342mb

git clone https://github.com/ashnkumar/sketch-code.git

cd sketch-code

cd scripts



# Get the data and pretrained weights

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



# training from scratch

# <augment_training_data> adds Keras ImageDataGenerator augmentation for training images

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



# training starting with pretrained model

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



# evaluate single GUI prediction

python evaluate_single_gui.py --original_gui_filepath  {path/to/original/gui/file} \

      --predicted_gui_filepath {path/to/predicted/gui/file}



# training starting with pretrained model

python evaluate_batch_guis.py --original_guis_filepath  {path/to/folder/with/original/guis} \

      --predicted_guis_filepath {path/to/folder/with/predicted/guis}