"EOS Angels ~ Block Producer Application Website Design Contest" - My Entry by whynot

View this thread on steempeak.com
· @whynot ·
$4.69
"EOS Angels ~ Block Producer Application Website Design Contest" - My Entry
Here's are my 3 entries for the [challenge](https://steemit.com/eos-projects/@officialfuzzy/eos-angels-block-producer-application-website-design-contest-beyondbit-and-eosbit-prizes-inside) posted by @officialfuzzy. I have used Bootstrap v4 to create the websites.

# #1
**Important:** I use a free hosting provider which shuts down the website each day for 1 hour.
URL: [Design 1](https://jackronson.000webhostapp.com/) 
I like this one because it can be easily extended with text / images. I would prefer a 4k image of the clouds so that it looks even better on large screens, but I don't have one.
![form1.png](https://steemitimages.com/DQmVWVZJ7WrPCNJUKYBDc7GNATeLbUJMehbbyRhQnQF9qD3/form1.png)

*Note:* I didn't use the video of the moving clouds because it's a always huge distraction proven in usability tests. Instead I made a screenshot and used the clouds as an image.

# #2
URL: [Design 2](https://jackronson.000webhostapp.com/index-logo-left-small.html)
This is the design I prefer because it's simple and can be extended with text / social media buttons on the left side (with the image).
![form2.png](https://steemitimages.com/DQmdyKC9RJ1PYN5zRtoW9ks12WBwWVQtAZfxNCfWKrFneSM/form2.png)

# #3
URL: [Design 3](https://jackronson.000webhostapp.com/index-logo-left-wide.html)
The last design looks good on small screens but is probably not suited for very large screens: The input fields would be very long and the user must move his head to read  long lines of input.
![form3.png](https://steemitimages.com/DQmRiYhGLAj7XWCYmUG8B5bZm89RFY9XupgHfGp6MXvxxha/form3.png)




# Responsive Design
The websites can be displayed on different devices like tablets or mobile phones:
![mobile.png](https://steemitimages.com/DQmPaJGJsUEye75yMsdFKM3bd72R16w4EdEagUXK5XSFaw5/mobile.png)


# Form Validation
The form is validated on the client side. Right now not every field is required but can be changed with a simple HTML parameter thanks to using Bootstrap:
![validation.png](https://steemitimages.com/DQmdE42wjSa99ZsHNKPFhQQeq3USEyxYvYkqNSXzAWnYHtw/validation.png)


# Contest Requirements

1) Single page website template with graphics, sliced & diced, coded
2) The design must be 'responsive' 
3) The design must include the EOSAngel logo
4) The completed template MUST include a form with specific fields
5) Winner must be able to supply all files
6) Entrants must upvote and resteem the challenge post
7) Create a post with your entry (up to 3), then reply below with a link to your your post, you MUST ALSO put a screen capture of your design in the reply, and your BTS/OL account name in the comments.


# Feedback
Please let me know in the comments your suggestions to enhance the form. 

For example I would add the following:
* Benefits why to apply as a block producer
* Social media buttons
* Links to privacy /  terms / support


# Download
I'll provide a download link with all files (.zip) once the contest has finished / suggestions are implemented.
👍  , , , ,
properties (23)
post_id37,039,984
authorwhynot
permlinkeos-angels-block-producer-application-website-design-contest-my-entry
categoryeos-projects
json_metadata"{"format": "markdown", "links": ["https://steemit.com/eos-projects/@officialfuzzy/eos-angels-block-producer-application-website-design-contest-beyondbit-and-eosbit-prizes-inside", "https://jackronson.000webhostapp.com/", "https://jackronson.000webhostapp.com/index-logo-left-small.html", "https://jackronson.000webhostapp.com/index-logo-left-wide.html"], "app": "steemit/0.1", "tags": ["eos-projects", "eos", "eosangels", "eosbit", "dapps"], "users": ["officialfuzzy"], "image": ["https://steemitimages.com/DQmVWVZJ7WrPCNJUKYBDc7GNATeLbUJMehbbyRhQnQF9qD3/form1.png"]}"
created2018-03-06 13:10:06
last_update2018-03-06 13:10:06
depth0
children1
net_rshares1,149,726,263,556
last_payout2018-03-13 13:10:06
cashout_time1969-12-31 23:59:59
total_payout_value3.522 SBD
curator_payout_value1.165 SBD
pending_payout_value0.000 SBD
promoted0.000 SBD
body_length2,964
author_reputation172,010,736,569
root_title""EOS Angels ~ Block Producer Application Website Design Contest" - My Entry"
beneficiaries[]
max_accepted_payout1,000,000.000 SBD
percent_steem_dollars10,000
author_curate_reward""
vote details (5)
@whynot · (edited)
There are no suggestions so here's the link:

[Download link: eos.zip](https://jackronson.000webhostapp.com/eos.zip)

.
properties (22)
post_id37,514,149
authorwhynot
permlinkre-whynot-eos-angels-block-producer-application-website-design-contest-my-entry-20180308t185440935z
categoryeos-projects
json_metadata"{"app": "steemit/0.1", "links": ["https://jackronson.000webhostapp.com/eos.zip"], "tags": ["eos-projects"]}"
created2018-03-08 18:54:42
last_update2018-03-08 18:56:03
depth1
children0
net_rshares0
last_payout2018-03-15 18:54:42
cashout_time1969-12-31 23:59:59
total_payout_value0.000 SBD
curator_payout_value0.000 SBD
pending_payout_value0.000 SBD
promoted0.000 SBD
body_length119
author_reputation172,010,736,569
root_title""EOS Angels ~ Block Producer Application Website Design Contest" - My Entry"
beneficiaries[]
max_accepted_payout1,000,000.000 SBD
percent_steem_dollars10,000