ImageCLEF 2020 DrawnUI

Update: As the challenges are over, starting July 2021, the dataset is not available anymore.

Note: Do not forget to read the Rules section on this page. Pressing the red Participate button leads you to a page where you have to agree with those rules. You will not be able to submit any results before agreeing with the rules.

Note: Before trying to submit results, read the Submission instructions section on this page.

Challenge description

Building websites requires a very specific set of skills. Currently, the two main ways to achieve this is either by using a visual website builder or by programming. Both approaches have a steep learning curve. Enabling people to create websites by drawing them on a whiteboard or on a piece of paper would make the webpage building process more accessible.

A first step in capturing the intent expressed by a user through a wireframe is to correctly detect a set of atomic user interface elements (UI) in their drawings. The bounding boxes and labels resulted from this detection step can then be used to accurately generate a website layout using various heuristics.

In this context, the detection and recognition of hand drawn website UIs task addresses the problem of automatically recognizing the hand drawn objects representing website UIs, which are further used to be translated automatically into website code.

Given a set of images of hand drawn UIs, participants are required to develop machine learning techniques that are able to predict the exact position and type of UI elements.

Data

As soon as the data is released it will be available under the "Resources" tab.

The provided data set consists of 2,950 hand drawn images inspired from mobile application screenshots and actual web pages containing about 1,000 different templates. Each image comes with the manual labeling of the positions of the bounding boxes corresponding to each UI element and its type. To avoid any ambiguity, a predefined shape dictionary with 21 classes is used, e.g., paragraph, label, header. The development set contains 2,363 images while the test set contains 587 images.

Classes

The 21 classes are the following:

[
    'paragraph',
    'dropdown',
    'checkbox',
    'radiobutton',
    'rating',
    'toggle',
    'textarea',
    'datepicker',
    'stepperinput',
    'slider',
    'video',
    'label',
    'table',
    'list',
    'header',
    'button',
    'image',
    'linebreak',
    'container',
    'link',
    'textinput'
]

The following image was given as a guideline for the people who drew the wireframes:

Example

Image 1c3e1163fa864f9c.jpg from the train set

The annotation format for the development set is a single CSV file with one row per image, following the format below:

Here are the annotations while in development:

And here is the corresponding row from the CSV file:

1c3e1163fa864f9c.jpg;paragraph 1:190x135+410+474;button 1:99x60+265+745,1:85x50+434+819,1:89x50+614+739;image 1:259x135+379+305;container 1:614x925+179+95,1:549x229+219+689;;;;;;;;

Submission instructions

Before being allowed to submit your results, you have to first press the red participate button, which leads you to a page where you have to accept the challenges rules.

Participants will be permitted to submit up to 10 runs. Each system run will consist of a single ASCII plain text file (a csv). The results of each test set should be given in separate lines in the text file. The format of the text file is as follows:

[image_ID/document_ID] [results]

The results of each test set image should be given in separate lines, each line providing only up to 300 localised widget. The format is the same as for the development set, i.e.:

[image_ID];[widget1] [[confidence1,1]:][width1,1]x[height1,1]+[xmin1,1]+[ymin1,1],[[confidence1,2]:][width1,2]x[height1,2]+[xmin1,2]+[ymin1,2],…;[widget2] …

[confidence] are floating point values 0-1 for which a higher value means a higher score.

Here is an example for the image 1c3e1163fa864f9c:

It will correspond to this row in the submission file:

1c3e1163fa864f9c.jpg;paragraph 0.8:190x135+410+474;button 0.95:99x60+265+745,0.6:85x50+434+819,0.6:89x50+614+739;image 0.7:259x135+379+305;container 0.8:614x925+179+95,0.8:549x229+219+689

The submission script can be found here.

Note: We are aware that the evaluation calculation is not the same as the official pascal mAP@0.5 IoU, However, to be consistent with previous edition of object detection challenges in ImageCLEF, we choose to keep this script and naming for this edition. This decision will be reevaluated for future editions.

Evaluation criteria

The performance of the algorithms will be evaluated using the standard mean Average Precision over IoU .5, commonly used in object detection.

Rules

Note: In order to participate in this challenge you have to sign an End User Agreement (EUA). You will find more information on the 'Resources' tab.

ImageCLEF lab is part of the Conference and Labs of the Evaluation Forum: CLEF 2020. CLEF 2020 consists of independent peer-reviewed workshops on a broad range of challenges in the fields of multilingual and multimodal information access evaluation, and a set of benchmarking activities carried in various labs designed to test different aspects of mono and cross-language Information retrieval systems. More details about the conference can be found here{:target='_blank'} .

Submitting a working note with the full description of the methods used in each run is mandatory. Any run that could not be reproduced thanks to its description in the working notes might be removed from the official publication of the results. Working notes are published within CEUR-WS proceedings, resulting in an assignment of an individual DOI (URN) and an indexing by many bibliography systems including DBLP. According to the CEUR-WS policies, a light review of the working notes will be conducted by ImageCLEF organizing committee to ensure quality. As an illustration, ImageCLEF 2019 working notes (task overviews and participant working notes) can be found within CLEF 2019 CEUR-WS{:target='_blank'} proceedings.

Important

Participants of this challenge will automatically be registered at CLEF 2020. In order to be compliant with the CLEF registration requirements, please edit your profile by providing the following additional information:

• First name

• Last name

• Affiliation

• Address

• City

• Country

• Regarding the username, please choose a name that represents your team.

This information will not be publicly visible and will be exclusively used to contact you and to send the registration data to CLEF, which is the main organizer of all CLEF labs

Participating as an individual (non affiliated) researcher

We welcome individual researchers, i.e. not affiliated to any institution, to participate. We kindly ask you to provide us with a motivation letter containing the following information:

• the presentation of your most relevant research activities related to the task/tasks

• your motivation for participating in the task/tasks and how you want to exploit the results

• a list of the most relevant 5 publications (if applicable)

• the link to your personal webpage

The motivation letter should be directly concatenated to the End User Agreement document or sent as a PDF file to bionescu at imag dot pub dot ro. The request will be analyzed by the ImageCLEF organizing committee. We reserve the right to refuse any applicants whose experience in the field is too narrow, and would therefore most likely prevent them from being able to finish the task/tasks.

Citations

Information will be posted after the challenge ends.

Prizes

Publication

ImageCLEF 2020 is an evaluation campaign that is being organized as part of the CLEF initiative{:target='_blank'} labs. The campaign offers several research tasks that welcome participation from teams around the world. The results of the campaign appear in the working notes proceedings, published by CEUR Workshop Proceedings (CEUR-WS.org). Selected contributions among the participants, will be invited for publication in the following year in the Springer Lecture Notes in Computer Science (LNCS) together with the annual lab overviews.

Resources

Contact us

Discussion Forum

• You can ask questions related to this challenge on the Discussion Forum. Before asking a new question please make sure that question has not been asked before.
• Click on Discussion tab above or direct link: https://discourse.aicrowd.com/c/imageclef-2020-drawnui{:target='_blank'}

Alternative channels

We strongly encourage you to use the public channels mentioned above for communications between the participants and the organizers. In extreme cases, if there are any queries or comments that you would like to make using a private communication channel, then you can send us an email at :

• paul[dot]brie[at]teleporthq[dot]io
• dimitri[dot]fichou[at]teleporthq[dot]io
• stefan[dot]liviu[dot]daniel[at]gmail[dot]com
• cmihaigabriel[at]gmail[dot]com
• dogariu[dot]mihai8[at]gmail[dot]com
• bogdanlapi[at]gmail[dot]com

More information

You can find additional information on the challenge here: https://www.imageclef.org/2020/drawnui{:target='_blank'}

If you participate in this task, you may want also to check the Coral Task which addresses a similar classification problem, but in a different use case scenario. For more information see: https://www.imageclef.org/2020/coral