4th Street Bar Hive-Bar

Hive-Bar Powered by Hive beta-fdb5b5b

Community post

"EOS Angels ~ WEBSITE DESIGN CONTEST #2" - My Entry

The website design contest reached round #2 and @officialfuzzy provided feedback for my initial design.

I'm thankful for choosing my design and here's my approach to enhance it.

Design

Here's the new live design
Important: I use a free hosting provider which shuts down the website each day for 1 hour.

1.png

I added the following elements to the initial design:

  • Moving clouds background (that scales with the size of the browser) and transparent form
  • Countdown (read more below at 'Easy Customization')
  • Social buttons (read more below at 'E-Mail Security')
  • Text (What is...)

My goal was to enhance the clean and easy to use form with additional functionality and information without distracting the user too much.

As you can see in the mobile view the social buttons + "What is..." text moves below the form so the form has a more prominent place at the top of the page.

Easy Customization

You can easily move the heading and countdown from the left side to the top of the form:

21.png

Just change the destination in line 226 of the HTML.

  • Top of the form:
    3.png
  • Left side:
    4.png

You can also change the end date of the countdown in the exact same line.

Social Buttons and E-Mail Security

I added 2 social buttons to the left side and here's one little but important element: the E-Mail link.
7.png

Here's the thing:

  • There are bots that crawl websites for E-Mail addresses which will receive spam.
  • The E-Mail address inside the HTML file is encrypted with ROT13 and not useful for bots because it has the form of 'znvygb:[email protected]'.
    5.png
    (The E-Mail address can be updated in line 231)
  • The user can see and use the correct E-Mail address.

What is...

It was difficult for me to come up with a short + most simple text what EOS Angels actually is.

6.png

I hope it's spot on and helps people that apply as Block Producers who have no clear understanding about EOS Angels yet.

Feedback

Please let me know what you think.

When I read about the contest I wanted to add tons of gimmicks but I ended up with a (hopefully) better approach of helpful functionality and clean design.

ps. I'm thinking about changing the social buttons e.g. using a link to the EOSTalk Discord instead of an E-Mail address... but I'm not sure what's preferred.

ps. Download link comes tomorrow.

10 upvotes 6 downvotes $0.65

Replies (10)

Review before signing

Posting as . Signing with . Keychain permission: Posting. Hive Keychain will ask you to approve this action next.


  
Technical details

Operation fingerprint: