Loading ...

  Polydojo Support


2.81.

Tutorial: Form Creation (Let's Host A Contest!) (7 mins)

Thank you for your interest in Polydojo. If you don't have an account, we request you to sign up.

Human Beings Are Explorers

The best way to get started with form creation is to go to Forms, and click Create. Then fiddle around and explore on your own. It'll be fun. If you prefer a written guide, a quickstart guide is available here.

This article shall present a longer, more-detailed guide; and shall be the first of a three-part series:

  • 2.1) Creating Your First Form
  • 2.2) Integrating Your First Form
  • 2.3) Sharing & Embedding Your First Form

Let's Host A Photo Contest!

Let us assume that your company, Acme Corp., wants to host a photo contest. Customers would be requested to submit a photo of themselves in which they are seen using your product. The top-ten submissions, as judged by you, would win a reward. Plain and simple.

Building The Contest Entry Form:

0. Login to Polydojo using your registered email address and password. (Visit polydojo.com/login.)

1. From the drop-down menu toward the top-right, select Forms.

3. Click Create, and then Start from scratch. A dialog will appear, asking for the form's title.

4. Type-in "Acme Corp's Photo Contest" and click OK. Soon, the form editor will open.

5. It's time to add your first field. Click Add Field. A dialog for selecting field type will appear.

6. Select 1st option, Short Answer. A blank field called Field Label & a light-yellow box will appear.

Getting Familiar With The Field Editor:

You should be seeing a light-yellow box with a dashed border. That's the field editor. Just above the field editor, you should see a blank form field labeled "Field Label". That's the field preview Any changes you make in the field editor shall be reflected in the field preview. This'll soon be clear:

7. In the light-yellow box, against Label, type-in "Please enter your name:".

Within a few moments, the field preview's label will change to the one you just typed in. Any changes changes you make to the label will momentarily be reflected the preview. Try making some changes!

8. Now, in the light-yellow box, against Type, click Short Answer to re-open the field type selector.

9. Select Name. Upon selection, the preview will immediately reformat itself.

10. Now, check the box labeled "Mark as mandatory." and change the label to just "Name".

What Are Mandatory Fields?

Mandatory fields are just that. They are fields which must be filled-out by the form-filler. Without filling them out, the form may not be submitted. As we need to know the name of each contest entrant, we marked the field as mandatory. (The red star is an indication to the form-filler.)

11. Click Done toward the bottom-left corner of the light-yellow box.

You Added Your First Field! Great Job!

Thanks for reading along. You've successfully added and edited your first field! Let's add a few more:

12. Click Add Field and select type Email. Mark it as mandatory by checking "Mark as mandatory.".

13. Now, check the box titled "Show more configuration options.".

Making Your Forms Look Professional:

Forms designed by professional web developers usually include informative text that describes the type of information expected. But you don't really need professional web developers for that.

14. Against Help Text, please type "Contest results shall be communicated at this address.".

15. Against Hint Text, please enter "Eg. your.name@domain.com".

Now, take a look at the field preview. Does it look better? In my opinion, it look much better. Try to type something into the field preview. As soon as you start typing, you will notice that the Hint Text disappears, but the Help Text remains. We generally recommend shorter hints and longer help text.

16. Click Done toward the bottom-left corner of the light-yellow box.

Adding Yet More Fields:

Alright! Now that you're familiar with adding fields, let's pickup the pace and add some more:

17. Add a field of type Phone Number, mark it as mandatory and click Done.

18. Add an Address type field and mark it as mandatory. (And of course, click Done.)

19. Add a File Upload field labeled "Upload Photo Entry" and mark it as mandatory.

20. Add a Long Answer field labeled "Anything else you'd like to add?".

21. Click Save or press Ctrl + S.

Almost there! Just finishing touches remain.

By this point, your form is pretty-much ready. Thank you for reading along. This article is far more detailed than our related quickstart article. Thank you for your kind patience. If you have any questions or difficulties, we request you to contact [email protected]. We'll be happy to help.

Alright, it's time to add some finishing touches. In the following, we'll mostly be adding Informative Fields, which are listed toward the bottom of the field-type selector.

Add Your Company's Logo:

22. Open http://acmelogos.com/#logos in a new tab. (Keep the form editor open in a different tab.)

23. Right-click directly on a logo of your choice and select: Copy image address/location.

24. Back in the form editor, add a field of type Image and paste the copied URL against Image URL.

25. Using the bars-menu toward the right of the field, drag the field to the top of the form.

Just as you added the ACME logo, you can use this procedure to add the logo from your own website.

Add Some Contest Terms:

26. Add a field of type Heading and label it "Contest Terms".

27. Add a field of type Text and copy-paste the below sample terms. (Replace things in {{braces}}.)

--- --- --- --- --- --- --- --- --- --- --- --- --- ---

(A)  To participate in {{Acme Corp}}'s contest, please  fill your name, address, and phone number in the contest entry form and submit it online at {{polydojo.com/this-is-a-sample-form-url}}.
(B)  Contest will be held from {{01 Feb 2017}} to {{15 Feb 2017}}. No submissions shall be entertained after {{15 Feb 2017}}. Prize winners will be announced on our site, {{acme-corp.com}}, on {{20 Feb 2017}}.
(C)  You ought to be 18-years-old or older win a prize. No purchase necessary. Only one submission per person please. You needn't be physically present at our offices to win. Void where prohibited.
(D)  Approximate value of each winner's prize is {{$1000}}. There may at most be {{10}} winners.

--- --- --- --- --- --- --- --- --- --- --- --- --- ---

Disclaimer: Please note that the above terms are only a sample. They are essentially just a meaningless placeholder. The above terms have neither been written nor reviewed by a lawyer. This article does NOT provide legal advice and does NOT create an attorney-client relationship. If you need legal advice, please contact a lawyer directly.

28. Add a field of type Checkbox labeled "I accept the Contest Terms.". Mark it as mandatory.

Optional: Go Multi-page!

If you'd like, you may choose to split the form across multiple pages. This'll make it easier to fill-out.

29. If you'd like to go multi-page, add Page Break field(s). Drag and drop to re-position.

And Its Done! You've Finally Finished!

30. Finally, click Save or press Ctrl + S.

Thank you very much for reading and following along. We hope the article wasn't too difficult to follow; and that you now feel comfortable with the idea of building forms. We thank you for giving us your valuable time, and are excited to see all the wonderful forms you will build.

If you have any questions, please feel free to contact [email protected]. We'll be more than glad to assist you. There are no silly questions, so please don't hesitate in contacting us.

We will soon be publishing the second and third part of this article series, wherein we will integrate this form with email and Google Sheets; and will then share the form with potential respondents.