taneemishere's picture
adding examples and code refactoring
154ccf5
raw
history blame
2.89 kB
__author__ = 'Taneem Jan, taneemishere.github.io'
import gradio as gr
import main_program
# our model's i/o method that take image from gradio interface's inputs.Image()
def model_interface(image):
return main_model(image)
# main method that call the main_program where code is generated and then compiled
def main_model(input_image):
result = main_program.main_method(input_image)
return result
interface_title = "<br> <p style='margin: 0% 8% 0% 8%'>HTML Code Generation from Images with Deep Neural Networks</p>"
interface_description = """<p style='margin: 0% 8% 2% 8%; text-align: justify;text-justify: inter-word;'> Writing
code in a programming language for a designed mockup or a graphical user interface created by designers and UI
engineers, is done mostly by developers to build and develop custom websites and software. The development work is
not approachable by those unfamiliar with programming, to drive these personas capable of designing and developing
the code bases and website structures we come up with an automated system. In this work, we showed and proposed that
methods of deep learning and computer vision can be grasped to train a model that will automatically generate HTML
code from a single input mockup image and try to build an end-to-end automated system with accuracy more than
previous works for developing the structures of web pages.</p> """
interface_article = """<br><h2 style='text-align: center;'>Limitations of Model</h2> <p style='text-align:
center;'>Certain limitations are there in the model some of them are listed below</p> <ul><li>Sometimes the model do
produce all the buttons with the same green color instead of other colors</li><li>As the model has fed with the data
provided, and so while producing the code on some other types of images might not generate the code we
wanted</li><li>The model is only trained upon the learning and recognition of boxes and buttons etc. in the images
and it do not write the text written exactly on the images</li></ul>
<div style='text-align: center;'> <br><br><a
href='https://twitter.com/taneemishere' target='_blank'>Developed by Taneem Jan</a> </div> <div style='text-align:
center;'> <a href='https://taneemishere.github.io/projects/project-one.html' target='_blank'>Paper</a> &ensp; &emsp;
<a href='https://github.com/taneemishere/html-code-generation-from-images-with-deep-neural-networks'
target='_blank'>Code</a> </div> """
interface_examples = ['examples/example-1.png', 'examples/example-2.png', 'examples/example-3.png']
# a gradio interface to convert a image to HTML Code
interface = gr.Interface(
model_interface,
inputs='image',
outputs='text',
allow_flagging="manual",
title=interface_title,
description=interface_description,
article=interface_article,
examples=interface_examples
)
interface.launch(share=False)